/* RAS FESTIVAL — 홍보 페이지 */

/* ============ 01 HERO ============ */
.hero { position: relative; height: 300vh; background: #fff; }
.hero__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; background: #fff; isolation: isolate; }
.hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; background: #0b0d06; }
.hero__scrim { position: absolute; inset: 0; z-index: 1; background: #000; opacity: 0; pointer-events: none; }
.hero__mask { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.hero__veil { fill: #fff; }
/* JS 가 글자 위치를 잡기 전에는 흰 판만 보이지 않도록, 기본 배치를 CSS 로도 둔다 */
.hero__meta {
  position: absolute; z-index: 4; top: calc(var(--gnb-h) + 18px); left: var(--gutter); right: var(--gutter);
  display: flex; justify-content: space-between; gap: 16px; color: var(--muted);
}
.hero__objs { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.obj { position: absolute; will-change: transform; }
.obj__in { will-change: transform; }
.obj__float { animation: float 7s ease-in-out infinite; }
.obj img { width: 100%; height: auto; filter: drop-shadow(0 28px 36px rgba(0, 0, 0, .18)); }
.obj--book { left: 3%; top: 17%; width: clamp(150px, 19vw, 320px); }
.obj--book .obj__float { animation-delay: -1s; }
.obj--mic { right: 6.5%; top: 13%; width: clamp(70px, 8.4vw, 150px); }
.obj--mic .obj__float { animation-delay: -3s; animation-duration: 6s; }
.obj--sneaker { left: 9%; bottom: 9%; width: clamp(120px, 14vw, 240px); }
.obj--sneaker .obj__float { animation-delay: -2s; animation-duration: 8s; }
.obj--rope { right: 6%; bottom: 11%; width: clamp(110px, 12.5vw, 220px); }
.obj--rope .obj__float { animation-delay: -4s; }
@keyframes float {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(0, -14px, 0) rotate(2.5deg); }
}

.hero__copy {
  position: absolute; z-index: 4; left: 0; right: 0; bottom: clamp(28px, 6.5vh, 76px);
  display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 var(--gutter);
}
.hero__title { font-size: inherit; }
.hero__name { display: block; font-size: clamp(24px, 2.7vw, 40px); font-weight: 800; letter-spacing: -0.045em; line-height: 1.2; }
.hero__slogan { margin-top: 6px; font-size: clamp(16px, 1.55vw, 21px); font-weight: 600; color: var(--muted); letter-spacing: -0.025em; }
.hero__slogan b { color: var(--ink); font-weight: 800; }
.hero__cta { display: flex; gap: 10px; margin-top: 22px; }
.hero__period { margin-top: 16px; color: var(--muted-2); }

.hero__after {
  position: absolute; z-index: 5; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; color: #fff; padding: 0 var(--gutter); pointer-events: none; opacity: 0; visibility: hidden;
}
.hero__after-kicker { color: var(--volt); margin-bottom: 14px; }
.hero__after-title { font-size: clamp(64px, 13vw, 220px); font-weight: 900; letter-spacing: -0.06em; line-height: .95; }
.hero__after-title span { display: inline-block; }
.hero__after-sub { margin-top: 22px; font-size: clamp(16px, 1.6vw, 22px); font-weight: 600; color: rgba(255, 255, 255, .78); }

.hero__scroll {
  position: absolute; z-index: 4; right: var(--gutter); bottom: 28px;
  display: none; flex-direction: column; align-items: center; gap: 8px; color: var(--muted-2); font-size: 10px;
}
.hero__scroll i { width: 1px; height: 28px; background: linear-gradient(var(--muted-2), transparent); animation: scrollcue 2s var(--ease) infinite; transform-origin: top; }
@keyframes scrollcue { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }

/* JS 없이 볼 때: 영상 대신 포스터가 글자 밖까지 보이지 않게 흰 판을 유지하고 뒤 내용은 그대로 */
.no-motion .hero { height: auto; }
.no-motion .hero__stage { position: relative; height: 100vh; height: 100svh; min-height: 640px; }
.no-motion .hero__after { display: none; }

@media (max-width: 960px) {
  .hero__meta span:last-child { display: none; }
  .hero__cta .btn--lg { --h: 50px; padding: 0 22px; font-size: 16px; }
}
@media (max-aspect-ratio: 4/5) {
  .hero__video { filter: brightness(.74) contrast(1.15) saturate(1.1); transform: scale(1.32); transform-origin: 50% 88%; }
  .hero__meta { top: calc(var(--gnb-h) + 12px); }
  .hero__name { font-size: clamp(22px, 6.4vw, 30px); }
  .hero__slogan { font-size: 15px; margin-top: 4px; }
  .hero__copy { bottom: max(20px, env(safe-area-inset-bottom)); }
  .hero__cta .btn--lg { --h: 48px; padding: 0 20px; font-size: 15px; }
  .obj--book { left: -7%; top: 15%; width: 34vw; }
  .obj--mic { right: 6%; top: 17%; width: 12vw; }
  .obj--sneaker { left: -2%; bottom: 31%; width: 25vw; }
  .obj--rope { right: -2%; bottom: 30%; width: 23vw; }
  .hero__period { display: none; }
  .hero__cta { margin-top: 18px; }
}
@media (min-height: 760px) and (min-width: 961px) { .hero__scroll { display: flex; } }

/* ============ 02 STATEMENT ============ */
.statement { position: relative; height: 230vh; }
.statement__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: grid; place-items: center; }
.statement__tags { position: absolute; inset: calc(var(--gnb-h) + 10px) 0 0 0; pointer-events: none; }
.tag {
  position: absolute; padding: 10px 18px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .22);
  font-size: clamp(13px, 1.1vw, 16px); font-weight: 600; color: rgba(255, 255, 255, .86); white-space: nowrap;
  will-change: transform, opacity;
}
.tag:nth-child(1) { left: 7%; top: 12%; }
.tag:nth-child(2) { left: 74%; top: 9%; }
.tag:nth-child(3) { left: 40%; top: 5%; }
.tag:nth-child(4) { left: 84%; top: 32%; background: #fff; color: var(--ink); border-color: #fff; }
.tag:nth-child(5) { left: 3%; top: 42%; }
.tag:nth-child(6) { left: 13%; top: 76%; }
.tag:nth-child(7) { left: 63%; top: 82%; }
.tag:nth-child(8) { left: 80%; top: 64%; }
.tag:nth-child(9) { left: 36%; top: 88%; }
.tag:nth-child(10) { left: 86%; top: 86%; border-color: var(--volt); color: var(--volt); }

.statement__body { position: relative; z-index: 2; width: 100%; max-width: 1240px; padding: 0 var(--gutter); text-align: center; }
.statement__body .kicker { margin-bottom: 26px; }
.statement__title { display: flex; flex-direction: column; align-items: center; }
.statement__line { font-size: clamp(24px, 3.3vw, 48px); font-weight: 700; letter-spacing: -0.04em; color: rgba(255, 255, 255, .72); line-height: 1.2; }
.statement__big { margin-top: 10px; font-size: clamp(64px, 12.5vw, 200px); font-weight: 900; letter-spacing: -0.06em; line-height: 1; }
.hl { position: relative; display: inline-block; padding: .02em .12em .06em; }
.hl__text { position: relative; }
.hl__ink {
  position: absolute; inset: 0; padding: inherit; background: var(--volt); color: var(--ink);
  clip-path: inset(0 0 0 0); white-space: nowrap;
}
.statement__desc { margin: 30px auto 0; max-width: 30em; font-size: clamp(16px, 1.5vw, 20px); color: rgba(255, 255, 255, .66); font-weight: 500; }
.facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 56px auto 0; max-width: 980px;
  border-top: 1px solid rgba(255, 255, 255, .16); text-align: left;
}
.facts > div { padding: 18px 18px 0 0; }
.facts > div + div { padding-left: 18px; border-left: 1px solid rgba(255, 255, 255, .16); }
.facts dt { color: rgba(255, 255, 255, .5); margin-bottom: 8px; }
.facts dd { font-size: clamp(17px, 1.7vw, 24px); font-weight: 800; letter-spacing: -0.03em; line-height: 1.3; }
.facts small { display: block; font-size: 14px; font-weight: 500; color: rgba(255, 255, 255, .55); letter-spacing: -0.01em; }
@media (max-width: 720px) {
  .statement { height: 210vh; }
  .facts { grid-template-columns: 1fr 1fr; margin-top: 36px; }
  .facts > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .facts > div:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .16); margin-top: 16px; }
  .tag:nth-child(n) { padding: 8px 13px; }
  .tag:nth-child(4) { left: 64%; top: 26%; }
  .tag:nth-child(2) { left: 60%; top: 12%; }
  .tag:nth-child(8) { left: 66%; top: 70%; }
  .tag:nth-child(10) { left: 62%; top: 90%; }
  .tag:nth-child(9) { left: 26%; top: 94%; }
  .statement__desc { margin-top: 22px; }
}
.no-motion .statement { height: auto; }
.no-motion .statement__stage { position: relative; height: auto; min-height: 100vh; padding: 140px 0; }

