/* 법적 문서 4종(terms · refund · privacy · contact) 공용 레이아웃.
   pay.css의 토큰을 그대로 쓴다 — 색·폰트는 여기서 다시 정의하지 않는다. */

.doc{max-width:760px;margin:0 auto;padding:0 22px 96px}

.doc-head{padding:52px 0 26px;border-bottom:1px solid var(--line)}
.doc-head .home{font-family:var(--ui);font-size:13.5px;color:var(--ink3);
  text-decoration:none;letter-spacing:0;display:inline-block;margin-bottom:20px}
.doc-head .home:hover{color:var(--aurora)}
.doc-head h1{font-family:var(--disp);font-size:clamp(27px,5vw,40px);line-height:1.12;
  letter-spacing:-.02em;margin:0 0 12px;font-weight:700}
.doc-head .eff{font-family:var(--mono);font-size:12px;color:var(--ink3);margin:0;letter-spacing:0}

/* 언어 선택은 우측 상단에 고정한다. 제목 아래에 두면 문서의 일부처럼 읽히는데,
   이건 문서 내용이 아니라 화면 조작이다. .doc-head를 기준 상자로 삼는다. */
.doc-head{position:relative}
.lang{position:absolute;top:52px;right:0;margin:0;font-size:13px;color:var(--ink3)}
.lang a{color:var(--ink2);text-decoration:none}
.lang a:hover{color:var(--aurora);text-decoration:underline}
.lang [aria-current]{color:var(--ink);font-weight:600}
@media (max-width:560px){
  /* 좁은 화면에서는 제목과 겹친다. 흐름으로 되돌린다. */
  .doc-head{position:static}
  .lang{position:static;margin:14px 0 0}
}

.doc h2{font-family:var(--disp);font-size:19px;font-weight:700;letter-spacing:-.01em;
  margin:42px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.doc h3{font-size:15.5px;font-weight:650;margin:26px 0 8px;color:var(--ink)}
.doc p{margin:0 0 13px;color:var(--ink2);font-size:15px;max-width:68ch}
.doc ul,.doc ol{margin:0 0 13px;padding-left:21px;color:var(--ink2);font-size:15px;max-width:68ch}
.doc li{margin-bottom:7px}
.doc strong{color:var(--ink);font-weight:650}
.doc a{color:var(--aurora)}
.doc code{font-family:var(--mono);font-size:.87em;background:var(--surface);
  border:1px solid var(--line);border-radius:4px;padding:1.5px 5px;color:var(--ink)}

.kv{width:100%;border-collapse:collapse;font-size:14.5px;margin:0 0 13px}
.kv th,.kv td{text-align:left;padding:10px 16px 10px 0;border-bottom:1px solid var(--line);
  vertical-align:top;color:var(--ink2)}
/* 라벨은 한글이다. 모노 폰트는 한글 글리프가 없어 폴백되고, letter-spacing은
   음절을 흩어 놓는다("구  매 · 환  불"). 둘 다 라틴 소문자를 위한 장치다. */
.kv th{font-family:var(--ui);font-size:13px;color:var(--ink3);white-space:nowrap;
  width:auto;min-width:8.5em;padding-right:22px;letter-spacing:0;font-weight:500}
.kv td{color:var(--ink)}

.note{background:var(--surface);border:1px solid var(--line);border-left:2px solid var(--aurora);
  border-radius:0 8px 8px 0;padding:14px 17px;margin:0 0 15px;font-size:14.5px;
  color:var(--ink2);max-width:68ch}
/* 한글엔 대문자가 없어 text-transform이 아무 일도 안 하고, 자간만 남아
   "라이선스  키  전체는"처럼 벌어진다. 강조는 색과 굵기로 한다. */
.note b{color:var(--aurora);font-family:var(--ui);font-size:13px;letter-spacing:0;
  display:block;margin-bottom:6px;font-weight:650}

.warn{background:rgba(239,106,106,.09);border:1px solid var(--danger);
  border-radius:8px;padding:14px 17px;margin:0 0 22px;font-size:14.5px;color:var(--ink);max-width:68ch}
.warn b{color:var(--danger);display:block;margin-bottom:6px;font-family:var(--ui);
  font-size:13px;letter-spacing:0;font-weight:650}

.doc-nav{display:flex;gap:22px;flex-wrap:wrap;margin-top:56px;padding-top:22px;
  border-top:1px solid var(--line);font-family:var(--ui);font-size:13.5px;letter-spacing:0}
.doc-nav a{color:var(--ink3);text-decoration:none}
.doc-nav a:hover{color:var(--aurora)}
.doc-nav a[aria-current]{color:var(--ink)}

.biz{margin-top:26px;font-size:12.5px;color:var(--ink3);line-height:1.9}
.biz .biz-item{white-space:nowrap}
.biz .biz-item b{font-weight:400;color:var(--ink3);opacity:.72}
.biz .biz-sep{opacity:.4;padding:0 2px}
