/* =========================================================
   Niiice Layout2 — about.css（關於頁專屬，class 前綴 nl2-）
   值全部取自母站 post-24.css / post-388.css / post-1148.css /
   post-470.css / post-16.css（kit），非目測。共用樣式在 base.css，不重複。
   斷點同 base：tablet ≤1024、mobile ≤767
   ========================================================= */

/* Elementor kit-16：區域內 h1-h6 line-height 覆蓋為 1.4em */
.nl2-about :is(h1, h2, h3, h4, h5, h6) { line-height: 1.4em; }

/* ---------- 0. 頁首 banner ----------
   母站 #2d2bc14：overlay 0.2 但無背景圖 → 視覺純色（CAPTURE 附錄 5），不套 cover/overlay。
   #a4b654f：row、space-between、align flex-end、margin-bottom 48（手機 24）。
   breadcrumb widget（#cb6cd85）margin-bottom = kit 24px。 */
.nl2-about__banner-inner {
  padding-bottom: 48px; /* 覆蓋 base 24px — 母站桌機 48px */
}
.nl2-about__breadcrumbs {
  color: var(--color-text);
  margin-bottom: 24px; /* kit-widget-spacing 24px（#cb6cd85） */
}
.nl2-about__breadcrumbs a { color: var(--color-text); }
.nl2-about__breadcrumbs a:hover { color: var(--color-accent-hover); }
.nl2-about__crumb-sep { margin: 0 8px; } /* Blocksy ct-separator */

/* ---------- 通用：文字+箭頭按鈕（母站 button 內容 row-reverse、gap 8px）----------
   母站箭頭為 inline SVG（↗ 斜向箭頭）；workspace 前端禁令禁 SVG icon，
   改以文字箭頭 U+2197 等價呈現（視覺語意一致）。gap 8px 已在 .niiice-btn。 */
.nl2-btn-arrow__icon {
  font-size: 12px;
  line-height: 1;
}

/* ---------- 1. Intro（母站 #5a35dca）----------
   兩欄 row、align center、gap 102px（tablet 64、mobile 24）、margin 80px 上下。 */
.nl2-intro {
  display: flex;
  align-items: center;
  gap: 102px;
  margin-top: 80px;
  margin-bottom: 80px;
}
/* 左欄 60%（#12264cc：column、gap 24） */
.nl2-intro__text {
  flex: 0 0 60%;
  max-width: 60%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.nl2-intro__title { color: var(--palette-4); }
/* intro-content（#40a2d02）：字 palette-3、margin-bottom = kit 24 + 24 = 48px、lh 1.8em（kit text） */
.nl2-intro__content {
  color: var(--palette-3);
  line-height: 1.8em;
  margin-bottom: 48px;
}
/* 右欄 40%（#beb27be） */
.nl2-intro__media {
  flex: 0 0 40%;
  max-width: 40%;
  min-width: 0;
}
.nl2-intro__img { width: 100%; }

/* ---------- 2. Advantages ----------
   母站 #19d6b9a：上緣 1px hairline（base .niiice-hairline-top）。
   #2b1277d：margin-top 80（手機 48）、gap 12。
   #6308c05 h2：margin-bottom = kit 24 + 40 = 64px（手機 kit 24 + 0 = 24px）。
   #72631a1 listing：單欄、下緣 1px hairline。 */
.nl2-adv__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-top: 80px;
}
.nl2-adv__subtitle { margin-bottom: 64px; }
.nl2-adv__list {
  width: 100%;
  border-bottom: var(--hairline);
}

/* 優勢卡（模板 388 / 鏡像 1148）：row、gap 0、兩欄各 50%、padding 48（tablet 24）。
   邊框拼合成連續格線：圖欄 上右左 1px、文欄 上右 1px（左由圖欄右框補）；
   鏡像時左右互換（文欄 上右左、圖欄 上右）。卡片間共用 1px（下框省略、靠下一張上框）。 */
