/* 서비스 페이지 공통 본문 */
.service-section { padding: var(--tf-content-space) 0; }
.service-section .tf-container { display: flex; flex-direction: column; gap: 5rem; }
.service-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 3rem; }
.service-category-nav { display: flex; align-items: center; gap: 2.5rem; }
.service-category-nav button, .service-category-nav a { position: relative; border: 0; padding: 0 0 .375rem; color: var(--color-text-normal); background: transparent; font-size: var(--tf-text-body-lg, 1.125rem); font-weight: 400; line-height: 1.5; white-space: nowrap; }
.service-category-nav button::after, .service-category-nav a::after { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: transparent; content: ""; }
.service-category-nav :is(button, a):hover, .service-category-nav .is-active { color: var(--tf-primary-50); }
.service-category-nav .is-active { font-weight: 600; }
.service-category-nav .is-active::after { background: var(--tf-primary-50); }

/* 테스트베드 준비 중 화면 */
.service-ready { display: flex; width: 100%; height: 50rem; flex-direction: column; align-items: center; justify-content: center; gap: 1.25rem; border: 1px solid var(--color-border-normal); border-radius: 1.5rem; background: var(--color-background-alt); }
.service-ready__icon { display: flex; width: 6.25rem; height: 6.25rem; flex: 0 0 6.25rem; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--color-text-muted); border-radius: var(--tf-radius-pill); }
.service-ready__icon img, .service-ready__icon .tf-icon { width: 2.5rem; height: 2.5rem; object-fit: contain; }
.service-ready__copy { display: flex; flex-direction: column; align-items: center; gap: .75rem; color: var(--color-text-muted); text-align: center; }
.service-ready__copy h3 { margin: 0; font-size: var(--tf-text-section-title, 2.5rem); font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
.service-ready__copy p { margin: 0; font-size: var(--tf-text-body-lg, 1.125rem); font-weight: 400; line-height: 1.5; letter-spacing: -.015em; }

/* 공정 필터와 장비 검색 */
.equipment-browser { display: flex; flex-direction: column; gap: 2.5rem; }
.equipment-results { display: flex; flex-direction: column; gap: 1.25rem; }
.equipment-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.equipment-filters { display: flex; flex-wrap: wrap; gap: .75rem; }
.equipment-filters button { min-height: 2.25rem; border: 0; border-radius: .375rem; padding: .375rem .875rem; color: var(--color-text-normal); background: var(--color-background-alt); font-size: .875rem; line-height: 1.5; transition: color var(--tf-duration), background-color var(--tf-duration); }
.equipment-filters button:hover, .equipment-filters button.is-active { color: var(--common-white); background: var(--tf-primary-50); }
.equipment-search { display: flex; height: 3rem; align-items: center; gap: .5rem; border: 1px solid var(--color-border-normal); border-radius: .5rem; padding: 0 1rem; }
.equipment-search:focus-within { border-color: var(--palette-primary-60); box-shadow: 0 0 0 .1875rem rgba(37,110,244,.16); }
.equipment-search input { min-width: 0; flex: 1; border: 0; outline: 0; font-size: 1rem; }
.equipment-search input::placeholder { color: var(--color-text-muted); }
.equipment-search > img, .equipment-search > .tf-icon { width: 1.5rem; height: 1.5rem; flex: 0 0 1.5rem; object-fit: contain; }

/* 장비 카드 목록 */
.equipment-grid, .wafer-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--tf-gutter); }
.equipment-card { position: relative; grid-column: span 4; min-width: 0; overflow: hidden; border: 1px solid var(--color-border-normal); border-radius: 1.5rem; color: var(--color-text-normal); background: var(--common-white); transition: border-color var(--tf-duration), box-shadow var(--tf-duration), transform var(--tf-duration); }
.equipment-card[hidden] { display: none; }
.equipment-card__process { position: absolute; z-index: 1; top: 1.25rem; left: 1.25rem; display: inline-flex; border-radius: var(--tf-radius-pill); padding: .375rem .75rem; color: var(--common-white); background: var(--tf-primary-50); font-size: .75rem; font-weight: 600; line-height: 1.5; }
.equipment-card__image { display: flex; height: 15rem; align-items: center; justify-content: center; padding: 1.25rem; }
.equipment-card__image img { width: 100%; height: 100%; object-fit: contain; }
.equipment-card--image-false .equipment-card__image { background: var(--color-background-alt); }
.equipment-card__image-empty { margin: 0; color: var(--color-text-subtle); font-size: var(--tf-text-subtitle, 2rem); font-weight: 700; line-height: var(--tf-text-item-leading, 1.3); letter-spacing: -.01em; text-align: center; }
.equipment-card__body { position: relative; display: flex; min-height: 11.75rem; flex-direction: column; align-items: stretch; border-top: 1px solid var(--color-border-normal); padding: 1.25rem 1.5rem; }
.equipment-card__body small { color: var(--tf-primary-50); font-size: .875rem; font-weight: 600; line-height: 1.5; }
.equipment-card__body h3 { overflow: hidden; margin: .75rem 0 0; font-size: var(--tf-text-item-title, 1.5rem); font-weight: 700; line-height: var(--tf-text-item-leading, 1.3); text-overflow: ellipsis; white-space: nowrap; }
.equipment-card__body p { overflow: hidden; margin: .125rem 0 0; color: var(--color-text-normal); font-size: 1rem; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.equipment-card__body dl { margin: .75rem 0 0; border-top: 1px solid var(--color-border-normal); padding-top: .75rem; }
.equipment-card__body dl div { display: flex; align-items: center; gap: .5rem; font-size: .875rem; line-height: 1.5; }
.equipment-card__body dt { color: var(--color-text-muted); font-weight: 400; }
.equipment-card__body dd { margin: 0; }
.equipment-status { position: absolute; right: 1.5rem; bottom: 1.25rem; border-radius: var(--tf-radius-pill); padding: .375rem .75rem; color: var(--tf-primary-50); background: var(--tf-primary-95); font-size: .75rem; font-weight: 600; line-height: 1.5; }
.equipment-status--planned { color: var(--color-status-danger); background: var(--palette-red-95, #fff1f1); }
.equipment-result { margin: 0; padding: 5rem 0; border-block: 1px solid var(--color-border-normal); text-align: center; }
.equipment-more { display: flex; justify-content: center; }
.equipment-more[hidden] { display: none; }
.service-help { display: flex; min-height: 8.75rem; align-items: center; justify-content: space-between; border-radius: 1rem; padding: var(--tf-panel-space, 2.5rem) var(--tf-panel-space, 3rem); color: var(--common-white); background: linear-gradient(110deg, var(--tf-primary-50), var(--palette-primary-30)); }
.service-help div { display: flex; flex-direction: column; gap: .25rem; }
.service-help strong { font-size: var(--tf-text-emphasis, 1.25rem); font-weight: 600; }
.service-help span { font-size: .875rem; }
.service-help a { color: inherit; font-size: 1rem; font-weight: 600; }

/* 장비 상세 */
.equipment-detail { display: flex; flex-direction: column; gap: 5rem; }
.equipment-detail__hero { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); min-height: 23rem; overflow: hidden; border: 1px solid var(--color-border-normal); border-radius: 1.5rem; }
.equipment-detail__hero > div:first-child { display: flex; grid-column: span 8; flex-direction: column; align-items: flex-start; justify-content: center; padding: var(--tf-panel-space, 5rem); }
.equipment-detail__hero > div:first-child:only-child { grid-column: 1 / -1; }
.equipment-detail__hero h1 { margin: 1rem 0 0; font-size: var(--tf-text-page-title, 3rem); font-weight: 700; line-height: var(--tf-text-heading-leading, 1.2); }
.equipment-detail__hero p { margin: .25rem 0 0; color: var(--color-text-muted); font-size: var(--tf-text-subtitle, 2rem); font-weight: 600; line-height: var(--tf-text-item-leading, 1.3); }
.equipment-detail__image { display: flex; grid-column: span 4; align-items: center; justify-content: center; padding: var(--tf-panel-space, 3rem); }
.equipment-detail__image img { width: 100%; height: 100%; max-height: 18rem; object-fit: contain; }
.equipment-detail__section { display: flex; flex-direction: column; gap: 1.5rem; }
.equipment-detail__section h2 { margin: 0; border-left: .25rem solid var(--tf-primary-50); padding-left: 1rem; font-size: 1.25rem; font-weight: 700; line-height: 1.5; }
.equipment-detail__section ul { margin: 0; padding-left: 1.5rem; font-size: 1rem; line-height: 1.75; }
.equipment-spec { display: flex; flex-direction: column; gap: .75rem; margin: 0; padding-left: 1.25rem; }
.equipment-spec div { display: grid; grid-template-columns: 8rem 1fr; gap: 2rem; }
.equipment-spec dt { font-weight: 400; }
.equipment-spec dd { margin: 0; }
.equipment-detail__action { display: flex; justify-content: center; }

/* 웨이퍼 제작 목록: 단위공정과 동일한 12컬럼 카드 인터랙션 */
.wafer-browser { display: flex; flex-direction: column; gap: 2.5rem; }
.wafer-card { grid-column: span 4; min-width: 0; overflow: hidden; border: 1px solid var(--color-border-normal); border-radius: 1.5rem; color: var(--color-text-normal); background: var(--common-white); transition: border-color var(--tf-duration), box-shadow var(--tf-duration), transform var(--tf-duration); }
.wafer-card[hidden] { display: none; }
.wafer-card__visual { position: relative; display: flex; height: 15rem; align-items: center; justify-content: center; overflow: hidden; padding: 1.25rem; }
.wafer-card__visual .tf-badge { position: absolute; z-index: 1; top: 1.25rem; left: 1.25rem; }
.wafer-card__visual img { display: block; width: 100%; height: 100%; object-fit: contain; }
.wafer-card__body { min-height: 8.125rem; border-top: 1px solid var(--color-border-normal); padding: 1.25rem 1.5rem; }
.wafer-card__body small { color: var(--tf-primary-50); font-size: .875rem; font-weight: 600; line-height: 1.5; }
.wafer-card__body h3 { overflow: hidden; margin: .75rem 0 0; font-size: var(--tf-text-item-title, 1.5rem); font-weight: 700; line-height: var(--tf-text-item-leading, 1.3); text-overflow: ellipsis; white-space: nowrap; }
.wafer-card__body p { overflow: hidden; margin: .125rem 0 0; font-size: 1rem; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }

/* 웨이퍼 제작 상세 */
.wafer-detail { display: flex; flex-direction: column; gap: 5rem; }
.wafer-detail__hero { display: grid; min-height: 22.25rem; grid-template-columns: repeat(12, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--color-border-normal); border-radius: 1.5rem; }
.wafer-detail__intro { display: flex; grid-column: span 8; flex-direction: column; align-items: flex-start; justify-content: center; padding: var(--tf-panel-space, 5rem); }
.wafer-detail__intro h1 { margin: .5rem 0 0; font-size: var(--tf-text-page-title, 3rem); font-weight: 700; line-height: var(--tf-text-heading-leading, 1.2); }
.wafer-detail__intro p { margin: .25rem 0 0; color: var(--color-text-muted); font-size: var(--tf-text-subtitle, 2rem); font-weight: 600; line-height: var(--tf-text-item-leading, 1.3); }
.wafer-detail__intro small { margin-top: 1rem; font-size: 1rem; line-height: 1.5; }
.wafer-detail__image { display: flex; grid-column: span 4; align-items: center; justify-content: center; border-left: 1px solid var(--color-border-normal); padding: var(--tf-panel-space, 3rem); }
.wafer-detail__image img { width: 100%; height: 100%; max-height: 15rem; object-fit: contain; }
.wafer-detail__section { display: flex; flex-direction: column; gap: 1.5rem; }
.wafer-detail__section h2 { margin: 0; border-left: .375rem solid var(--tf-primary-50); padding-left: .75rem; font-size: var(--tf-text-item-title, 1.5rem); font-weight: 700; line-height: 1.5; }
.wafer-detail__section ul { margin: 0; padding-left: 1.5rem; font-size: var(--tf-text-body-lg, 1.125rem); line-height: 1.5; }
.wafer-spec { align-self: flex-start; border-block: 1px solid var(--color-text-subtle); }
.wafer-spec dl { display: grid; grid-template-columns: 7rem minmax(15rem, auto); margin: 0; }
.wafer-spec dl > div { display: contents; }
.wafer-spec dt, .wafer-spec dd { margin: 0; border-bottom: 1px solid var(--color-border-normal); padding: .75rem 1.25rem; font-size: 1rem; line-height: 1.5; }
.wafer-spec dt { background: var(--color-background-alt); font-weight: 500; text-align: center; }
.wafer-spec dd { font-weight: 400; text-align: center; }
.wafer-spec dl > div:last-child :is(dt, dd) { border-bottom: 0; }
.wafer-process-table { align-self: flex-start; border-block: 1px solid var(--color-text-subtle); }
.wafer-process-table table { min-width: 43.75rem; border-collapse: collapse; font-size: 1rem; line-height: 1.5; }
.wafer-process-table th, .wafer-process-table td { border-bottom: 1px solid var(--color-border-normal); padding: .75rem 2.5rem; text-align: left; }
.wafer-process-table th { background: var(--color-background-alt); font-weight: 500; }
.wafer-process-table th:first-child, .wafer-process-table td:first-child { width: 7rem; text-align: center; }
.wafer-process-table tbody tr:last-child td { border-bottom: 0; }

/* C/R 임대 서비스 */
.cleanroom-heading .tf-button { flex: 0 0 auto; }
.cleanroom-heading .tf-button img, .cleanroom-heading .tf-button .tf-icon { width: 1.5rem; height: 1.5rem; object-fit: contain; }
.cleanroom-content { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; }
.cleanroom-info { display: flex; grid-column: span 4; min-width: 0; flex-direction: column; justify-content: space-between; }
.cleanroom-info__body { display: flex; flex-direction: column; gap: 1.5rem; }
.cleanroom-info h3 { margin: 0; border-left: .375rem solid var(--tf-primary-50); padding-left: .75rem; color: var(--color-text-normal); font-size: var(--tf-text-item-title, 1.5rem); font-weight: 700; line-height: 1.5; letter-spacing: -.01em; }
.cleanroom-feature-list { display: flex; flex-direction: column; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.cleanroom-feature-list li { display: flex; min-width: 0; align-items: center; gap: .5rem; color: var(--color-text-normal); font-size: var(--tf-text-body-lg, 1.125rem); font-weight: 500; line-height: 1.5; letter-spacing: -.015em; }
.cleanroom-feature-list__icon { display: flex; width: 2.5rem; height: 2.5rem; flex: 0 0 2.5rem; align-items: center; justify-content: center; border-radius: var(--tf-radius-pill); background: var(--color-background-alt); }
.cleanroom-feature-list__icon img { width: 1.25rem; height: 1.25rem; object-fit: contain; }
.cleanroom-legend { display: flex; flex-direction: column; align-items: flex-end; gap: 1rem; }
.cleanroom-legend > div { display: flex; align-items: center; gap: 1rem; font-size: var(--tf-text-body-lg, 1.125rem); font-weight: 500; line-height: 1.5; }
.cleanroom-legend__swatch { display: block; width: 3.75rem; height: 1.25rem; flex: 0 0 3.75rem; }
.cleanroom-legend__swatch--process { border: 1px dashed var(--tf-neutral-50); background: var(--color-background-alt); }
.cleanroom-legend__swatch--rental { background: var(--palette-primary-90); }
.cleanroom-plan { grid-column: span 8; min-width: 0; margin: 0; }
.cleanroom-plan img { display: block; width: 100%; height: auto; }

/* 마우스 사용 환경에서만 카드 호버 적용 */
@media (hover: hover) and (pointer: fine) {
  .equipment-card:hover, .wafer-card:hover { color: var(--color-text-normal); border-color: var(--palette-primary-60); box-shadow: var(--shadow-level-02); transform: translateY(-.25rem); }
  .has-scroll-reveal :is(.equipment-card, .wafer-card).scroll-reveal.is-revealed:hover { transform: translateY(-.25rem); transition-delay: 0ms; }
}

/* 1200 시안: 목록 이미지 비율과 카드 정보, 장비 상세 공통 */
@media (max-width: 1919.98px) {
  .service-section .tf-container > *, .equipment-browser, .wafer-browser, .equipment-results { min-width: 0; }
  .equipment-grid, .wafer-grid { row-gap: var(--number-40); }
  .equipment-results { gap: var(--number-40); }
  .equipment-filters button { padding: var(--number-8) var(--number-20); font-weight: 500; white-space: nowrap; }
  .equipment-search { height: 3.5rem; border-radius: var(--number-12); padding-inline: var(--number-20); }
  .equipment-card__image, .wafer-card__visual { position: relative; height: auto; aspect-ratio: 520 / 240; }
  .equipment-card__image { padding: 0; }
  .equipment-card__process { max-width: calc(100% - var(--number-40)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .equipment-card__image img { position: absolute; top: -9.58%; left: 22.5%; width: 55.19%; height: 119.58%; }
  .equipment-card__image-empty { max-width: 8em; padding-inline: var(--number-12); font-size: 1.5rem; line-height: 1.3; word-break: keep-all; }
  .equipment-card__body, .wafer-card__body { min-height: 0; padding: var(--number-20) var(--number-24); }
  .equipment-card__body small, .wafer-card__body small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .equipment-card__body dl { margin-bottom: 0; }
  .equipment-card__body dl div { min-height: 1.875rem; padding-right: 7.5rem; }
  .equipment-card__body dt { flex-shrink: 0; font-size: .75rem; }
  .equipment-card__body dd { min-width: 0; overflow: hidden; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
  .equipment-status { right: var(--number-24); bottom: var(--number-20); font-weight: 600; }
  .service-help { min-height: 0; border-radius: var(--number-20); padding: var(--number-48) var(--number-80); background: linear-gradient(90deg, var(--tf-primary-50), var(--palette-primary-30)); }
  .service-help strong, .service-help a { font-size: 1.25rem; line-height: 1.3; }
  .service-help a { white-space: nowrap; }

  .equipment-detail__hero { min-height: 0; column-gap: var(--number-20); }
  .equipment-detail__hero > div:first-child { grid-column: span 7; min-width: 0; padding: var(--number-80); }
  .equipment-detail__hero h1 { margin-top: var(--number-8); font-size: 3.5rem; line-height: 1.2; overflow-wrap: anywhere; }
  .equipment-detail__hero p { color: var(--color-text-subtle); font-size: 2.5rem; font-weight: 500; line-height: 1.3; overflow-wrap: anywhere; }
  .equipment-detail__image { grid-column: span 5; min-width: 0; border-left: 1px solid var(--color-border-normal); padding: 0; }
  .equipment-detail__image img { width: min(100%, 20rem); height: 20rem; max-height: none; }
  .equipment-detail__section h2 { border-left-width: .375rem; padding-left: var(--number-12); font-size: 1.5rem; line-height: 1.3; letter-spacing: -.01em; }
  .equipment-detail__section ul { font-size: 1.125rem; font-weight: 500; line-height: 1.5; overflow-wrap: anywhere; }
  .equipment-spec { gap: var(--number-16); padding: 0; font-size: 1.125rem; font-weight: 500; line-height: 1.5; }
  .equipment-spec div { display: flex; gap: var(--number-16); }
  .equipment-spec dt { flex-shrink: 0; color: var(--color-text-muted); font-weight: inherit; }
  .equipment-spec dt::before { display: inline-block; width: 1.5rem; content: "•"; text-align: center; }
  .equipment-spec dd { min-width: 0; overflow-wrap: anywhere; }
  .wafer-detail__image { overflow: hidden; padding: 0; }
  .wafer-detail__image img { width: 32.5rem; height: 15rem; max-width: none; max-height: none; flex-shrink: 0; }
  .service-ready { padding: var(--tf-panel-space); }
}

/* 태블릿·소형 데스크톱의 상세 글자, 표, 구조 이미지 */
@media (min-width: 768px) and (max-width: 1919.98px) {
  .equipment-detail__hero :is(h1, p), .wafer-detail__intro :is(h1, p) { letter-spacing: -.01em; }
  .wafer-detail__hero { min-height: 0; column-gap: var(--tf-gutter); }
  .wafer-detail__intro { min-width: 0; }
  .wafer-detail__intro h1 { font-size: 3.5rem; line-height: 1.2; overflow-wrap: anywhere; }
  .wafer-detail__intro p { color: var(--color-text-subtle); font-size: 2.5rem; font-weight: 500; line-height: 1.3; overflow-wrap: anywhere; }
  .wafer-detail__intro small { width: max-content; max-width: 100%; margin-top: var(--number-8); font-size: 1.125rem; font-weight: 500; line-height: 1.5; letter-spacing: -.015em; word-break: keep-all; overflow-wrap: anywhere; }
  .wafer-detail__section h2, .cleanroom-info h3 { line-height: 1.3; }
  .wafer-detail__section ul { font-weight: 500; }
  .wafer-spec, .wafer-process-table { max-width: 100%; }
  .wafer-spec dd { padding-inline: var(--number-40); }
  .wafer-process-table table { min-width: 0; }
  .wafer-process-table th:first-child, .wafer-process-table td:first-child { width: 4.25rem; padding-inline: var(--number-20); }

  .service-ready__icon { color: var(--color-text-muted); }
  .cleanroom-heading { align-items: center; }
}

/* 1200~1919: 상세 제목과 이미지의 가로 배치 */
@media (min-width: 1200px) and (max-width: 1919.98px) {
  .wafer-detail__intro { padding: var(--number-80); }
  .wafer-detail__intro small { max-width: calc(100% + var(--tf-gutter)); }
  .service-ready { height: auto; min-height: 35rem; padding: var(--number-160) var(--number-40); }
  .service-ready__copy h3 { font-size: 2.5rem; }
}

/* 태블릿·모바일: 카드 배지·안내 문구와 상세 이미지 배치 */
@media (max-width: 1199.98px) {
  .service-heading { align-items: flex-start; flex-direction: column; gap: var(--number-20); }
  .equipment-toolbar { width: 100%; align-items: stretch; flex-direction: column; gap: var(--number-20); }
  .equipment-search { order: -1; }
  .equipment-grid, .wafer-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .equipment-card, .wafer-card { grid-column: span 3; }
  .equipment-card__process, .wafer-card__visual .tf-badge { top: var(--number-12); left: var(--number-12); }
  .equipment-card__process { max-width: calc(100% - var(--number-24)); }
  .equipment-card__image-empty { font-size: 1.25rem; font-weight: 600; line-height: 1.5; }
  .equipment-detail__hero, .wafer-detail__hero { display: flex; min-height: 0; flex-direction: column; gap: var(--number-80); overflow: visible; border: 0; border-radius: 0; }
  .equipment-detail__hero > div:first-child, .wafer-detail__intro { width: 100%; padding: 0; }
  .equipment-detail__image, .wafer-detail__image { order: -1; width: 100%; overflow: hidden; border: 1px solid var(--color-border-normal); border-radius: var(--number-24); }
  .service-ready { height: auto; gap: var(--number-16); padding: var(--number-80) var(--number-40); }
  .service-ready__icon { width: 5rem; height: 5rem; flex-basis: 5rem; color: var(--color-text-muted); }
  .service-ready__icon img, .service-ready__icon .tf-icon { width: 2rem; height: 2rem; }
  .service-ready__copy { gap: var(--number-4); }
  .cleanroom-content { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--number-20); }
  .cleanroom-info { display: contents; }
  .cleanroom-info__body { grid-column: 1 / -1; grid-row: 1; margin-bottom: var(--number-20); }
  .cleanroom-plan { grid-column: 1 / -1; grid-row: 2; }
  .cleanroom-legend { grid-column: 1 / -1; grid-row: 3; }
  .cleanroom-legend > div { flex-direction: row-reverse; gap: var(--number-8); }
}

/* 768~1199: 본문 구간은 기본 80px, 목록 필터·검색은 40px 간격 */
@media (min-width: 768px) and (max-width: 1199.98px) {
  .service-heading .section-heading--page > small { font-weight: 400; }
  .equipment-toolbar { gap: var(--number-40); }
  .equipment-search { width: 100%; }

  .service-ready__copy h3 { font-size: 1.5rem; }
  .service-ready__copy p { font-size: 1rem; }

  .cleanroom-heading { flex-direction: row; align-items: center; }
  .cleanroom-info__body { margin-bottom: calc(var(--number-80) - var(--number-20)); }
  .cleanroom-legend { flex-direction: row-reverse; align-items: center; justify-content: center; gap: var(--number-40); }
}

/* 모바일: 1열 카드, 가로 공정 필터, 이미지·본문 사이 40px */
@media (max-width: 767.98px) {
  .service-section .tf-container, .equipment-detail, .wafer-detail { gap: var(--number-40); }
  .service-category-nav { width: 100%; justify-content: space-between; gap: var(--number-12); }
  .service-category-nav button, .service-category-nav a { flex-shrink: 0; font-size: .875rem; font-weight: 400; }
  .service-category-nav .is-active { font-weight: 400; }
  .equipment-filters { width: 100%; min-width: 0; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .equipment-filters::-webkit-scrollbar { display: none; }
  .equipment-browser, .wafer-browser, .equipment-results { gap: var(--number-20); }
  .equipment-grid, .wafer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: var(--number-20); }
  .equipment-card, .wafer-card { grid-column: span 4; }
  .equipment-card__body h3, .wafer-card__body h3 { margin-top: var(--number-4); font-weight: 600; }
  .equipment-card__body p, .wafer-card__body p { margin-top: 0; font-size: .875rem; }
  .equipment-card__body dl { margin-top: var(--number-8); padding-top: var(--number-8); }
  .equipment-more .tf-button, .equipment-detail__action .tf-button, .cleanroom-heading .tf-button { height: 2.5rem; padding-inline: var(--number-16); font-size: 1rem; }
  .equipment-more .tf-button { padding-inline: var(--number-12); }
  .equipment-more .tf-button :is(img, .tf-icon), .equipment-detail__action .tf-button :is(img, .tf-icon), .cleanroom-heading .tf-button :is(img, .tf-icon) { width: 1.25rem; height: 1.25rem; flex-basis: 1.25rem; }
  .equipment-more .tf-button--rect { border-radius: var(--number-6); }
  .service-help { display: none; }

  .equipment-detail__hero, .wafer-detail__hero { gap: var(--number-40); }
  .equipment-detail__hero h1, .wafer-detail__intro h1 { font-size: 1.5rem; line-height: 1.3; letter-spacing: -.01em; overflow-wrap: anywhere; }
  .equipment-detail__hero p, .wafer-detail__intro p { margin-top: 0; color: var(--color-text-subtle); font-size: 1.25rem; font-weight: 600; line-height: 1.5; letter-spacing: -.01em; overflow-wrap: anywhere; }
  .equipment-detail__image { aspect-ratio: 4 / 3; }
  .equipment-detail__image img { width: 72.1875%; height: auto; aspect-ratio: 1; }
  .equipment-detail__section { gap: var(--number-12); }
  .equipment-detail__section h2, .wafer-detail__section h2, .cleanroom-info h3 { font-size: 1.25rem; font-weight: 600; line-height: 1.5; letter-spacing: -.01em; }
  .equipment-detail__section ul, .equipment-spec { font-size: 1rem; font-weight: 400; }

  .wafer-detail__intro small { margin-top: var(--number-4); font-size: .875rem; overflow-wrap: anywhere; }
  .wafer-detail__section ul { font-size: 1rem; overflow-wrap: anywhere; }
  .wafer-spec { width: 100%; }
  .wafer-spec dl { grid-template-columns: 5.5rem minmax(0, 1fr); }
  .wafer-spec dt, .wafer-spec dd { padding-inline: var(--number-8); overflow-wrap: anywhere; }
  .wafer-process-table { width: 100%; overflow-x: auto; }

  /* 같은 표의 열을 세로로 재배치하며, 공정 수는 service.js에서 계산합니다. */
  .wafer-process-table table[data-mobile-process-grid] { display: grid; width: 100%; min-width: 0; grid-template-columns: 5rem minmax(0, 1fr); grid-auto-rows: minmax(3.6rem, auto); }
  .wafer-process-table [data-mobile-process-grid] :is(thead, tbody, tr) { display: contents; }
  .wafer-process-table [data-mobile-process-grid] :is(th, td):first-child { display: none; }
  .wafer-process-table [data-mobile-process-grid] :is(th, td) { display: flex; min-width: 0; align-items: center; padding-inline: var(--number-8); overflow-wrap: anywhere; }
  .wafer-process-table [data-mobile-process-grid] th { grid-column: 1; justify-content: center; text-align: center; }
  .wafer-process-table [data-mobile-process-grid] th:nth-child(2) { grid-row: 1 / span var(--wafer-process-count); }
  .wafer-process-table [data-mobile-process-grid] th:nth-child(3) { grid-row: calc(var(--wafer-process-count) + 1) / span var(--wafer-process-count); border-bottom: 0; }
  .wafer-process-table [data-mobile-process-grid] td { grid-column: 2; order: 1; }
  .wafer-process-table [data-mobile-process-grid] td:nth-child(3) { order: 2; }
  .wafer-process-table [data-mobile-process-grid] tr:last-child td:nth-child(2) { border-bottom: 1px solid var(--color-border-normal); }

  .service-ready { padding-inline: var(--number-20); }
  .service-ready__copy h3 { font-size: 1.25rem; font-weight: 600; line-height: 1.5; }
  .service-ready__copy p { font-size: .875rem; }
  .cleanroom-heading .tf-button { align-self: flex-start; }
  .cleanroom-content { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cleanroom-feature-list { gap: var(--number-8); }
  .cleanroom-feature-list li, .cleanroom-legend > div { font-size: 1rem; font-weight: 400; }
  .cleanroom-legend { flex-direction: column-reverse; align-items: flex-start; gap: var(--number-8); }
}