@charset "utf-8";

/*
 * 안쪽 페이지 배치만 담당합니다.
 * 위·아래 공통 뼈대는 eng-home.css, 색은 토큰만 씁니다.
 */

.eng-sub {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: var(--eng-stage-gap, var(--space-5)) var(--container-padding-x) var(--space-8);
}

/* 흰 상자 테두리·위쪽 색띠는 eng-home.css 의 .eng-sub__card 와 같이 씀 */

.eng-sub .kapa-breadcrumb {
  margin: 0;
}

.eng-sub .kapa-breadcrumb a {
  color: var(--color-text-link);
  text-decoration: none;
}

.eng-sub .kapa-breadcrumb a:hover,
.eng-sub .kapa-breadcrumb a:focus-visible {
  text-decoration: underline;
}

.eng-sub .kapa-breadcrumb [aria-current="page"] {
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
}

.eng-sub .kapa-page__title {
  margin: 0;
}

.eng-sub .kapa-page__header {
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-4);
}

@media (min-width: 768px) {
  .eng-sub .kapa-page__header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

.eng-sub .kapa-page__lead {
  min-width: 0;
}

.eng-sub .kapa-page__desc {
  margin-top: var(--space-2);
}

/*
 * About처럼 안쪽 갈래가 있을 때: 예전 왼쪽 목록 대신
 * 제목 옆(작은 화면은 제목 아래) 단추 줄을 씁니다.
 * 각 단추는 다른 화면으로 바로 이어집니다.
 */
.eng-subnav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  gap: 2px;
}

.eng-subnav .kapa-segment__btn {
  min-height: var(--touch-target-min);
  white-space: normal;
  text-align: center;
  line-height: var(--leading-tight);
}

.eng-subnav .kapa-segment__btn[aria-current="page"] {
  background: var(--color-primary-strong);
  color: var(--color-text-inverse);
  box-shadow: var(--shadow-sm);
}

@media (min-width: 768px) {
  .eng-subnav {
    display: inline-flex;
    width: auto;
    flex-wrap: nowrap;
    flex-shrink: 0;
  }

  .eng-subnav .kapa-segment__btn {
    white-space: nowrap;
  }
}

.eng-facts {
  display: grid;
  gap: var(--space-3);
  margin: 0;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

.eng-facts > div {
  min-width: 0;
}

.eng-facts dt {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: var(--text-xs);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* 자격 상단 세 칸 이름만 파란색. 아래 내용 글자는 그대로 */
.eng-facts--lead dt {
  color: var(--color-primary);
}

.eng-facts dd {
  margin: var(--space-1) 0 0;
  color: var(--color-text);
  font-size: var(--text-md);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
}

@media (min-width: 768px) {
  .eng-facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-5);
    padding: var(--space-5);
  }
}

.eng-sub-heading {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--color-text);
}

.eng-mission {
  display: grid;
  gap: var(--space-3);
}

.eng-mission__item {
  margin: 0;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

.eng-mission__num {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--color-primary);
  font-size: var(--text-xs);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.08em;
}

.eng-mission__item p {
  margin: 0;
  color: var(--color-text);
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
}

@media (min-width: 768px) {
  .eng-mission {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
  }

  /* 항목이 둘이면 빈 칸 없이 반씩 나눈다 */
  .eng-mission--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .eng-mission__item {
    padding: var(--space-5);
  }
}

/* 두 칸짜리 자격 경로: 글이 테두리에 붙지 않게 좌우만 10px 더 */
.eng-mission--two .eng-mission__item {
  padding-left: calc(var(--space-4) + 10px);
  padding-right: calc(var(--space-4) + 10px);
}

@media (min-width: 768px) {
  .eng-mission--two .eng-mission__item {
    padding-left: calc(var(--space-5) + 10px);
    padding-right: calc(var(--space-5) + 10px);
  }
}

/* 실무수습: 긴 문단 대신 일정 칸과 장소 목록 */
.eng-train {
  display: grid;
  gap: var(--space-3);
}

.eng-train__label {
  margin: 0;
  font-size: var(--text-md);
  font-weight: var(--font-weight-bold);
  line-height: var(--leading-tight);
  color: var(--color-text);
}

.eng-train-lead {
  margin: 0;
  max-width: none;
  font-size: var(--text-md);
  line-height: var(--leading-relaxed);
  color: var(--color-text);
}

/* 일정 달 이름만 자격 경로의 01·02와 같은 파란색 */
.eng-train .eng-facts dt {
  color: var(--color-primary);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.08em;
}

.eng-train-icon {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-bg));
  color: var(--color-primary);
}

.eng-train-icon .kapa-icon {
  width: 1.25rem;
  height: 1.25rem;
  vertical-align: 0;
}

