/* About Page Styles */
.zs-about-banner-wrap { position: relative; width: 100%; aspect-ratio: 1920 / 600; overflow: hidden; display: block; line-height: 0; font-size: 0; }
.zs-about-banner-img { width: 100%; height: auto; object-fit: cover; display: block; }
.zs-about-banner-content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-image: linear-gradient(to bottom, var(--tw-gradient-stops));}
.zs-about-banner-title { font-size: 46px; color: var(--color-white); font-weight: bold; text-align: center; }

.zs-about-profile { padding: 80px 0; background: rgba(246, 249, 252, 1) url(../img/img_about_map_bg.webp) no-repeat center top;}
.zs-profile-flex { display: flex; justify-content: space-between; gap: 80px; margin-bottom: 50px; }
.zs-profile-left { flex: 0 0 50%; }
.zs-profile-title { font-size: 40px; color: var(--color-title); font-weight: bold; margin-bottom: 30px; }
.zs-profile-desc p { font-size: 16px; color: var(--color-text); line-height: 1.8; margin-bottom: 20px; }
.zs-profile-right { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 40px; }
.zs-profile-year { font-size: 160px; font-weight: bold; line-height: 1; margin-bottom: 10px; color: var(--color-title); }
.zs-profile-founded { font-size: 40px; text-transform: uppercase; letter-spacing: 2px; color: var(--color-title); }
.zs-profile-img { width: 100%; overflow: hidden; }
.zs-profile-img img { width: 100%; height: auto; display: block; }

.zs-about-global { padding: 80px 0; background: url(../img/img_about_global_bg.webp) no-repeat center; }
.zs-global-content { width: 40%; text-align: left; }
.zs-global-title { font-size: 36px; color: var(--color-white); font-weight: bold; margin-bottom: 30px; }
.zs-global-desc p { font-size: 16px; color: var(--color-white); line-height: 1.8; margin-bottom: 40px; }
.zs-global-list { list-style: none; display: flex; flex-direction: column; gap: 15px; }
.zs-global-list li { display: flex; align-items: center; gap: 10px; font-size: 16px; color: var(--color-white); font-weight: bold; }
.zs-global-list img { width: 20px; }

