/* CI/BI/폰트 페이지(/ci-bi/) — CIBI-1. 본문은 kt-cibi-* 클래스만, 라이트는 --kt-* 변수, 다크는 html.kt-dark 규칙 */
.kt-cibi { --cb-ac: var(--kt-brand, #0c7673); --cb-card: var(--kt-bg); font-family: var(--kt-sans); }
.kt-cibi-hero { text-align: center; padding: 34px 20px 30px; margin-bottom: 26px; border-radius: 18px; color: #fff; background: linear-gradient(135deg, #0a5f5d, #145f8a 60%, #2f6b24); }
.kt-cibi-hero > * { margin: 0; }
.kt-cibi .kt-cibi-hero h2 { font: 800 34px/1.25 var(--kt-serif); color: #fff; border: 0; padding: 0; margin-top: 4px; }
.kt-cibi-hero p { font-size: 16px; color: #e6f4f2; margin-top: 8px; }
.kt-cibi-hero .kt-cibi-kicker { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #d8f3b0; margin: 0; }
.kt-cibi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 18px; }
.kt-cibi-card { display: flex; flex-direction: column; padding: 24px 22px 20px; border-radius: 16px; background: var(--cb-card); border: 1px solid var(--kt-line); min-width: 0; }
.kt-cibi-card > * { margin: 0 0 12px; }
.kt-cibi-ico { font-size: 28px; line-height: 1; color: var(--cb-ac); font-weight: 800; }
.kt-cibi .kt-cibi-card h3 { font: 800 21px/1.3 var(--kt-sans); color: var(--kt-ink); border: 0; padding: 0; }
.kt-cibi-card p { font-size: 15px; line-height: 1.65; color: var(--kt-sub); }
.kt-cibi ul.kt-cibi-chips { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.kt-cibi-chips li { margin: 0; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; background: var(--kt-soft); color: var(--kt-sub); border: 1px solid var(--kt-line); }
.kt-cibi ul.kt-cibi-list { padding-left: 18px; font-size: 14px; line-height: 1.75; color: var(--kt-sub); }
.kt-cibi-list li { margin: 0; }
.kt-cibi .kt-cibi-act { margin-top: auto; display: flex; flex-wrap: wrap; gap: 8px; }
.kt-art-body .kt-cibi .kt-cibi-btn { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 10px; font-size: 14px; font-weight: 700; text-decoration: none; color: #fff; background: #0c7673; }
.kt-art-body .kt-cibi a.kt-cibi-btn:hover, .kt-art-body .kt-cibi a.kt-cibi-btn:focus-visible { background: #095e5c; color: #fff; }
.kt-art-body .kt-cibi .kt-cibi-btn.is-off { background: transparent; color: var(--kt-sub); border: 1px dashed var(--kt-line); cursor: default; }
.kt-cibi .kt-cibi-note { font-size: 13px; color: var(--kt-sub); margin: 10px 0 0; }
.kt-cibi-card.is-font { background: linear-gradient(135deg, #0f3d3c, #123d5a); border-color: transparent; }
.kt-cibi-card.is-font .kt-cibi-ico, .kt-cibi .kt-cibi-card.is-font h3 { color: #fff; }
.kt-cibi-card.is-font p { color: #d6e7e4; }
.kt-cibi-card.is-font .kt-cibi-sample { font: 700 26px/1.3 'KT Sans', var(--kt-sans); color: #fff; text-align: center; padding: 16px 10px; border-radius: 10px; background: rgba(255,255,255,.08); }
.kt-cibi-card.is-font .kt-cibi-chips li { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.2); color: #fff; }
.kt-art-body .kt-cibi-card.is-font .kt-cibi-btn { background: #c5ea8f; color: #10302f; }
.kt-art-body .kt-cibi-card.is-font a.kt-cibi-btn:hover { background: #d8f3b0; color: #10302f; }
.kt-cibi-rules { margin-top: 26px; padding: 24px 22px; border-radius: 16px; background: var(--kt-soft); }
.kt-cibi .kt-cibi-rules h3 { font: 800 20px var(--kt-sans); margin: 0 0 10px; color: var(--kt-ink); border: 0; padding: 0; }
.kt-cibi-rules ul { list-style: none; margin: 0; padding: 0; }
.kt-cibi-rules li { position: relative; margin: 0; padding: 10px 0 10px 26px; border-bottom: 1px solid var(--kt-line); font-size: 15px; color: var(--kt-sub); }
.kt-cibi-rules li:last-child { border-bottom: 0; }
.kt-cibi-rules li::before { content: "✓"; position: absolute; left: 2px; font-weight: 800; color: var(--cb-ac); }
@media (max-width: 600px) { .kt-cibi .kt-cibi-hero h2 { font-size: 26px; } .kt-cibi-hero { padding: 26px 16px 22px; } }
/* 다크 */
html.kt-dark .kt-cibi { --cb-ac: #3DC4BA; --cb-card: #0E1617; }
html.kt-dark .kt-cibi-hero { background: linear-gradient(135deg, #0f5552, #123d5a 60%, #23471c); }
html.kt-dark .kt-art-body .kt-cibi .kt-cibi-btn:not(.is-off) { background: linear-gradient(135deg, #0C7673, #2f6b24); color: #fff; }
html.kt-dark .kt-art-body .kt-cibi-card.is-font .kt-cibi-btn { background: #c5ea8f; color: #10302f; }
html.kt-dark .kt-cibi-rules { background: #132224; }
html.kt-dark .kt-cibi-chips li { background: #132224; }