.eng-checklist.eng-checklist--icons > li {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding-left: 0;
}

.eng-checklist.eng-checklist--icons > li::before {
  content: none;
}

/*
 * Work: 제목과 짧은 설명이 있는 업무 칸 목록
 * 아이콘+제목은 한 줄, 설명은 그 아래 전체 너비
 */
.eng-fields {
  display: grid;
  gap: var(--space-3);
}

.eng-fields__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin: 0;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

.eng-fields__icon {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  margin: 0;
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-bg));
  color: var(--color-primary);
}

.eng-fields__icon .kapa-icon {
  width: 1.5rem;
  height: 1.5rem;
  vertical-align: 0;
}

/* 제목·설명을 한 묶음으로 두어 왼쪽 줄을 맞추고 간격을 좁힘 */
.eng-fields__text {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.eng-fields__title {
  margin: 0;
  color: var(--color-text);
  font-size: var(--text-md);
  font-weight: var(--font-weight-bold);
  line-height: var(--leading-tight);
}

.eng-fields__text > p {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
}

@media (min-width: 768px) {
  .eng-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
  }

  .eng-fields__item {
    padding: var(--space-5);
  }
}

/* 넓은 화면: 한 줄에 3칸 (12개 → 4줄) */
@media (min-width: 1024px) {
  .eng-fields {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* 구비서류: 한 줄은 Land→Building 순. 넓은 화면은 Land–Building 짝으로 나란히. 짧은 칸 아래 빈자리 허용. */
.eng-doc-grid {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.eng-doc-col {
  display: contents;
}

.eng-doc-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  min-width: 0;
  margin: 0;
}

.eng-doc-card .eng-sub-heading {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding-bottom: var(--space-3);
  border-bottom: 2px solid var(--color-primary);
}

.eng-doc-card .eng-checklist {
  /* 제목·아이콘 왼쪽 끝보다 목록을 살짝 들여 안정감 */
  padding: 0 0 0 var(--space-3);
  border: 0;
  border-radius: 0;
  background: transparent;
}

.eng-doc-card__icon {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  color: var(--color-primary);
}

.eng-doc-card__icon .kapa-icon {
  width: 2rem;
  height: 2rem;
  vertical-align: 0;
}

/* 좁은 화면: 칸만 빠져 나와 순서대로. 넓은 화면에서만 Motor·Special을 Forest와 한 줄로 묶음 */
.eng-doc-tail {
  display: contents;
}

.eng-doc-card--land { order: 1; }
.eng-doc-card--building { order: 2; }
.eng-doc-card--apartment { order: 3; }
.eng-doc-card--factory { order: 4; }
.eng-doc-card--motor { order: 5; }
.eng-doc-card--forest { order: 6; }
.eng-doc-card--special { order: 7; }

@media (min-width: 768px) {
  .eng-doc-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  /* Motor 위 · Special 아래를 Forest 높이에 맞춰, 아랫줄만 맞춤 */
  .eng-doc-tail {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
    order: 5;
    align-self: stretch;
    min-width: 0;
  }

  .eng-doc-card--motor,
  .eng-doc-card--special {
    order: 0;
  }

  .eng-doc-card--special {
    margin-top: auto;
  }

  .eng-doc-card--forest {
    order: 6;
  }
}

/* 수수료: 기준식만 본문. 0.8·1.2배 시작 금액은 다를 때만 아래 한 줄 */
.eng-fee__list {
  display: grid;
  gap: var(--space-3);
}

.eng-fee-band {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg);
  overflow: hidden;
}

.eng-fee-band__range {
  margin: 0;
  padding: var(--space-3) var(--space-4);
  background: var(--color-bg-subtle);
  color: var(--color-text);
  font-size: var(--text-md);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
}

.eng-fee-band__fee {
  margin: 0;
  padding: var(--space-4);
  color: var(--color-text);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
  line-height: var(--leading-normal);
}

.eng-fee-band__fee strong {
  font-weight: var(--font-weight-bold);
}

.eng-fee-band__fee:has(+ .eng-fee-band__ends) {
  padding-bottom: var(--space-2);
}

.eng-fee-band__ends {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
  margin: 0;
  padding: 0 var(--space-4) var(--space-4);
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
  line-height: var(--leading-normal);
}

.eng-fee-band__ends strong {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

/* 넓은 화면만 한 줄에 구간 둘. 좁으면 계산식이 다시 잘림 */
@media (min-width: 768px) {
  .eng-fee__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .eng-fee-band {
    min-width: 0;
  }
}

/* Work: 한 줄짜리 항목 목록 — 브라우저 기본 들여쓰기 대신 점을 직접 맞춤 */
.eng-checklist {
  margin: 0;
  padding: var(--space-4) var(--space-5);
  list-style: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

/* Scope: 긴 주제는 자격 경로(01)처럼 파란 소제목 + 회색 상자, 한 줄로 쌓음 */
.eng-scope-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.eng-scope-topic {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
  margin: 0;
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

.eng-scope-topic__title {
  margin: 0;
  color: var(--color-primary);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-bold);
  line-height: var(--leading-snug, var(--leading-tight));
  letter-spacing: var(--tracking-tight);
}

/* Scope 큰 제목: Documents처럼 아이콘 + 파란 밑줄 */
.eng-sub-heading:has(> .eng-doc-card__icon) {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding-bottom: var(--space-3);
  border-bottom: 2px solid var(--color-primary);
}

/* Scope: 짧은 주제끼리만 넓은 화면에서 두 칸. 긴 주제는 한 줄 */
.eng-scope-grid {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.eng-scope-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
  margin: 0;
}

@media (min-width: 768px) {
  .eng-scope-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-5);
    align-items: start;
  }
}

.eng-scope-block .eng-checklist,
.eng-scope-topic .eng-checklist {
  padding: 0 0 0 var(--space-3);
  border: 0;
  border-radius: 0;
  background: transparent;
}

.eng-scope-lead {
  display: block;
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

.eng-scope-detail {
  display: block;
  margin-top: var(--space-1);
  color: var(--color-text-secondary);
  font-weight: var(--font-weight-regular);
}

.eng-checklist > li {
  position: relative;
  margin: 0 0 var(--space-3);
  padding-left: 1.1rem;
  color: var(--color-text);
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
}

.eng-checklist > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 50%;
  background: currentColor;
}

.eng-checklist > li:last-child {
  margin-bottom: 0;
}

.eng-checklist__sub {
  margin: var(--space-2) 0 0;
  padding: 0;
  list-style: none;
}

.eng-checklist__sub > li {
  position: relative;
  margin: 0 0 var(--space-2);
  padding-left: 1.1rem;
  color: var(--color-text);
  font-weight: var(--font-weight-regular);
}

.eng-checklist__sub > li:last-child {
  margin-bottom: 0;
}

/* 안쪽 목록은 채운 점과 구분되도록 빈 동그라미 */
.eng-checklist__sub > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  box-sizing: border-box;
  width: 0.25rem;
  height: 0.25rem;
  border: 1px solid currentColor;
  border-radius: 50%;
  background: transparent;
}

