body {
      font-family: Pretendard, sans-serif;
      background: #f7f8fc;
      overflow-x: hidden;
    }

    .glass {
      background: rgba(255, 255, 255, 0.75);
      backdrop-filter: blur(18px);
      border: 1px solid rgba(255, 255, 255, 0.6);
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
    }

    .track {
      display: flex;
      transition: transform 0.8s ease;
      height: 100%;
    }

    .slide {
      min-width: 100%;
      height: 100%;
      position: relative;
    }

    .overlay {
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.35);
    }

    .btn {
      transition: 0.2s ease;
    }

    .btn:hover {
      transform: translateY(-2px);
    }

    .nav {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 50;
    }

    .soft-shadow {
      box-shadow: 0 25px 60px rgba(0, 0, 0, 0.08);
    }

    /* DOTS */
    .dot {
      width: 10px;
      height: 10px;
      border-radius: 9999px;
      background: rgba(0, 0, 0, 0.2);
      transition: 0.2s;
      cursor: pointer;
    }

    .dot.active {
      background: black;
      transform: scale(1.2);
    }

    @keyframes kmIn {
  from {
    transform: translateY(10px) scale(0.98);
    opacity: 0;
  }
  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

@keyframes kmOut {
  from {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
  to {
    transform: translateY(10px) scale(0.98);
    opacity: 0;
  }
}

.km-in {
  animation: kmIn 0.18s ease-out;
}

.km-out {
  animation: kmOut 0.15s ease-in forwards;
}


@keyframes announcement-in {
    from {
        opacity: 0;
        transform: translate(-50%, -20px) scale(.96);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }
}

@keyframes announcement-out {
    from {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }
    to {
        opacity: 0;
        transform: translate(-50%, -20px) scale(.96);
    }
}

.animate-announcement {
    animation: announcement-in .35s cubic-bezier(.22,1,.36,1);
}

.animate-announcement-out {
    animation: announcement-out .25s ease forwards;
}


.glass {
    background: rgba(255,255,255,.82);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.soft-shadow {
    box-shadow:
        0 20px 40px rgba(0,0,0,.08),
        0 2px 8px rgba(0,0,0,.04);
}