.zs-about-exhibition { padding: 80px 0; }
.zs-exhibition-wrap { display: flex; gap: 0; align-items: stretch; }
.zs-exhibition-left { flex: 1; position: relative; overflow: hidden; aspect-ratio: 4/3; }
.zs-exhibition-slider { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.zs-exhibition-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 0.8s ease-in-out; z-index: 1; }
.zs-exhibition-slide.active { opacity: 1; z-index: 2; }
.zs-exhibition-slide img { width: 100%; height: 100%; object-fit: cover; }
.zs-exhibition-nav { position: absolute; bottom: 0; right: 0; display: flex; z-index: 10; }
.zs-exhibition-prev, .zs-exhibition-next { width: 60px; height: 60px; background: linear-gradient(135deg, #FFD54F, #FF9800); display: flex; justify-content: center; align-items: center; cursor: pointer; transition: all 0.3s; }
.zs-exhibition-prev:hover, .zs-exhibition-next:hover { background: linear-gradient(135deg, #FFCA28, #F57C00); }
.zs-exhibition-right { flex: 1; position: relative; min-height: 250px; background: #f6f9fc; padding: 60px; display: flex; flex-direction: column; justify-content: center; }
.zs-exhibition-text-slider { position: relative; width: 100%; height: 250px; }
.zs-exhibition-text-slide { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; transform: translateY(30px); transition: all 0.8s ease-in-out; z-index: 1; pointer-events: none; }
.zs-exhibition-text-slide.active { opacity: 1; transform: translateY(0); z-index: 2; pointer-events: auto; }
.zs-exhibition-text-slide h3 { font-size: 28px; color: var(--color-title); margin-bottom: 20px; }
.zs-exhibition-text-slide p { font-size: 16px; color: var(--color-text); line-height: 1.8; }

.zs-about-certificate { padding: 80px 0; background: var(--color-bg-gray); }
.zs-cert-flex { display: flex; gap: 50px; align-items: center; }
.zs-cert-left { flex: 1; }
.zs-cert-left h2 { font-size: 36px; color: var(--color-title); font-weight: bold; margin-bottom: 20px; }
.zs-cert-left p { font-size: 16px; color: var(--color-text); line-height: 1.8; margin-bottom: 30px; }
.zs-cert-right { flex: 2; overflow: hidden; }
.zs-cert-slider-container { overflow: hidden; position: relative; }
.zs-cert-slider { display: flex; transition: transform 0.5s ease; }
.zs-cert-track { display: flex; gap: 20px; }
.zs-cert-item { min-width: calc(25% - 15px); }
.zs-cert-item img { width: 100%; height: auto; display: block; border: 1px solid #ddd; background: var(--color-white); padding: 5px; }
.zs-cert-pagination { display: flex; justify-content: center; gap: 10px; margin-top: 30px; }
.zs-cert-dot { width: 10px; height: 10px; border-radius: 50%; background: #ccc; cursor: pointer; transition: background 0.3s; }
.zs-cert-dot.active { background: var(--color-main); }

.zs-about-partner { padding: 80px 0; }
.zs-partner-slider-container { overflow: hidden; position: relative; }
.zs-partner-slider { width: 100%; overflow: hidden; }
.zs-partner-track { display: flex; gap: 30px; transition: transform 0.5s ease; }
.zs-partner-item { min-width: calc(20% - 24px); flex-shrink: 0; display: flex; justify-content: center; align-items: center; }
.zs-partner-item img { width: 100%; max-width: 200px; height: auto; display: block; object-fit: contain; }
.zs-partner-pagination { display: flex; justify-content: center; gap: 10px; margin-top: 40px; }
.zs-partner-dot { width: 10px; height: 10px; border-radius: 50%; background: #ccc; cursor: pointer; transition: background 0.3s; }
.zs-partner-dot.active { background: var(--color-main); }


@media (max-width: 992px) {
  .zs-about-profile, .zs-about-global, .zs-about-exhibition, .zs-about-certificate, .zs-about-partner { padding: 40px 0; }
  .zs-profile-flex { flex-direction: column; gap: 30px; margin-bottom: 30px; }
  .zs-profile-right { width: 100%; padding: 0; }
  .zs-profile-year { font-size: 80px; }
  .zs-profile-founded { font-size: 24px; }
  .zs-global-content { width: 100%; }
  .zs-exhibition-wrap { flex-direction: column; }
  .zs-exhibition-right { width: 100%; padding: 30px 15px; min-height: auto; }
  .zs-exhibition-text-slider { height: auto; min-height: 500px; }
  .zs-cert-flex { flex-direction: column; }
  .zs-cert-item { min-width: calc(50% - 10px); }
  .zs-partner-item { min-width: calc(33.333% - 20px); }
  .zs-about-banner-title { font-size: 32px; }
  .zs-profile-title, .zs-global-title, .zs-cert-left h2 { font-size: 28px; }
  .zs-about-global{background-position: left;}
}

@media (max-width: 768px) {
  .zs-about-profile, .zs-about-global, .zs-about-exhibition, .zs-about-certificate, .zs-about-partner { padding: 30px 0; }
  .zs-profile-flex { gap: 20px; margin-bottom: 20px; }
  .zs-profile-title { margin-bottom: 15px; }
  .zs-profile-year { font-size: 60px; margin-bottom: 5px; }
  .zs-profile-founded { font-size: 20px; }
  .zs-global-title { margin-bottom: 15px; }
  .zs-global-desc p { margin-bottom: 20px; }
  .zs-exhibition-right { padding: 20px 15px; }
}

@media (max-width: 576px) {
  .zs-partner-item { min-width: calc(50% - 15px); }
}