/* 특수평가처럼 순번이 있는 아래 목록은 점 대신 번호를 쓴다 */
.eng-checklist__sub--num {
  list-style: decimal;
  padding-left: 1.25rem;
}

.eng-checklist__sub--num > li {
  padding-left: 0.35rem;
}

.eng-checklist__sub--num > li::before {
  content: none;
}

.eng-checklist a {
  color: var(--color-text-link);
  text-decoration: none;
}

.eng-checklist a:hover,
.eng-checklist a:focus-visible {
  text-decoration: underline;
}

.eng-checklist a .kapa-icon {
  margin-left: 0.3em;
  color: var(--color-text-secondary);
}

.eng-checklist a:hover .kapa-icon,
.eng-checklist a:focus-visible .kapa-icon {
  color: var(--color-primary);
}

/* Work: 국제 협력 MOU — 연도 | 기관 이름 */
.eng-partner-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--color-border);
}

.eng-partner-list > li {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr);
  gap: var(--space-3);
  align-items: baseline;
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text);
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
}

.eng-partner-list__year {
  color: var(--color-primary);
  font-weight: var(--font-weight-bold);
}

.eng-partner-list a {
  color: var(--color-text-link);
  text-decoration: none;
}

.eng-partner-list a:hover,
.eng-partner-list a:focus-visible {
  text-decoration: underline;
}

/* 외부 사이트 링크: 새창 아이콘은 보조 신호로만 */
.eng-partner-list a .kapa-icon {
  margin-left: 0.3em;
  color: var(--color-text-secondary);
}

.eng-partner-list a:hover .kapa-icon,
.eng-partner-list a:focus-visible .kapa-icon {
  color: var(--color-primary);
}

.eng-partner-list__note {
  color: var(--color-text-secondary);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
}

.eng-sub-more {
  display: grid;
  gap: var(--space-3);
}

/* More in … 은 위 본문과 구분. 제목 위에 줄을 둔다 */
.eng-sub-heading:has(+ .eng-sub-more) {
  margin-top: var(--space-2);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-border);
}

.eng-sub-heading + .eng-sub-more {
  margin-top: var(--space-3);
}

.eng-sub-more .kapa-panel {
  height: 100%;
}

