/* 서브페이지(docspro·programs) — 홈(기점 랜딩) 언어 위에 얹는 얇은 층.
   토큰·버튼·헤더·details·.index·.service-lines 는 /gijeom/work/generated/decisions.css 가 원천이고,
   여기에는 서브페이지에만 필요한 것(서체 선언, 글 밀도용 챕터, 표, 호환성 목록, 헤더 모바일)만 둔다. */
@font-face{font-family:Archivo;src:url(/gijeom/fonts/Archivo-Variable.woff2) format('woff2');font-display:swap}
@font-face{font-family:Plex;src:url(/gijeom/fonts/IBMPlexSansKR-Regular.woff2) format('woff2');font-display:swap}

.skip{position:absolute;left:-999px;top:0;z-index:20;background:#392b27;color:#fff4e8;padding:12px 18px}
.skip:focus{left:0}
header .logo,header nav .button{white-space:nowrap}
@media (max-width:900px){header .logo{font-size:20px}header .logo span{display:none}}

/* 글 위주 챕터: 한 화면 강제 없음 */
.chapter.text{min-height:auto;padding-bottom:clamp(56px,8svh,88px)}
.chapter.hero.sub{min-height:auto;padding-bottom:clamp(150px,20svh,220px)}
.hero.sub .bigword{font-size:clamp(56px,9vw,150px);bottom:10px}
.hero.sub .ko-title{max-width:26ch;margin-left:auto;margin-right:auto}
.hero.sub .hero-sub{max-width:62ch;margin:20px auto 0;text-align:center;font-size:15px}
.hero.sub .hero-bottom{margin-top:28px;align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:8px 20px;font-family:Archivo,Plex,sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.chips span{border-top:1px solid currentColor;padding-top:8px}
.hero.sub .actions{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.textlink{text-decoration:underline;text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}

/* 본문 블록 */
.prose{max-width:62ch}
.prose p{margin-top:12px}
.prose ul{margin:14px 0 0;padding-left:18px}
.prose li{margin-top:6px}
.prose b{font-weight:600}
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(24px,5vw,72px);border-top:1px solid currentColor;padding-top:20px;margin-top:8px}
.feature h3{font-size:clamp(24px,2.4vw,34px);line-height:1.25;margin:6px 0 0}
.feature .index{margin:0}
.service-lines.many{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 28px}
.service-lines.many article{border-top-color:currentColor}
.service-lines.many p{font-size:14px}

/* 비교표 */
.tablewrap{overflow-x:auto;border-top:1px solid currentColor;margin-top:8px}
table{width:100%;border-collapse:collapse;font-size:15px;min-width:560px}
th,td{text-align:left;padding:12px 14px 12px 0;border-bottom:1px solid currentColor;vertical-align:top}
th{font-family:Archivo,Plex,sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
td.mark{font-family:Archivo,Plex,sans-serif;font-weight:600}
th.col-dp,td.col-dp{padding-left:14px;border-left:1px solid currentColor}

/* 호환성 목록 */
.compat{margin-top:40px;max-width:720px}
.compat ul{list-style:none;margin:12px 0 0;padding:0}
.compat li{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid currentColor;font-size:15px}
.compat li b{font-weight:600}
.compat li span{text-align:right;opacity:.8}

/* 목록 페이지 */
.service-entry .actions{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:12px}
.service-entry .actions .button{margin-top:0}
.tool-list{max-width:720px}

footer p a{text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:4px 0;margin:-4px 0}

@media (max-width:900px){
  .feature{grid-template-columns:minmax(0,1fr);gap:12px}
  .service-lines.many{grid-template-columns:minmax(0,1fr)}
  .compat li{flex-direction:column;gap:2px}
  .compat li span{text-align:left}
}

/* ── 제품 시트(docspro): 홈과 같은 토큰, 다른 골격 — 단일 분필 바탕, 왼쪽 목차 + 오른쪽 본문, 명판 ── */
body.sheet{background:#e9e7dc}
.sheet-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:clamp(32px,6vw,96px);align-items:end;padding:clamp(120px,16svh,160px) 6vw clamp(40px,6svh,64px);border-bottom:1px solid currentColor}
.sheet-hero h1{text-align:left;font-size:clamp(56px,7vw,104px);margin-top:14px}
.sheet-hero .index{margin:0}
.sheet-hero .tagline{font-size:clamp(20px,2vw,26px);line-height:1.35;letter-spacing:-.02em;margin-top:18px;max-width:30ch}
.sheet-hero .actions{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;margin-top:28px}
.plate{margin:0;background:#edaa91;padding:22px 24px 6px;align-self:end}
.plate div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid #392b27}
.plate div:last-child{border-bottom:0}
.plate dt{font-family:Archivo,Plex,sans-serif;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding-top:3px}
.plate dd{margin:0;font-size:15px;text-align:right}
.sheet-body{display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(32px,6vw,96px);padding:clamp(40px,6svh,64px) 6vw clamp(72px,9svh,96px)}
.rail{position:sticky;top:32px;align-self:start;display:flex;flex-direction:column;gap:2px;font-family:Archivo,Plex,sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.rail a{padding:10px 0;border-top:1px solid currentColor;min-height:44px;display:flex;align-items:center}
.rail a:last-child{border-bottom:1px solid currentColor}
.rail a:hover{text-decoration:underline}
.sheet-content{max-width:720px}
.sheet-content section{padding-bottom:clamp(40px,6svh,64px);margin-bottom:clamp(40px,6svh,64px);border-bottom:1px solid currentColor}
.sheet-content section:last-child{border-bottom:0;margin-bottom:0}
.sheet-content .index{display:block;margin:0 0 10px}
.sheet-content h2{font-size:clamp(26px,2.6vw,36px)}
.lines{list-style:none;margin:20px 0 0;padding:0}
.lines li{padding:12px 0;border-top:1px solid currentColor;font-size:16px}
.lines b{font-weight:600}
.core{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:20px}
.core article{border-top:1px solid currentColor;padding-top:14px}
.core h3{font-size:20px;margin:0 0 6px}
.core p{font-size:15px}
.etc{margin:24px 0 0}
.etc div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px;padding:9px 0;border-top:1px solid currentColor;font-size:14px}
.etc dt{font-weight:600}
.etc dd{margin:0;opacity:.85}
.faq.one{grid-template-columns:minmax(0,1fr);gap:0;margin-top:12px}
.faq.one details{border-bottom-color:currentColor}
.actions.end{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:32px}
@media (max-width:900px){
  .sheet-hero{grid-template-columns:minmax(0,1fr);padding:104px 24px 32px;gap:24px}
  .plate{padding:16px 18px 2px}
  .sheet-body{grid-template-columns:minmax(0,1fr);padding:32px 24px 72px;gap:24px}
  .rail{position:static;flex-direction:row;flex-wrap:wrap;gap:0 18px}
  nav.rail a:not(.button){display:flex;border:0;min-height:40px}
  .core{grid-template-columns:minmax(0,1fr)}
  .etc div{grid-template-columns:minmax(0,1fr);gap:2px}
}