/* FAB kanon — sama dengan beranda (FloatingButtons + globals.css).
   Desktop/tablet: 66×66 · ikon 26 · gap 12 · inset 24.
   Mobile ≤640: 48×48 · gap 10 · bottom 14 / right 12.
   Urutan: WhatsApp → Instagram → AI. */

html body .atlas-fab-stack {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  left: auto !important;
  top: auto !important;
  z-index: 150 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
  pointer-events: none;
}
html body .atlas-fab-stack > * {
  pointer-events: auto;
  margin: 0 !important;
  padding: 0 !important;
  width: 66px !important;
  height: 66px !important;
  flex: 0 0 66px !important;
  min-height: 66px !important;
  max-height: 66px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  box-sizing: border-box !important;
}
html body .atlas-fab-stack .atlas-fab-btn {
  width: 66px !important;
  height: 66px !important;
  min-width: 66px !important;
  min-height: 66px !important;
  border-radius: 50% !important;
  border-width: 2px !important;
  border-style: solid !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  cursor: pointer;
  text-decoration: none !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .28) !important;
  transform: none !important;
  position: relative !important;
}
html body .atlas-fab-stack .atlas-fab-btn:hover {
  transform: none !important;
  filter: brightness(1.06);
}
html body .atlas-fab-stack .atlas-fab-btn .atlas-fab-icon,
html body .atlas-fab-stack .atlas-fab-btn i {
  font-size: 26px !important;
  line-height: 1 !important;
  position: relative;
  z-index: 1;
}
html body .atlas-fab-btn--wa {
  background: #059669 !important;
  border-color: #fff !important;
}
html body .atlas-fab-btn--wa:hover { background: #10b981 !important; }
html body .atlas-fab-btn--ig {
  background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888) !important;
  border-color: rgba(255, 255, 255, .5) !important;
}
html body .atlas-fab-btn--ai {
  background: linear-gradient(135deg, #004B8E, #002244) !important;
  border-color: #A68A56 !important;
}
html body .atlas-fab-tip {
  position: absolute;
  right: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  padding: 6px 12px;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .28);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 2;
}
html body .atlas-fab-item:hover .atlas-fab-tip,
html body .atlas-fab-item:focus-within .atlas-fab-tip { opacity: 1; }
html body .atlas-fab-tip--wa { background: #059669; }
html body .atlas-fab-tip--ig { background: linear-gradient(90deg, #8a3ab9, #e95950, #fccc63); }
html body .atlas-fab-tip--ai {
  background: #002244;
  border: 1px solid rgba(166, 138, 86, .5);
}
html body .atlas-fab-dot {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: #10b981 !important;
  border: 2px solid #fff !important;
  box-sizing: border-box !important;
  z-index: 5 !important;
}
html body .atlas-fab-stack .float-pulse-ring,
html body .atlas-fab-stack .fab-pulse {
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 2px solid var(--rc, rgba(166, 138, 86, .55));
  pointer-events: none;
  animation: atlasFabPulse 2.4s ease-out infinite;
}
@keyframes atlasFabPulse {
  0% { transform: scale(0.92); opacity: 0.9; }
  70% { transform: scale(1.45); opacity: 0; }
  100% { transform: scale(1.45); opacity: 0; }
}
html body .atlas-fab-stack .atlas-fab-btn.attention-glow {
  animation: atlasFabGlow 3s infinite ease-in-out !important;
}
@keyframes atlasFabGlow {
  0%, 100% { box-shadow: 0 0 16px rgba(166, 138, 86, .4), 0 12px 32px rgba(0, 0, 0, .28); }
  50% { box-shadow: 0 0 28px rgba(166, 138, 86, .65), 0 12px 32px rgba(0, 0, 0, .28); }
}

html body #scroll-progress-bar {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(90deg, #004B8E, #A68A56, #E6D2A7);
  z-index: 9999;
  pointer-events: none;
  box-shadow: 0 0 8px rgba(166, 138, 86, .7);
}
html body #back-to-top-btn {
  position: fixed !important;
  bottom: 24px !important;
  left: 24px !important;
  right: auto !important;
  z-index: 150 !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(0, 75, 142, .88) !important;
  border: 1px solid rgba(166, 138, 86, .5) !important;
  color: #fff !important;
  cursor: pointer;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 12px, 0);
  padding: 0 !important;
}
html body #back-to-top-btn.btt-visible {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate3d(0, 0, 0) !important;
}

@media (max-width: 640px) {
  html body .atlas-fab-stack {
    bottom: 14px !important;
    right: 12px !important;
    gap: 10px !important;
  }
  html body .atlas-fab-stack > *,
  html body .atlas-fab-stack .atlas-fab-item {
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
  }
  html body .atlas-fab-stack .atlas-fab-btn {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-width: 1.5px !important;
  }
  html body .atlas-fab-stack .atlas-fab-btn .atlas-fab-icon,
  html body .atlas-fab-stack .atlas-fab-btn i {
    font-size: 1.15rem !important;
  }
  html body .atlas-fab-tip { display: none !important; }
  html body .atlas-fab-dot {
    width: 10px !important;
    height: 10px !important;
  }
  html body #back-to-top-btn {
    width: 34px !important;
    height: 34px !important;
    bottom: 14px !important;
    left: 12px !important;
  }
}


/* Tombol mengambang menepi (atlas-fab.js).
   - Footer mendekat: tumpukan WA/AI hilang supaya alamat, © dan tautan legal terbaca utuh.
   - Tombol kembali ke atas hanya muncul sesudah menggulir naik (nol menutup teks saat membaca ke bawah).
   - v77: Instagram kembali tampil di tumpukan pada semua layar (HP, iPad, desktop), bersama WhatsApp dan Atlas Butler. */
html body .atlas-fab-stack {
  transition: opacity .22s ease;
}
html.atlas-fab-away body .atlas-fab-stack {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .22s ease, visibility 0s linear .22s !important;
}
html.atlas-fab-js:not(.atlas-fab-up) body #back-to-top-btn.btt-visible {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate3d(0, 12px, 0) !important;
}
@media (pointer: coarse), (max-width: 640px) {
  html body #back-to-top-btn#back-to-top-btn {
    width: 44px !important;
    height: 44px !important;
  }
}