.eng-sub-more .kapa-link {
  margin-top: auto;
  align-self: flex-start;
  min-height: var(--touch-target-min);
}

@media (min-width: 768px) {
  .eng-sub-more {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
  }
}

.eng-history {
  display: grid;
}

.eng-decade-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.eng-decade-nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px;
  margin-bottom: var(--space-5);
  padding: 2px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg-muted);
  scroll-margin-top: 5.5rem;
}

.eng-decade-nav label[for="d-1970s"] {
  grid-column: 1 / -1;
}

.eng-decade-nav label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--touch-target-min);
  padding: 0 var(--space-3);
  border-radius: calc(var(--radius-md) - 2px);
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  text-align: center;
  cursor: pointer;
}

#d-2020s:checked ~ .eng-decade-nav label[for="d-2020s"],
#d-2010s:checked ~ .eng-decade-nav label[for="d-2010s"],
#d-2000s:checked ~ .eng-decade-nav label[for="d-2000s"],
#d-1990s:checked ~ .eng-decade-nav label[for="d-1990s"],
#d-1970s:checked ~ .eng-decade-nav label[for="d-1970s"] {
  background: var(--color-primary-strong);
  color: var(--color-text-inverse);
  box-shadow: var(--shadow-sm);
}

#d-2020s:focus-visible ~ .eng-decade-nav label[for="d-2020s"],
#d-2010s:focus-visible ~ .eng-decade-nav label[for="d-2010s"],
#d-2000s:focus-visible ~ .eng-decade-nav label[for="d-2000s"],
#d-1990s:focus-visible ~ .eng-decade-nav label[for="d-1990s"],
#d-1970s:focus-visible ~ .eng-decade-nav label[for="d-1970s"] {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

.eng-decade {
  display: none;
  flex-direction: column;
  gap: var(--space-6);
}

#d-2020s:checked ~ .eng-decade--2020s,
#d-2010s:checked ~ .eng-decade--2010s,
#d-2000s:checked ~ .eng-decade--2000s,
#d-1990s:checked ~ .eng-decade--1990s,
#d-1970s:checked ~ .eng-decade--1970s {
  display: flex;
}

@media (min-width: 768px) {
  .eng-decade-nav {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .eng-decade-nav label[for="d-1970s"] {
    grid-column: auto;
  }
}

.eng-year-index {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  scroll-margin-top: 5.5rem;
}

.eng-year-index a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* 손가락 크기는 유지하고, 가로는 조금 넓혀 공처럼 보이지 않게 */
  min-height: var(--touch-target-min);
  min-width: 4.5rem;
  padding: 0 var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-bg-muted);
  color: var(--color-text);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  text-decoration: none;
}

.eng-year-index a:hover,
.eng-year-index a:focus-visible {
  background: var(--color-bg-brand-soft);
  color: var(--color-primary-strong);
}

.eng-year-index a:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

.eng-timeline {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.eng-timeline__year {
  margin: 0 0 var(--space-3);
  color: var(--color-primary-strong);
  font-size: var(--text-lg);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--tracking-tight);
  scroll-margin-top: 5.5rem;
}

.eng-timeline__list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--color-border);
}

.eng-timeline__item {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr);
  gap: var(--space-3);
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--color-border);
}

.eng-timeline__month {
  color: var(--color-primary);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-bold);
}

.eng-timeline__item p {
  margin: 0;
  color: var(--color-text);
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
}

/* 연혁 맨 아래: 연도 단추로 돌아가기 */
.eng-timeline-end {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--space-5);
}

/* 조금 내려간 뒤에만 구석에 같은 단추를 띄웁니다. */
.eng-backtop {
  position: fixed;
  right: var(--space-4);
  bottom: var(--space-5);
  z-index: var(--z-dropdown);
  display: inline-flex;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  box-shadow: var(--shadow-md);
}

.eng-backtop.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

@media (prefers-reduced-motion: no-preference) {
  html:has(.eng-history) {
    scroll-behavior: smooth;
  }

  .eng-backtop {
    transition: opacity 0.2s ease, visibility 0.2s ease;
  }
}

@media (max-width: 767px) {
  .eng-backtop {
    right: var(--space-3);
    bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px) + var(--space-3));
  }
}


/* 위원회: 총회 → 이사회 → 위원회 → 세 묶음 */
.eng-comm {
  min-width: 0;
}

.eng-comm__stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.eng-comm__stack-lead,
.eng-comm__stack-soft,
.eng-comm__stack-mid {
  margin: 0;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border-brand);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  text-align: center;
}

.eng-comm__stack-lead {
  border-color: var(--color-primary-strong);
  background: var(--color-bg-inverse);
  color: var(--color-text-inverse);
}

.eng-comm__stack-soft {
  background: var(--color-bg);
  color: var(--color-primary);
}

