/* 백링크하이 — 법정·부속 페이지 공용 스타일
   랜딩과 동일한 브랜드 토큰을 쓰되, 3D·커스텀커서 없이 가볍게 유지한다. */

:root{
  --font-body:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,sans-serif;
  --font-display:'Wanted Sans Variable','Wanted Sans','Pretendard Variable',sans-serif;
  --mono:'IBM Plex Mono',monospace;
  --pad:48px;
  --ink:#0D1730; --ink-2:#3B4761; --ink-3:#4A576F; --ink-4:#5C6A85;
  --blue:#1B54E8; --blue-d:#0F3BB8; --line:rgba(17,26,46,.1);
}
@media (max-width:1024px){:root{--pad:32px;}}
@media (max-width:720px){:root{--pad:20px;}}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; color:var(--ink); font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  background:linear-gradient(180deg,#FDFEFF 0%,#F4F9FF 46%,#EAF2FF 100%);
  background-attachment:fixed;
  line-height:1.75;
}
a{color:var(--blue); text-decoration:none;}
a:hover{color:var(--blue-d); text-decoration:underline;}
a:focus-visible,button:focus-visible,summary:focus-visible{
  outline:2px solid var(--blue); outline-offset:3px; border-radius:4px;
}
img{max-width:100%; height:auto;}

/* ── 상단 바 ── */
.nav{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px var(--pad);
  background:rgba(251,253,255,.82); backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(17,26,46,.055);
}
.nav img{height:25px; width:auto; display:block;}
.nav .back{
  font-size:14.5px; font-weight:700; color:var(--blue);
  padding:9px 17px; border-radius:11px;
  border:1px solid rgba(27,84,232,.22); background:rgba(255,255,255,.7);
  transition:background .2s ease;
}
.nav .back:hover{background:#fff; text-decoration:none;}

/* ── 본문 ── */
.wrap{max-width:820px; margin:0 auto; padding:clamp(48px,7vw,88px) var(--pad) 96px;}
.eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:.2em;
  color:var(--blue); margin-bottom:18px;
}
h1{
  font-family:var(--font-display); margin:0;
  font-size:clamp(32px,5.2vw,54px); line-height:1.14; letter-spacing:-0.04em;
  font-weight:800; color:#0B142B; word-break:keep-all;
}
.lead{margin:20px 0 0; font-size:16.5px; line-height:1.8; color:var(--ink-2); text-wrap:pretty;}
.meta{
  margin-top:26px; padding-top:20px; border-top:1px solid var(--line);
  font-family:var(--mono); font-size:12.5px; color:var(--ink-4); line-height:2;
}

h2{
  font-family:var(--font-display);
  margin:56px 0 0; font-size:clamp(21px,2.6vw,26px); line-height:1.35;
  letter-spacing:-0.025em; font-weight:800; color:#0B142B;
  scroll-margin-top:88px; word-break:keep-all;
}
h2 + p, h2 + ul, h2 + ol, h2 + .box, h2 + .tablewrap{margin-top:14px;}
h3{
  font-family:var(--font-display);
  margin:30px 0 0; font-size:17.5px; line-height:1.5;
  letter-spacing:-0.015em; font-weight:700; color:#0B142B; word-break:keep-all;
}
h3 + p, h3 + ul, h3 + ol, h3 + .tablewrap{margin-top:10px;}
p{margin:14px 0 0; font-size:15.8px; line-height:1.85; color:var(--ink-3); text-wrap:pretty;}
ul,ol{margin:12px 0 0; padding-left:22px;}
li{margin:8px 0; font-size:15.8px; line-height:1.85; color:var(--ink-3); text-wrap:pretty;}
li::marker{color:var(--blue);}
strong{color:#0B142B; font-weight:700;}

/* ── 표 ── */
.tablewrap{margin-top:14px; overflow-x:auto; -webkit-overflow-scrolling:touch;}
table{
  border-collapse:collapse; width:100%; min-width:520px;
  background:rgba(255,255,255,.72); border-radius:14px; overflow:hidden;
}
th,td{
  padding:13px 16px; text-align:left; vertical-align:top;
  font-size:14.6px; line-height:1.7; border-bottom:1px solid var(--line);
}
th{
  background:rgba(27,84,232,.055); color:#0B142B; font-weight:700;
  white-space:nowrap;
}
td{color:var(--ink-3);}
tr:last-child th, tr:last-child td{border-bottom:none;}

/* ── 강조 박스 ── */
.box{
  margin-top:18px; padding:22px 24px; border-radius:16px;
  background:rgba(255,255,255,.78); border:1px solid rgba(27,84,232,.16);
}
.box p:first-child{margin-top:0;}
.box .label{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.16em;
  color:var(--blue); margin-bottom:10px;
}
.box.warn{border-color:rgba(214,120,20,.28); background:rgba(255,250,242,.86);}
.box.warn .label{color:#B26A0A;}

/* ── 목차 ── */
.toc{
  margin-top:34px; padding:22px 24px; border-radius:16px;
  background:rgba(255,255,255,.66); border:1px solid var(--line);
}
.toc .label{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.16em;
  color:var(--ink-4); margin-bottom:12px;
}
.toc ol{margin:0; padding-left:20px; columns:2; column-gap:28px;}
.toc li{margin:6px 0; font-size:14.6px; break-inside:avoid;}
@media (max-width:640px){.toc ol{columns:1;}}

/* ── 푸터 ── */
.foot{
  background:#0A142F; color:#A9B7D6; font-size:13.5px; line-height:2;
}
.foot .inner{
  max-width:1240px; margin:0 auto;
  padding:52px var(--pad) 48px;
  display:flex; flex-direction:column; gap:24px;
}
.foot .top{
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:18px;
}
.foot img{height:22px; width:auto; filter:brightness(0) invert(.85);}
.foot .links{display:flex; gap:24px; font-weight:600; flex-wrap:wrap;}
.foot a{color:#CCD7EE;}
.foot .biz{border-top:1px solid rgba(255,255,255,.08); padding-top:22px;}
.foot .copy{font-family:var(--mono); font-size:12px; color:#8492B4;}

/* ── 오류/완료 페이지 중앙 정렬 ── */
.center{
  min-height:calc(100vh - 72px);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:64px var(--pad) 80px;
}
.center h1{text-wrap:balance;}
.center .lead{max-width:46ch; margin-left:auto; margin-right:auto;}
.center .actions{display:flex; gap:11px; flex-wrap:wrap; justify-content:center; margin-top:34px;}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:16px 30px; border-radius:13px; font-weight:700; font-size:16px;
  white-space:nowrap; transition:background .2s ease;
}
.btn-primary{background:var(--blue); color:#fff; box-shadow:0 10px 28px rgba(27,84,232,.24);}
.btn-primary:hover{background:var(--blue-d); color:#fff; text-decoration:none;}
.btn-ghost{
  background:rgba(255,255,255,.72); color:var(--blue);
  border:1px solid rgba(27,84,232,.2);
}
.btn-ghost:hover{background:#fff; text-decoration:none;}
.mark{
  width:64px; height:64px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:28px; margin-bottom:26px;
}
.mark.ok{background:rgba(27,158,90,.1); border:1px solid rgba(27,158,90,.28); color:#15794A;}
.mark.err{background:rgba(27,84,232,.08); border:1px solid rgba(27,84,232,.24); color:var(--blue); font-family:var(--mono); font-size:20px; font-weight:600;}

@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important;}}
