/* IFU: 제품군·언어 선택 · 문서 검색 · 문서 표 */
.hero-visual--ifu .hero-visual__overlay { background:#00000080 }
.ifu-page { padding-block:96px }
.ifu-page__inner { display:grid; gap:32px; width:calc(100% - 192px); max-width:1728px; margin-inline:auto }

/* ---------- 검색 도구 ---------- */
.ifu-toolbar { display:flex; align-items:center; gap:16px }
.ifu-search { display:flex; flex:1; gap:16px; min-width:0 }
.ifu-search__select { position:relative; flex:0 0 220px }
.ifu-search__select img { position:absolute; top:17px; right:16px; pointer-events:none }
.ifu-search select,.ifu-search input { width:100%; height:58px; padding:0 16px; border:1px solid var(--border); border-radius:0; background:white; font:inherit; color:var(--text-body); appearance:none }
.ifu-search select { padding-right:44px; cursor:pointer }
.ifu-search__field { flex:1; min-width:0 }
.ifu-search input { color:var(--color-black) }
.ifu-search input::placeholder { color:var(--color-muted); opacity:1 }
.ifu-search input::-webkit-search-cancel-button { appearance:none }
.ifu-search select:focus,.ifu-search input:focus { border-color:var(--color-black); outline:none }
.ifu-search__submit { flex:0 0 144px; min-height:58px; padding-inline:16px; background:var(--color-black); color:white; transition:background-color .2s }
.ifu-search__submit:focus-visible { background:var(--surface-on-dark) }
@media(hover:hover) {
    .ifu-search__submit:hover { background:var(--surface-on-dark) }
}

/* ---------- 문서 표: 모바일 전환을 위해 role을 명시합니다 ---------- */
.ifu-table { width:100%; border-collapse:collapse; table-layout:fixed }
.ifu-table thead th { padding:20px 12px; border-top:2px solid var(--color-black); background:var(--surface); font-size:13px; font-weight:500; line-height:20px; color:var(--text-body); text-align:left }
.ifu-table thead th:first-child { padding-left:32px }
.ifu-table thead th:last-child { padding-right:32px }
.ifu-table tbody td { height:136px; padding:16px 12px; border-bottom:1px solid var(--border); color:var(--text-body); vertical-align:middle }
.ifu-table tbody td:first-child { padding-left:32px }
.ifu-table tbody td:last-child { padding-right:32px }
.ifu-table__col--number { width:112px }
.ifu-table__col--language { width:184px }
.ifu-table__col--revision { width:154px }
.ifu-table__col--date { width:204px }
.ifu-table__col--file { width:276px }
.ifu-table__number { font:500 28px/36px var(--font-head); color:var(--color-muted) }
.ifu-table__product { font:500 18px/24px var(--font-head); color:var(--action-primary) }
.ifu-table__title { margin-top:8px; font-size:20px; font-weight:700; line-height:30px; color:var(--color-black) }
.ifu-table__doc { margin-top:8px; font-size:12px; line-height:20px }
.ifu-table__label { display:none }
.ifu-table .button { width:100%; min-width:0 }

.ifu-empty { display:grid; justify-items:center; gap:24px; padding:72px 24px; background:var(--surface); text-align:center }
.ifu-empty p { font-size:20px; font-weight:700; line-height:30px; color:var(--text-heading) }
.ifu-note { font-size:12px; line-height:20px; color:var(--text-body) }

/* ---------- 반응형: 1599px 이하 ---------- */
@media(max-width:1599px) {
    .ifu-page__inner { width:calc(100% - var(--gutter)*2) }
    .ifu-search__submit { flex-basis:120px }
    .ifu-table__col--number { width:88px }
    .ifu-table__col--language { width:140px }
    .ifu-table__col--revision { width:110px }
    .ifu-table__col--date { width:130px }
    .ifu-table__col--file { width:220px }
    .ifu-table thead th:first-child,.ifu-table tbody td:first-child { padding-left:20px }
    .ifu-table thead th:last-child,.ifu-table tbody td:last-child { padding-right:20px }
}

/* ---------- 반응형: 1199px 이하 (태블릿) ---------- */
@media(max-width:1199px) {
    .ifu-page { padding-block:72px }
    .ifu-page__inner { gap:24px }
    .ifu-toolbar { flex-direction:column; align-items:stretch }
    .ifu-search { flex:none; flex-wrap:wrap }
    .ifu-search__select { flex:1 1 calc(50% - 8px) }
    .ifu-search__field { flex:1 1 240px }
    .ifu-table__col--number { width:64px }
    .ifu-table__col--language { width:104px }
    .ifu-table__col--revision { width:84px }
    .ifu-table__col--date { width:84px }
    .ifu-table__col--file { width:172px }
    .ifu-table thead th,.ifu-table tbody td { padding-inline:8px }
    .ifu-table thead th:first-child,.ifu-table tbody td:first-child { padding-left:12px }
    .ifu-table thead th:last-child,.ifu-table tbody td:last-child { padding-right:12px }
    .ifu-table tbody td { height:120px; font-size:14px; line-height:20px }
    .ifu-table__number { font-size:24px }
    .ifu-table__product { font-size:16px; line-height:22px }
    .ifu-table__title { margin-top:4px; font-size:16px; line-height:24px }
    .ifu-table__doc { margin-top:4px }
    .ifu-table .button { padding-inline:12px; font-size:12px }
}

/* ---------- 반응형: 767px 이하 (모바일): 표를 카드형으로 표시 ---------- */
@media(max-width:767px) {
    .ifu-page { padding-block:56px }
    .ifu-search { flex-direction:column; flex-wrap:nowrap; gap:12px }
    .ifu-search__select,.ifu-search__field,.ifu-search__submit { flex:none }
    .ifu-search select,.ifu-search input,.ifu-search__submit { height:56px; min-height:56px }
    .ifu-search__select img { top:16px }
    .ifu-table,.ifu-table tbody,.ifu-table tr,.ifu-table td { display:block; width:100% }
    .ifu-table colgroup { display:none }
    /* 머리글은 화면에서만 숨기고 스크린리더 구조는 유지합니다. */
    .ifu-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%) }
    .ifu-table { border-top:2px solid var(--color-black) }
    .ifu-table tbody tr { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding-block:24px; border-bottom:1px solid var(--border) }
    .ifu-table tbody td,.ifu-table tbody td:first-child,.ifu-table tbody td:last-child { height:auto; padding:0; border:0 }
    .ifu-table tbody tr[hidden] { display:none }
    .ifu-table__cell--number { display:none!important }
    .ifu-table__cell--document,.ifu-table__cell--file { grid-column:1/-1 }
    .ifu-table__title { font-size:18px; line-height:28px }
    .ifu-table__label { display:block; margin-bottom:2px; font-size:12px; line-height:18px; color:var(--text-body) }
    .ifu-table tbody td { color:var(--text-heading) }
    .ifu-table .button { font-size:13px; padding-inline:18px }
    .ifu-empty { padding:48px 20px }
}