/* Pretendard: tools/fonts.py 가 사이트 글자만 뽑아 만든 파일 (OFL) */
@font-face { font-family: "Pretendard"; font-weight: 400; font-style: normal; font-display: swap; src: url("/assets/fonts/pretendard-400.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 500; font-style: normal; font-display: swap; src: url("/assets/fonts/pretendard-500.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 600; font-style: normal; font-display: swap; src: url("/assets/fonts/pretendard-600.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 700; font-style: normal; font-display: swap; src: url("/assets/fonts/pretendard-700.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 800; font-style: normal; font-display: swap; src: url("/assets/fonts/pretendard-800.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 900; font-style: normal; font-display: swap; src: url("/assets/fonts/pretendard-900.woff2") format("woff2"); }

/* ==========================================================================
   강남 멀리건 (구 구구단) 쩜오
   2026-09-16 리디자인. 검정+골드+세리프 조합을 버리고 시그니엘 서울 실측 팔레트
   에서 버튼, 선, 타이포 방식을 가져왔다. 지면은 고객 선호로 검정 유지.
     지면 검정 / 글자 아이보리 / CTA 아이보리 단색 / 황동은 전화번호 밑줄에만
     Pretendard 한 서체 / 모서리 0 / 카드 대신 선으로 구분 / 가운데 정렬 히어로 대신 좌하단 정렬
   ========================================================================== */

:root {
  color-scheme: dark;

  --bg:          #050505;
  --surface:     #111111;
  --surface-2:   #171717;
  --line:        rgba(255, 255, 255, 0.12);
  --line-strong: rgba(255, 255, 255, 0.26);

  --text:        #D2CFC8;
  --text-dim:    #8A8A86;
  --text-hi:     #F3F0EA;

  --ivory:       #ECE5D6;
  --ink:         #050505;
  --brass:       #B39063;

  --accent:      var(--brass);
  --cta:         var(--ivory);
  --cta-ink:     var(--ink);
  --menu-hd:     var(--text-dim);

  --sans: Pretendard, "Pretendard Variable", -apple-system, "Apple SD Gothic Neo",
          "Malgun Gothic", system-ui, sans-serif;

  --wrap: 1200px;
  --pad-x: 20px;
  --hdr-h: 72px;
  --bar-h: 0px;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: var(--hdr-h); }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.75;
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
}

img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
p { margin: 0; }

h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: 1.35; color: var(--text-hi); letter-spacing: -0.02em; }
h1 { font-size: clamp(24px, 2.8vw, 34px); }
h2 { font-size: clamp(22px, 2.4vw, 30px); }
h3, h4 { font-size: 17px; letter-spacing: -0.01em; }

::selection { background: var(--ivory); color: var(--ink); }
:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.skip {
  position: absolute; left: 12px; top: -60px; z-index: 200;
  background: var(--cta); color: var(--cta-ink);
  padding: 10px 18px; font-size: 14px; font-weight: 600;
}
.skip:focus { top: 12px; }

/* ------------------------------------------------------------- 레이아웃 */

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--pad-x); }

.sec > .wrap { padding-block: clamp(52px, 6.5vw, 88px); border-top: 1px solid var(--line); }
.sec > .wrap > h1, .sec > .wrap > h2 { margin-bottom: 14px; max-width: 30em; }
.sec-note { color: var(--text-dim); font-size: 15.5px; max-width: 44em; }
.sec-unit { color: var(--text-dim); font-size: 13px; margin-top: 4px; }
.lead { font-size: 16.5px; margin-top: 14px; max-width: 46em; }
.lead + .lead { margin-top: 14px; }
.note { margin-top: 14px; font-size: 13px; color: var(--text-dim); }

/* --------------------------------------------------------------- 헤더
   로고와 전화번호만 (유흥 사이트 원칙). 메뉴 버튼 없음. */

