@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=JetBrains+Mono:wght@300;400;500&display=swap');

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #F9F9F9; }
::-webkit-scrollbar-thumb { background: #111111; border-radius: 0; }
::-webkit-scrollbar-thumb:hover { background: #333333; }

html {
  scroll-behavior: smooth;
  background-color: #F9F9F9;
  color: #111111;
  -webkit-font-smoothing: antialiased;
}

::selection {
  background-color: #111111;
  color: #F9F9F9;
}

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

@keyframes grains {
  0% { transform: translate3d(0, 0, 0); }
  10% { transform: translate3d(-1%, -0.5%, 0); }
  20% { transform: translate3d(-2%, 1%, 0); }
  30% { transform: translate3d(1%, -1%, 0); }
  40% { transform: translate3d(-1%, 2%, 0); }
  50% { transform: translate3d(-2%, 1%, 0); }
  60% { transform: translate3d(2%, -1%, 0); }
  70% { transform: translate3d(1%, 2%, 0); }
  80% { transform: translate3d(-1%, -2%, 0); }
  90% { transform: translate3d(2%, 1%, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

.film-grain {
  position: fixed;
  top: -10%; left: -10%; right: -10%; bottom: -10%;
  width: 120%; height: 120%;
  background: transparent url('data:image/svg+xml,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noise"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="1" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noise)" opacity="0.04"/%3E%3C/svg%3E') repeat;
  opacity: 0.15;
  animation: grains 1.5s steps(6) infinite;
  pointer-events: none;
  z-index: 9999;
}

.amber-grade {
  filter: contrast(1.02) sepia(0.04) brightness(0.99);
  transition: filter 0.5s ease-in-out;
}

#cinematic-preloader.is-hidden {
  opacity: 0;
  transform: translateY(-100%);
  pointer-events: none;
}

.nav-active::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(1);
}

.modal-backdrop { display: none; }
.modal-backdrop.is-open { display: flex; }

.faq-answer { display: none; }
.faq-item.is-open .faq-answer { display: block; }
.faq-item.is-open .faq-chevron { transform: rotate(180deg); }

.process-panel { display: none; }
.process-panel.is-active { display: block; }

.archive-drawer { display: none; }
.archive-drawer.is-open { display: table-row; }

.director-modal { display: none; }
.director-modal.is-open { display: flex; }

.mobile-menu { display: none; }
.mobile-menu.is-open { display: flex; }

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

.hidden-ui { display: none !important; }
