/* =========================================================
   Niiice Layout2 — home.css（首頁專屬樣式）
   值出處：CAPTURE_REPORT §2 首頁 + capture 原檔
   post-10.css（頁面容器）/ post-100.css（hero slide 模板）/
   post-960.css（服務手風琴內容）/ post-1042.css（news 列模板）。
   共用元件（按鈕 / chip / 手風琴 / case / slider / reveal / scrim）已在 base.css，不重複。
   class 前綴：.niiice-home-*（避免互撞）
   斷點同 base.css：tablet ≤1024px、mobile ≤767px
   ========================================================= */

/* =========================================================
   ① Hero 輪播（post-100.css #63c126e / #7a58db9 / #fadfde2 / #235bcf9）
   slide：bg cover center + palette-4 overlay 0.2（base .niiice-overlay-20）+ 底部 scrim
   內欄：桌機 50%（tablet 80%、mobile 100%）、min-height 70vh（mobile 480px）、justify space-between
   ========================================================= */
.niiice-home-hero__slide {
  display: flex;
  flex-direction: column;
  justify-content: space-around; /* #63c126e --justify-content:space-around */
}
.niiice-home-hero__inner {
  width: 50%;
  min-height: var(--hero-min-h); /* 70vh */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
/* hs-title：bbd15a7 同組（DM Sans 14px w300 uppercase）+ 白字、margin-top 72px */
.niiice-home-hero__title {
  display: block;
  font-size: var(--eyebrow-fs);
  font-weight: var(--eyebrow-fw);
  letter-spacing: var(--ls-typo);
  text-transform: uppercase;
  color: var(--color-white);
  margin-top: 72px;
}
/* hs-description：secondary 14px lh1.6 白字、margin-bottom 72px */
.niiice-home-hero__desc {
  font-size: var(--typo-secondary-fs);
  line-height: var(--typo-secondary-lh);
  letter-spacing: var(--ls-typo);
  color: var(--color-white);
  margin-bottom: 72px;
}

/* =========================================================
   ② Intro（post-10.css #fb89740 / #420bf01 / #52a051d / #742b857）
   ========================================================= */
.niiice-home-intro {
  border-bottom: var(--hairline); /* 區塊下緣 1px（#fb89740） */
}
.niiice-home-intro__row {
  display: flex;
  padding: 64px 0;
  border-left: var(--hairline);  /* #420bf01 border 0 1px 0 1px */
  border-right: var(--hairline);
}
.niiice-home-intro__left {
  flex: 0 0 30%;
  margin: 0 64px;
  border-right: var(--hairline);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  min-width: 0;
}
.niiice-home-intro__right {
  flex: 1 1 auto;
  margin-right: 160px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px; /* --kit-widget-spacing */
  min-width: 0;
}

/* =========================================================
   區塊標題列共用骨架（services / projects / news：左右各 50%）
   ========================================================= */
.niiice-home-sechead--services {
  margin: 104px 0 24px; /* #9e58118 */
}
.niiice-home-sechead__row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end; /* projects / news（#af291dc / #9b21f83） */
  gap: 24px;
}
.niiice-home-sechead__row--center { align-items: center; } /* services（#9e58118 --align-items:center） */
.niiice-home-sechead__left {
  flex: 0 0 50%;
  display: flex;
  flex-direction: column;
  gap: 8px; /* eyebrow 與 h2 間距（#4ec1a00 --gap:8px） */
  min-width: 0;
}
.niiice-home-sechead__right {
  flex: 1 1 auto;
  min-width: 0;
}
.niiice-home-sechead__right--btn {
  display: flex;
  justify-content: flex-end; /* 「更多」鈕靠右（#820c5a7 align flex-end） */
}
.niiice-home-sechead__desc {
  font-size: var(--typo-text-fs);
  line-height: var(--typo-text-lh);
  letter-spacing: var(--ls-typo);
}
.niiice-home-sechead__desc--dark { color: var(--palette-4); } /* project-description（#d4cdff6） */

