/* 루트 정보 페이지 전용: 소개(/about/), 개인정보 처리방침(/privacy/). 페이지는 _dev/build_info.py 가 만든다.
   색은 site.css 토큰만 쓴다. 글자는 15px 아래로 내리지 않는다(보조 글 포함). */

/* 머리 칸: 무엇이 있는 페이지인지 + 페이지 안 바로가기 */
.ihead{background:var(--card);border-bottom:1px solid var(--line)}
.ihead__in{max-width:808px;padding-top:44px;padding-bottom:30px}
.ihead__in--wide{max-width:var(--wrap)}
.ihead__kicker{margin:0 0 10px;font-size:15px;font-weight:700;color:var(--lamp-ink)}
.ihead__title{margin:0;font-size:clamp(28px,4.4vw,42px);line-height:1.25;letter-spacing:-.025em;font-weight:800}
.ihead__lead{margin:14px 0 0;color:var(--ink-2);max-width:40em}
.ijump{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.ijump a{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;
  text-decoration:none;color:var(--ink);font-size:15px;font-weight:600;background:var(--paper)}
.ijump a:hover{border-color:var(--muted)}
.ijump a span{color:var(--muted);font-weight:600}
@media (max-width:560px){.ihead__in{padding-top:30px;padding-bottom:24px}.ijump a{min-height:38px;padding:0 12px}}
/* 방침의 목차: 요약 바로 뒤, 번호 순서대로 위에서 아래로 읽는 목록 */
.ijump--toc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(6,auto);grid-auto-flow:column;gap:0 32px;
  margin-top:28px;padding:10px 20px;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--paper)}
.ijump--toc a{display:flex;min-height:40px;padding:0;border:0;border-radius:0;background:none;font-weight:600}
.ijump--toc a:hover{text-decoration:underline}
@media (max-width:560px){.ijump--toc{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-auto-flow:row;padding:6px 16px}.ijump--toc a{min-height:38px}}

/* 끝 칸: 밤 바탕(홈의 문의 칸과 같은 결) */
.iend{margin-top:72px;background:var(--night);color:var(--night-ink);padding-top:72px;padding-bottom:76px}
.iend__title{margin:0;font-size:clamp(24px,3.2vw,32px);line-height:1.3;letter-spacing:-.02em}
.iend__lead{margin:12px 0 26px;color:var(--night-muted);max-width:36em}
.iend__lead a{color:var(--night-ink)}
.iend__row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin:0}
.iend__more{color:var(--night-ink);font-weight:600}
.iend a:focus-visible{outline-color:var(--lamp)}
@media (max-width:860px){.iend{margin-top:56px;padding-top:56px;padding-bottom:60px}}

/* 소개·방침 본문 */
.idoc{max-width:808px;padding-top:8px;padding-bottom:80px}
.idoc h2{font-size:23px;line-height:1.35;margin:52px 0 10px;padding-top:30px;border-top:1px solid var(--line);letter-spacing:-.015em;scroll-margin-top:72px}
.idoc section:first-child h2{border-top:0;padding-top:24px;margin-top:20px}
.idoc h3{font-size:18px;line-height:1.45;margin:30px 0 6px}
.idoc p{margin:10px 0;color:var(--ink-2)}
.idoc section{scroll-margin-top:72px}
html[lang="en"] .idoc p,html[lang="en"] .idoc li,html[lang="en"] .idoc dd{word-break:normal}

/* 점 목록: 앞의 굵은 말이 있으면 그 줄의 이름 */
.ilist{list-style:none;margin:14px 0;padding:0;display:grid;gap:12px}
.ilist li{position:relative;padding-left:22px;color:var(--ink-2)}
.ilist li::before{content:"";position:absolute;left:2px;top:.66em;width:8px;height:8px;border-radius:50%;background:var(--lamp)}
.ilist li>b:first-child{display:block;color:var(--ink)}

/* 만드는 기준: 짧은 약속 카드 */
.irules{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.irules li{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-s);padding:16px 18px;color:var(--ink-2);font-size:16px;line-height:1.65}
.irules b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}
@media (max-width:640px){.irules{grid-template-columns:minmax(0,1fr)}}

/* 이름 – 값 표 */
.ifacts{margin:16px 0;padding:0;border-bottom:1px solid var(--line)}
.ifacts div{display:grid;grid-template-columns:8.5em minmax(0,1fr);gap:4px 18px;padding:11px 0;border-top:1px solid var(--line)}
.ifacts dt{color:var(--muted);font-size:15.5px;font-weight:600}
.ifacts dd{margin:0;color:var(--ink)}
.ifacts--rows div{grid-template-columns:10.5em minmax(0,1fr)}
.ifacts--rows dt{color:var(--ink)}
.ifacts--rows dd{color:var(--ink-2)}
@media (max-width:560px){.ifacts div,.ifacts--rows div{grid-template-columns:minmax(0,1fr);gap:2px}}

/* 도구마다 확인한 방법 */
.ichecks{margin:18px 0 0;padding:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.ck{padding:15px 20px;scroll-margin-top:84px}
.ck:target{background:var(--lamp-soft)}
.ck+.ck{border-top:1px solid var(--line)}
.ck dt{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-weight:700;font-size:17px}
.ck dt img{display:block;border-radius:8px}
.ck dt a{color:var(--ink);text-decoration-color:var(--line)}
.ck dt a:hover{text-decoration-color:currentColor}
.ck dd{margin:6px 0 0;color:var(--ink-2);font-size:15.5px;line-height:1.65}
.ck__src{font-weight:650;white-space:nowrap}
.ck__host{font-size:15px;font-weight:600;color:var(--muted)}
@media (max-width:420px){.ck{padding:14px 16px}}

/* 방침이 다루는 사이트 목록 */
.isites{list-style:none;margin:14px 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px}
.isites li{padding:9px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:15.5px}
.isites li>a:first-child{font-weight:700;color:var(--ink)}
@media (max-width:640px){.isites{grid-template-columns:minmax(0,1fr)}}