@import url("https://unpkg.com/aos@2.3.4/dist/aos.css");

body {
  font-family: "Google Sans Flex", "Segoe UI", system-ui, -apple-system,
    BlinkMacSystemFont, sans-serif;
}

body.page-load {
  opacity: 0;
  transform: translateY(10px);
}

body.page-loaded {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 600ms ease, transform 700ms ease;
}

.vertical-text {
  writing-mode: vertical-rl;
  letter-spacing: 0.2em;
}

.outline-text {
  color: transparent;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1.5px rgba(214, 213, 213, 0.6);
}

.stroke-biru {
  font-family: "Google Sans Flex", sans-serif;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: white;
  -webkit-text-stroke-width: 1.5px;
}

.outline-running {
  font-family: "Montserrat", sans-serif;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1.5px white;
}

.text-biru {
  color: #2563eb;
}

.bg-biru {
  background: #2563eb;
}

.border-biru {
  background: #2563eb;
}

.bg-biru-tua {
  background: #0f2c60;
}
.ornamen-white {
  filter: brightness(0) invert(1);
}

.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.smooth-scroll {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

.btn-wartana {
  background: linear-gradient(135deg, #2563eb, #5a73ff);
  color: #ffffff;
  border: 0;
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.35);
  transition: transform 200ms ease, box-shadow 200ms ease, filter 200ms ease;
}

.btn-wartana:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(37, 99, 235, 0.45);
  filter: brightness(1.06);
}

.btn-wartana:active {
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.35);
}

.wartana-clamp {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.group:hover .wartana-clamp {
  -webkit-line-clamp: unset;
}


/* Themed scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: #2563eb #ffffff;
}

*::-webkit-scrollbar {
  width: 10px;
}

*::-webkit-scrollbar-track {
  background: #ffffff;
}

*::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #2563eb, #5a73ff);
  border-radius: 999px;
  border: 2px solid #ffffff;
}

*::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #5a73ff, #2563eb);
}