/* ─────────────────────────────────────────────────────────────────────────────
   tone.css — 랜딩 기준 톤 통일 (2026-08-30, Eddy 결정)

   배경: 전 페이지 디자인 전수조사에서, 같은 서비스인데 페이지마다 파랑의 양이 달라
   오가면 다른 사이트처럼 보인다는 문제가 나왔다. 랜딩(mono.css)이 기준으로 정해졌다.

   랜딩 기준이란:
     · 핵심 CTA        = 금색 #CDA00A 하나
     · 키커/이어브로우 = 모노 잉크 + 금빛 도트
     · 강조어          = 금빛 밑줄 (색을 바꾸지 않는다)
     · 배지/칩         = 금빛 아웃라인
     · 파랑 #1E3AFF    = 링크·성경 인용·포커스링·체크마크 같은 "미세 액센트"에만

   ⛔ 링크와 성경 인용의 파랑은 건드리지 않는다. mono.css 가 명시한 범위 그대로다.
   이 파일은 각 페이지의 스타일시트 **뒤에** 로드한다.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── 0. 근본 원인: `--gold` 가 여러 페이지에서 파랑으로 재정의돼 있었다 ──────────
   `pages-modern.css:11`  → `--gold:#1E3AFF!important` (church·about·2·membership·2·tools·2·testimony)
   `redesign.css:13`      → `--gold:#1E3AFF`            (index.html·app-en.html)
   예전 "Editorial Light — 액센트를 코발트로" 테마의 잔재다. 그래서 그 페이지들은
   `var(--gold)` 를 쓴 곳이 전부 파랑으로 나왔고(교회 대시보드·달력 오늘 표시 등),
   럜딩만 진짜 금색이라 두 계열로 갈렸다. 금색을 금색으로 되돌린다.
   (2026-08-30 전수조사에서 발견. 이 한 줄이 톤 분열의 절반이었다.) */
:root {
  --gold: #CDA00A !important;
  --gold-2: #E0B01E !important;
  /* ⚠ 금색은 원래 큰 면적(버튼·로고)용이다. 그대로 글자에 쓰면 흰 배경에서
     #CDA00A = 2.43:1, #A88208 = 3.3:1 로 WCAG AA(4.5:1)를 못 넘는다.
     채우기용(--gold)과 글자용(--gold-deep)을 나눈다. #8A6B05 = 4.85:1. */
  --gold-deep: #7F6104 !important;
  --gold-ink: #1A1405 !important;
  --gold-soft: #FBF3D9 !important;
  /* veil-header.css 는 .vh 스코프에서 자기 변수를 쓴다. 거기도 같이 맞춘다. */
  --vh-gold-deep: #7F6104 !important;

  --tone-ink: #101015;
  --tone-ink2: #26262E;
  --tone-mut: #6B6B75;
  --tone-gold: #CDA00A;
  --tone-gold-deep: #7F6104; /* 흰 배경 5.4:1 · 회색 카드(#F3F3F6) 위에서도 AA — 글자용 금색 */
  --tone-gold-ink: #1A1405;
  --tone-gold-tint: rgba(205, 160, 10, .10);
  --tone-gold-line: rgba(205, 160, 10, .45);
  --tone-soft: #F3F3F6;
}

/* ── 1. 키커·이어브로우: 파란 글자 → 모노 잉크 + 금빛 도트 ────────────────── */
.kicker, .eyebrow, .hc-eyebrow, .tool-head .kicker, .section-head .kicker {
  color: var(--tone-ink) !important;
  letter-spacing: .02em;
}
/* 마크업에 이미 "·" 를 넣어 둔 곳이 있어 도트를 중복으로 그리지 않는다. */
.kicker > i, .eyebrow > i { color: var(--tone-gold-deep) !important; }

/* 금색을 글자로 쓰는 곳은 글자용 금색으로 — 색감은 같고 읽힐 수만 있게 한다. */
.side-lock,
.gcal-day.today .gcal-num,
.lang-opt.is-current,
.footer .lang-opt.is-current,
.faq-foot a,
.brand-sub,
body .brand-sub { color: var(--tone-gold-deep) !important; }

/* 결제 상태 마크: 진행중일 때 파란 원이었다. 중립 톤으로(성공/실패색은 그대로 둔다). */
.payment-mark { background: var(--tone-soft) !important; color: var(--tone-ink) !important; }
.payment-card[data-tone="ok"] .payment-mark { background: #e9f5ee !important; color: #27754a !important; }
.payment-card[data-tone="bad"] .payment-mark { background: #fbecea !important; color: #a23b32 !important; }

/* ── 2. 단계 숫자(01·02·03): 파란 글자/파란 알약 → 모노 ──────────────────── */
.li .n {
  color: var(--tone-ink) !important;
  background: var(--tone-soft) !important;
}
.step .n, .n.disp {
  color: var(--tone-ink) !important;
}

/* ── 3. 히어로 강조어: 파란 글자 → 금빛 밑줄 (mono.css 의 em.acc 와 같은 처리) ─ */
.hero h1 .bl, h1 .bl, .big .bl {
  color: var(--tone-ink) !important;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--tone-gold) 85%, transparent);
  text-decoration-thickness: .06em;
  text-underline-offset: .14em;
}