/* =========================================================
   ④ Services 手風琴內容（post-960.css #3a24abc / #f5d2497 / #37abdbc）
   標籤列 / 分隔線 / 40px padding / +x icon = base.css 通用手風琴
   ========================================================= */
.niiice-home-svc__row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 48px;
}
.niiice-home-svc__info {
  flex: 0 0 40%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  min-width: 0;
}
.niiice-home-svc__desc {
  font-size: var(--typo-secondary-fs);
  line-height: var(--typo-secondary-lh);
  letter-spacing: var(--ls-typo);
}
.niiice-home-svc__media {
  width: 60%;
  max-width: 60%;
}
.niiice-home-svc__img { width: 100%; }

/* =========================================================
   ⑤ Projects（post-10.css #ae8c15d / #9379433）
   ========================================================= */
.niiice-home-projects {
  margin: 104px 0; /* #ae8c15d */
}
.niiice-home-projects__carousel {
  position: relative;
  margin-top: 64px; /* 區塊內部 gap 64（#ae8c15d --gap:64px） */
}
.niiice-home-projects__viewport { overflow: hidden; }
.niiice-home-projects__track {
  display: flex;
  transition: transform .5s ease; /* speed 500ms */
}
/* 4 欄、gap 48（--swiper-slides-to-display:4 / --swiper-slides-gap:48px） */
.niiice-home-projects__item {
  flex: 0 0 calc((100% - 144px) / 4);
  margin-right: 48px;
  min-width: 0;
}
/* 箭頭：外側 -16px、深底半透明方塊（#9379433；bg/hover 在 base .niiice-slider__arrow--boxed） */
.niiice-home-projects__carousel .niiice-slider__arrow {
  font-size: 16px; /* --arrow-size:16px */
  padding: 8px;
}
.niiice-home-projects__arrow--prev { left: -16px; }
.niiice-home-projects__arrow--next { right: -16px; }

/* 專案卡（loop 卡模板 259；CAPTURE §2-5 / ④） */
.niiice-home-card {
  display: flex;
  flex-direction: column;
  gap: 24px; /* --kit-widget-spacing */
}
.niiice-home-card__media {
  position: relative;
  display: block;
}
.niiice-home-card__chip {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}
.niiice-home-card__img {
  display: block;
  width: 100%;
  height: var(--project-card-img-h); /* 264px object-fit cover */
  object-fit: cover;
}
.niiice-home-card__title {
  font-size: var(--typo-text-fs);   /* 16px「text」 */
  line-height: var(--typo-text-lh); /* 1.8em */
  font-weight: 400;
}
.niiice-home-card__title a { color: var(--palette-4); }
.niiice-home-card__title a:hover { color: var(--color-accent-hover); }

/* =========================================================
   ⑥ Case-accordion（post-10.css #3cf58d7 / #6881d0d）
   骨架 / 遮罩 / hover 展開 / 高度變數在 base.css .niiice-case
   ========================================================= */
/* 外框上下 1px + padding 16px（#3cf58d7）；列高 480 為內容高 → 總高補 padding */
.niiice-home-case .niiice-case {
  padding: 16px;
  height: calc(var(--case-h) + 32px);
}
.niiice-home-case .niiice-case__content { gap: 0; }
/* title：primary 18px、margin-bottom 4px（#6881d0d .jet-image-accordion__title） */
.niiice-home-case__title {
  color: var(--color-white);
  font-size: var(--typo-primary-fs);
  line-height: var(--typo-primary-lh);
  letter-spacing: var(--ls-typo);
  font-weight: 400;
  margin-bottom: 4px;
}
/* desc：secondary 14px 白字 */
.niiice-home-case__desc {
  font-size: var(--typo-secondary-fs);
  line-height: var(--typo-secondary-lh);
  letter-spacing: var(--ls-typo);
  color: var(--color-white);
}
/* 鈕：margin-top 24px；desc / 鈕僅 active 顯示（title-display on_both_states → 標題兩態皆顯示） */
.niiice-home-case__btn {
  margin-top: 24px;
  font-size: var(--typo-secondary-fs);
  letter-spacing: var(--ls-typo);
}
.niiice-home-case .niiice-case__content > .niiice-home-case__desc,
.niiice-home-case .niiice-case__content > .niiice-home-case__btn {
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease, visibility .5s ease;
}
.niiice-home-case .niiice-case__item.is-active .niiice-home-case__desc,
.niiice-home-case .niiice-case__item.is-active .niiice-home-case__btn {
  opacity: 1;
  visibility: visible;
}

