/* =========================
   Background (OUTSIDE=PARTY)
   ========================= */
.bg{
  position: fixed;
  inset: 0;
  z-index: -2;
  overflow: visible;
  background:
    radial-gradient(1200px 600px at 20% 10%, rgba(60,140,255,.35), transparent 60%),
    radial-gradient(900px 500px at 80% 30%, rgba(120,60,255,.20), transparent 55%),
    linear-gradient(180deg, #0a2a55 0%, #05070d 70%, #02030a 100%);
}

/* Glow blobs */
.glow{
  position: fixed;
  width: 420px;
  height: 420px;
  filter: blur(40px);
  opacity: .35;
  z-index: -1;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.7), rgba(60,140,255,.3), transparent 70%);
  animation: drift 10s ease-in-out infinite;
}
.glow-1{ top:-80px; left:-60px; }
.glow-2{ top:20%; right:-140px; animation-duration:12s; }
.glow-3{ bottom:-120px; left:35%; animation-duration:14s; }

@keyframes drift{
  0%,100%{ transform: translate(0,0) scale(1); }
  50%{ transform: translate(18px,-12px) scale(1.06); }
}

/* =========================
   Content UI
   ========================= */
.hero{ padding: 18px 16px 6px; }
.hero h1{ margin: 0 0 10px; font-size: 20px; }
.sub{ margin: 0; opacity: .85; line-height: 1.55; }

.card-grid{
  padding: 14px 16px 6px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}
.card{
  display: block;
  padding: 14px;
  border-radius: 18px;
  text-decoration: none;
  color: #fff;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}
.card__title{ font-weight: 800; margin-bottom: 6px; }
.card__desc{ opacity: .82; font-size: 13px; }

.section{ padding: 14px 16px; }
.section h2{ margin: 0 0 10px; font-size: 16px; }
.list{ display: grid; gap: 8px; }
.list__item{ opacity: .92; }

.notice{
  margin: 14px 16px 6px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.08);
}
.notice strong{ display:block; margin-bottom: 6px; }

.footer{
  padding: 18px 16px 24px;
  border-top: 1px solid rgba(255,255,255,.08);
  opacity: .9;
}
.footer .small{ opacity: .75; font-size: 12px; margin-top: 6px; }

.page-title{ padding: 18px 16px 8px; }
.page-title h1{ margin:0 0 8px; font-size: 20px; }

/* 후기 카드 */
.review{
  margin-top: 12px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}
.review__top{
  display:flex;
  justify-content: space-between;
  align-items:center;
  margin-bottom: 8px;
}
.review__meta{ opacity:.75; font-size: 12px; }
.review__text{ margin:0; opacity:.9; line-height: 1.55; }