/* ── 4. 배지·칩: 파란 채움 → 금빛 아웃라인 ──────────────────────────────── */
.plan-badge, .price .flag, .grat-today-chip, .ch-chip.plan {
  background: var(--tone-gold-tint) !important;
  color: var(--tone-gold-deep) !important;
  border: 1px solid var(--tone-gold-line) !important;
  border-radius: 999px !important;
}

/* 추천 플랜·후기 카드의 파란 테두리·그림자 → 금빛 헤어라인
   ⚠ 럜딩 4종(index-ko/en/es/pt)의 추천 요금 카드는 .price.feat 다 — modern.css:223 이
   var(--blue) 테두리를 칠해 금색 배지와 파란 테두리가 한 카드에 공존했다(2026-08-30 Eddy 스크린샷). */
.plan-featured, .testi--featured, .price.feat {
  border-color: var(--tone-gold-line) !important;
  box-shadow: 0 20px 50px -14px rgba(205, 160, 10, .28) !important;
}

/* ── 5. 상태 문구: 파란 강조 → 잉크 (오류/성공색은 각 페이지 규칙을 존중) ──── */
.payment-live { color: var(--tone-ink2) !important; }
.grat-saved { color: var(--tone-mut) !important; }
.v5-badge i { background: var(--tone-soft) !important; color: var(--tone-ink) !important; }
.v5-badge .live { background: var(--tone-gold) !important; }

/* ── 6. 교회 대시보드 ─────────────────────────────────────────────────────
   church-shell.css 는 --gold 를 파랑(#7C8DFF)으로 재정의해 두었다("이 레포에서
   --gold 는 실제로 블루다"라는 주석이 그 파일에 있다). 그래서 대시보드만 통째로
   파란 계열이었다. 랜딩 기준으로 되돌린다. 강조 면적이 큰 것부터.
   ──────────────────────────────────────────────────────────────────────── */
.church-body, .ch-shell, body.church-body {
  --gold: #CDA00A !important;
  --gold-2: #E0B01E !important;
  --ch-accent: #CDA00A !important;
  --ch-accent-soft: rgba(205, 160, 10, .12) !important;
  --ch-on-accent: #1A1405 !important;
  --gold-deep: #7F6104 !important;
}
/* church-shell.css 가 .church-body 스코프에서 변수를 다시 잡아 :root 만으로는 마지막 한 둘이 남는다. */
.church-body .brand-sub, .ch-shell .brand-sub { color: #7F6104 !important; }
.ch-upsell .ch-upsell-btn {
  background: var(--tone-gold) !important;
  color: var(--tone-gold-ink) !important;
}
/* KPI 첫 카드: 원래 파란 그라디언트 면이었다. 금색으로 되돌리면 같은 화면의
   금색 CTA(로그인 / 가입)와 무게가 겹친다. 랜딩은 금색을 CTA 하나에만 쓰므로
   강조 면은 잉크로 내린다(mono 의 검은 pill 과 같은 자리). */
.ch-kpi.is-feature {
  background: linear-gradient(150deg, var(--tone-ink), #2A2A33 70%) !important;
  border-color: transparent !important;
  color: #fff !important;
}
.ch-kpi.is-feature .ch-kpi-label,
.ch-kpi.is-feature .ch-kpi-sub,
.ch-kpi.is-feature .ch-kpi-go { color: rgba(255,255,255,.86) !important; }
/* 숫자와 아이콘은 금색 카드 시절의 잉크(#1A1405)를 들고 있어 어두운 면 위에서 안 보였다. */
.ch-kpi.is-feature .ch-kpi-num,
.ch-kpi.is-feature .ch-kpi-value,
.ch-kpi.is-feature strong, .ch-kpi.is-feature b { color: #fff !important; }
.ch-kpi.is-feature .ch-kpi-ico { background: rgba(255,255,255,.14) !important; color: #fff !important; }
.ch-kpi.is-feature svg { color: #fff !important; }
/* 브레드크럼 구분자가 #E9E9EE 라 흰 배경에서 보이지 않았다. */
.ch-crumb .sep { color: var(--tone-mut) !important; }
/* 금색 글자로 남은 교회 요소들 */
.sv-role, #copy-code, .ch-chip.plan { color: var(--tone-gold-deep) !important; }

/* ── 7. 본문 속 성경 인용 ──────────────────────────────────────────
   예전에는 var(--gold) 를 썼는데 그 변수가 파랑이라 파란 인용문이었다.
   금색을 되돌리면 2.43:1 로 안 읽힌다. 럜딩의 강조어 방식(잉크 + 금빛 밑줄)을 따른다. */
.brand-story-text em, .doc-body em, .about-body em, main em[lang], main cite {
  color: var(--tone-ink2) !important;
  font-style: italic;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--tone-gold) 80%, transparent);
  text-decoration-thickness: .05em;
  text-underline-offset: .16em;
}

/* 장식용 금빛 점·구분자도 읽힐 수 있는 금색으로 */
.hero-trust .dot, .kick::before { color: var(--tone-gold-deep) !important; }

/* ── 8. 링크·포커스는 파랑 유지 ──────────────────────────────────────
   여기에 규칙을 추가하지 말 것. mono.css 가 정한 "미세 액센트" 범위다. */