/* 2026 CMC Seoul — Sub pages */
body.page-sub {
  background: #ffffff;
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 1) 0%,
    rgba(249, 236, 211, 1) 100%
  );
}

body.page-sub .site-header {
  position: absolute;
}

/* ----- Page banner ----- */
.page-banner {
  position: relative;
  height: 500px;
  display: flex;
  align-items: center;
  color: #fff;
  background: #f26a21 url("../img/sub-tit-bg.jpg") center / cover no-repeat;
  overflow: hidden;
}

.page-banner-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: calc(var(--header-h) + 8px) 40px 0;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-size: clamp(14px, 3vw, 20px);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.78);
}

.breadcrumb a:hover {
  color: #fff;
  text-decoration: underline;
}

.breadcrumb .sep {
  opacity: 0.55;
}

.breadcrumb .current {
  color: var(--color-navy);
  font-weight: 700;
}

.page-banner-title {
  font-size: clamp(32px, 3.2vw, 48px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.25;
  color: #fff;
}

.page-banner-title::before {
  content: "|";
  margin-right: 12px;
  font-weight: 500;
}

/* ----- Content shell ----- */
.page-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 72px 40px 100px;
}

.section-head {
  margin-bottom: 36px;
}

.section-head .ko {
  display: block;
  color: #e8890c;
  font-size: clamp(28px, 3vw, 36px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.3;
}

.section-head .en {
  display: block;
  margin-top: 6px;
  color: var(--color-navy);
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.section-head .line {
  display: block;
  width: 48px;
  height: 3px;
  margin-top: 16px;
  background: #e8b86a;
  border-radius: 2px;
}

@media (max-width: 860px) {
  .page-banner {
    height: 240px;
  }

  .page-banner-inner {
    padding: calc(var(--header-h) + 4px) 24px 0;
  }

  .breadcrumb {
    font-size: 12px;
    gap: 6px;
    margin-bottom: 10px;
  }

  .page-banner-title {
    font-size: clamp(26px, 7vw, 34px);
  }

  .page-banner-title::before {
    margin-right: 8px;
  }

  .page-content {
    padding: 48px 24px 72px;
  }
}