.eng-comm__stack-mid {
  background: color-mix(in srgb, var(--color-border-strong) 38%, var(--color-bg));
  color: var(--color-primary-strong);
}

.eng-comm__stack-groups {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.eng-commchart__hint {
  display: none;
  margin: 0 0 var(--space-3);
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
}

.eng-commchart__scroll {
  display: none;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: var(--space-2);
}

@media (min-width: 768px) {
  .eng-comm__stack {
    display: none;
  }

  .eng-commchart__scroll {
    display: block;
  }
}

/* 탭·좁은 노트북: 도표를 옆으로 밀라는 안내 */
@media (min-width: 768px) and (max-width: 1023px) {
  .eng-commchart__hint {
    display: block;
  }
}

.eng-commchart {
  --eng-comm-line: #b0b8c0;
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows:
    auto
    1.25rem
    auto
    1.25rem
    auto
    1.15rem
    0.95rem
    auto;
  column-gap: var(--space-4);
  row-gap: 0;
  min-width: 42rem;
  width: 100%;
}

.eng-commchart__line {
  pointer-events: none;
  z-index: 0;
}

.eng-commchart__line--v {
  width: 2px;
  justify-self: center;
  background: repeating-linear-gradient(
    to bottom,
    var(--eng-comm-line) 0 3px,
    transparent 3px 7px
  );
}

.eng-commchart__line--h {
  height: 2px;
  align-self: center;
  background: repeating-linear-gradient(
    to right,
    var(--eng-comm-line) 0 3px,
    transparent 3px 7px
  );
}

.eng-commchart__stem-1 { grid-column: 2; grid-row: 2; }
.eng-commchart__stem-2 { grid-column: 2; grid-row: 4; }
.eng-commchart__stem-3 {
  grid-column: 2;
  grid-row: 6;
  align-self: start;
  height: calc(0.575rem + 1px);
}
.eng-commchart__t-bar {
  grid-column: 1 / 4;
  grid-row: 6;
  clip-path: inset(0 calc((100% - 2 * var(--space-4)) / 6) 0 calc((100% - 2 * var(--space-4)) / 6));
}
.eng-commchart__to-l { grid-column: 1; grid-row: 7; }
.eng-commchart__to-m { grid-column: 2; grid-row: 7; }
.eng-commchart__to-r { grid-column: 3; grid-row: 7; }

.eng-commchart__box {
  position: relative;
  z-index: 1;
  grid-column: 1 / -1;
  justify-self: center;
  margin: 0;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border-brand);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  text-align: center;
}

.eng-commchart__box--lead {
  grid-row: 1;
  min-width: 10.5rem;
  border-color: var(--color-primary-strong);
  background: var(--color-bg-inverse);
  color: var(--color-text-inverse);
}

.eng-commchart__box--soft {
  grid-row: 3;
  min-width: 10.5rem;
  background: var(--color-bg);
  color: var(--color-primary);
}

.eng-commchart__box--mid {
  grid-row: 5;
  min-width: 10.5rem;
  background: color-mix(in srgb, var(--color-border-strong) 38%, var(--color-bg));
  color: var(--color-primary-strong);
}

.eng-commchart .eng-org__offices {
  position: relative;
  z-index: 1;
  align-self: start;
}

.eng-commchart__g-l { grid-column: 1; grid-row: 8; }
.eng-commchart__g-m { grid-column: 2; grid-row: 8; }
.eng-commchart__g-r { grid-column: 3; grid-row: 8; }

.eng-sub-article {
  display: grid;
  grid-template-areas:
    "portrait"
    "copy";
  gap: var(--space-6);
}

.eng-sub-article__copy {
  grid-area: copy;
  min-width: 0;
}

.eng-sub-article__copy .kapa-prose p:last-child {
  margin-bottom: 0;
}

.eng-sub-article__portrait {
  grid-area: portrait;
  justify-self: center;
  width: min(100%, 14.5rem);
  text-align: center;
}

.eng-sub-article__portrait img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

.eng-sub-sign {
  margin-top: var(--space-3);
}

.eng-sub-sign__name {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--color-text);
}

.eng-sub-sign__role {
  margin: var(--space-1) 0 0;
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
}

@media (min-width: 768px) {
  .eng-sub-article {
    grid-template-columns: minmax(0, 1fr) 14.5rem;
    grid-template-areas: "copy portrait";
    align-items: start;
    gap: var(--space-8);
  }

  .eng-sub-article__portrait {
    justify-self: stretch;
  }
}

/* 위원회 목록 점 스타일(공통) */
.eng-org__offices {
  margin: 0;
  padding: var(--space-3) var(--space-4);
  list-style: none;
  border: 1px solid var(--color-border-brand);
  border-radius: var(--radius-md);
  background: var(--color-bg);
}

