@charset "UTF-8";
/* =========================================================
   festival.html 전용 스타일 (강남페스티벌)
   - 공통 토큰·컴포넌트는 style.css / sub.css 그대로 사용
   ========================================================= */

/* (카드 배지 폭 · 가로 타임라인 정렬 보정은 sub.css 공통 규칙으로 옮김) */

/* ---------- 01. 개요: 메인 페스티벌 포스터를 크게 ---------- */
.fest-visual { container-type: inline-size; background: var(--blue); }
.fest-visual .poster { padding: 7cqi; }
.fest-visual .poster--festival .poster__tag { top: 7cqi; left: 7cqi; font-size: max(12px, 2.4cqi); padding: 1.2cqi 2.4cqi; }
.fest-visual .poster--festival .poster__big { font-size: 11.5cqi; }
.fest-visual .poster--festival .poster__year { margin-top: 2.4cqi; font-size: max(13px, 3cqi); }
.fest-visual::after { /* 오른쪽 아래 하트 스티커 */
  content: ""; position: absolute; right: 7cqi; bottom: 7cqi; width: 22cqi; aspect-ratio: 1;
  background: var(--pink);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-8.8-5.2-8.8-11.3A4.9 4.9 0 0 1 12 6.8a4.9 4.9 0 0 1 8.8 2.9C20.8 15.8 12 21 12 21z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-8.8-5.2-8.8-11.3A4.9 4.9 0 0 1 12 6.8a4.9 4.9 0 0 1 8.8 2.9C20.8 15.8 12 21 12 21z'/%3E%3C/svg%3E") center / contain no-repeat;
  transform: rotate(-12deg);
}
.fest-kicker { margin-bottom: 14px; }

/* ---------- 02. 즐길 거리 (예시 카드: 링크 없음 → hover 효과 끔) ---------- */
.hl-card:hover { border-color: transparent; box-shadow: none; }
.hl-card:hover .art { transform: none; }
.hl-card .art__word { font-size: clamp(30px, 8vw, 40px); }
.hl-card .art__icon { width: 40px; height: 40px; }
.hl-card .card__title { margin-top: 4px; }
@media (max-width: 767.98px) { .hl-card .card__media { aspect-ratio: 2 / 1; } }
.hl-art--art .poster__shape--circle { width: 42%; top: 10%; left: 10%; }
.hl-art--art .poster__shape--square { width: 26%; top: 14%; right: 12%; }
.hl-art--art .poster__shape--arch { width: 30%; top: 36%; left: 44%; }
.hl-note { margin-top: 32px; background: #fff; }
@media (min-width: 768px) { .hl-note { margin-top: 40px; } }

/* ---------- 04. 축제 FAQ: 데스크톱은 머리말 왼쪽 + 질문 오른쪽 ---------- */
.fest-faq__more { margin-top: 24px; }
@media (min-width: 1280px) {
  .fest-faq { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 72px; align-items: start; }
  .fest-faq .sec-head { margin-bottom: 0; position: sticky; top: calc(var(--header-h) + var(--lnb-h) + 32px); }
  .fest-faq .sec-en { font-size: 56px; }
}

/* ---------- 05. 소식 알림 신청 ---------- */
.fest-notify { display: grid; gap: 32px; }
.fest-notify .check-list li::before { background: var(--ink); }
.fest-notify .check-list li::after { border-color: var(--mint); }
.fest-notify__card {
  padding: 24px 20px; border-radius: var(--radius-lg); background: #fff;
  box-shadow: 0 24px 48px -32px rgba(17, 17, 17, .35);
}
.fest-notify__card .form { max-width: none; }
.fest-notify__req { color: var(--gray); font-size: 14px; }
.fest-notify__req span[aria-hidden] { color: var(--pink-aa); font-weight: 700; }
@media (min-width: 768px) { .fest-notify__card { padding: 36px; } }
@media (min-width: 1280px) {
  .fest-notify { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 72px; align-items: start; }
  .fest-notify__card { padding: 48px; }
  .fest-notify .sec-en { font-size: 56px; }
}