/* 아티스트 개인 홈페이지 — 에디토리얼 매거진 (템플릿 K)
 *
 * 나우고양 아티스트 상세(/artist/<slug>)를 사이트 공통 틀에서 떼어
 * «개인 홈페이지» 처럼 보이게 하는 전용 스킨입니다.
 * 모든 규칙을 body[data-page="artist"] 안으로 가둬 다른 화면에 새지 않게 합니다.
 *
 * 색·글꼴 값은 작가 홈페이지 템플릿 키트(arttan) K 안을 따릅니다.
 *   바탕 #f6f2ea · 글자 #1d1a16 · 흐린 글자 #7a7166 · 선 #ddd5c8
 *   한글 제목 Noto Serif KR · 영문 장식 Bodoni Moda · 본문 Pretendard
 */
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,wght@0,400;0,500;1,400;1,500&family=Noto+Serif+KR:wght@400;500;600;700&display=swap');
/* 모노(GAZU 풍) 템플릿용 볼드 그로테스크 */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800;900&display=swap');

body[data-page="artist"] {
  --ah-paper: #f6f2ea;
  --ah-ink:   #1d1a16;
  --ah-muted: #7a7166;
  --ah-line:  #ddd5c8;
  --ah-accent:#7a7166;
  --ah-serif: 'Noto Serif KR', serif;
  --ah-latin: 'Bodoni Moda', serif;

  background: var(--ah-paper);
  color: var(--ah-ink);
}

/* 사이트 공통 머리말·꼬리말·떠다니는 단추를 걷어 냅니다 — 여기서는 안 씁니다.
   (지우지 않고 가리기만 합니다. auth·검색 등 다른 코드가 참조할 수 있어서요.) */
body[data-page="artist"] > .hdr,
body[data-page="artist"] > .ftr,
body[data-page="artist"] > .skip,
body[data-page="artist"] > .kkfloat { display: none !important; }

/* ── 전체 틀 ─────────────────────────────────────────── */
.ah { max-width: 1120px; margin: 0 auto; padding: 0 24px 96px; }
.ah *::selection { background: #e4dcce; }

/* 맨 위 얇은 띠 — 나우고양으로 돌아가는 길 (키트의 PortalBar) */
.ah-portal {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 12px 0; margin: 0 -24px 0;
  padding-left: 24px; padding-right: 24px;
  border-bottom: 1px solid var(--ah-line);
  font-size: 12px; letter-spacing: 0.04em;
}
/* 좌상단 브랜드를 없앴으므로 메뉴·단추를 오른쪽에 붙인다 */
.ah-portal { justify-content: flex-end; }
.ah-portal a { color: var(--ah-muted); text-decoration: none; }
.ah-portal a:hover { color: var(--ah-ink); }
.ah-portal__back { font-weight: 600; }
.ah-portal__nav { display: flex; align-items: center; gap: 18px; }

/* 메인으로 가는 단추 (맨 위 오른쪽) — 먹색으로 꽉 채워 또렷하게 */
.ah-portal__home {
  background: var(--ah-ink); border: 1px solid var(--ah-ink); border-radius: 999px;
  padding: 8px 17px; color: var(--ah-paper) !important; font-weight: 700;
  box-shadow: 0 2px 8px rgba(29,26,22,.18);
  transition: transform .12s, box-shadow .15s, opacity .15s;
}
.ah-portal__home:hover {
  color: var(--ah-paper) !important; opacity: .9;
  transform: translateY(-1px); box-shadow: 0 4px 14px rgba(29,26,22,.26);
}

/* ── 이름·메뉴 (지면 머리) ───────────────────────────── */
.ah-head { text-align: center; padding: 54px 0 30px; }
.ah-eyebrow {
  font-family: var(--ah-latin); font-style: italic; font-size: 13px;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--ah-muted);
  margin-bottom: 14px;
}
.ah-name {
  font-family: var(--ah-serif); font-weight: 600;
  font-size: clamp(40px, 7vw, 76px); line-height: 1.04;
  letter-spacing: -0.01em; word-break: keep-all; margin: 0;
}
.ah-sub {
  margin-top: 12px; font-size: clamp(14px, 1.4vw, 17px);
  color: var(--ah-muted); letter-spacing: 0.02em;
}
.ah-tag {
  margin-top: 6px; font-family: var(--ah-serif); font-size: clamp(15px, 1.6vw, 19px);
  color: var(--ah-ink); word-break: keep-all;
}

.ah-menu {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 26px;
  margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--ah-line);
}
.ah-menu a {
  font-size: 14px; letter-spacing: 0.02em; color: var(--ah-ink);
  text-decoration: none; padding: 4px 0; position: relative;
}
.ah-menu a:hover { color: var(--ah-muted); }