.eng-org__offices li {
  position: relative;
  padding: var(--space-2) 0 var(--space-2) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
}

.eng-org__offices li:last-child {
  border-bottom: 0;
}

.eng-org__offices li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.85rem;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--color-primary);
}

/*
 * 최신 조직도: 칸과 선을 격자 같은 자리에 두고,
 * 선은 칸 뒤로 깔아 끝이 상자에 닿아 보이게 합니다.
 */
.eng-orgchart {
  --eng-org-teal: #1a9aa8;
  --eng-org-green: #2e9a73;
  --eng-org-navy: #2f5f9a;
  --eng-org-office: #4f8fbf;
  --eng-org-gray: #7d868f;
  min-width: 0;
}

/* 휴대폰·좁은 화면: 단계별 목록 */
.eng-orgchart__stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.eng-orgchart__stack-lead {
  margin: 0;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-primary-strong);
  color: var(--color-text-inverse);
  font-size: var(--text-md);
  font-weight: var(--font-weight-bold);
  text-align: center;
}

.eng-orgchart__stack-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
}

.eng-orgchart__stack-heading {
  margin: 0;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--eng-org-gray);
  color: var(--color-text-inverse);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-bold);
  line-height: var(--leading-tight);
  text-align: center;
}

.eng-orgchart__stack-heading--svp {
  background: var(--eng-org-teal);
}

.eng-orgchart__stack-heading--ops {
  background: var(--eng-org-green);
}

.eng-orgchart__stack-sub {
  margin: var(--space-1) 0 0;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  background: var(--eng-org-navy);
  color: var(--color-text-inverse);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  text-align: center;
}

.eng-orgchart__stack-list {
  margin: 0;
  padding: var(--space-2) var(--space-3);
  list-style: none;
  border-radius: var(--radius-md);
  background: #eef2f5;
}

.eng-orgchart__stack-list li {
  margin: 0;
  padding: var(--space-2) var(--space-3);
  border-radius: 6px;
  color: var(--color-text-inverse);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  text-align: center;
}

.eng-orgchart__stack-list li + li {
  margin-top: 0.4rem;
}

.eng-orgchart__stack-list--advisor li {
  background: var(--eng-org-gray);
}

.eng-orgchart__stack-list--office li {
  background: var(--eng-org-office);
}

.eng-orgchart__hint {
  display: none;
  margin: 0 0 var(--space-3);
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
}

.eng-orgchart__scroll {
  display: none;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: var(--space-2);
}

