/* ai.css — "AI 잘 쓰는 방법" hub + 12 environment-setup guides (brand v2, 2026-09-25) */
.ai-layers{margin-top:44px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.ai-layer{position:relative;border:1px solid var(--line);background:var(--card);border-radius:var(--r-lg);padding:28px 26px 30px;display:flex;flex-direction:column;box-shadow:6px 6px 0 var(--tc,var(--connector));}
.ai-layer__n{font-family:var(--display);font-weight:800;font-size:15px;color:var(--cobalt);background:var(--cobalt-bg);border:1px solid var(--cobalt-line);border-radius:999px;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;}
.ai-layer__t{margin-top:14px;font-size:clamp(19px,2.2vw,22px);font-weight:800;letter-spacing:-.02em;color:var(--ink);}
.ai-layer__d{margin-top:10px;font-size:16px;color:var(--text-3);line-height:1.7;word-break:keep-all;}
.ai-how{margin:56px 0 64px;border:2px solid var(--ink);background:var(--bg-2);border-radius:var(--r-lg);padding:34px 32px;}
.ai-how__list{margin:16px 0 0;padding-left:0;list-style:none;counter-reset:how;display:grid;gap:14px;}
.ai-how__list li{position:relative;padding-left:44px;font-size:16px;color:var(--text-2);line-height:1.7;word-break:keep-all;counter-increment:how;}
.ai-how__list li::before{content:counter(how);position:absolute;left:0;top:2px;width:30px;height:30px;border-radius:999px;background:var(--ink);color:var(--card);font-family:var(--display);font-weight:800;font-size:14px;display:inline-flex;align-items:center;justify-content:center;}
.ai-how__list strong{color:var(--ink);}
.ai-group__t{margin-bottom:6px;}
.ai-group__d{margin:0 0 18px;font-size:16px;color:var(--text-3);word-break:keep-all;}
.ai-wrap{max-width:820px;}
.ai-crumb{font-family:var(--display);font-weight:700;font-size:14px;letter-spacing:.08em;color:var(--cobalt);margin-bottom:12px;}
.ai-crumb a:hover{text-decoration:underline;}
.ai-h2{margin-top:52px;font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--cobalt);}
.ai-h2 + .prose{margin-top:14px;}
.ai-note{margin-top:10px;font-size:15px;color:var(--text-3);word-break:keep-all;}
.ai-block{margin-top:16px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--card);}
.ai-block__bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;background:var(--bg-2);border-bottom:1px solid var(--line);}
.ai-block__label{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);}
.ai-copy{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--card);background:var(--ink);border:0;border-radius:8px;padding:7px 14px;cursor:pointer;transition:background .2s;}
.ai-copy:hover,.ai-copy:focus-visible{background:var(--cobalt);}
.ai-copy.is-done{background:var(--sage);}
.ai-pre{margin:0;padding:18px 16px;font-family:'Pretendard Variable','Pretendard',ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14.5px;line-height:1.7;color:var(--text-2);white-space:pre-wrap;word-break:break-word;overflow-x:auto;max-height:520px;overflow-y:auto;}
.ai-pre:focus-visible{outline:2px solid var(--cobalt);outline-offset:-2px;}
.ai-steps,.ai-check{margin:16px 0 0;padding-left:0;list-style:none;display:grid;gap:12px;}
.ai-steps{counter-reset:st;}
.ai-steps li{position:relative;padding-left:40px;font-size:16px;color:var(--text-2);line-height:1.7;word-break:keep-all;counter-increment:st;}
.ai-steps li::before{content:counter(st);position:absolute;left:0;top:2px;width:28px;height:28px;border-radius:999px;background:var(--cobalt-bg);border:1px solid var(--cobalt-line);color:var(--cobalt);font-family:var(--display);font-weight:800;font-size:13px;display:inline-flex;align-items:center;justify-content:center;}
.ai-check li{position:relative;padding-left:32px;font-size:16px;color:var(--text-2);line-height:1.7;word-break:keep-all;}
.ai-check li::before{content:"";position:absolute;left:2px;top:7px;width:16px;height:16px;border:2px solid var(--ink);border-radius:4px;background:var(--card);}
.ai-pager{margin-top:56px;display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.ai-pager__a{display:flex;flex-direction:column;gap:4px;border:1px solid var(--line);background:var(--card);border-radius:var(--r);padding:16px 18px;transition:transform .2s,border-color .2s,box-shadow .2s;}
.ai-pager__a:hover{border-color:var(--ink);transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--connector);}
.ai-pager__a--next{text-align:right;}
.ai-pager__k{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--cobalt);}
.ai-pager__t{font-weight:700;font-size:15px;color:var(--ink);word-break:keep-all;}
@media(max-width:900px){
  .ai-layers{grid-template-columns:1fr;}
  .ai-how{padding:26px 20px;}
  .ai-pager{grid-template-columns:1fr;}
  .ai-pager__a--next{text-align:left;}
}