/* ── 히어로 — 표지 작품 + 소개 ───────────────────────── */
.ah-hero {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  border-top: 1px solid var(--ah-line); margin-top: 8px;
}
.ah-hero__img {
  aspect-ratio: 4 / 5; background: #ece5d8; overflow: hidden;
  border-right: 1px solid var(--ah-line);
}
.ah-hero__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ah-hero__meta {
  padding: 44px 48px; display: flex; flex-direction: column; justify-content: center;
}
.ah-hero__meta .ah-eyebrow { margin-bottom: 18px; }
.ah-hero__name {
  font-family: var(--ah-serif); font-weight: 600;
  font-size: clamp(30px, 4.4vw, 52px); line-height: 1.08; margin: 0;
  word-break: keep-all;
}
.ah-hero__tag {
  margin-top: 18px; font-family: var(--ah-serif);
  font-size: clamp(17px, 2vw, 23px); line-height: 1.55; color: var(--ah-ink);
  word-break: keep-all;
}
.ah-hero__facts { margin-top: 26px; display: grid; gap: 10px; }
.ah-hero__facts div { display: flex; gap: 14px; font-size: 14px; }
.ah-hero__facts dt {
  flex: 0 0 64px; color: var(--ah-muted); font-family: var(--ah-latin);
  font-style: italic; letter-spacing: 0.04em;
}
.ah-hero__facts dd { margin: 0; color: var(--ah-ink); word-break: keep-all; }

/* ── 본문 구획 ───────────────────────────────────────── */
.ah-sec { padding: 46px 0; border-top: 1px solid var(--ah-line); }
.ah-sec__h {
  font-family: var(--ah-latin); font-style: italic; font-size: 13px;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--ah-muted);
  margin-bottom: 22px;
}
.ah-sec h3 {
  font-family: var(--ah-serif); font-weight: 600; font-size: 20px;
  margin: 0 0 10px; word-break: keep-all;
}
.ah-sec p { line-height: 1.85; color: #3a342c; word-break: keep-all; max-width: 760px; }
.ah-sec a { color: var(--ah-ink); text-underline-offset: 3px; }

.ah-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ah-list li {
  padding-bottom: 12px; border-bottom: 1px dashed var(--ah-line);
  line-height: 1.6; color: #3a342c; word-break: keep-all;
}
.ah-list li:last-child { border-bottom: 0; }

/* 두 칸 묶음 (활동·작품·지역 등) */
.ah-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.ah-grid .ah-block h3 {
  font-family: var(--ah-latin); font-style: italic; font-size: 13px;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--ah-muted);
  margin-bottom: 14px; font-weight: 500;
}