/* =========================================================
   ⑦ 最新消息（post-10.css #d393d06 / #dc999fd + post-1042.css 列模板）
   ========================================================= */
.niiice-home-news {
  margin: 104px 0; /* #d393d06 */
}
.niiice-home-news__list {
  margin-top: 56px; /* 區塊內部 gap 56（#d393d06 --gap:56px） */
  display: flex;
  flex-direction: column;
  gap: 48px; /* 列距 48（#dc999fd item padding 48/2 上下） */
}
.niiice-home-news__row {
  display: flex;
  align-items: center;
  gap: 24px;
}
/* 分類 chip：palette-7 底、4px 16px、1px 框、radius 80、14px、hover palette-6（post-1042 #9f01f89） */
.niiice-home-news__chip {
  display: inline-block;
  font-size: var(--typo-secondary-fs);
  line-height: var(--typo-secondary-lh);
  letter-spacing: var(--ls-typo);
  color: var(--palette-3);
  background: var(--palette-7);
  border: var(--hairline);
  border-radius: var(--radius-pill-lg);
  padding: 4px 16px;
  white-space: nowrap;
  transition: background-color .2s ease;
}
.niiice-home-news__chip:hover {
  background: var(--palette-6);
  color: var(--palette-3);
}
.niiice-home-news__title {
  font-size: var(--fs-h4); /* h4 16px */
  font-weight: 400;
  min-width: 0;
}
.niiice-home-news__title a { color: var(--palette-4); }
.niiice-home-news__title a:hover { color: var(--color-accent-hover); }

/* =========================================================
   ⑧ CTA（post-10.css #829792d / #21e6bf0 / #e42020e）
   ========================================================= */
.niiice-home-cta {
  min-height: var(--cta-min-h); /* 80vh */
  display: flex;
  flex-direction: column;
  justify-content: flex-end; /* 內容沉底 */
}
.niiice-home-cta__row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 80px; /* #21e6bf0 */
  gap: 24px;
}
.niiice-home-cta__left {
  flex: 0 0 50%;
  display: flex;
  flex-direction: column;
  gap: 16px; /* #454ec7f --gap:16px */
  min-width: 0;
}
.niiice-home-cta__title { color: var(--color-white); } /* h2 22px 白（#32a85d5） */
.niiice-home-cta__desc {
  color: var(--color-white); /* #bc5955f */
  font-size: var(--typo-text-fs);
  line-height: var(--typo-text-lh);
  letter-spacing: var(--ls-typo);
}
.niiice-home-cta__right {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end; /* 鈕靠右（#f40356d align flex-end） */
}
/* CTA 鈕：border none、其餘同 kit 預設（#e42020e border-style:none） */
.niiice-home-cta__btn { border: 0; }

/* =========================================================
   RWD — tablet ≤1024px（post-10 / post-100 @1024 值）
   ========================================================= */
@media (max-width: 1024px) {
  .niiice-home-hero__inner { width: 80%; } /* #7a58db9 tablet 80% */
  .niiice-home-intro__left { margin: 0 48px; }   /* #52a051d */
  .niiice-home-intro__right { margin-right: 48px; } /* #742b857 */
  .niiice-home-projects__item { flex-basis: calc((100% - 48px) / 2); } /* 2 欄 */
  .niiice-home-case .niiice-case { height: calc(var(--case-h-t) + 32px); } /* 320px + padding */
}

