/* ==========================================================================
   💎 SAiGEN 靜奢風（Quiet Luxury）團隊介紹頁面專屬 CSS 系統
   ========================================================================== */
:root {
  --bs-body-font-family: "Inter", sans-serif;
  --bs-body-bg: #f7f3ee;
  --bs-body-color: #191c1e;
  --color-gold-custom: #f7d5a4;
  --color-navy-dark: #0f1c36;
  --color-bronze-primary: #8c5e3c;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--bs-body-font-family);
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
  line-height: 1.75;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

.font-serif {
  font-family: "Playfair Display", Georgia, serif;
}

/* 頂部沉浸式 Banner */
.about-banner-section {
  position: relative;
  min-height: 420px;
  display: flex;
  align-items: center;
  background-color: var(--color-navy-dark);
  margin-top: 0 !important;
  padding-top: 40px !important;
  padding-bottom: 40px !important;
  overflow: hidden;
}

.banner-bg-wrapper {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}

.banner-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  filter: brightness(1.04) contrast(108%) saturate(95%) hue-rotate(-5deg);
}

.banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(15, 28, 54, 0.9) 0%,
    rgba(15, 28, 54, 0.72) 45%,
    rgba(15, 28, 54, 0.35) 75%,
    rgba(15, 28, 54, 0.1) 100%
  );
  pointer-events: none;
}

.text-shadow-lg {
  text-shadow:
    0 4px 20px rgba(0, 0, 0, 0.95),
    0 2px 6px rgba(0, 0, 0, 0.9);
}
.text-shadow-md {
  text-shadow:
    0 3px 18px rgba(0, 0, 0, 0.9),
    0 1px 5px rgba(0, 0, 0, 0.7);
}

/* 合夥人卡片 */
.partner-card {
  background: #ffffff;
  border: 1px solid rgba(140, 94, 60, 0.15);
  border-radius: 1.25rem;
  padding: 2rem;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 0.5rem 1.5rem rgba(50, 42, 38, 0.04);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.partner-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 1.25rem 2.5rem rgba(114, 91, 56, 0.12);
  border-color: rgba(140, 94, 60, 0.3);
}

.partner-img-wrap {
  width: 100%;
  height: 360px;
  overflow: hidden;
  border-radius: 0.85rem;
  margin-bottom: 1.5rem;
  background-color: #e5e5e5;
}

.partner-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.partner-img-2 {
  object-position: center 25% !important;
}

.partner-card:hover .partner-img-wrap img {
  transform: scale(1.03);
}

/* 探索完整資歷按鈕 */
.btn-explore-profile {
  background-color: transparent;
  color: var(--color-navy-dark);
  border: 1px solid rgba(15, 28, 54, 0.3);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-explore-profile:hover {
  background-color: var(--color-navy-dark);
  color: #ffffff;
  border-color: var(--color-navy-dark);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(15, 28, 54, 0.15);
}

.btn-explore-profile:hover .icon-arrow {
  transform: translateX(4px);
  transition: transform 0.3s ease;
}

.icon-arrow {
  transition: transform 0.3s ease;
}

/* ==========================================================================
   📱✨ 完美適應各裝置的 RWD 彈窗 Modal 系統系統優化
   ========================================================================== */
.saigen-responsive-modal {
  max-width: 720px !important; /* 限制筆電與桌機上的最大寬度，避免過寬 */
  margin: 1.75rem auto;
}

.saigen-modal-content {
  background-color: #ffffff;
  border: 1px solid rgba(140, 94, 60, 0.15);
  box-shadow: 0 20px 50px rgba(15, 28, 54, 0.15) !important;
  max-height: 85vh; /* 確保不超過視窗高度 */
  display: flex;
  flex-direction: column;
}

.saigen-modal-content .modal-body {
  max-height: calc(85vh - 140px); /* 自動計算並支援內部捲軸 */
  overflow-y: auto;
  padding-right: 1rem;
}

/* 自訂內部捲軸美化 */
.saigen-modal-content .modal-body::-webkit-scrollbar {
  width: 6px;
}
.saigen-modal-content .modal-body::-webkit-scrollbar-track {
  background: #f7f3ee;
  border-radius: 3px;
}
.saigen-modal-content .modal-body::-webkit-scrollbar-thumb {
  background: #c8bcb0;
  border-radius: 3px;
}

/* 智庫與準則小卡 */
.thinktank-card,
.principle-card {
  background: #ffffff;
  border: 1px solid rgba(140, 94, 60, 0.15);
  border-radius: 1rem;
  padding: 2rem;
  height: 100%;
  transition: all 0.3s ease;
  box-shadow: 0 0.5rem 1.5rem rgba(50, 42, 38, 0.04);
}

.thinktank-card:hover,
.principle-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 1rem 2rem rgba(114, 91, 56, 0.1);
}

/* CTA 區塊 */
.advisory-cta-section {
    position: relative;
    width: 100%;
    min-height: 480px; 
    background-color: var(--color-navy-dark);
}

@media (min-width: 768px) {
    .advisory-cta-section {
        min-height: 520px;
    }
}

/* 確保背景圖片絕對定位、不變型，並透過微調濾鏡讓畫面更通透高級 */
.advisory-cta-section .position-absolute.inset-0 img.object-fit-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    /* 微調亮度與對比，讓底圖不再死黑或過深，呈現舒適的淡淡質感 */
    filter: brightness(2) contrast(102%) saturate(90%);
}

/* CTA 按鈕高奢質感升級 */
.advisory-cta-btn {
    background-color: #0f1c36;
    border: 1px solid rgba(247, 213, 164, 0.4);
    color: #ffffff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.advisory-cta-btn:hover {
    background-color: #1a2f5a;
    border-color: #f7d5a4;
    color: #f7d5a4;
    transform: translateY(-3px);
    box-shadow: 
        0 0.75rem 2rem rgba(247, 213, 164, 0.25),
        0 4px 15px rgba(0, 0, 0, 0.5);
}/* Back to Top 按鈕 */
.btn-back-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 48px;
  height: 48px;
  background: #0f1c36;
  color: #f7d5a4;
  border: 1px solid rgba(247, 213, 164, 0.3);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 1040;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}
.btn-back-to-top:hover {
  background: #1a2f5a;
  transform: translateY(-3px);
}
.top-arrow-icon {
  width: 18px;
  height: 18px;
}
.top-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1px;
}