/* 영상 */
.ah-videos { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.ah-video { margin: 0; }
.ah-video iframe {
  width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; background: #000;
}
.ah-video figcaption { margin-top: 10px; font-size: 13px; color: var(--ah-muted); }

/* 연락처 단추 */
.ah-contact { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.ah-btn {
  display: inline-block; padding: 12px 22px; border: 1px solid var(--ah-ink);
  color: var(--ah-ink); text-decoration: none; font-size: 14px; letter-spacing: 0.02em;
  transition: background .15s, color .15s;
}
.ah-btn:hover { background: var(--ah-ink); color: var(--ah-paper); }

/* 꼬리말 */
.ah-foot {
  margin-top: 60px; padding-top: 30px; border-top: 1px solid var(--ah-line);
  text-align: center; font-size: 13px; color: var(--ah-muted);
}
.ah-foot a { color: var(--ah-ink); text-decoration: none; font-weight: 600; }
.ah-foot p { margin-top: 10px; }

/* 꼬리말의 «나우고양 메인으로» 큰 단추 — 먹색으로 꽉 채워 또렷하게 */
.ah-foot__home {
  display: inline-block; background: var(--ah-ink); border: 1px solid var(--ah-ink);
  border-radius: 999px; padding: 13px 28px; font-size: 15px; font-weight: 700;
  color: var(--ah-paper) !important; letter-spacing: 0.02em;
  box-shadow: 0 2px 10px rgba(29,26,22,.18);
  transition: transform .12s, box-shadow .15s, opacity .15s;
}
.ah-foot__home:hover {
  color: var(--ah-paper) !important; opacity: .9;
  transform: translateY(-1px); box-shadow: 0 5px 16px rgba(29,26,22,.26);
}
.ah-foot__more { margin-top: 18px; }
.ah-foot__more a { font-weight: 500; color: var(--ah-muted); }
.ah-foot__more a:hover { color: var(--ah-ink); }

/* 참여 작품 줄 (worksBlock 재사용) — 지면에 맞게 테두리만 입힙니다 */
body[data-page="artist"] .pdnext__list { border-top: 1px solid var(--ah-line); margin-top: 0; }

/* ═══════════════════════════════════════════════════════════
   템플릿: 모노 (GAZU 풍) — 그레이시 화이트 + 순흑 고대비, 볼드 그로테스크
   base(에디토리얼) 위에 색·글꼴·라벨·단추만 덧씌워 «느낌»을 바꾼다.
   레이아웃은 그대로. data-template="mono" 일 때만 적용.
   ═══════════════════════════════════════════════════════════ */
body[data-page="artist"][data-template="mono"] {
  --ah-paper: #efede9;   /* 따뜻한 베이지 → 중성 그레이시 화이트 */
  --ah-ink:   #0e0e0e;   /* 순흑에 가깝게, 대비 ↑ */
  --ah-muted: #6e6e6e;   /* 중성 회색 */
  --ah-line:  #dcdad4;
  --ah-accent:#0e0e0e;
  /* 세리프 → 볼드 그로테스크. 한글은 Pretendard 로 떨어뜨린다 */
  --ah-serif: 'Archivo', 'Pretendard', 'Apple SD Gothic Neo', sans-serif;
  --ah-latin: 'Archivo', 'Pretendard', 'Apple SD Gothic Neo', sans-serif;
}
body[data-page="artist"][data-template="mono"] .ah *::selection { background: #dcdad4; }
body[data-page="artist"][data-template="mono"] .ah-hero__img { background: #e4e2dc; }

/* 라벨: 이탤릭 세리프 → 직립 그로테스크, 대문자·넓은 자간.
   라틴(ARTIST)은 넓게, 한글 라벨은 과하게 벌어지지 않도록 조금 좁게. */
body[data-page="artist"][data-template="mono"] .ah-eyebrow {
  font-style: normal; font-weight: 600; letter-spacing: 0.28em;
}
body[data-page="artist"][data-template="mono"] .ah-sec__h,
body[data-page="artist"][data-template="mono"] .ah-grid .ah-block h3 {
  font-style: normal; font-weight: 700; letter-spacing: 0.16em;
}
body[data-page="artist"][data-template="mono"] .ah-hero__facts dt {
  font-style: normal; letter-spacing: 0.1em; text-transform: uppercase;
}

/* 이름: 더 무겁고 빡빡하게 (GAZU 대형 타이포) */
body[data-page="artist"][data-template="mono"] .ah-name,
body[data-page="artist"][data-template="mono"] .ah-hero__name {
  font-weight: 800; letter-spacing: -0.02em;
}
body[data-page="artist"][data-template="mono"] .ah-name {
  font-size: clamp(46px, 8.2vw, 92px); line-height: 0.98;
}

/* 메뉴: 굵게·트래킹 */
body[data-page="artist"][data-template="mono"] .ah-menu a { font-weight: 700; letter-spacing: 0.1em; }

/* 본문 글자색 중성으로 (따뜻한 갈색 제거) */
body[data-page="artist"][data-template="mono"] .ah-sec p,
body[data-page="artist"][data-template="mono"] .ah-list li { color: #333; }

/* 단추: 둥근 알약 → 각지고 납작하게(그림자 X) = GAZU */
body[data-page="artist"][data-template="mono"] .ah-portal__home,
body[data-page="artist"][data-template="mono"] .ah-foot__home {
  border-radius: 0; box-shadow: none; letter-spacing: 0.04em;
}
body[data-page="artist"][data-template="mono"] .ah-portal__home:hover,
body[data-page="artist"][data-template="mono"] .ah-foot__home:hover {
  transform: none; box-shadow: none; opacity: 0.85;
}
body[data-page="artist"][data-template="mono"] .ah-btn { border-radius: 0; }

/* ── 휴대폰 ───────────────────────────────────────────── */
@media (max-width: 760px) {
  .ah { padding: 0 18px 72px; }
  .ah-hero { grid-template-columns: 1fr; }
  .ah-hero__img { aspect-ratio: 4 / 3; border-right: 0; border-bottom: 1px solid var(--ah-line); }
  .ah-hero__meta { padding: 32px 4px; }
  .ah-grid { grid-template-columns: 1fr; gap: 28px; }
  .ah-videos { grid-template-columns: 1fr; }
  .ah-portal { font-size: 11px; }
  .ah-portal__nav { gap: 10px; }
  /* 좁은 화면에선 «나우고양» 단추만 남기고 보조 링크는 접습니다 */
  .ah-portal__nav a:not(.ah-portal__home) { display: none; }
  .ah-portal__home { padding: 5px 12px; }
}