/* =========================================================
   RWD — mobile ≤767px（post-10 / post-100 @767 值）
   ========================================================= */
@media (max-width: 767px) {
  /* hero：欄寬 100%、min-height 480px、上下 48px */
  .niiice-home-hero__inner {
    width: 100%;
    min-height: var(--hero-min-h-m);
  }
  .niiice-home-hero__title { margin-top: 48px; }
  .niiice-home-hero__desc { margin-bottom: 48px; }

  /* intro：直排、padding 48、gap 24（#420bf01 mobile） */
  .niiice-home-intro__row {
    flex-direction: column;
    padding: 48px 0;
    gap: 24px;
  }
  .niiice-home-intro__left {
    flex: 1 1 auto;
    margin: 0;
    border-right: 0;
  }
  .niiice-home-intro__right {
    margin-right: 0;
  }

  /* 標題列直排；h2 補 24px padding + 底線（#3b6109c / #7541158 / #99fdde7 mobile；news h2 無底線） */
  .niiice-home-sechead--services { margin: 80px 0 24px; } /* #9e58118 mobile margin-top 80 */
  .niiice-home-sechead__row {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
  }
  .niiice-home-sechead__left,
  .niiice-home-sechead__right { flex: 1 1 auto; width: 100%; }
  .niiice-home-h2-line {
    padding-bottom: 24px;
    border-bottom: var(--hairline);
  }
  .niiice-home-sechead__right--btn { justify-content: flex-start; }

  /* 服務手風琴內容：gap 24、圖 100%（post-960 mobile） */
  .niiice-home-svc__row {
    flex-wrap: wrap;
    gap: 24px;
  }
  .niiice-home-svc__info { flex: 1 1 100%; }
  .niiice-home-svc__media { width: 100%; max-width: 100%; }

  /* projects：margin 48/80、1 欄、箭頭 -8px（#ae8c15d / #9379433 mobile） */
  .niiice-home-projects { margin: 48px 0 80px; }
  .niiice-home-projects__carousel { margin-top: 24px; } /* 區塊 gap 64 → 24 */
  .niiice-home-projects__item { flex-basis: 100%; }
  .niiice-home-projects__arrow--prev { left: -8px; }
  .niiice-home-projects__arrow--next { right: -8px; }

  /* case：直向 total 400 + padding、item 間距 8（#6881d0d mobile margin 8/2） */
  .niiice-home-case .niiice-case {
    height: calc(var(--case-total-h-m) + 32px);
    gap: 8px;
  }

  /* news：margin 48/80、gap 24、「更多」鈕隱藏（#d393d06 / #820c5a7 elementor-hidden-mobile） */
  .niiice-home-news { margin: 48px 0 80px; }
  .niiice-home-news__list { margin-top: 24px; }
  .niiice-home-news__more { display: none; }
  .niiice-home-news__row {
    flex-wrap: wrap;
    gap: 16px 24px; /* post-1042 mobile --gap:16px 24px */
  }
  .niiice-home-news__title { width: 100%; } /* post-1042 mobile #8cc7469 width 100% */

  /* CTA：min-height 70vh、內容列 gap 8 / margin-bottom 24（#829792d / #21e6bf0 mobile） */
  .niiice-home-cta { min-height: var(--cta-min-h-m); }
  .niiice-home-cta__row {
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
  }
  .niiice-home-cta__left { flex: 1 1 100%; }
  .niiice-home-cta__right {
    flex: 1 1 100%;
    justify-content: flex-start; /* #f40356d mobile align flex-start */
  }
}

/* 首頁專案卡：描述段（母站實況為描述非日期，2026-07-07 P4 驗收修正） */
.niiice-home-card__desc {
  font-size: 14px;
  color: var(--palette-3);
  line-height: 1.8em;
  margin: 8px 0 16px;
}