.nl2-adv-card { display: flex; }
.nl2-adv-card__media,
.nl2-adv-card__body {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 48px;
  border-style: solid;
  border-color: var(--palette-5);
}
.nl2-adv-card__media { border-width: 1px 1px 0 1px; }
.nl2-adv-card__body {
  border-width: 1px 1px 0 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
/* 鏡像卡（奇數 index：文左圖右） */
.nl2-adv-card.is-mirror { flex-direction: row-reverse; }
.nl2-adv-card.is-mirror .nl2-adv-card__media { border-width: 1px 1px 0 0; }
.nl2-adv-card.is-mirror .nl2-adv-card__body { border-width: 1px 1px 0 1px; }

.nl2-adv-card__img { width: 100%; }

/* 大編號（#b283736 / #81091df）：48px w300 palette-5；正常靠右、鏡像靠左；手機 32px */
.nl2-adv-card__num {
  display: block;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.4em;
  color: var(--palette-5);
  text-align: right;
}
.nl2-adv-card.is-mirror .nl2-adv-card__num { text-align: left; }

/* 文字組（#e43c75b：column、gap 12） */
.nl2-adv-card__text {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.nl2-adv-card__title { color: var(--palette-4); }

/* ---------- 3. Awards ----------
   標題組 #a5778ca：margin-top 80（手機 48）、gap 12；
   h2 #01665e8 margin-bottom = kit 24 + 40 = 64px（手機 kit 24 + 0 = 24px）。
   手風琴容器 #2be760e：margin-bottom 104（手機 0）。 */
.nl2-award-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-top: 80px;
}
.nl2-award-head__subtitle { margin-bottom: 64px; }
.nl2-award-acc { margin-bottom: 104px; }

/* 手風琴標籤：母站走 Elementor primary 18px（base 通用 20px → 依母站覆蓋回 18px） */
.nl2-award-acc__label {
  font-size: var(--typo-primary-fs);   /* 18px */
  line-height: var(--typo-primary-lh); /* 1.8em */
}

/* 手風琴內容（模板 470）：row、align center、gap 64（手機 48）；左 80% / 右 20% */
.nl2-award-acc__row {
  display: flex;
  align-items: center;
  gap: 64px;
}
.nl2-award-acc__main {
  flex: 0 0 80%;
  max-width: 80%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
/* award-note（#574c62a：heading widget 無自訂樣式 → body 16px、標題色） */
.nl2-award-acc__note {
  font-size: 16px;
  color: var(--palette-4);
}
/* award-description（#00b27b1）：字 palette-3、margin-bottom = kit 24 + 24 = 48px、lh 1.8em */
.nl2-award-acc__desc {
  color: var(--palette-3);
  line-height: 1.8em;
  margin-bottom: 48px;
}
/* 右欄 20%（#0f0bdeb） */
.nl2-award-acc__media {
  flex: 0 0 20%;
  max-width: 20%;
  min-width: 0;
}
.nl2-award-acc__img { width: 100%; }

/* =========================================================
   RWD
   ========================================================= */
@media (max-width: 1024px) {
  /* intro gap 102 → 64（#5a35dca tablet） */
  .nl2-intro { gap: 64px; }
  /* 優勢卡 padding 48 → 24（模板 388/1148 tablet） */
  .nl2-adv-card__media,
  .nl2-adv-card__body { padding: 24px; }
}

@media (max-width: 767px) {
  /* banner inner margin-bottom 48 → 24（#a4b654f mobile） */
  .nl2-about__banner-inner { padding-bottom: 24px; }
  /* breadcrumb 手機 100% 寬（#cb6cd85 mobile） */
  .nl2-about__breadcrumbs { width: 100%; }

  /* intro：gap 24、兩欄改直向 100%（--flex-wrap-mobile:wrap） */
  .nl2-intro {
    flex-direction: column;
    gap: 24px;
  }
  .nl2-intro__text,
  .nl2-intro__media {
    flex: 1 1 auto;
    max-width: 100%;
    width: 100%;
  }

  /* advantages：margin-top 80 → 48（#2b1277d mobile）、h2 下距 64 → 24 */
  .nl2-adv__inner { margin-top: 48px; }
  .nl2-adv__subtitle { margin-bottom: 24px; }

  /* 優勢卡直向：圖一律在上（母站 order start hack）、兩欄全框 上右左 1px */
  .nl2-adv-card,
  .nl2-adv-card.is-mirror { flex-direction: column; }
  .nl2-adv-card__media,
  .nl2-adv-card__body {
    flex: 1 1 auto;
    max-width: 100%;
    border-width: 1px 1px 0 1px;
  }
  .nl2-adv-card.is-mirror .nl2-adv-card__media,
  .nl2-adv-card.is-mirror .nl2-adv-card__body { border-width: 1px 1px 0 1px; }
  .nl2-adv-card__media { order: -1; }
  /* 大編號 48 → 32px（#b283736 mobile） */
  .nl2-adv-card__num { font-size: 32px; }

  /* awards：標題組 margin-top 80 → 48、h2 下距 64 → 24、手風琴容器 margin-bottom 104 → 0 */
  .nl2-award-head { margin-top: 48px; }
  .nl2-award-head__subtitle { margin-bottom: 24px; }
  .nl2-award-acc { margin-bottom: 0; }

  /* 手風琴內容：gap 64 → 48、直向、圖 100%（#689970c / #0f0bdeb mobile） */
  .nl2-award-acc__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 48px;
  }
  .nl2-award-acc__main,
  .nl2-award-acc__media {
    flex: 1 1 auto;
    max-width: 100%;
    width: 100%;
  }
}