/* 768px부터 도표 (휴대폰만 목록) */
@media (min-width: 768px) {
  .eng-orgchart__stack {
    display: none;
  }

  .eng-orgchart__scroll {
    display: block;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .eng-orgchart__hint {
    display: block;
  }
}

@media (max-width: 767px) {
  /* 목록이 보이므로 도표용 읽기 설명은 숨김(중복 방지) */
  .eng-orgchart__chart-sr {
    display: none;
  }
}

.eng-orgchart__canvas {
  --eng-org-line: #b0b8c0;
  --eng-org-teal: #1a9aa8;
  --eng-org-green: #2e9a73;
  --eng-org-navy: #2f5f9a;
  --eng-org-office: #4f8fbf;
  --eng-org-gray: #7d868f;
  --eng-org-cluster: #eef2f5;
  --eng-org-gap: 0.85rem;

  position: relative;
  display: grid;
  grid-template-columns: repeat(15, minmax(0, 1fr));
  grid-template-rows:
    auto
    1.1rem
    auto
    1.1rem
    1.1rem
    1.1rem
    auto
    1.1rem
    1.1rem
    1.1rem
    auto
    1.1rem
    auto;
  column-gap: var(--eng-org-gap);
  row-gap: 0;
  min-width: 64rem;
  width: 100%;
  padding: var(--space-2) 0 var(--space-3);
}

.eng-orgchart__line {
  pointer-events: none;
  z-index: 0;
  box-sizing: content-box;
}

.eng-orgchart__line--v {
  width: 2px;
  justify-self: center;
  background: repeating-linear-gradient(
    to bottom,
    var(--eng-org-line) 0 3px,
    transparent 3px 7px
  );
}

.eng-orgchart__line--h {
  height: 2px;
  align-self: center;
  background: repeating-linear-gradient(
    to right,
    var(--eng-org-line) 0 3px,
    transparent 3px 7px
  );
}

.eng-orgchart__p-stem { grid-column: 8; grid-row: 2 / 8; }
.eng-orgchart__advisor-bar {
  grid-column: 2 / 15;
  grid-row: 3;
}
.eng-orgchart__vp-bar {
  grid-column: 2 / 14;
  grid-row: 5;
  /* 선임·부회장 세로줄 밖으로 가로줄이 삐져 십자가가 되지 않게 */
  clip-path: inset(0 1.7rem 0 1.7rem);
}
.eng-orgchart__from-bar-svp {
  grid-column: 2;
  grid-row: 5 / 8;
  margin-top: calc(0.55rem - 1px);
}
.eng-orgchart__from-bar-vp {
  grid-column: 13;
  grid-row: 5 / 8;
  margin-top: calc(0.55rem - 1px);
}
.eng-orgchart__svp-bar-r {
  grid-column: 2 / 7;
  grid-row: 9;
  clip-path: inset(0 1.7rem 0 1.7rem);
}
/* 선임부회장 쪽 ↔ 운영부회장 쪽 가로 연결 */
.eng-orgchart__plan-biz {
  grid-column: 6 / 10;
  grid-row: 9;
  clip-path: inset(0 calc((100% - 3 * var(--eng-org-gap)) / 8) 0 calc((100% - 3 * var(--eng-org-gap)) / 8));
}
.eng-orgchart__ops-bar {
  grid-column: 9 / 15;
  grid-row: 9;
  clip-path: inset(0 calc((100% - 5 * var(--eng-org-gap)) / 12) 0 calc((100% - 5 * var(--eng-org-gap)) / 12));
}
.eng-orgchart__to-g1 { grid-column: 2; grid-row: 8 / 13; }
.eng-orgchart__to-plan {
  grid-column: 6;
  grid-row: 9 / 12;
  margin-top: calc(0.55rem - 1px);
}
/* 공시지원실: 가로줄에서만 내려가고, 위(부회장)로는 안 올라감 */
.eng-orgchart__to-g4 {
  grid-column: 12;
  grid-row: 9 / 13;
  margin-top: calc(0.55rem - 1px);
}
.eng-orgchart__to-biz { grid-column: 9; grid-row: 8 / 12; }
.eng-orgchart__to-rec { grid-column: 14; grid-row: 8 / 12; }
.eng-orgchart__to-g2 { grid-column: 6; grid-row: 12; }
.eng-orgchart__to-g3 { grid-column: 9; grid-row: 12; }
.eng-orgchart__to-g5 { grid-column: 14; grid-row: 12; }

.eng-orgchart__box,
.eng-orgchart__office {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 0.55rem 0.65rem;
  overflow: hidden;
  border: 0;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  text-align: center;
}

.eng-orgchart__box--president {
  grid-column: 6 / 11;
  grid-row: 1;
  justify-self: center;
  min-width: 11rem;
  padding: 0.75rem 1.35rem;
  border-radius: 8px;
  font-size: 1rem;
  background: var(--color-primary-strong);
  color: var(--color-text-inverse);
}

.eng-orgchart__box--advisor {
  background: var(--eng-org-gray);
  color: var(--color-text-inverse);
}

.eng-orgchart__board { grid-column: 1 / 4; grid-row: 3; }
.eng-orgchart__audit { grid-column: 4 / 7; grid-row: 3; }
.eng-orgchart__advisor { grid-column: 10 / 13; grid-row: 3; }
.eng-orgchart__advisory { grid-column: 13 / 16; grid-row: 3; }

.eng-orgchart__box--svp,
.eng-orgchart__box--vp {
  background: var(--eng-org-teal);
  color: var(--color-text-inverse);
}

.eng-orgchart__box--ops {
  background: var(--eng-org-green);
  color: var(--color-text-inverse);
}

.eng-orgchart__svp { grid-column: 1 / 5; grid-row: 7; }
.eng-orgchart__ops { grid-column: 6 / 11; grid-row: 7; }
.eng-orgchart__vp { grid-column: 11 / 16; grid-row: 7; }

.eng-orgchart__box--director {
  background: var(--eng-org-navy);
  color: var(--color-text-inverse);
}

.eng-orgchart__plan { grid-column: 5 / 8; grid-row: 11; }
.eng-orgchart__biz { grid-column: 8 / 11; grid-row: 11; }
.eng-orgchart__rec { grid-column: 13 / 16; grid-row: 11; }

.eng-orgchart__cluster {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  align-self: start;
  padding: 0.45rem;
  border-radius: 8px;
  background: var(--eng-org-cluster);
}

.eng-orgchart__g1 { grid-column: 1 / 4; grid-row: 13; }
.eng-orgchart__g2 { grid-column: 5 / 8; grid-row: 13; }
.eng-orgchart__g3 { grid-column: 8 / 11; grid-row: 13; }
.eng-orgchart__g4 { grid-column: 11 / 13; grid-row: 13; }
.eng-orgchart__g5 { grid-column: 13 / 16; grid-row: 13; }

.eng-orgchart__office {
  background: var(--eng-org-office);
  color: var(--color-text-inverse);
}

/*
 * 사이트맵(목록형): 메뉴마다 옅은 칸으로 구역 구분.
 * 제목 옆 아이콘 + 하위 링크는 평소 글, 올리면 칸.
 * 넓은 화면은 메뉴 순서대로 2열(짧은·긴 칸이 섞여 좌우가 덜 치우침).
 */
.eng-sitemap {
  display: grid;
  gap: var(--space-4);
  margin-top: var(--space-5);
}

.eng-sitemap__group {
  min-width: 0;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

.eng-sitemap__title {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0 0 var(--space-3);
  padding: 0;
  border: 0;
  color: var(--color-text);
  font-size: var(--text-md);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
}

.eng-sitemap__icon {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-bg));
  color: var(--color-primary);
}