/* ============ 03 CHAPTERS ============ */
.chapters { position: relative; height: 400vh; }
.chapters__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; background: var(--ink); }
.chapter { position: absolute; inset: 0; visibility: hidden; overflow: hidden; }
.chapter.is-active { visibility: visible; }
.chapter--r { background: var(--ink); color: #fff; }
.chapter--a { background: var(--volt); color: var(--ink); }
.chapter--s { background: #fff; color: var(--ink); }
.chapter__corner {
  position: absolute; z-index: 3; top: calc(var(--gnb-h) + 18px); left: var(--gutter); right: var(--gutter);
  display: flex; justify-content: space-between; opacity: .6;
}
.chapter__word {
  position: absolute; z-index: 1; left: 50%; top: 47%;
  font-family: var(--display); font-weight: 900; font-size: 18vw; line-height: .78; letter-spacing: -0.045em;
  white-space: nowrap; transform: translate(-50%, -50%); user-select: none; scale: var(--s, 1);
}
.chapter__word span { display: inline-block; }
.chapter__objs { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.cobj { position: absolute; height: auto; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .22)); will-change: transform; }
.chapter--r .cobj--book { width: clamp(220px, 33vw, 600px); right: 9%; top: 15%; }
.chapter--a .cobj--mic { width: clamp(80px, 9vw, 170px); left: 16%; top: 13%; }
.chapter--a .cobj--violin { width: clamp(180px, 24vw, 430px); right: 7%; top: 16%; }
.chapter--a .cobj--sneaker { width: clamp(150px, 18vw, 330px); left: 44%; bottom: 7%; }
.chapter--s .cobj--rope { width: clamp(150px, 19vw, 340px); left: 14%; top: 11%; }
.chapter--s .cobj--belt { width: clamp(220px, 28vw, 500px); right: 8%; bottom: 13%; }

.chapter__info { position: absolute; z-index: 3; left: var(--gutter); bottom: clamp(32px, 7vh, 80px); max-width: 430px; }
.chapter__info h3 { margin-top: 16px; font-size: clamp(28px, 3.3vw, 48px); font-weight: 800; letter-spacing: -0.045em; line-height: 1.12; }
.chapter__info p { margin-top: 12px; font-size: clamp(15px, 1.25vw, 18px); line-height: 1.6; opacity: .72; font-weight: 500; }
.chapter--r .chip { background: var(--volt); }
.chapter--a .chip { background: var(--ink); color: var(--volt); }
.chapter--s .chip { background: var(--ink); color: #fff; }

.chapters__hud {
  position: absolute; z-index: 4; right: var(--gutter); bottom: clamp(32px, 7vh, 80px);
  display: flex; align-items: center; gap: 16px; color: inherit; mix-blend-mode: difference; color: #fff;
}
.chapters__count b { font-weight: 500; }
.chapters__ticks { display: flex; gap: 6px; }
.chapters__ticks i { width: 22px; height: 3px; background: currentColor; opacity: .3; border-radius: 2px; transition: opacity .3s, width .4s var(--ease); }
.chapters__ticks i.is-on { opacity: 1; width: 40px; }

@media (max-aspect-ratio: 4/5) {
  .chapter__word { left: 0; top: 50%; transform-origin: center; }
  .chapter__info { right: var(--gutter); max-width: none; bottom: clamp(24px, 5vh, 48px); }
  .chapters__hud { top: calc(var(--gnb-h) + 44px); bottom: auto; }
  .chapter--r .cobj--book { width: 60vw; right: -4%; top: 22%; }
  .chapter--a .cobj--mic { width: 14vw; left: auto; right: 16%; top: 15%; }
  .chapter--a .cobj--violin { width: 40vw; right: -4%; top: 25%; }
  .chapter--a .cobj--sneaker { width: 30vw; left: auto; right: 36%; bottom: auto; top: 39%; }
  .chapter--s .cobj--rope { width: 36vw; left: auto; right: 10%; top: 14%; }
  .chapter--s .cobj--belt { width: 48vw; right: -4%; bottom: auto; top: 37%; }
}
.no-motion .chapters { height: auto; }
.no-motion .chapters__stage { position: relative; height: auto; background: none; }
.no-motion .chapter { position: relative; visibility: visible; height: 100vh; height: 100svh; min-height: 620px; }
.no-motion .chapters__hud { display: none; }

/* ============ 04 BANDS ============ */
.bands { position: relative; height: clamp(240px, 36vw, 480px); overflow: hidden; background: #fff; }
.band { position: absolute; left: -8%; width: 116%; top: 50%; padding: clamp(14px, 1.6vw, 22px) 0; overflow: hidden; }
.band--volt { z-index: 2; background: var(--volt); color: var(--ink); transform: translateY(-78%) rotate(-5deg); }
.band--ink { z-index: 1; background: var(--ink); color: #fff; transform: translateY(-22%) rotate(5deg); }
.band__track {
  display: flex; align-items: center; gap: clamp(18px, 2.4vw, 36px); width: max-content; padding-right: clamp(18px, 2.4vw, 36px);
  font-family: var(--display); font-weight: 900; font-size: clamp(34px, 5.6vw, 86px); letter-spacing: -0.035em; line-height: 1;
  white-space: nowrap; will-change: transform;
}
.band__star { width: .62em; height: .62em; flex: none; }
.band--ink .band__star { color: var(--volt); }
.no-js .band__track, .no-motion .band__track { animation: band 40s linear infinite; }
.no-js [data-reverse] .band__track, .no-motion [data-reverse] .band__track { animation-direction: reverse; }
@keyframes band { to { transform: translateX(-50%); } }

/* ============ 05 PROGRAM ============ */
.program { position: relative; }
.program__stage { position: sticky; top: 0; height: 100vh; height: 100svh; display: flex; flex-direction: column; justify-content: center; overflow: hidden; padding-top: var(--gnb-h); }
.program__head { position: relative; margin-bottom: clamp(24px, 4vh, 44px); }
.program__rail { margin-top: clamp(20px, 3vh, 36px); }
.program__rail-line { position: relative; height: 2px; background: var(--gray-2); border-radius: 2px; }
.program__rail-line i { position: absolute; inset: 0 auto 0 0; width: 100%; background: var(--ink); transform-origin: left; transform: scaleX(0); }
.program__rail-line b { position: absolute; top: 50%; left: 0; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: var(--volt); box-shadow: 0 0 0 4px var(--ink); }
.program__rail-labels { display: flex; justify-content: space-between; margin-top: 12px; color: var(--muted); }
.program__viewport { position: relative; }
.program__track { display: flex; gap: 20px; width: max-content; padding: 0 var(--gutter); will-change: transform; }
.pcard {
  position: relative; flex: none; display: flex; flex-direction: column;
  width: clamp(290px, 29vw, 410px); height: clamp(340px, 50vh, 470px); padding: 30px 30px 32px;
  border-radius: var(--radius); background: #fff; overflow: hidden;
}
.pcard__time { position: relative; z-index: 1; font-family: var(--display); font-weight: 900; font-size: clamp(54px, 5.6vw, 84px); letter-spacing: -0.045em; line-height: .9; }
.pcard__time--sm { font-size: clamp(40px, 4vw, 60px); }
.pcard__tag { position: relative; z-index: 1; margin-top: 16px; color: var(--muted); }
.pcard h3 { position: relative; z-index: 1; margin-top: auto; font-size: clamp(24px, 2.2vw, 30px); font-weight: 800; letter-spacing: -0.04em; line-height: 1.2; }
.pcard h3 + p { position: relative; z-index: 1; margin-top: 8px; font-size: 15px; color: var(--muted); line-height: 1.55; }
.pcard__obj { position: absolute; z-index: 0; right: -8%; top: 18%; width: 48%; height: auto; transform: rotate(-12deg); transition: transform .8s var(--ease); filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .14)); }
.pcard:hover .pcard__obj { transform: rotate(-4deg) scale(1.06); }
.pcard__obj--violin { width: 52%; top: 14%; }
.pcard__obj--trophy { width: 40%; right: -2%; }
.pcard__obj--rope { width: 42%; }
.pcard--ink { background: var(--ink); color: #fff; }
.pcard__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .62; z-index: 0; }
.pcard--video::after { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(10, 10, 10, .55) 0%, rgba(10, 10, 10, .1) 40%, rgba(10, 10, 10, .85) 100%); }
.pcard--video > *:not(video) { z-index: 1; }
.pcard--ink .pcard__tag { color: var(--volt); }
.pcard--ink h3 + p { color: rgba(255, 255, 255, .62); }
.pcard--volt { background: var(--volt); }
.pcard--volt .pcard__tag, .pcard--volt h3 + p { color: rgba(10, 10, 10, .62); }
.program__note { margin-top: clamp(18px, 3vh, 30px); font-size: 14px; color: var(--muted); }

@media (max-width: 899px) {
  .program { padding: 110px 0 90px; }
  .program__stage { position: relative; height: auto; padding-top: 0; }
  .program__rail { display: none; }
  .program__track { flex-direction: column; width: auto; gap: 14px; }
  .pcard { width: 100%; height: auto; min-height: 220px; padding: 26px; }
  .pcard h3 { margin-top: 36px; }
  .pcard__obj { width: 34%; top: 10%; right: -4%; }
}
.no-motion .program__stage { position: relative; height: auto; padding: 120px 0; }
.no-motion .program__track { flex-wrap: wrap; width: auto; }

/* ============ 06 JOIN ============ */
.join { padding: clamp(110px, 14vw, 180px) 0; }
.join__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: clamp(40px, 6vw, 72px); }
.jcard {
  position: relative; display: flex; flex-direction: column; min-height: 600px; padding: 34px 32px 32px;
  border-radius: var(--radius); background: var(--gray); overflow: hidden;
  transition: transform .6s var(--ease), box-shadow .6s var(--ease);
}
.jcard:hover { transform: translateY(-6px); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .35); }
.jcard__no { color: var(--muted); }
.jcard h3 { margin-top: 18px; font-size: clamp(36px, 3.4vw, 50px); font-weight: 900; letter-spacing: -0.055em; line-height: 1; }
.jcard__lead { margin-top: 14px; max-width: 11.5em; font-size: 17px; font-weight: 600; line-height: 1.5; letter-spacing: -0.025em; }
.jcard__modes { margin-top: auto; padding-top: 140px; }
.jcard__modes li { display: flex; gap: 14px; align-items: baseline; padding: 13px 0; border-top: 1px solid rgba(10, 10, 10, .12); font-size: 15px; }
.jcard__modes b { flex: none; width: 34px; font-weight: 800; }
.jcard__list { margin: 6px 0 26px; padding-top: 14px; border-top: 1px solid rgba(10, 10, 10, .12); }
.jcard__list li { position: relative; padding-left: 16px; font-size: 14px; color: var(--muted); line-height: 1.7; }
.jcard__list li::before { content: ""; position: absolute; left: 0; top: .72em; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .55; }
.jcard .btn { align-self: flex-start; }
.jcard__obj { position: absolute; right: -8%; top: 25%; width: 44%; height: auto; transform: rotate(10deg); transition: transform .8s var(--ease); filter: drop-shadow(0 24px 30px rgba(0, 0, 0, .2)); pointer-events: none; }
.jcard:hover .jcard__obj { transform: rotate(2deg) translateY(-8px) scale(1.04); }
.jcard__obj--mic { width: 22%; right: 7%; top: 20%; transform: rotate(18deg); }
.jcard__obj--sneaker { width: 40%; top: 23%; transform: rotate(-12deg); }
.jcard:hover .jcard__obj--sneaker { transform: rotate(-4deg) translateY(-10px) scale(1.05); }
.jcard--ink { background: var(--ink); color: #fff; }
.jcard--ink .jcard__no { color: var(--volt); }
.jcard--ink .jcard__modes li, .jcard--ink .jcard__list { border-color: rgba(255, 255, 255, .16); }
.jcard--ink .jcard__list li { color: rgba(255, 255, 255, .62); }
.jcard--volt { background: var(--volt); }
.jcard--volt .jcard__no, .jcard--volt .jcard__list li { color: rgba(10, 10, 10, .62); }
@media (max-width: 1080px) {
  .join__grid { grid-template-columns: 1fr; }
  .jcard { min-height: 0; }
  .jcard__modes { padding-top: 60px; }
  .jcard__obj { width: 30%; top: 8%; }
  .jcard__obj--mic { width: 16%; }
  .jcard__obj--sneaker { width: 28%; }
}

/* ============ 07 SCHEDULE ============ */
.schedule { padding: clamp(110px, 14vw, 180px) 0; overflow: hidden; }
.dday { margin-bottom: clamp(48px, 7vw, 90px); }
.dday__label { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.plate { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; background: var(--volt); color: var(--ink); border-radius: 6px; }
.dday__when { color: rgba(255, 255, 255, .55); }
.dday__num { display: flex; align-items: flex-end; margin-top: 10px; font-family: var(--display); font-weight: 900; font-size: clamp(120px, 25vw, 380px); letter-spacing: -0.06em; line-height: .78; }
.dday__d { color: var(--volt); }
.dday__roll { display: inline-flex; overflow: hidden; }
.dday__roll .digit { display: inline-block; }
.dday__num.is-text { font-size: clamp(64px, 13vw, 200px); letter-spacing: -0.05em; }
.steps { position: relative; display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; margin-top: clamp(36px, 5vw, 60px); padding-top: 26px; }
.steps::before { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 1px; background: rgba(255, 255, 255, .2); }
.steps li { position: relative; padding-right: 8px; }
.steps li::before { content: ""; position: absolute; left: 0; top: -26px; width: 13px; height: 13px; border-radius: 50%; background: var(--ink); border: 1.5px solid rgba(255, 255, 255, .5); }
.steps li.is-key::before { background: var(--volt); border-color: var(--volt); }
.steps li.is-final::before { background: #fff; border-color: #fff; box-shadow: 0 0 0 5px rgba(212, 245, 39, .35); }
.steps__date { color: rgba(255, 255, 255, .5); }
.steps h3 { margin-top: 10px; font-size: clamp(16px, 1.4vw, 20px); font-weight: 800; letter-spacing: -0.035em; line-height: 1.3; }
.steps h3 + p { margin-top: 6px; font-size: 14px; color: rgba(255, 255, 255, .55); }
.steps li.is-key h3, .steps li.is-final h3 { color: var(--volt); }
.notice { display: flex; gap: 16px; align-items: flex-start; margin-top: clamp(44px, 6vw, 70px); padding: 24px 26px; border-radius: 20px; border: 1px solid rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .04); }
.notice__ico { width: 22px; height: 22px; flex: none; margin-top: 3px; color: var(--volt); }
.notice p { font-size: clamp(15px, 1.3vw, 18px); color: rgba(255, 255, 255, .72); line-height: 1.65; }
.notice b { color: #fff; font-weight: 700; }
@media (max-width: 960px) {
  .steps { grid-template-columns: 1fr; gap: 0; padding: 0 0 0 30px; }
  .steps::before { left: 6px; right: auto; top: 8px; bottom: 8px; width: 1px; height: auto; }
  .steps li { padding: 0 0 26px; }
  .steps li::before { left: -30px; top: 4px; }
  .steps h3 { margin-top: 4px; }
}

/* ============ 08 AWARDS ============ */
.awards { position: relative; padding: clamp(110px, 14vw, 180px) 0; overflow: hidden; background: #fff; }
.awards__wall { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 1vw; pointer-events: none; user-select: none; }
.awards__wall p {
  font-family: var(--display); font-weight: 900; font-size: clamp(90px, 15vw, 260px); line-height: .86; letter-spacing: -0.04em; white-space: nowrap;
  color: transparent; -webkit-text-stroke: 1.5px var(--gray-2); will-change: transform;
}
.awards__wall p.is-fill { color: var(--gray); -webkit-text-stroke: 0; }
.awards__inner { position: relative; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.awards__visual img { width: min(100%, 440px); margin: 0 auto; filter: drop-shadow(0 40px 50px rgba(0, 0, 0, .2)); }
.awards__num { display: flex; align-items: baseline; gap: 12px; margin-top: 18px; font-family: var(--display); font-weight: 900; font-size: clamp(100px, 13vw, 190px); line-height: .85; letter-spacing: -0.06em; }
.awards__num small { font-family: var(--sans); font-size: clamp(20px, 2vw, 28px); font-weight: 800; letter-spacing: -0.04em; }
.awards__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 34px; }
.prize { padding-top: 16px; border-top: 2px solid var(--ink); }
.prize__div { font-size: 20px; font-weight: 800; letter-spacing: -0.03em; }
.prize ul { margin-top: 10px; }
.prize li { display: flex; justify-content: space-between; align-items: baseline; padding: 9px 0; border-bottom: 1px solid var(--gray-2); font-weight: 600; }
.prize b { font-family: var(--display); font-weight: 900; font-size: 22px; }
.awards__notes { margin-top: 26px; display: grid; gap: 6px; }
.awards__notes li { position: relative; padding-left: 18px; color: var(--muted); font-size: 15px; }
.awards__notes li::before { content: ""; position: absolute; left: 0; top: .62em; width: 8px; height: 8px; background: var(--volt); border-radius: 2px; transform: rotate(45deg); }
@media (max-width: 900px) {
  .awards__inner { grid-template-columns: 1fr; }
  .awards__visual img { width: min(62vw, 300px); }
}

/* ============ 09 FAQ ============ */
.faq { padding: clamp(110px, 13vw, 170px) 0; }
.faq__inner { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(28px, 6vw, 96px); align-items: start; }
.faq__head { position: sticky; top: calc(var(--gnb-h) + 40px); }
.faq__list details { border-bottom: 1px solid var(--line); }
.faq__list details:first-child { border-top: 1px solid var(--line); }
.faq__list summary {
  display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 24px 0;
  font-size: clamp(17px, 1.5vw, 21px); font-weight: 700; letter-spacing: -0.03em; cursor: pointer; list-style: none;
}
.faq__list summary::-webkit-details-marker { display: none; }
.faq__list summary .ico { width: 22px; height: 22px; transition: transform .4s var(--ease); }
.faq__list details[open] summary .ico { transform: rotate(45deg); }
.faq__list details > div { overflow: hidden; }
.faq__list details p { padding: 0 40px 24px 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
.faq__list details a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 900px) {
  .faq__inner { grid-template-columns: 1fr; }
  .faq__head { position: static; }
}

/* ============ 10 VENUE ============ */
.venue { padding: clamp(110px, 13vw, 170px) 0; }
.venue__inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(36px, 6vw, 96px); align-items: center; }
.venue__addr { display: flex; align-items: center; gap: 8px; margin-top: 26px; font-size: clamp(18px, 1.6vw, 22px); font-weight: 700; letter-spacing: -0.03em; }
.venue__addr .ico { width: 22px; height: 22px; }
.venue__note { margin-top: 10px; color: var(--muted); font-size: 15px; }
.venue__links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }

.ticket {
  position: relative; display: flex; flex-direction: column; width: min(100%, 440px); justify-self: center;
  border-radius: 26px; background: var(--ink); color: #fff; transform: rotate(-4deg); transform-style: preserve-3d;
  box-shadow: 0 50px 80px -40px rgba(0, 0, 0, .5); transition: transform .6s var(--ease);
}
.ticket__main { padding: 32px 32px 26px; }
.ticket__kicker { color: var(--volt); }
.ticket__title { margin-top: 18px; font-family: var(--display); font-weight: 900; font-size: clamp(56px, 6vw, 84px); line-height: .82; letter-spacing: -0.05em; }
.ticket__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 14px; margin-top: 30px; }
.ticket__meta dt { color: rgba(255, 255, 255, .45); font-size: 10px; }
.ticket__meta dd { margin-top: 4px; font-size: 12px; }
.ticket__stub {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 32px 26px;
  border-top: 2px dashed rgba(255, 255, 255, .22);
}
.ticket__stub::before, .ticket__stub::after { content: ""; position: absolute; top: -14px; width: 26px; height: 26px; border-radius: 50%; background: #fff; }
.ticket__stub::before { left: -13px; }
.ticket__stub::after { right: -13px; }
.ticket__stub p { color: rgba(255, 255, 255, .5); font-size: 11px; }
.ticket__bars { display: block; width: 150px; height: 40px; background: repeating-linear-gradient(90deg, #fff 0 2px, transparent 2px 4px, #fff 4px 5px, transparent 5px 9px, #fff 9px 12px, transparent 12px 14px); opacity: .9; }
@media (max-width: 900px) {
  .venue__inner { grid-template-columns: 1fr; }
  .ticket { margin-top: 20px; width: min(100%, 360px); transform: rotate(-3deg); }
}

/* ============ 11 FINALE ============ */
.finale { position: relative; padding: clamp(130px, 16vw, 220px) 0; overflow: hidden; background: var(--volt); text-align: center; }
.finale__icons svg { position: absolute; width: clamp(44px, 5vw, 78px); height: clamp(44px, 5vw, 78px); color: var(--ink); opacity: .9; }
.finale__icons svg:nth-child(1) { left: 8%; top: 20%; transform: rotate(-12deg); }
.finale__icons svg:nth-child(2) { left: 20%; top: 72%; transform: rotate(10deg); }
.finale__icons svg:nth-child(3) { left: 80%; top: 17%; transform: rotate(14deg); }
.finale__icons svg:nth-child(4) { left: 87%; top: 62%; transform: rotate(-8deg); }
.finale__icons svg:nth-child(5) { left: 66%; top: 80%; transform: rotate(6deg); }
.finale__icons svg:nth-child(6) { left: 34%; top: 12%; transform: rotate(-6deg); }
.finale__icons svg:nth-child(7) { left: 5%; top: 78%; transform: rotate(8deg); }
.finale__icons svg:nth-child(8) { left: 58%; top: 9%; transform: rotate(-14deg); }
.finale__inner { position: relative; z-index: 1; }
.finale .kicker { color: rgba(10, 10, 10, .6); }
.finale__title { font-size: clamp(54px, 10vw, 168px); font-weight: 900; letter-spacing: -0.06em; line-height: .98; }
.finale__sub { margin-top: 24px; font-size: clamp(16px, 1.5vw, 20px); font-weight: 700; color: rgba(10, 10, 10, .7); }
.finale__cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 34px; }
.finale .btn--ink:hover { background: #fff; color: var(--ink); }
@media (max-width: 720px) {
  .finale__icons svg:nth-child(2), .finale__icons svg:nth-child(5), .finale__icons svg:nth-child(8) { display: none; }
}

/* JS 를 끈 환경 */
.no-js .hero__mask { display: none; }
.no-js .hero__copy, .no-js .hero__meta { color: #fff; }
.no-js .hero__slogan, .no-js .hero__slogan b { color: #fff; }