.hdr {
  position: fixed; inset: 0 0 auto 0; z-index: 90;
  height: var(--hdr-h); padding-inline: var(--pad-x);
  display: flex; align-items: center;
  border-bottom: 1px solid transparent;
  transition: background .35s ease, border-color .35s ease;
}
.hdr[data-solid="true"] {
  background: rgba(5, 5, 5, .94); backdrop-filter: blur(10px);
  border-bottom-color: var(--line);
}
.hdr__in {
  width: 100%; max-width: calc(var(--wrap) - var(--pad-x) * 2); margin-inline: auto;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.logo { display: flex; align-items: center; gap: 12px; }
.logo img { width: 36px; height: 36px; }
.logo__txt { display: flex; flex-direction: column; line-height: 1.25; }
.logo__txt b { font-size: 16px; font-weight: 600; color: var(--text-hi); letter-spacing: -0.01em; }
.logo__txt small { font-size: 12px; color: var(--text-dim); }

.hdr-call { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; }
.hdr-call small { font-size: 11.5px; color: var(--text-dim); }
.hdr-call b {
  font-size: 17px; font-weight: 600; color: var(--text-hi); letter-spacing: .01em;
  padding-bottom: 2px; border-bottom: 1px solid var(--brass);
}
.hdr-call:hover b { color: #fff; }

/* -------------------------------------------------------------- 히어로
   좌하단 정렬. 가운데 로고 + 알약 버튼 조합을 쓰지 않는다. */

.hero {
  position: relative; height: 100svh; min-height: 620px;
  display: flex; align-items: flex-end; overflow: hidden; background: var(--bg);
}
.hero__media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hero__media picture { display: contents; }
.hero__bg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; filter: blur(34px) brightness(.4) saturate(.8);
  transform: scale(1.18);
}
.hero__fg { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; }
.hero__fg img, .hero__fg video {
  width: auto; max-width: none;
  height: calc(100% * var(--hero-zoom, 1.46));
  object-fit: contain; transform: translate(0, -4%);
  /* 영상 좌우 끝이 흐린 배경과 칼같이 갈라져 보이지 않게 가장자리를 녹인다 */
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
}
/* 포스터와 영상을 같은 규칙으로 겹쳐 둔다. 포스터가 그리드 흐름을 따르면 크기 계산이
   따로 돌아 1280 화면에서 1869px 로 커지고 위로 밀려 얼굴이 화면 밖으로 나갔다. */
.hero__fg .hero__still, .hero__fg video {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -54%);
}
/* 포스터가 영상 첫 프레임과 같으므로 페이드 없이 바로 바꾼다 (페이드가 지연처럼 보였다) */
.hero__fg video { opacity: 0; }
.hero__fg video[data-ready="true"] { opacity: 1; }
.hero__media.is-placeholder { background: linear-gradient(160deg, #1A1A1A 0%, var(--bg) 72%); }
.hero__scrim {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(90deg, rgba(5,5,5,.92) 0%, rgba(5,5,5,.62) 34%, rgba(5,5,5,.08) 66%),
    linear-gradient(0deg, rgba(5,5,5,.95) 0%, rgba(5,5,5,0) 38%);
}
.hero__in { position: relative; z-index: 2; padding-bottom: clamp(52px, 9vh, 104px); }

.hero__loc { font-size: 13.5px; color: var(--text); display: flex; align-items: center; gap: 12px; }
.hero__loc::before { content: ""; width: 32px; height: 1px; background: var(--brass); }
.hero__name {
  margin-top: 18px; font-size: clamp(60px, 8.4vw, 112px); font-weight: 700;
  line-height: .98; letter-spacing: -0.045em; color: var(--text-hi);
}
.hero__kr { margin-top: 16px; font-size: 18px; color: var(--text-hi); }
.hero__kr span { margin-left: 10px; color: var(--text-dim); }

.hero__phone { display: inline-flex; flex-direction: column; margin-top: 38px; }
.hero__phone small { font-size: 12.5px; color: var(--text-dim); }
.hero__phone b {
  margin-top: 2px; font-size: clamp(28px, 3.1vw, 38px); font-weight: 600;
  letter-spacing: .005em; color: var(--text-hi); line-height: 1.2;
  padding-bottom: 6px; border-bottom: 2px solid var(--brass);
  transition: color .2s ease, border-color .2s ease;
}
.hero__phone:hover b { color: #fff; border-color: var(--ivory); }

.hero__links { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 10px 28px; }
.hero__link {
  background: none; border: 0; padding: 0 0 3px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 15px; font-weight: 500; color: var(--text);
  border-bottom: 1px solid var(--line-strong);
  transition: color .2s ease, border-color .2s ease;
}
.hero__link svg { width: 15px; height: 15px; transition: transform .2s ease; }
.hero__link:hover { color: var(--text-hi); border-color: var(--ivory); }
.hero__link:hover svg { transform: translateX(3px); }

.hero__trust {
  margin: 30px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap;
  font-size: 13px; color: var(--text-dim);
}
.hero__trust li + li::before {
  content: ""; display: inline-block; width: 1px; height: 10px;
  background: var(--line-strong); margin: 0 12px; vertical-align: 0;
}

/* ---------------------------------------------------------------- 버튼 */

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 0 26px; border-radius: 0;
  font-size: 15px; font-weight: 600; border: 1px solid transparent; cursor: pointer;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.btn--main { background: var(--cta); color: var(--cta-ink); }
.btn--main:hover { background: #fff; }
.btn--sub { background: transparent; color: var(--text-hi); border-color: var(--line-strong); }
.btn--sub:hover { border-color: var(--ivory); }
.btn__ic { width: 17px; height: 17px; flex: none; }

.cta-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.cta-row--center { justify-content: center; }

/* ------------------------------------------------------ 3칸 정보 (카드 대신 선) */

.cards {
  display: grid; grid-template-columns: repeat(3, 1fr);
  margin-top: 28px; border-top: 1px solid var(--line-strong);
}
.cards > div { padding: 26px 28px 28px 0; border-bottom: 1px solid var(--line); }
.cards > div + div { padding-left: 28px; border-left: 1px solid var(--line); }
.cards h3 { margin-bottom: 12px; }
.cards p { font-size: 15px; }
.cards p + p { margin-top: 8px; }
.cards b { color: var(--text-hi); font-weight: 600; }

.price4 { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 28px; border-top: 1px solid var(--line-strong); }
.price4 > div { padding: 22px 0; border-bottom: 1px solid var(--line); }
.price4 dt { font-size: 14px; color: var(--text-dim); }
.price4 dd { margin: 6px 0 0; font-size: 22px; font-weight: 600; color: var(--text-hi); }

/* ------------------------------------------------------------- 영업시간 */

.days { display: grid; grid-template-columns: repeat(7, 1fr); margin-top: 28px; border-top: 1px solid var(--line-strong); }
.days > div { padding: 18px 12px 18px 0; border-bottom: 1px solid var(--line); }
.days h3 { margin-bottom: 8px; font-size: 15px; }
.days p { font-size: 13px; }
.days p span { display: block; color: var(--text-dim); font-size: 12px; }
.days > div[data-off="true"] p, .days > div[data-off="true"] h3 { color: var(--text-dim); }

/* ---------------------------------------------------------- 메뉴 테이블 */

.menu-h { color: var(--text-hi) !important; }
.mtable { margin-top: 24px; border-top: 1px solid var(--line-strong); }
.mrow {
  display: grid; align-items: center; min-height: 44px; padding: 8px 0;
  border-bottom: 1px solid var(--line); font-size: 15.5px;
}
.mrow--3 { grid-template-columns: repeat(3, 1fr); column-gap: 12px; }
.mrow--2 { grid-template-columns: repeat(2, 1fr); column-gap: 12px; }
.mrow--head { color: var(--text-dim); font-weight: 500; font-size: 13px; }
.mrow > span:last-child { color: var(--text-hi); }
.mrow--head > span:last-child { color: var(--text-dim); }
.mrow .tag { color: var(--text-dim); font-size: 13.5px; }

/* ------------------------------------------------- 전면 사진 띠 (band)
   레퍼런스 실측: 배경 고정, cover. 글자는 얹지 않는다. 모바일은 일반 스크롤. */

.band {
  width: 100%; height: 450px;
  background-image: var(--img); background-repeat: no-repeat;
  background-size: cover; background-position: var(--focus, center);
  background-attachment: fixed; background-color: var(--bg);
}
@media (max-width: 1024px) {
  .band {
    height: calc(100vw * 9 / 16); min-height: 200px; max-height: 420px;
    background-attachment: scroll; background-position: center;
  }
}

.shot { margin: 24px 0 0; }
.shot img { width: 100%; height: auto; }
.shot figcaption { margin-top: 10px; font-size: 13px; color: var(--text-dim); }

.ph {
  width: 100%; aspect-ratio: 16/9; border: 1px dashed var(--line); background: var(--surface);
  display: grid; place-content: center; gap: 4px; text-align: center;
  color: var(--text-dim); font-size: 13px; padding: 16px;
}

/* --------------------------------------------------- 예약방문 이벤트 */

.ev { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(16px, 3vw, 56px); align-items: center; }
.ev__anim { min-width: 0; display: flex; justify-content: center; }
.ev__txt > h2 { margin-bottom: 10px; }
.ev__list { list-style: none; counter-reset: ev; margin: 22px 0 0; padding: 0; border-top: 1px solid var(--line-strong); }
.ev__list li { counter-increment: ev; position: relative; padding: 18px 0 18px 40px; border-bottom: 1px solid var(--line); }
.ev__list li::before { content: counter(ev, decimal-leading-zero); position: absolute; left: 0; top: 19px; font-size: 13px; color: var(--text-dim); }
.ev__list h3 { margin-bottom: 4px; }
.ev__list div { font-size: 15px; }
@media (max-width: 900px) { .ev { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------ 오시는 길 */

.addr {
  margin-top: 26px; padding: 22px 0; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px;
}
.addr b { color: var(--text-hi); font-size: 18px; font-weight: 600; }
.copy {
  background: transparent; border: 1px solid var(--line-strong); color: var(--text-hi);
  padding: 10px 18px; font-size: 14px; cursor: pointer;
}
.copy:hover { border-color: var(--ivory); }
.copy[data-done="true"] { background: var(--cta); color: var(--cta-ink); border-color: transparent; }

/* ------------------------------------------------------------------ FAQ */

.faq-h { color: var(--text-hi) !important; }
.faq { margin-top: 26px; border-top: 1px solid var(--line-strong); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary {
  cursor: pointer; list-style: none; padding: 22px 48px 22px 0; position: relative;
  font-size: 16.5px; font-weight: 600; color: var(--text-hi);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before, .faq summary::after {
  content: ""; position: absolute; right: 4px; top: 50%;
  background: var(--text-dim); transition: transform .25s ease, opacity .25s ease;
}
.faq summary::before { width: 14px; height: 1px; }
.faq summary::after { width: 1px; height: 14px; margin-top: -6.5px; right: 10.5px; }
.faq details[open] summary::after { transform: scaleY(0); opacity: 0; }
.faq .a { padding: 0 0 22px; font-size: 15.5px; max-width: 48em; }

/* ------------------------------------------------------------ 마지막 CTA */

.final > .wrap { text-align: left; }
.final h2 { font-size: clamp(26px, 3.2vw, 40px); }
.final p { margin-top: 12px; color: var(--text-dim); font-size: 15px; }
.final .cta-row--center { justify-content: flex-start; }

/* ---------------------------------------------------------------- 푸터 */

.ftr { background: #000000; border-top: 1px solid var(--line); padding-block: 36px 44px; font-size: 14px; color: var(--text-dim); }
.ftr__in { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 28px; }
.ftr b { display: block; margin-bottom: 6px; color: var(--text); font-size: 14px; font-weight: 600; }
.ftr a:hover { color: var(--text-hi); }

/* ------------------------------------ 오른쪽 하단 원형 전화 버튼 (하단 고정 바 금지) */

.callfab {
  position: fixed; z-index: 95;
  right: clamp(16px, 2vw, 28px);
  bottom: calc(clamp(16px, 2vw, 28px) + env(safe-area-inset-bottom));
  width: 58px; height: 58px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--cta); color: var(--cta-ink);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
  opacity: 0; transform: translateY(14px); pointer-events: none;
  transition: opacity .3s ease, transform .3s ease, background .2s ease;
}
.callfab[data-show="true"] { opacity: 1; transform: none; pointer-events: auto; }
.callfab:hover { background: #fff; }
.callfab .btn__ic { width: 22px; height: 22px; }

/* ----------------------------------------------------------------- 404 */

.nf { min-height: 78svh; display: grid; place-content: center; text-align: center; gap: 10px; padding-top: var(--hdr-h); }
.nf .code { font-size: 96px; font-weight: 700; letter-spacing: -0.05em; color: var(--text-hi); line-height: 1; }

/* ============================================================== 반응형 */

@media (max-width: 1024px) {
  .price4 { grid-template-columns: repeat(2, 1fr); }
  .days { grid-template-columns: repeat(4, 1fr); }
  .cards { grid-template-columns: 1fr; }
  .cards > div, .cards > div + div { padding: 22px 0; border-left: 0; }
}

@media (max-width: 768px) {
  :root { --hdr-h: 64px; }
  .logo img { width: 32px; height: 32px; }
  .logo__txt b { font-size: 15px; }
  .hdr-call small { display: none; }
  .hdr-call b { font-size: 15px; }
  .hero__bg { display: none; }
  .hero__fg img, .hero__fg video {
    width: 100%; height: 100%; max-width: none;
    object-fit: cover; object-position: 50% 22%; transform: none;
  }
  .hero__fg .hero__still, .hero__fg video { transform: translate(-50%, -50%); }
  .hero__scrim {
    background: linear-gradient(0deg, rgba(5,5,5,.96) 0%, rgba(5,5,5,.72) 34%, rgba(5,5,5,.1) 62%);
  }
  .hero__phone { margin-top: 30px; }
  .days { grid-template-columns: repeat(2, 1fr); }
  .mrow { font-size: 15px; }
}

@media (max-width: 400px) {
  :root { --pad-x: 16px; }
  .hero__name { font-size: 54px; }
  .mrow { font-size: 14px; }
  .mrow .tag { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
  .hero__media video { display: none; }
}

/* ═══════════════════════════════════════ 문의 접수 · 예약 신청 창 */

.modal {
  border: 1px solid var(--line-strong); border-radius: 0;
  background: var(--surface); color: var(--text); padding: 0;
  width: min(680px, calc(100vw - 32px)); max-height: min(88svh, 900px);
}
.modal::backdrop { background: rgba(0, 0, 0, .78); backdrop-filter: blur(3px); }
.modal__box { padding: clamp(22px, 3vw, 34px); }
.modal__hd { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.modal__hd h2 { font-size: 22px; }
.modal__x { background: none; border: 0; color: var(--text-dim); font-size: 28px; line-height: 1; cursor: pointer; padding: 0 4px; }
.modal__x:hover { color: var(--text-hi); }
.modal__note { margin-top: 8px; color: var(--text-dim); font-size: 14px; }
.modal__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 22px; }
.fld { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.fld--wide { grid-column: 1 / -1; }
.fld > span { font-size: 13px; color: var(--text-dim); }
.fld input, .fld select, .fld textarea {
  width: 100%; background: var(--bg); border: 1px solid var(--line); border-radius: 0;
  color: var(--text-hi); font: inherit; font-size: 15px; padding: 12px 14px; min-height: 48px;
}
.fld textarea { resize: vertical; line-height: 1.6; }
.fld input:focus, .fld select:focus, .fld textarea:focus { outline: none; border-color: var(--ivory); }
.fld input::placeholder, .fld textarea::placeholder { color: #5E5E5B; }
.fld select { appearance: none; cursor: pointer; }
.chk { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: var(--text-dim); line-height: 1.6; }
.chk input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--ivory); flex: none; }
.chk a { color: var(--text-hi); text-decoration: underline; text-underline-offset: 3px; }
.modal__ft { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.modal__done { margin-top: 16px; padding: 14px 16px; background: rgba(179, 144, 99, .12); border: 1px solid var(--line); color: var(--text-hi); font-size: 14.5px; }
@media (max-width: 560px) {
  .modal__grid { grid-template-columns: 1fr; }
  .modal__ft { flex-direction: column-reverse; }
  .modal__ft .btn { width: 100%; }
}

.linkish {
  background: none; border: 0; padding: 0; cursor: pointer; font: inherit;
  color: var(--text-hi); border-bottom: 1px solid var(--line-strong);
}
.linkish:hover { border-color: var(--ivory); }

/* ───────────────────────────────────────── 매장 실제 사진 */

.own { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-top: 26px; }
.own figure { margin: 0; position: relative; }
.own img { width: 100%; height: auto; display: block; }
.own figcaption { padding: 10px 0 14px; font-size: 13px; color: var(--text-dim); }
@media (max-width: 900px) { .own { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .own { grid-template-columns: 1fr; } }

/* ───────── 검색어 섹션 표와 목록 (seo.py) ───────── */
.tbl { margin-top: 24px; overflow-x: auto; border-top: 1px solid var(--line-strong); }
.tbl table { width: 100%; border-collapse: collapse; font-size: 15px; }
.tbl--wide table { min-width: 560px; }
.tbl th, .tbl td { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.tbl thead th { color: var(--text-dim); font-weight: 500; font-size: 13px; }
.tbl tbody th { color: var(--text-hi); font-weight: 600; white-space: nowrap; }
.tbl td { color: var(--text); }
.sub { margin-top: 36px; }
.chk-list { list-style: none; margin: 24px 0 0; padding: 0; border-top: 1px solid var(--line-strong); }
.chk-list li { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 15px; display: grid; grid-template-columns: 9em 1fr; gap: 12px; }
.chk-list b { color: var(--text-hi); font-weight: 600; }
@media (max-width: 560px) {
  .tbl table { font-size: 14px; }
  .tbl th, .tbl td { padding: 12px 12px 12px 0; }
  .tbl tbody th { white-space: normal; }
  .chk-list li { grid-template-columns: 1fr; gap: 4px; }
}

/* ───────── 쩜오 이미지 격자 (한 장에 한 명) ───────── */
.girls { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; margin-top: 26px; }
.girls figure { margin: 0; overflow: hidden; background: var(--surface); }
.girls img { display: block; width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; transition: transform .6s ease; }
.girls figure:hover img { transform: scale(1.03); }
@media (max-width: 768px) { .girls { grid-template-columns: repeat(2, 1fr); gap: 2px; } }

/* ───────── 검색어 안내 페이지 (guides.py) ───────── */
.guide-top > .wrap { padding-top: calc(var(--hdr-h) + 48px); border-top: 0; }
.crumb { font-size: 13px; color: var(--text-dim); margin-bottom: 16px; }
.crumb a { color: var(--text-dim); }
.crumb a:hover { color: var(--text-hi); }
.crumb span { margin: 0 8px; }
.steps { list-style: none; counter-reset: s; margin: 24px 0 0; padding: 0; border-top: 1px solid var(--line-strong); }
.steps li { counter-increment: s; padding: 16px 0 16px 48px; border-bottom: 1px solid var(--line); position: relative; font-size: 15px; }
.steps li::before { content: counter(s, decimal-leading-zero); position: absolute; left: 0; top: 17px; font-size: 13px; color: var(--text-dim); }
.steps b { display: block; color: var(--text-hi); margin-bottom: 2px; }
.guide-links { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 14px; }
.guide-links a, .ftr__guides a { color: var(--text-dim); border-bottom: 1px solid var(--line); }
.guide-links a:hover, .ftr__guides a:hover { color: var(--text-hi); }
.ftr__guides { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 13px; }
.ftr__guides b { width: 100%; color: var(--text); font-weight: 600; }

/* ══════════════════════════════════════════════════════════════════════
   밝은 판 (html data-theme="light", /light/ 비교용)
   흰 본문, 푸터만 아주 연한 회색. 히어로는 사진 위라 어두운 글자 설정을 유지한다.
   ══════════════════════════════════════════════════════════════════════ */

html[data-theme="light"] {
  color-scheme: light;
  --bg: #FFFFFF; --surface: #F7F5F0; --surface-2: #F1EEE7;
  --line: rgba(5, 5, 5, 0.12); --line-strong: rgba(5, 5, 5, 0.28);
  --text: #33312D; --text-dim: #83807A; --text-hi: #050505;
  --cta: #050505; --cta-ink: #FFFFFF; --brass: #9A7A4F;
}
html[data-theme="light"] ::selection { background: #050505; color: #fff; }
html[data-theme="light"] .hero,
html[data-theme="light"] .hdr:not([data-solid="true"]) {
  --text: #D2CFC8; --text-dim: #A5A5A0; --text-hi: #F3F0EA;
  --line: rgba(255, 255, 255, 0.12); --line-strong: rgba(255, 255, 255, 0.3); --brass: #B39063;
}
html[data-theme="light"] .hero { background: #050505; }
html[data-theme="light"] .hdr[data-solid="true"] { background: rgba(255, 255, 255, .95); }
html[data-theme="light"] .callfab { box-shadow: 0 10px 30px rgba(5, 5, 5, .25); }
html[data-theme="light"] .ftr { background: #F7F7F5; }
html[data-theme="light"] .fld input,
html[data-theme="light"] .fld select,
html[data-theme="light"] .fld textarea { background: #fff; }

/* ═══════════════════════════════ 모션 (2026-09-16, 모바일 포함)
   레퍼런스(gugudan.yeojido.io) 실측: 반짝 글자 .animate-gradient = 배경 300%, 5초 왕복
   영업시간 1부 2부 = opacity 2초 깜빡임. 기차 사진과 띠 넘김은 사장님 요청으로 추가. */

/* 반짝이는 글자 */
.shine {
  background: linear-gradient(100deg, var(--text-hi) 0%, var(--text-hi) 36%, #D9B77A 46%, #FFF4DC 50%, #D9B77A 54%, var(--text-hi) 64%, var(--text-hi) 100%);
  background-size: 300% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shine 5s ease-in-out infinite alternate;
}
@keyframes shine { 0% { background-position: 0% center; } 100% { background-position: 100% center; } }

/* 깜빡이는 시간 */
.pulse { color: var(--text-hi); animation: pulse 2s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: .45; } }

/* 기차처럼 흐르는 사진 두 줄 (서로 반대 방향) */
.train {
  margin-top: 26px; display: grid; gap: 4px; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
}
.train__row { display: flex; gap: 4px; padding-right: 4px; width: max-content; animation: train 52s linear infinite; }
.train__row--rev { animation-direction: reverse; animation-duration: 58s; }
.train figure { margin: 0; flex: none; width: clamp(150px, 22vw, 300px); overflow: hidden; background: var(--surface); }
.train img { display: block; width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; transition: transform .6s ease; }
.train figure:hover img { transform: scale(1.04); }
.train:hover .train__row { animation-play-state: paused; }
@keyframes train { to { transform: translateX(-50%); } }

/* 사진 띠: 다음 사진이 파워포인트 닦아내기처럼 들어왔다 나간다 */
.band { position: relative; overflow: hidden; }
.band__next {
  position: absolute; inset: 0;
  background-image: var(--img2); background-size: cover; background-position: center;
  background-repeat: no-repeat; background-attachment: inherit;
  clip-path: inset(0 100% 0 0);
  animation: wipe 9s cubic-bezier(.77, 0, .18, 1) infinite;
  animation-delay: var(--delay, 0s);
}
@keyframes wipe {
  0%, 28%   { clip-path: inset(0 100% 0 0); }
  40%, 70%  { clip-path: inset(0 0 0 0); }
  82%, 100% { clip-path: inset(0 0 0 100%); }
}

@media (prefers-reduced-motion: reduce) {
  .shine { animation: none; -webkit-text-fill-color: currentColor; background: none; color: var(--text-hi); }
  .pulse, .train__row, .band__next { animation: none; }
}

/* ═══════════════════ 2026-09-16 수정: 반짝임은 제목에, 가격 숫자와 메인 사진은 가만히 */
.ttl {
  background: linear-gradient(100deg, var(--text-hi) 0%, var(--text-hi) 34%, #D9B77A 44%, #FFF4DC 50%, #D9B77A 56%, var(--text-hi) 66%, var(--text-hi) 100%);
  background-size: 300% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shine 4.5s ease-in-out infinite alternate;
}
.band__next { display: none; }

/* 실후기 카드: 두 줄이 서로 반대로 흐른다 */
.rv-train {
  margin-top: 26px; display: grid; gap: 14px; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.rv-row { display: flex; gap: 14px; padding-right: 14px; width: max-content; animation: train 56s linear infinite; }
.rv-row--rev { animation-direction: reverse; animation-duration: 64s; }
.rv-train:hover .rv-row { animation-play-state: paused; }
.rv {
  margin: 0; flex: none; width: clamp(270px, 30vw, 380px); padding: 22px 22px 20px;
  border: 1px solid var(--line-strong);
  background: linear-gradient(160deg, var(--surface-2) 0%, var(--surface) 100%);
}
.rv__top { display: flex; align-items: center; gap: 10px; }
.rv__badge { font-size: 12px; font-weight: 700; color: var(--ink); background: var(--ivory); padding: 2px 9px; letter-spacing: .02em; }
.rv__stars { color: #D9B77A; letter-spacing: 2px; font-size: 14px; }
.rv blockquote { margin: 14px 0 0; font-size: 15.5px; line-height: 1.7; color: var(--text-hi); }
.rv figcaption { margin-top: 14px; font-size: 13px; color: var(--text-dim); }

@media (prefers-reduced-motion: reduce) {
  .ttl { animation: none; -webkit-text-fill-color: currentColor; background: none; color: var(--text-hi); }
  .rv-row { animation: none; }
}

/* ═══════════════════ 2026-09-19 고객 요청: 공식 안내, 대표 카드, 매장 사진, 시스템, 팁, 지도 */

/* 공식홈페이지 안내 */
.official { border-left: 2px solid var(--brass); padding-left: clamp(16px, 2.4vw, 28px); }
.official__lead { font-size: clamp(20px, 2.2vw, 26px); font-weight: 700; color: var(--text-hi); line-height: 1.45; letter-spacing: -0.02em; }
.official__info { margin: 22px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); }
.official__info > div { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--line); }
.official__info dt { font-size: 12.5px; color: var(--text-dim); }
.official__info dd { margin: 4px 0 0; font-size: 17px; font-weight: 600; color: var(--text-hi); }
.official__info a { border-bottom: 1px solid var(--brass); }
@media (max-width: 560px) { .official__info { grid-template-columns: 1fr; } }

/* 진환대표 직통 카드 */
.dir {
  position: relative; padding: clamp(24px, 3vw, 40px);
  border: 1px solid var(--line-strong);
  background: radial-gradient(120% 90% at 100% 0%, rgba(179, 144, 99, .16) 0%, rgba(179, 144, 99, 0) 55%), var(--surface);
}
.dir__badge { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .12em; color: #D9B77A; border: 1px solid rgba(217, 183, 122, .5); padding: 4px 12px; }
.dir__name { margin-top: 16px; font-size: clamp(44px, 6vw, 64px); font-weight: 700; line-height: 1; letter-spacing: -0.04em; color: var(--text-hi); }
.dir__name span { margin-left: 10px; font-size: .42em; font-weight: 500; color: var(--text-dim); letter-spacing: 0; }
.dir__role { margin-top: 12px; font-size: 16px; font-weight: 600; color: #D9B77A; }
.dir__cta { margin-top: 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.dir__live { font-size: 14px; color: var(--text); display: inline-flex; align-items: center; gap: 8px; }
.dir__live::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #3CCB7F; box-shadow: 0 0 0 4px rgba(60, 203, 127, .18); animation: pulse 2s ease-in-out infinite; }

/* 실제 매장 사진: 크기를 섞은 격자, 스크롤하면 한 장씩 드러난다 */
.store { margin-top: 26px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(150px, 16vw, 210px); grid-auto-flow: dense; gap: 6px; }
.store figure { position: relative; margin: 0; overflow: hidden; background: var(--surface); opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.store figure.is-in { opacity: 1; transform: none; }
.store figure.w2 { grid-column: span 2; }
.store figure.h2 { grid-row: span 2; }
.store picture, .store img { display: block; width: 100%; height: 100%; }
.store img { object-fit: cover; transition: transform .8s ease; }
.store figure:hover img { transform: scale(1.05); }
.store figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 10px; font-size: 13px; color: var(--text-hi); background: linear-gradient(0deg, rgba(0,0,0,.7), rgba(0,0,0,0)); }
@media (max-width: 768px) { .store { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 150px; gap: 4px; } }

/* 시스템 안내 3칸 */
.sys { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 26px; border-top: 1px solid var(--line-strong); }
.sys > div { padding: 24px 26px 26px 0; border-bottom: 1px solid var(--line); }
.sys > div + div { padding-left: 26px; border-left: 1px solid var(--line); }
.sys h3 { margin-bottom: 12px; }
.sys p { font-size: 15px; }
.sys p + p { margin-top: 8px; }
@media (max-width: 1024px) { .sys { grid-template-columns: 1fr; } .sys > div, .sys > div + div { padding: 22px 0; border-left: 0; } }

/* 방문 팁 번호 목록 */
.tips { list-style: none; counter-reset: tip; margin: 26px 0 0; padding: 0; border-top: 1px solid var(--line-strong); }
.tips li { counter-increment: tip; position: relative; padding: 22px 0 22px 64px; border-bottom: 1px solid var(--line); }
.tips li::before { content: counter(tip, decimal-leading-zero); position: absolute; left: 0; top: 18px; font-size: 30px; font-weight: 700; letter-spacing: -0.04em; color: #D9B77A; }
.tips h3 { margin-bottom: 6px; }
.tips p { font-size: 15.5px; max-width: 52em; }

/* 맞춤 초이스 칩 */
.chips { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chips li { font-size: 15px; color: var(--text-hi); border: 1px solid var(--line-strong); padding: 8px 14px; }

/* 후기 분류 태그 */
.rv__tag { font-size: 12px; font-weight: 700; color: #D9B77A; border: 1px solid rgba(217, 183, 122, .55); padding: 2px 10px; letter-spacing: .04em; }
.rv figcaption b { color: var(--text-hi); font-weight: 600; margin-right: 6px; }

/* 지도 */
.map { margin-top: 20px; position: relative; border: 1px solid var(--line-strong); aspect-ratio: 16 / 7; min-height: 280px; background: var(--surface); }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.2) contrast(1.05); }
.map-links { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 14px; }
.map-links a { color: var(--text); border-bottom: 1px solid var(--line-strong); }
.map-links a:hover { color: var(--text-hi); }
@media (max-width: 560px) { .map { aspect-ratio: 4 / 3; } }

@media (prefers-reduced-motion: reduce) { .store figure { opacity: 1; transform: none; } }

/* ---- 상호 변경 안내: 간판 플레이트 (구구단의 새 이름) ------------------------ */
.rename { position: relative; margin: 0 0 22px; padding: clamp(22px, 3.4vw, 36px) clamp(18px, 3vw, 36px) 0;
  border: 1px solid rgba(217, 183, 122, .45); outline: 1px solid rgba(217, 183, 122, .18); outline-offset: 5px;
  background: radial-gradient(90% 120% at 50% 0%, rgba(217, 183, 122, .10), transparent 70%); text-align: center; }
.rename__kicker { margin: 0; font-size: clamp(13px, 1.5vw, 15px); font-weight: 600; letter-spacing: .32em; color: #D9B77A; }
.rename__name { margin: 6px 0 clamp(18px, 2.6vw, 28px); font-size: clamp(54px, 9vw, 96px); font-weight: 900; letter-spacing: -0.04em; line-height: 1; }
.rename__same { list-style: none; margin: 0 calc(-1 * clamp(18px, 3vw, 36px)); padding: 0; display: grid; grid-template-columns: 1.6fr 1fr 1.2fr;
  border-top: 1px solid rgba(217, 183, 122, .3); }
.rename__same li { padding: 14px 10px 16px; font-size: clamp(13.5px, 1.5vw, 16px); font-weight: 700; color: var(--text-hi); line-height: 1.4; }
.rename__same li + li { border-left: 1px solid rgba(217, 183, 122, .22); }
.rename__same small { display: block; margin-bottom: 4px; font-size: 11.5px; font-weight: 600; letter-spacing: .12em; color: #D9B77A; }
.rename__same a { color: #FFD43B; text-decoration: none; }
@media (max-width: 560px) {
  .rename__same { grid-template-columns: 1fr 1fr; }
  .rename__same li:first-child { grid-column: 1 / -1; border-bottom: 1px solid rgba(217, 183, 122, .22); }
  .rename__same li:nth-child(2) { border-left: 0; }
}

/* ---- 진환대표 카드 숫자 --------------------------------------------------- */
.dir__stats { list-style: none; margin: 18px 0 20px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.dir__stats li { padding: 14px 8px 14px 0; font-size: 13px; color: var(--text-dim); }
.dir__stats b { display: block; font-size: clamp(28px, 4vw, 40px); font-weight: 800; color: #FFD43B; letter-spacing: -0.03em; line-height: 1.1; }
.dir__stats small { font-size: .45em; font-weight: 700; margin-left: 2px; color: var(--text-hi); }

/* ---- 이런 분들 바로 전화주세요 배너 --------------------------------------- */
.cb { position: relative; overflow: hidden; border: 1px solid rgba(255, 59, 59, .45);
  background:
    linear-gradient(100deg, transparent 0 38%, rgba(255, 40, 60, .22) 44%, transparent 52%),
    linear-gradient(80deg, transparent 0 55%, rgba(40, 120, 255, .20) 62%, transparent 70%),
    repeating-linear-gradient(95deg, rgba(255,255,255,.035) 0 2px, transparent 2px 38px),
    radial-gradient(120% 90% at 20% 0%, #2a0a12 0%, #0b0b12 55%, #050505 100%); }
.cb__body { position: relative; z-index: 2; padding: clamp(26px, 4vw, 48px) clamp(18px, 4vw, 48px) 22px; max-width: 760px; }
.cb__ttl { margin: 0 0 22px; font-size: clamp(30px, 5.4vw, 58px); font-weight: 900; letter-spacing: -0.04em; line-height: 1.1;
  color: #FFE66D; text-shadow: 0 0 6px rgba(255, 230, 109, .9), 0 0 22px rgba(255, 190, 40, .6), 0 0 44px rgba(255, 120, 40, .35);
  animation: cb-flicker 4s infinite; }
.cb__ttl b { color: #fff; text-shadow: 0 0 6px #fff, 0 0 20px rgba(255, 59, 59, .9), 0 0 40px rgba(255, 59, 59, .6); }
@keyframes cb-flicker { 0%, 18%, 22%, 60%, 64%, 100% { opacity: 1; } 20%, 62% { opacity: .55; } }
.cb__list { margin: 0; padding: 16px 18px 16px 38px; background: rgba(0, 0, 0, .62); border-left: 3px solid #FF3B3B; }
.cb__list li { font-size: clamp(15px, 1.8vw, 19px); font-weight: 600; color: #fff; line-height: 1.55; padding: 3px 0; }
.cb__list li::marker { color: #FFD43B; font-weight: 800; }
.cb__list em { font-style: normal; font-weight: 800; color: #FF4D4D; text-shadow: 0 0 12px rgba(255, 60, 60, .45); }
.cb__img { position: absolute; z-index: 1; right: 0; bottom: 0; height: 100%; width: 38%; object-fit: cover; object-position: 50% 20%;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 40%); mask-image: linear-gradient(90deg, transparent, #000 40%); }
.cb__strip { position: relative; z-index: 2; margin: 0; padding: 14px clamp(18px, 4vw, 48px); background: #E0141E;
  font-size: clamp(16px, 2.1vw, 22px); font-weight: 800; color: #fff; letter-spacing: -0.02em; }
.cb__strip mark { background: none; color: #FFE14D; font-size: 1.18em; }
.cb__call { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 20px 16px 22px;
  background: #0d0d0d; border-top: 1px solid rgba(255, 212, 59, .35); text-decoration: none; }
.cb__call b { font-size: clamp(30px, 6vw, 56px); font-weight: 900; letter-spacing: -0.02em; color: #FFD43B;
  text-shadow: 0 0 16px rgba(255, 212, 59, .45); font-variant-numeric: tabular-nums; }
.cb__call span { font-size: 15px; font-weight: 700; color: #fff; }
.cb__call:hover b { color: #fff; }
@media (max-width: 720px) {
  .cb__img { width: 58%; opacity: .45; }
  .cb__list { padding-left: 32px; }
}
@media (prefers-reduced-motion: reduce) { .cb__ttl { animation: none; } }
.official .lead + .official__lead { margin-top: 26px; }

/* ---- 인물 사진 (2026-09-19)
   사진 띠: PC 는 기존 전면 띠 그대로. 모바일만 세로 원본 전체를 보여 준다.
   쩜오 이미지: 줄 높이만 고정하고 폭은 원본 비율대로. */
.band--portrait picture { display: none; }
@media (max-width: 768px) {
  .band.band--portrait { height: auto; min-height: 0; max-height: none; background-image: none; }
  .band--portrait picture { display: block; }
  .band--portrait img { display: block; width: 100%; height: auto; }
}
.train figure { width: auto; height: clamp(230px, 24vw, 380px); }
.train picture { display: block; height: 100%; }
.train img { width: auto; height: 100%; aspect-ratio: auto; object-fit: contain; }
/* 초이스 안내 4칸: PC 2x2 */
.sys--2 { grid-template-columns: repeat(2, 1fr); }
.sys--2 > div:nth-child(odd) { padding-left: 0; border-left: 0; }
.sys--2 > div:nth-child(even) { padding-left: 26px; border-left: 1px solid var(--line); }
@media (max-width: 1024px) { .sys--2 { grid-template-columns: 1fr; } .sys--2 > div:nth-child(even) { padding-left: 0; border-left: 0; } }

/* 2026-09-19 첫 화면 속도: 화면 밖 섹션은 가까워질 때 그린다.
   처음 한 번에 98장 사진 구역을 계산하느라 휴대폰에서 2초 가까이 멈췄고 그동안 히어로 영상이 못 떴다. */
main > .sec:not(#intro), main > .band, .ftr { content-visibility: auto; contain-intrinsic-size: auto 900px; }

/* 후기: 움직이지 않는 격자 (2026-09-19 고객 요청) */
.rv-grid { margin-top: 26px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.rv-grid .rv { width: auto; max-width: none; }
@media (max-width: 1024px) { .rv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .rv-grid { grid-template-columns: 1fr; gap: 10px; } }

/* 매니저 모집: 반짝이는 리드 한 줄 + 노란 소제목 (2026-09-20 복구, 고객 요청) */
.rec-lead { font-size: clamp(19px, 2vw, 26px); font-weight: 700; line-height: 1.45;
  margin-bottom: 26px; padding-bottom: 20px; border-bottom: 1px solid var(--line-strong); }
#recruit .cards h3 { color: #FFD43B; }
.ev__gift { width: 100%; max-width: 320px; height: auto; display: block; }
@media (max-width: 900px) { .ev__gift { max-width: 220px; } }

/* 2026-09-20 고객 요청: 큰 제목 아래 항목 소제목을 노란색으로 (가독성) */
/* 본문 안 모든 소제목(h3)을 노란색으로. 메뉴판 제목과 카드 안 이름은 제외 */
main .sec h3, .ev__list b { color: #FFD43B; }
.menu h3, .rv h3, .dir h3, .official h3, .cb h3 { color: inherit; }

/* 공식홈페이지 안내 한 줄은 노란색 (2026-09-21 고객 요청) */
.official__lead--hl { color: #FFD43B; }
.rename__same li:not(:first-child) { padding-top: 26px; }