.eng-sitemap__icon .kapa-icon {
  width: 1rem;
  height: 1rem;
  vertical-align: 0;
}

.eng-sitemap__list {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.eng-sitemap__list > li {
  margin: 0;
  min-width: 0;
  border-bottom: 0;
}

/* 하위 링크가 2개 이상일 때만, 사이사이 점선 */
.eng-sitemap__list:has(> li:nth-child(2)) > li:not(:last-child) {
  border-bottom: 1px dotted var(--color-border);
}

/* 하위 링크: 평소엔 글+화살표만, 올리면 안쪽 칸이 나타남 */
.eng-sitemap__list a {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  min-height: var(--touch-target-min);
  padding: var(--space-2) var(--space-3);
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  background: transparent;
  box-shadow: none;
  color: var(--color-text-link);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-medium);
  line-height: var(--leading-normal);
  text-decoration: none;
}

.eng-sitemap__list a::after {
  content: "";
  flex-shrink: 0;
  width: 0.4rem;
  height: 0.4rem;
  margin-left: auto;
  border-right: 2px solid var(--color-primary);
  border-bottom: 2px solid var(--color-primary);
  transform: rotate(-45deg);
  opacity: 0.55;
}

.eng-sitemap__list a:hover,
.eng-sitemap__list a:focus-visible {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: var(--color-bg);
  box-shadow: var(--shadow-sm);
  color: var(--color-primary-strong);
  text-decoration: none;
}

.eng-sitemap__list a:hover::after,
.eng-sitemap__list a:focus-visible::after {
  opacity: 1;
}

.eng-sitemap__list .kapa-icon {
  flex-shrink: 0;
  color: var(--color-text-secondary);
}

.eng-sitemap__list a:hover .kapa-icon,
.eng-sitemap__list a:focus-visible .kapa-icon {
  color: var(--color-primary);
}

@media (min-width: 768px) {
  .eng-sitemap {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4) var(--space-8);
  }
}

/* Members: 큰 숫자 카드 + 짧은 표 (모바일 세로 쌓기) */
.eng-members {
  display: grid;
  gap: var(--space-5);
}

.eng-members__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2) var(--space-4);
}

.eng-members__head .eng-sub-heading {
  margin: 0;
}

.eng-members__asof {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-medium);
}

.eng-members__cards {
  display: grid;
  gap: var(--space-3);
}

.eng-members__card {
  margin: 0;
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-subtle);
}

.eng-members__card--total {
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 8%, var(--color-bg));
}

.eng-members__label {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: var(--text-xs);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.eng-members__value {
  margin: var(--space-2) 0 0;
  color: var(--color-text);
  font-size: var(--text-3xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
}

.eng-members__card--total .eng-members__value {
  color: var(--color-primary-strong);
}

.eng-members__meta {
  margin: var(--space-1) 0 0;
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
}

.eng-members__detail-title {
  margin: 0;
  color: var(--color-text);
  font-size: var(--text-md);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
}

.eng-members__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg);
}

.eng-members__table {
  width: 100%;
  min-width: 18rem;
  border-collapse: collapse;
  font-size: var(--text-sm);
}

.eng-members__table th,
.eng-members__table td {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  text-align: left;
  vertical-align: middle;
}

.eng-members__table thead th {
  background: var(--color-bg-subtle);
  color: var(--color-text-secondary);
  font-weight: var(--font-weight-semibold);
}

.eng-members__table tbody th {
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
}

.eng-members__table td {
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
}

.eng-members__table tbody tr:last-child th,
.eng-members__table tbody tr:last-child td {
  border-bottom: 0;
  font-weight: var(--font-weight-semibold);
}

.eng-members__note {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
}

@media (min-width: 768px) {
  .eng-members__cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
  }

  .eng-members__value {
    font-size: var(--text-4xl);
  }
}