/* =========================================================
   Section 6：00757分割（ETF分割說明／影音專區／懶人包及QA下載）
   新增檔案，所有樣式皆以 .section-6 / .s6- 為前綴，不影響既有樣式
   ========================================================= */

.section-6 {
  --s6-navy: #2d3192;
  --s6-blue: #0165e9;
  --s6-ink: #231814;
  --s6-text: #333;
  --s6-tab-bg: #e7f2fe;
  --s6-tab-line: #c9e3ff;
  --s6-soft: #eff7ff;
  --s6-gold: linear-gradient(90deg, #f0d26f 0%, #e09f35 13.9%, #f8eaaf 33.2%, #fff9c7 47.1%, #f7e9ad 58.2%, #e5b845 76.9%, #f7dd78 100%);
  --s6-gold-btn: linear-gradient(90deg, #f0d26f 0%, #c1892f 13.9%, #f8eaaf 33.2%, #fff9c7 43.3%, #f7e9ad 57.2%, #d9b04e 79.8%, #f7dd78 100%);
  --s6-gold-frame: linear-gradient(210deg, #e6cc80 0%, #bf8311 17%, #fff7c2 42%, #f9df7b 67%, #bf8311 100%);

  position: relative;
  overflow: hidden;
  padding: 100px 20px 100px;
  background-color: #000082;
  background-image: url('../images/s6-bg.jpg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: 1920px auto;
  font-family: 'Noto Sans TC', sans-serif;
  color: var(--s6-text);
  scroll-margin-top: 80px;
}

@media screen and (min-width: 1921px) {
  .section-6 { background-size: 100% auto; }
}

.section-6 *,
.section-6 *::before,
.section-6 *::after { box-sizing: border-box; }

.section-6 h2,
.section-6 h3,
.section-6 p,
.section-6 ul,
.section-6 figure { margin: 0; padding: 0; }

.s6-sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

.s6-container {
  position: relative;
  max-width: 1040px;
  margin: 0 auto;
}
.s6-container--video { margin-top: 81px; }
.s6-container--download { margin-top: 80px; }

/* ---------- 區塊標題 ---------- */
.s6-head {
  position: relative;
  text-align: center;
  color: #fff;
}
.s6-title {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 48px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 1px;
  color: #fff;
}
.s6-dot {
  flex: none;
  width: 16px; height: 16px;
  border-radius: 50%;
  border: 2px solid transparent;
  background:
    linear-gradient(140deg, #f9cc64 0%, #faf9f1 27%, #f9c756 92%) padding-box,
    linear-gradient(315deg, #bf8311 0%, #f9df7b 26%, #fff7c2 43%, #bf8311 73%, #e6cc80 100%) border-box;
}
.s6-subtitle {
  margin-top: 26px !important;
  font-size: 24px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 1px;
}
.s6-head--split { margin-bottom: 48px; }
.s6-head--video { margin-bottom: 64px; }
.s6-head--download { margin-bottom: 64px; }

.s6-head-deco {
  position: absolute;
  pointer-events: none;
  z-index: 1;
}
.s6-head-deco--split { left: calc(50% + 195px); top: -27px; width: 330px; height: 240px; overflow: hidden; }
.s6-head-deco--video { left: calc(50% + 219px); top: -10px; width: 278px; }
.s6-mascot-top { position: absolute; left: 125px; top: 31px; width: 195px; height: auto; }
.s6-mascot-video { display: block; width: 278px; height: auto; }

/* ---------- POPUP ---------- */
.s6-bubble {
  position: absolute;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
}
.s6-bubble::after {
  content: '';
  position: absolute;
  width: 0; height: 0;
  border-style: solid;
}
.s6-bubble--top,
.s6-bubble--download {
  padding: 10px 18px;
  background: #fff;
  color: var(--s6-navy);
  border-radius: 100px;
  filter: drop-shadow(2px 2px 3px rgba(1, 101, 233, .25));
}
.s6-bubble--top { left: 0; top: 10px; padding: 12px 22px; transform: rotate(-5deg); }
.s6-bubble--top::after {
  right: 16px; bottom: -8px;
  border-width: 14px 0 0 18px;
  border-color: #fff transparent transparent transparent;
  transform: rotate(-20deg);
}
.s6-bubble--blue {
  left: 0; top: 56px;
  width: 170px;
  padding: 18px 8px;
  border-radius: 40px;
  color: #fff;
  font-size: 15px;
  background: linear-gradient(180deg, #007ffe 0%, #0042e5 100%);
  filter: drop-shadow(2px 2px 3px rgba(1, 101, 233, .25));
  z-index: 1;
}
.s6-bubble--blue::after {
  left: 50%; bottom: -11px;
  margin-left: -9px;
  border-width: 12px 9px 0 9px;
  border-color: #0042e5 transparent transparent transparent;
}

/* ---------- Tabs ---------- */
.s6-tabs {
  position: relative;
  z-index: 2;
}
.s6-tab-menu {
  display: flex;
  padding: 0 20px;
  position: relative;
  z-index: 2;
}
.s6-tab {
  flex: 1 1 0;
  min-width: 0;
  height: 56px;
  margin: 0;
  padding: 0 8px;
  border: 1px solid var(--s6-tab-line);
  border-bottom: 0;
  border-radius: 20px 20px 0 0;
  background: var(--s6-tab-bg);
  color: var(--s6-navy);
  font-family: inherit;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .5px;
  cursor: pointer;
  transition: background-color .2s, color .2s;
  -webkit-appearance: none;
  appearance: none;
}
.s6-tab:hover { background: #fff; }
.s6-tab.is-active {
  border-color: transparent;
  background: var(--s6-gold);
  color: var(--s6-ink);
}
.s6-tab:focus-visible {
  outline: 3px solid #ffc700;
  outline-offset: -3px;
}

/* ---------- 卡片 ---------- */
.s6-card {
  position: relative;
  border-radius: 20px;
  border: 1px solid #e0effd;
  background: #fff;
  box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
  padding: 40px 30px 30px;
  margin-top: -1px;
  z-index: 3;
}
.s6-panel[hidden] { display: none !important; }
.s6-panel.is-active { animation: s6-fade .35s ease; }
@keyframes s6-fade { from { opacity: 0; } to { opacity: 1; } }

.s6-coming {
  padding: 120px 0;
  text-align: center;
  color: var(--s6-navy);
  font-size: 20px;
  font-weight: 700;
}

/* ---------- Tab 1：ETF分割是什麼 ---------- */
.s6-intro {
  padding: 0 17px;
  font-size: 18px;
  line-height: 2;
  color: var(--s6-text);
  text-align: justify;
}
.s6-intro strong { font-weight: 700; }

.s6-diagram {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 33px;
}

.s6-diagram-mascot {
  position: relative;
  flex: none;
  width: 175px;
  height: 269px;
  margin-right: 18px;
}
.s6-mascot-search {
  position: absolute;
  left: 10px; bottom: 0;
  width: 128px; height: auto;
}

.s6-diagram-flow {
  display: flex;
  align-items: flex-start;
}

.s6-asset { text-align: center; }
.s6-asset figcaption { display: block; margin-top: 2px; }
.s6-asset-label {
  display: block;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  color: var(--s6-text);
}
.s6-asset-value {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-top: 2px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  color: var(--s6-navy);
}
.s6-badge {
  display: inline-block;
  padding: 1px 4px 2px 4px;
  border-radius: 4px;
  background: #eba937;
  color: #fff;
  font-style: normal;
  font-size: 14px;
  line-height: 22px;
}
.s6-asset--after .s6-asset-value { margin-left: 42px; }

.s6-coin,
.s6-pie {
  position: relative;
  margin: 0 auto;
}
.s6-coin { width: 186px; }
.s6-pie { width: 183px; }
.s6-coin img,
.s6-pie img { display: block; width: 100%; height: auto; }

.s6-coin-text {
  position: absolute;
  left: 0; right: 0; top: 50%;
  transform: translateY(-50%);
  color: #fff;
  font-size: 18px;
  line-height: 24px;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0, 40, 140, .4);
}
.s6-pie-num {
  position: absolute;
  transform: translate(-50%, -50%);
  color: #fff;
  font-family: Rubik, 'Noto Sans TC', sans-serif;
  font-size: 15px;
  line-height: 1;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0, 40, 140, .5);
}

.s6-scenario {
  flex: none;
  width: 152px;
  padding-top: 4px;
  text-align: center;
}
.s6-scenario-tag {
  display: inline-block;
  min-width: 72px;
  padding: 0 14px;
  border-radius: 17px;
  background: var(--s6-navy);
  color: #fff;
  font-size: 16px;
  line-height: 33px;
  font-weight: 700;
}
.s6-scenario-text {
  margin-top: 8px !important;
  color: var(--s6-navy);
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
}
.s6-scenario-text strong {
  font-family: Rubik, 'Noto Sans TC', sans-serif;
  font-size: 20px;
  font-weight: 700;
}
.s6-scenario-arrow {
  display: block;
  width: 18px; height: 37px;
  margin: 12px auto 0;
  background: linear-gradient(180deg, rgba(235, 169, 55, .05) 0%, #eba937 20%, #eba937 80%, rgba(235, 169, 55, .05) 100%);
  clip-path: polygon(0 0, 100% 52%, 0 100%, 22% 52%);
}

.s6-checklist {
  flex: none;
  list-style: none;
  width: 162px;
  margin: 27px 0 0 18px !important;
  padding: 13px 10px 13px !important;
  border-radius: 12px;
  background: var(--s6-soft);
}
.s6-checklist li {
  position: relative;
  padding-left: 37px;
  color: var(--s6-navy);
  font-size: 17px;
  line-height: 44px;
  font-weight: 700;
  white-space: nowrap;
}
.s6-checklist li::before {
  content: '';
  position: absolute;
  left: 0; top: 50%;
  width: 27px; height: 26px;
  margin-top: -13px;
  background: url('../images/s6-check.png') no-repeat 50% 50% / contain;
}

.s6-note {
  position: relative;
  padding: 18px 25px 18px 55px;
  border-radius: 12px;
  background: var(--s6-soft);
}
.s6-note::before {
  content: 'i';
  position: absolute;
  left: 22px; top: 21px;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--s6-blue);
  color: #fff;
  font-family: Georgia, serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  text-align: center;
}
.s6-note p {
  color: #444;
  font-size: 15px;
  line-height: 26px;
  text-align: justify;
}
.s6-note strong { font-weight: 700; }

/* ---------- 影音專區 ---------- */
.s6-card--video {
  padding: 30px 89px;
  background: linear-gradient(180deg, #f4f9fd 0%, #cde6fc 100%);
  overflow: hidden;
}
.s6-card--video::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../images/s6-video-deco.svg') no-repeat 100% 100% / cover;
  pointer-events: none;
}
.s6-video {
  position: relative;
  z-index: 1;
  aspect-ratio: 16 / 9;
  padding: 5px;
  border-radius: 36px;
  background: var(--s6-gold-frame);
  box-shadow: 0 0 6px rgba(255, 233, 160, .8);
}
.s6-video-inner {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 31px;
  overflow: hidden;
  background: #b3b3b3;
  -webkit-mask-image: -webkit-radial-gradient(white, black); /* Safari 圓角裁切 */
}
.s6-video iframe,
.s6-video-poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.s6-video-poster {
  display: block;
  padding: 0;
  margin: 0;
  background: #000 no-repeat 50% 50% / cover;
  cursor: pointer;
}
.s6-video-poster::after {
  content: '';
  position: absolute;
  left: 50%; top: 50%;
  width: 84px; height: 60px;
  margin: -30px 0 0 -42px;
  border-radius: 16px;
  background: #f00 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M8 5v14l11-7z'/%3E%3C/svg%3E") no-repeat 54% 50% / 36px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
  transition: transform .2s;
}
.s6-video-poster:hover::after { transform: scale(1.08); }
.s6-video-soon {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
}
.s6-video-soon strong {
  font-size: 40px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 2px;
}
.s6-video-soon small {
  margin-top: 4px;
  font-family: Rubik, sans-serif;
  font-size: 14px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, .85);
}

/* ---------- 懶人包及QA下載 ---------- */
.s6-download {
  position: relative;
  max-width: 659px;
  margin: 0 auto;
}
.s6-download-btns {
  display: flex;
  gap: 19px;
  position: relative;
  z-index: 2;
}
.s6-download-btn {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  gap: 22px;
  height: 150px;
  padding: 0 20px 0 25px;
  border-radius: 12px;
  background: var(--s6-gold-btn);
  box-shadow:
    0 5px 15px rgba(0, 0, 0, .3),
    2px 2px 10px rgba(0, 36, 83, .4),
    inset 0 -4px 4px rgba(255, 255, 255, .25);
  color: var(--s6-ink);
  font-size: 28px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .2s, box-shadow .2s;
}
.s6-download-btn img { flex: none; width: 108px; height: auto; }
.s6-download-btn:hover {
  transform: translateY(-3px);
  box-shadow:
    0 10px 20px rgba(0, 0, 0, .35),
    2px 2px 10px rgba(0, 36, 83, .4),
    inset 0 -4px 4px rgba(255, 255, 255, .25);
}
.s6-download-deco {
  position: absolute;
  left: calc(50% + 285px);
  top: -123px;
  width: 210px;
  pointer-events: none;
  z-index: 3;
}
.s6-mascot-download { display: block; width: 208px; height: auto; }
.s6-bubble--download {
  left: -36px; top: -24px;
  padding: 12px 20px;
  transform: rotate(-9deg);
}
.s6-bubble--download::after {
  right: 14px; bottom: -8px;
  border-width: 14px 0 0 18px;
  border-color: #fff transparent transparent transparent;
  transform: rotate(-20deg);
}

/* =========================================================
   RWD
   ========================================================= */

/* 1199 以下：裝飾公仔往內收 */
@media screen and (max-width: 1199px) {
  .s6-head-deco--split { left: auto; right: -10px; top: -12px; transform: scale(.85); transform-origin: 100% 0; }
  .s6-head-deco--video { left: auto; right: 0; }
  .s6-diagram-mascot { width: 160px; margin-right: 6px; }
  .s6-checklist { margin-left: 8px !important; }
}

/* 平板 991 以下 */
@media screen and (max-width: 991px) {
  .section-6 { padding: 80px 20px 80px; scroll-margin-top: 70px; }
  .s6-title { font-size: 40px; }
  .s6-subtitle { font-size: 20px; margin-top: 16px !important; }
  .s6-head--split { margin-bottom: 40px; padding-right: 120px; padding-left: 120px; }
  .s6-head--video { margin-bottom: 40px; padding-right: 120px; padding-left: 120px; }
  .s6-head--download { margin-bottom: 48px; }
  .s6-container--video,
  .s6-container--download { margin-top: 64px; }

  .s6-head-deco--split { right: -10px; top: -10px; transform: scale(.7); }  
  .s6-head-deco--video { right: -10px; top: 0; width: 190px; }
  .s6-mascot-video { width: 190px; }

  .s6-tab-menu { padding: 0 12px; }
  .s6-tab { font-size: 17px; height: 52px; border-radius: 16px 16px 0 0; }

  .s6-card { padding: 30px 24px 24px; }
  .s6-intro { padding: 0; font-size: 17px; line-height: 1.9; }

  .s6-diagram {
    flex-wrap: wrap;
    margin-top: 28px;
    /* margin-bottom: 20px; */
  }
  .s6-diagram-flow {
    order: 1;
    width: 100%;
    justify-content: center;
  }
  .s6-diagram-mascot {
    order: 2;
    width: 190px;
    height: 230px;
    margin: 10px 20px 0 0;
  }
  .s6-mascot-search { left: 24px; }
  .s6-bubble--blue { top: 20px; left: 10px; }
  .s6-checklist {
    order: 3;
    align-self: center;
    margin: 0 !important;
  }

  .s6-card--video { padding: 24px 40px; }
  .s6-video { border-radius: 28px; }
  .s6-video-inner { border-radius: 23px; }
  .s6-video-soon strong { font-size: 32px; }

  .s6-download { max-width: 720px; margin: 0 auto; padding-right: 170px; }
  .s6-download-btn { height: 120px; font-size: 22px; gap: 12px; padding: 0 14px; }
  .s6-download-btn img { width: 84px; }
  .s6-download-deco { left: auto; right: 0; top: -70px; width: 170px; }
  .s6-mascot-download { width: 170px; }
  .s6-bubble--download { font-size: 14px; line-height: 20px; left: -50px; top: -28px; }
}

/* 手機 767 以下 */
@media screen and (max-width: 767px) {
  .section-6 {
    padding: 50px 16px 64px;
    background-image: url('../images/s6-bg.jpg');
    /* background-size: 100% auto; */
    background-color: #000082;
  }
  .s6-title { font-size: 36px; gap: 8px; }
  .s6-dot { width: 12px; height: 12px; }
  .s6-subtitle { font-size: 16px; margin-top: 10px !important; }
  .s6-head--split,
  .s6-head--video { padding: 0 0 0 0; margin-bottom: 24px; }
  .s6-head--split { padding-top: 0; }
  .s6-head--download { margin-bottom: 28px; }
  .s6-container--video,
  .s6-container--download { margin-top: 52px; }
  

  /* 手機版標題公仔：置於標題下方右側小尺寸 */
  .s6-head-deco--split,
  .s6-head-deco--video { transform: scale(0.45); top: 10px; right: -12px; }
  .s6-vlion-m { display: none;}
  .s6-bubble--top { left: 16px; top: 13px; padding: 12px 22px; transform: rotate(-5deg) scale(1.2); }

  /* Tabs：2 x 2 */
  .s6-tab-menu {
    flex-wrap: wrap;
    gap: 4px;
    padding: 0;
    margin-bottom: 4px;
  }
  .s6-tab {
    /* flex: 1 1 calc(50% - 3px); */
    height: auto;
    border: 1px solid var(--s6-tab-line);
    border-radius: 10px;
    font-size: 16px;
    padding: 12px 4px;
    line-height: 140%;
  }
  .s6-tab span {
    display: inline-block;
  }
  .s6-card { border-radius: 14px; margin-top: 0; padding: 22px 16px 16px; }

  .s6-intro { font-size: 16px; line-height: 1.85; }

  .s6-diagram { margin-top: 20px; margin-bottom: 16px; }
  .s6-diagram-flow {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      'scn scn'
      'bef aft';
    column-gap: 8px;
    row-gap: 10px;
  }
  .s6-scenario {
    grid-area: scn;
    width: auto;
    padding: 0;
  }
  .s6-scenario-tag { font-size: 16px; line-height: 28px; }
  .s6-scenario-text { margin-top: 4px !important; font-size: 15px; line-height: 22px; }
  .s6-scenario-text br { display: none; }
  .s6-scenario-text strong { font-size: 17px; margin-right: 6px; }
  .s6-scenario-arrow {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: 0 0 0 -6px;
    width: 12px; height: 26px;
  }
  .s6-diagram-flow { position: relative; }
  .s6-scenario { position: static; }
  .s6-asset--before { grid-area: bef; }
  .s6-asset--after { grid-area: aft; }
  .s6-coin, .s6-pie { width: min(130px, 38vw); }
  .s6-coin-text { font-size: 14px; line-height: 18px; }
  .s6-pie-num { font-size: 11px; }
  .s6-asset-label { font-size: 14px; line-height: 20px; }
  .s6-asset-value { font-size: 16px; line-height: 20px; }
  .s6-asset--after .s6-asset-value { margin-left: 38px; }
  .s6-badge { font-size: 14px; line-height: 18px; }
  .s6-scenario-arrow { top: calc(50% + 32px); }

  .s6-diagram-mascot {
    width: 44%;
    height: 170px;
    margin: 14px 0 0;
    top: 20px;
  }
  .s6-mascot-search { width: 92px; left: 50%; margin-left: -46px; }
  .s6-diagram-mascot .s6-bubble--blue {
    left: 50%; top: 0;
    width: 140px;
    transform: translateX(-50%);
    padding: 10px 4px;
    font-size: 13px;
    line-height: 19px;
  }
  .s6-checklist {
    width: 52%;
    margin: 14px 0 0 4% !important;
    padding: 8px 10px !important;
  }
  .s6-checklist li { font-size: 14px; line-height: 36px; padding-left: 28px; }
  .s6-checklist li::before { width: 21px; height: 20px; margin-top: -10px; }

  .s6-note { padding: 12px; }
  .s6-note::before { left: 13px; top: 17px; width: 18px; height: 18px; line-height: 18px; font-size: 12px; display: none; }
  .s6-note p { font-size: 15px; line-height: 22px; }

  .s6-card--video { padding: 14px; }
  .s6-video { padding: 3px; border-radius: 16px; }
  .s6-video-inner { border-radius: 13px; }
  .s6-video-soon strong { font-size: 22px; letter-spacing: 1px; }
  .s6-video-soon small { font-size: 11px; }
  .s6-video-poster::after { width: 60px; height: 42px; margin: -21px 0 0 -30px; border-radius: 12px; background-size: 26px; }

  .s6-download { max-width: none; margin: 0; padding: 0; }
  .s6-download-btns { flex-direction: row; gap: 12px; padding-right: 104px; }
  .s6-download-btn { height: 114px; min-width: 124px; font-size: 19px; gap: 4px; padding: 8px 14px; border-radius: 10px; flex-direction: column; }
  .s6-download-btn img { width: 62px; }
  .s6-download-deco { right: -6px; top: -20px; width: 110px; }
  .s6-mascot-download { width: 110px; }
  .s6-bubble--download { display: none; }
}

@media screen and (max-width: 530px) {
  .s6-bubble--top { display: none; }
}

/* 小手機 374 以下 */
@media screen and (max-width: 374px) {
  .s6-title { font-size: 26px; }
  .s6-tab { font-size: 14px; }
  .s6-download-btn { font-size: 17px; }
}

/* =========================================================
   Tab 2～4：分割三大優勢／分割重要日程／有哪些投票方式
   ========================================================= */
.section-6 h4,
.section-6 dl,
.section-6 dt,
.section-6 dd,
.section-6 ol { margin: 0; padding: 0; }
.section-6 .s6-panel--adv,
.section-6 .s6-panel--sched,
.section-6 .s6-panel--vote { margin-top: -10px; }
.section-6 .s6-note a {
  color: var(--s6-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.section-6 .s6-note a:hover { color: var(--s6-navy); }

/* ---------- Tab 2：分割三大優勢 ---------- */
.s6-adv-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 21px;
  margin-bottom: 21px;
}
.s6-adv {
  display: flex;
  flex-direction: column;
  min-height: 362px;
  padding: 22px 10px 19px 5px;
  border: 1px solid #c4e3ff;
  border-radius: 20px;
  background: #fff;
}
.s6-adv-head {
  position: relative;
  display: flex;
  align-items: center;
  height: 44px;
  padding-right: 20px;
}
.s6-adv-badge {
  position: relative;
  z-index: 1;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 86px;
  height: 44px;
  border-radius: 22px;
  background: linear-gradient(90deg, #c58d1d 0%, #f9df7b 26%, #fff7c2 43%, #d3a748 71.6%, #e6cc80 100%);
  color: var(--s6-ink);
  font-size: 16px;
  font-weight: 700;
}
.s6-adv-badge b {
  font-family: Rubik, 'Noto Sans TC', sans-serif;
  font-size: 24px;
  line-height: 1;
}
.s6-adv-title {
  flex: 1;
  display: flex;
  align-items: center;
  height: 36px;
  margin-left: -54px;
  padding-left: 65px;
  border-radius: 0 8px 8px 0;
  background: linear-gradient(92deg, #2661c5 0%, #2d3192 28.8%, #5783cf 100%);
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .5px;
  white-space: nowrap;
}
.section-6 .s6-adv-text {
  margin: 14px 0 0 5px;
  color: var(--s6-text);
  font-size: 18px;
  line-height: 31px;
  text-align: justify;
}
.s6-adv-img {
  display: block;
  width: auto;
  max-width: 100%;
  height: 124px;
  margin: auto auto 0;
  padding-top: 14px;
  box-sizing: content-box;
  mix-blend-mode: multiply;
  object-fit: contain;
}

/* ---------- Tab 3：分割重要日程 ---------- */
.s6-sched {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
  margin-bottom: 20px !important;
}
.s6-sched-item {
  position: relative;
  min-height: 336px;
  padding: 0 7px 20px 8px;
  border: 1px solid #c4e3ff;
  border-radius: 20px;
  background: #fff;
}
.s6-sched-item + .s6-sched-item::before {
  content: '';
  position: absolute;
  left: -16px; top: 50%;
  width: 12px; height: 22px;
  margin-top: -11px;
  background: #d5d5d5;
  clip-path: polygon(0 0, 100% 50%, 0 100%, 30% 50%);
}
.s6-sched-item.is-highlight {
  border: 3px solid transparent;
  background:
    linear-gradient(#fff7d8, #fff7d8) padding-box,
    linear-gradient(208deg, #e6cc80 0%, #bf8311 17%, #fff7c2 42%, #f9df7b 67%, #bf8311 100%) border-box;
  text-align: center;
  padding: 0 8px 18px;
}
.s6-sched-head { text-align: center; }
.section-6 .s6-sched-date {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 82px;
  margin-top: 12px;
  color: var(--main-blue);
  font-size: 21px;
  line-height: 35px;
  font-weight: 700;
  white-space: nowrap;
}
.s6-sched-item.is-highlight .s6-sched-date { margin-top: 10px; }
.s6-sched-title {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 66px;
  color: var(--s6-navy);
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
}
.section-6 .s6-sched-text {
  margin-top: 6px;
  color: var(--s6-text);
  font-size: 16px;
  line-height: 29px;
}
.s6-sched-text strong { font-weight: 700; color: #3f3f3f; }
.s6-sched-sub { display: block; margin-top: 29px; }

/* ---------- Tab 4：有哪些投票方式 ---------- */
.s6-vote-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}
.s6-vote {
  display: flex;
  flex-direction: column;
  min-height: 411px;
  padding: 16px 16px 16px;
  border: 1px solid #c4e3ff;
  border-radius: 20px;
  background: #fbfcfd;
  --s6-vote-color: var(--s6-navy);
  --s6-vote-label: var(--s6-navy);
  --s6-vote-box: #edf6fe;
  --s6-vote-icon: url('../images/s6-icon-cal.svg');
}
.s6-vote--paper {
  border-color: #ffedd4;
  background: #fdf8f1;
  --s6-vote-color: #c66219;
  --s6-vote-label: #625742;
  --s6-vote-box: #feefd9;
  --s6-vote-icon: url('../images/s6-icon-mail.svg');
}
.s6-vote-title {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--s6-vote-color);
  font-size: 36px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 1px;
}
.s6-vote-title img {
  flex: none;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #ddeefd;
}
.s6-vote--paper .s6-vote-title img { background: transparent; }
.section-6 .s6-vote-text {
  flex: 1;
  margin: 14px 0 0 1px;
  color: #3f3f3f;
  font-size: 16px;
  line-height: 29px;
  text-align: justify;
}
.s6-vote-text strong { color: var(--s6-ink); font-weight: 700; }
.s6-vote-info {
  display: flex;
  align-items: center;
  min-height: 74px;
  margin-top: 16px !important;
  padding: 8px 16px 8px 69px !important;
  border-radius: 12px;
  background: var(--s6-vote-box) var(--s6-vote-icon) no-repeat 17px 50% / 34px auto;
}
.s6-vote--paper .s6-vote-info { background-size: 36px auto; }
.s6-vote-info > div + div {
  margin-left: 18px;
  padding-left: 16px;
  border-left: 1px solid var(--s6-vote-label);
}
.s6-vote-info dt,
.s6-vote-info dd {
  color: var(--s6-vote-label);
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  white-space: nowrap;
}
.section-6 .s6-vote-remark {
  min-height: 26px;
  margin-top: 2px;
  color: #3f3f3f;
  font-size: 14px;
  line-height: 26px;
  text-align: right;
}
.s6-vote-btn {
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 193px;
  height: 49px;
  margin-top: 8px;
  padding: 0 24px;
  border: 1px solid #126dff;
  border-radius: 25px;
  background: linear-gradient(165deg, #00d2ff 0%, #3641d9 66%, #0165e9 100%);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .5px;
  text-decoration: none;
  box-shadow: 0 3px 8px rgba(1, 101, 233, .25);
  transition: transform .2s, box-shadow .2s, filter .2s;
}
.s6-vote--paper .s6-vote-btn {
  border-color: #ac5312;
  background: linear-gradient(165deg, #de711e 0%, #cc6114 66%, #99420b 100%);
  box-shadow: 0 3px 8px rgba(172, 83, 18, .25);
}
.s6-vote-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  color: #fff;
}
.s6-tel { white-space: nowrap; }
.section-6 .s6-note .s6-tel { text-decoration: none; }

/* ---------- Tab 2～4 RWD ---------- */
@media screen and (max-width: 1079px) {
  .s6-vote-info { padding-left: 62px !important; padding-right: 12px !important; }
  .s6-vote-info > div + div { margin-left: 12px; padding-left: 12px; }
  .s6-vote-info dt, .s6-vote-info dd { font-size: 15px; }
}

@media screen and (max-width: 991px) {
  .section-6 .s6-panel--adv,
  .section-6 .s6-panel--sched,
  .section-6 .s6-panel--vote { margin-top: -6px; }

  /* 優勢：維持三欄，縮小字級 */
  .s6-adv-list { gap: 12px; }
  .s6-adv { min-height: 0; padding: 16px 8px 14px 4px; }
  .s6-adv-badge { width: 70px; height: 38px; font-size: 16px; }
  .s6-adv-badge b { font-size: 24px; }
  .s6-adv-title { height: 32px; margin-left: -44px; padding-left: 52px; font-size: 16px; }
  .s6-adv-head { height: 38px; padding-right: 4px; }
  .section-6 .s6-adv-text { font-size: 15px; line-height: 26px; }
  .s6-adv-img { height: 90px; }

  /* 日程：改為直式時間軸 */
  .s6-sched { grid-template-columns: 1fr; gap: 22px; }
  .s6-sched-item,
  .s6-sched-item.is-highlight {
    display: flex;
    align-items: center;
    min-height: 0;
    padding: 16px 20px;
    text-align: left;
  }
  .s6-sched-item.is-highlight { padding: 14px 18px; }
  .s6-sched-item + .s6-sched-item::before {
    left: 50%; top: -18px;
    width: 22px; height: 12px;
    margin: 0 0 0 -11px;
    clip-path: polygon(0 0, 50% 100%, 100% 0, 50% 30%);
  }
  .s6-sched-head {
    flex: none;
    width: 200px;
    padding-right: 16px;
    margin-right: 20px;
    border-right: 1px dashed #c4e3ff;
  }
  .s6-sched-item.is-highlight .s6-sched-head { border-right-color: #e5c56e; }
  .section-6 .s6-sched-date,
  .s6-sched-item.is-highlight .s6-sched-date { height: auto; margin-top: 0; font-size: 20px; line-height: 28px; margin-bottom: 8px; }
  .s6-sched-title { height: auto; margin-top: 6px; font-size: 18px; line-height: 26px; }
  .section-6 .s6-sched-text { flex: 1; margin-top: 0; font-size: 16px; line-height: 27px; }
  .s6-sched-sub { margin-top: 4px; }

  /* 投票方式：資訊欄位改直排 */
  .s6-vote-list { gap: 14px; }
  .s6-vote { min-height: 0; padding: 14px; }
  .s6-vote-title { font-size: 28px; gap: 10px; }
  .s6-vote-title img { width: 60px; height: 60px; }
  .section-6 .s6-vote-text { font-size: 15px; line-height: 27px; }
  .s6-vote-info { display: block; padding: 10px 12px 10px 58px !important; background-position: 14px 50%; background-size: 30px auto; }
  .s6-vote--paper .s6-vote-info { background-size: 32px auto; }
  .s6-vote-info > div { display: flex; flex-wrap: wrap; column-gap: 6px; }
  .s6-vote-info > div + div { margin: 4px 0 0; padding: 4px 0 0; border-left: 0; border-top: 1px solid var(--s6-vote-label); }
  .s6-vote-info dt, .s6-vote-info dd { line-height: 24px; }
  .s6-vote-info dt { font-weight: 500; }
}

@media screen and (max-width: 767px) {
  .section-6 .s6-panel--adv,
  .section-6 .s6-panel--sched,
  .section-6 .s6-panel--vote { margin-top: 0; }

  /* 優勢：單欄，圖片置右 */
  .s6-adv-list { grid-template-columns: 1fr; gap: 12px; margin-bottom: 14px; }
  .s6-adv {
    display: flex;
    column-gap: 8px;
    padding: 12px 12px 12px 6px;
    border-radius: 14px;
  }
  .s6-adv-head { grid-area: head; }
  .section-6 .s6-adv-text { grid-area: text; margin: 10px 0 0 6px; font-size: 16px; line-height: 24px; }
  .s6-adv-img { grid-area: img; align-self: center; width: 100%; max-width: 204px; height: auto; padding-top: 10px; margin: 0; }
  .s6-adv-title { font-size: 18px; }

  /* 日程 */
  .s6-sched { gap: 20px; margin-bottom: 14px !important; }
  .s6-sched-item,
  .s6-sched-item.is-highlight { padding: 12px 12px 12px 8px; border-radius: 14px; }
  .s6-sched-head { width: 120px; padding-right: 8px; margin-right: 12px; }
  .section-6 .s6-sched-date,
  .s6-sched-item.is-highlight .s6-sched-date { font-size: 16px; line-height: 22px; white-space: normal; }
  .s6-sched-head .s6-sched-title { font-size: 16px; line-height: 20px; margin-top: 4px; letter-spacing: -.2px; }
  .section-6 .s6-sched-text { font-size: 15px; line-height: 23px; }
  .s6-sched-item + .s6-sched-item::before { top: -16px; }

  /* 投票方式：單欄 */
  .s6-vote-list { grid-template-columns: 1fr; gap: 12px; margin-bottom: 14px; }
  .s6-vote { border-radius: 14px; padding: 14px 12px 16px; }
  .s6-vote-title { font-size: 24px; }
  .s6-vote-title img { width: 52px; height: 52px; }
  .section-6 .s6-vote-text { font-size: 16px; line-height: 24px; }
  .s6-vote-info dt, .s6-vote-info dd { font-size: 14px; line-height: 22px; }
  .section-6 .s6-vote-remark { font-size: 12px; min-height: 0; }
  .s6-vote--e .s6-vote-remark { display: none; }
  .s6-vote-btn { min-width: 0; width: 100%; max-width: 260px; height: 44px; margin-top: 10px; font-size: 16px; }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .section-6 .s6-sched-date { font-size: 18px; white-space: normal; }
  .s6-sched-title { font-size: 18px; }
}

/* =========================================================
   Tab 左右切換箭頭（ETF分割說明、影音專區）
   位於內容卡片左右邊線上、卡片垂直置中
   ========================================================= */
.s6-arrow {
  --s6-menu-h: 56px;               /* tab 列高度，用來推算卡片中心 */
  position: absolute;
  top: calc(50% + var(--s6-menu-h) / 2);
  z-index: 5;
  width: 60px;
  height: 60px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: url('../images/s6-arrow.svg') no-repeat 50% 50% / 100% 100%;
  box-shadow: 0 4px 10px rgba(0, 30, 120, .3);
  cursor: pointer;
  transform: translateY(-50%);
  transition: transform .2s, filter .2s;
  -webkit-appearance: none;
  appearance: none;
}
.s6-arrow--prev { left: -30px; }
.s6-arrow--next { left: auto; right: -30px; transform: translateY(-50%) scaleX(-1); } /* left:auto 覆蓋既有 button { left:50% } */
.s6-arrow:hover { filter: brightness(1.12); }
.s6-arrow--prev:hover { transform: translateY(-50%) scale(1.06); }
.s6-arrow--next:hover { transform: translateY(-50%) scaleX(-1) scale(1.06); }
.s6-arrow:focus-visible { outline: 3px solid #ffc700; outline-offset: 2px; }

@media screen and (max-width: 1199px) {
  .s6-arrow { width: 50px; height: 50px; }
  .s6-arrow--prev { left: -20px; }
  .s6-arrow--next { right: -20px; }
}

@media screen and (max-width: 991px) {
  .s6-arrow { --s6-menu-h: 52px; width: 44px; height: 44px; }
  .s6-arrow--prev { left: -18px; }
  .s6-arrow--next { right: -18px; }
  .s6-card { padding-left: 28px; padding-right: 28px; }
  .s6-card--video { padding-left: 40px; padding-right: 40px; }
}

@media screen and (max-width: 767px) {
  /* 手機 tab 為 2x2：44*2 + 間距 6 + 下方 10 */
  .s6-arrow { --s6-menu-h: 104px; width: 34px; height: 34px; box-shadow: 0 2px 6px rgba(0, 30, 120, .3); }
  .s6-arrow--prev { left: -13px; }
  .s6-arrow--next { right: -13px; }
  .s6-card { padding-left: 16px; padding-right: 16px; }
  .s6-card--video { padding: 14px 24px; }
}

/* =========================================================
   ETF分割說明 Tab 1 圖解進場動態（只播放一次）
   由 js/section-6.js 加上 .s6-anim-ready（初始隱藏）與 .is-play（播放）
   ========================================================= */
.s6-count { display: inline-block; text-align: right; font-variant-numeric: tabular-nums; }

.s6-anim-ready .s6-asset--before .s6-asset-value,
.s6-anim-ready .s6-count,
.s6-anim-ready .s6-badge { opacity: 0; transition: opacity .6s ease; }

/* 用 transition（非 animation），切換 tab 回來時不會重播 */
/* 1. 分割前 140,000 淡入 */
.s6-anim-ready.is-play .s6-asset--before .s6-asset-value { opacity: 1; transition-delay: .2s; }
/* 2. 分割後數字淡入，同時由 JS 從 0 跳到 140,000（約 0.9s～2.2s） */
.s6-anim-ready.is-play .s6-count { opacity: 1; transition-duration: .8s; transition-delay: .9s; }
/*    「不變」接著淡入 */
.s6-anim-ready.is-play .s6-badge { opacity: 1; transition-duration: .5s; transition-delay: 2.3s; }

@media (prefers-reduced-motion: reduce) {
  .s6-anim-ready .s6-asset--before .s6-asset-value,
  .s6-anim-ready .s6-count,
  .s6-anim-ready .s6-badge { opacity: 1 !important; transition: none !important; }
}

/* =========================================================
   電子投票方式 Popup（三種電子投票入口）
   ========================================================= */
.s6-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  background: rgba(0, 0, 0, .8);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  opacity: 0;
  transition: opacity .25s ease;
}
.s6-modal[hidden] { display: none; }
.s6-modal.is-open { opacity: 1; }

.s6-modal-dialog {
  position: relative;
  width: 100%;
  max-width: 1039px;
  margin: auto;
  padding: 40px 30px 30px;
  border: 1px solid #00aaff;
  border-radius: 16px;
  background: linear-gradient(180deg, #0032bb 0%, #001b88 23.5%, #00229c 100%);
  box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
  color: #fff;
  text-align: center;
  transform: translateY(16px) scale(.97);
  transition: transform .3s cubic-bezier(.2, .8, .3, 1);
}
.s6-modal.is-open .s6-modal-dialog { transform: none; }

.s6-modal-close {
  position: absolute;
  top: 19px;
  right: 19px;
  left: auto;          /* 覆蓋既有 button { left:50% } */
  width: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 1px solid #fff;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: background-color .2s;
}
.s6-modal-close::before,
.s6-modal-close::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 22px;
  height: 3px;
  margin: -1.5px 0 0 -11px;
  border-radius: 2px;
  background: #fff;
  transform: rotate(45deg);
}
.s6-modal-close::after { transform: rotate(-45deg); }
.s6-modal-close:hover { background: rgba(255, 255, 255, .15); }
.s6-modal-close:focus-visible { outline: 3px solid #ffc700; outline-offset: 2px; }

.section-6 .s6-ev-title {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-size: 48px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 2px;
}
.section-6 .s6-ev-sub {
  margin-top: 26px;
  color: #fff;
  font-size: 22px;
  line-height: 1.4;
  font-weight: 700;
}

.s6-ev-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 38px;
}
.s6-ev-card {
  display: flex;
  flex-direction: column;
  min-height: 378px;
  padding: 17px 10px 21px 7px;
  border: 1px solid #c4e3ff;
  border-radius: 20px;
  background: #fff;
}
.section-6 .s6-ev-head {
  position: relative;
  display: flex;
  align-items: center;
  height: 69px;
  margin: 0;
}
.s6-ev-icon {
  position: relative;
  z-index: 1;
  flex: none;
  width: 69px;
  height: 69px;
}
.s6-ev-head span {
  flex: 1;
  display: flex;
  align-items: center;
  height: 50px;
  margin-left: -34px;
  padding-left: 44px;
  border-radius: 0 12px 12px 0;
  background: linear-gradient(91deg, #2661c5 0%, #2d3192 28.8%, #5783cf 100%);
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 1px;
  white-space: nowrap;
  text-align: left;
}

.s6-ev-body {
  flex: 1;
  display: flex;
  align-items: center;
  margin-top: 22px;
}
.s6-ev-img {
  flex: none;
  width: 108px;
  height: auto;
  margin: 0 14px 0 9px;
}
.s6-ev-card--web .s6-ev-img { width: 136px; margin: 12px 0 0 2px; }
.section-6 .s6-ev-steps {
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: s6ev;
  text-align: left;
}
.s6-ev-steps li {
  position: relative;
  flex-wrap: wrap;
  display: flex;
  align-items: center;
  min-height: 50px;
  padding-left: 36px;
  color: var(--s6-navy);
  font-size: 17px;
  line-height: 25px;
  font-weight: 500;
  white-space: nowrap;
  counter-increment: s6ev;
}
.s6-ev-steps li + li { margin-top: 14px; }
.s6-ev-steps li::before {
  content: counter(s6ev);
  position: absolute;
  left: 0;
  top: 50%;
  width: 28px;
  height: 28px;
  margin-top: -14px;
  border-radius: 50%;
  background: var(--s6-navy);
  color: #fff;
  font-family: Rubik, 'Noto Sans TC', sans-serif;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  text-align: center;
}

.s6-ev-btn {
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 121px;
  height: 49px;
  margin-top: 16px;
  padding: 0 24px;
  border: 1px solid #126dff;
  border-radius: 25px;
  background: linear-gradient(162deg, #00d2ff 0%, #3641d9 66%, #0165e9 100%);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 3px 8px rgba(1, 101, 233, .25);
  transition: transform .2s, filter .2s;
}
.s6-ev-btn:hover { transform: translateY(-2px); filter: brightness(1.08); color: #fff; }

.section-6 .s6-ev-info {
  display: flex;
  align-items: center;
  min-height: 100px;
  margin: 20px 0 0;
  padding: 14px 30px 14px 20px;
  border-radius: 8px;
  background: rgba(228, 242, 255, .2);
  text-align: left;
}
.s6-ev-info > div {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
}
.s6-ev-info > div:first-child { flex: 0 0 auto; padding-right: 52px; border-right: 1px solid #99caff; }
.s6-ev-info > div + div { padding-left: 45px; }
.s6-ev-info-icon { flex: none; width: 30px; height: auto; margin-right: 13px; }
.section-6 .s6-ev-info dt {
  flex: none;
  margin: 0;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  white-space: nowrap;
}
.section-6 .s6-ev-info dd {
  margin: 0 0 0 14px;
  color: #fff;
  font-size: 17px;
  line-height: 32px;
  font-weight: 700;
}

/* 開啟 popup 時鎖住背景捲動 */
html.s6-modal-lock,
html.s6-modal-lock body { overflow: hidden; }

/* ---------- Popup RWD ---------- */
@media screen and (max-width: 1079px) {
  .s6-modal-dialog { padding: 36px 20px 20px; }
  .section-6 .s6-ev-title { font-size: 40px; }
  .section-6 .s6-ev-sub { font-size: 19px; margin-top: 16px; }
  .s6-ev-cards { gap: 14px; margin-top: 28px; }
  .s6-ev-head span { font-size: 20px; padding-left: 40px; letter-spacing: 0; }
  .s6-ev-img { width: 92px; margin: 0 12px 0 4px; }
  .s6-ev-card--web .s6-ev-img { width: 104px; margin: 8px 4px 0 0; }
  .s6-ev-steps li { font-size: 15px; line-height: 22px; padding-left: 32px; }
  .s6-ev-info > div:first-child { padding-right: 24px; }
  .s6-ev-info > div + div { padding-left: 24px; }
  .section-6 .s6-ev-info dd { font-size: 16px; line-height: 28px; }
  .s6-ev-br { display: none; }
}

@media screen and (max-width: 991px) {
  /* 三張卡片改直排，卡片內圖文左右排 */
  .s6-ev-cards { grid-template-columns: 1fr; max-width: 560px; margin-left: auto; margin-right: auto; }
  .s6-ev-card { min-height: 0; padding: 14px 16px 18px 8px; }
  .s6-ev-body { margin-top: 12px; justify-content: center; }
  .s6-ev-img { width: 96px; margin: 0 26px 0 10px; }
  .s6-ev-card--web .s6-ev-img { width: 120px; margin: 0 14px 0 0; }
  .section-6 .s6-ev-steps { flex: 0 1 260px; }
  .s6-ev-steps li { min-height: 40px; }
  .s6-ev-steps li + li { margin-top: 8px; }
  .s6-ev-btn { margin-top: 12px; }
  .section-6 .s6-ev-info { flex-direction: column; align-items: stretch; max-width: 560px; margin-left: auto; margin-right: auto; padding: 14px 18px; }
  .s6-ev-info > div:first-child { padding: 0 0 12px; border-right: 0; border-bottom: 1px solid #99caff; }
  .s6-ev-info > div + div { padding: 12px 0 0; }
}

@media screen and (max-width: 767px) {
  .s6-modal { padding: 16px 12px; align-items: flex-start; }
  .s6-modal-dialog { padding: 54px 14px 16px; border-radius: 14px; }
  .s6-modal-close { top: 12px; right: 12px; width: 36px; height: 36px; }
  .s6-modal-close::before,
  .s6-modal-close::after { width: 16px; height: 2px; margin: -1px 0 0 -8px; }
  .section-6 .s6-ev-title { font-size: 26px; gap: 8px; letter-spacing: 1px; }
  .section-6 .s6-ev-sub { font-size: 15px; margin-top: 10px; }
  .s6-ev-cards { gap: 12px; margin-top: 18px; }
  .s6-ev-card { padding: 10px 10px 14px 6px; border-radius: 14px; }
  .section-6 .s6-ev-head { height: 52px; }
  .s6-ev-icon { width: 52px; height: 52px; }
  .s6-ev-head span { height: 40px; margin-left: -26px; padding-left: 34px; font-size: 18px; }
  .s6-ev-img { width: 72px; margin: 0 12px 0 4px; }
  .s6-ev-card--web .s6-ev-img { width: 88px; margin: 0 8px 0 0; }
  .s6-ev-steps li { min-height: 34px; padding-left: 32px; font-size: 14px; line-height: 20px; }
  .s6-ev-steps li::before { width: 24px; height: 24px; margin-top: -12px; font-size: 14px; line-height: 24px; }
  .s6-ev-btn { height: 42px; font-size: 16px; }
  .section-6 .s6-ev-info { padding: 12px 14px; margin-top: 12px; }
  .s6-ev-info > div { align-items: flex-start; flex-wrap: wrap; }
  .s6-ev-info-icon { width: 24px; margin: 2px 8px 0 0; }
  .section-6 .s6-ev-info dt { font-size: 16px; line-height: 28px; }
  .section-6 .s6-ev-info dd { flex: 1 1 100%; margin: 2px 0 0 32px; font-size: 14px; line-height: 22px; }
}

/* =========================================================
   PDF 說明 Popup（疊在電子投票 popup 之上）
   ========================================================= */
.s6-modal.is-stacked { background: rgba(0, 0, 0, .6); }  /* 疊加時背景再暗一些，總和接近全黑 */

.s6-modal--pdf { padding: 24px; }
.s6-modal-dialog.s6-pdf-dialog {
  display: flex;
  flex-direction: column;
  max-width: 1100px;
  height: min(860px, calc(100vh - 48px));
  height: min(860px, calc(100dvh - 48px));
  padding: 0;
  overflow: hidden;
  text-align: left;
}
.s6-pdf-bar {
  flex: none;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 68px;
  padding: 10px 14px 10px 24px;
}
.section-6 .s6-pdf-title {
  flex: 1;
  min-width: 0;
  margin: 0;
  color: #fff;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1px;
}
.s6-pdf-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  white-space: nowrap;
}
.s6-pdf-count { min-width: 64px; text-align: center; font-variant-numeric: tabular-nums; }
.s6-pdf-btn {
  position: relative;
  top: auto; left: auto;          /* 覆蓋既有 button { top/left:50% } */
  width: 36px;
  height: 36px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}
.s6-pdf-btn::before {
  content: '';
  position: absolute;
  left: 50%; top: 50%;
  width: 9px; height: 9px;
  margin: -5px 0 0 -3px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}
.s6-pdf-btn--next::before { margin-left: -7px; transform: rotate(-135deg); }
.s6-pdf-btn:hover { background: rgba(255, 255, 255, .15); }
.s6-pdf-open {
  flex: none;
  padding: 0 16px;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 18px;
  color: #fff;
  font-size: 15px;
  line-height: 34px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.s6-pdf-open:hover { background: rgba(255, 255, 255, .15); color: #fff; }
.s6-modal-close.s6-pdf-close { position: relative; top: auto; right: auto; flex: none; width: 44px; height: 44px; }

.s6-pdf-view {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 8px 24px 24px;
  background: #525659;
}
.s6-pdf-view:focus-visible { outline: 3px solid #ffc700; outline-offset: -3px; }
.s6-pdf-page {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto 14px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}
.s6-pdf-page canvas { display: block; width: 100%; height: 100%; }
.s6-pdf-loading {
  margin: 0;
  padding: 120px 0;
  color: #fff;
  font-size: 18px;
  text-align: center;
}
.s6-pdf-frame { display: block; width: 100%; height: 100%; border: 0; background: #fff; }

@media screen and (max-width: 767px) {
  .s6-modal--pdf { padding: 0; align-items: stretch; }
  .s6-modal-dialog.s6-pdf-dialog { height: 100vh; height: 100dvh; max-width: none; border-radius: 0; border: 0; }
  .s6-pdf-bar { flex-wrap: wrap; gap: 8px 10px; min-height: 0; padding: 10px 10px 10px 14px; }
  .section-6 .s6-pdf-title { flex: 1 1 calc(100% - 60px); font-size: 17px; letter-spacing: 0; }
  .s6-modal-close.s6-pdf-close { order: 2; width: 36px; height: 36px; }
  .s6-pdf-nav { order: 3; font-size: 14px; gap: 6px; }
  .s6-pdf-btn { width: 32px; height: 32px; }
  .s6-pdf-open { order: 4; margin-left: auto; font-size: 13px; line-height: 30px; padding: 0 12px; }
  .s6-pdf-view { padding: 6px 8px 16px; }
  .s6-pdf-page { margin-bottom: 8px; }
}

/* =========================================================
   ETF分割說明 Tab 3 分割重要日程：5 個日期區塊由左至右依序淡入（間隔 0.3 秒，約 1.8 秒完成）
   只播放一次（重新整理頁面才會再播）
   由 js/section-6.js 加上 .s6-sched-ready（初始隱藏）與 .is-play（播放）
   用 transition（非 animation），切換 tab 回來時不會重播
   ========================================================= */
.s6-sched-ready .s6-sched-item {
  opacity: 0;
  transform: translateX(-16px);
  transition: opacity .6s ease-out, transform .6s ease-out;
}
.s6-sched-ready.is-play .s6-sched-item { opacity: 1; transform: none; }
.s6-sched-ready.is-play .s6-sched-item:nth-child(1) { transition-delay: 0s; }
.s6-sched-ready.is-play .s6-sched-item:nth-child(2) { transition-delay: .3s; }
.s6-sched-ready.is-play .s6-sched-item:nth-child(3) { transition-delay: .6s; }
.s6-sched-ready.is-play .s6-sched-item:nth-child(4) { transition-delay: .9s; }
.s6-sched-ready.is-play .s6-sched-item:nth-child(5) { transition-delay: 1.2s; }

/* 平板、手機為直式排列：改為由上往下 */
@media screen and (max-width: 991px) {
  .s6-sched-ready .s6-sched-item { transform: translateY(12px); }
  .s6-sched-ready.is-play .s6-sched-item { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .s6-sched-ready .s6-sched-item { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* =========================================================
   影音專區：YouTube Shorts（直式 9:16）
   在 .s6-video 加上 class="s6-video--short" 即套用
   ========================================================= */
.s6-video.s6-video--short {
  aspect-ratio: 9 / 16;
  width: auto;
  height: min(640px, 75vh);
  max-width: 100%;
  margin: 0 auto;
  border-radius: 28px;
}
.s6-video--short .s6-video-inner { border-radius: 23px; }
.s6-video--short .s6-video-soon strong { font-size: 24px; }
@media screen and (max-width: 767px) {
  .s6-video.s6-video--short { height: auto; width: min(100%, 300px); border-radius: 16px; }
  .s6-video--short .s6-video-inner { border-radius: 13px; }
}

/* =========================================================
   分割懶人包「敬請期待」Popup（共用 .s6-modal 開關與背景）
   ========================================================= */
.s6-modal-dialog.s6-soon-dialog {
  max-width: 520px;
  padding: 56px 32px 36px;
  font-family: 'Noto Sans TC', sans-serif;
}
.s6-modal .s6-soon-title {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: #fff;
  font-size: 36px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 2px;
}
.s6-modal .s6-soon-text {
  margin: 20px 0 0;
  color: #fff;
  font-size: 22px;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: 1px;
}
.s6-modal .s6-soon-btn {
  position: static;          /* 覆蓋既有 button { top/left:50% } */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 160px;
  height: 48px;
  margin: 30px 0 0;
  padding: 0 28px;
  border: 1px solid #126dff;
  border-radius: 24px;
  background: linear-gradient(162deg, #00d2ff 0%, #3641d9 66%, #0165e9 100%);
  color: #fff;
  font-family: inherit;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .2s, filter .2s;
}
.s6-modal .s6-soon-btn:hover { transform: translateY(-2px); filter: brightness(1.08); }
.s6-modal .s6-soon-btn:focus-visible { outline: 3px solid #ffc700; outline-offset: 2px; }
.s6-modal--soon .s6-dot { width: 14px; height: 14px; }

@media screen and (max-width: 767px) {
  .s6-modal--soon { align-items: center; }
  .s6-modal-dialog.s6-soon-dialog { padding: 52px 20px 28px; }
  .s6-modal .s6-soon-title { font-size: 26px; gap: 8px; }
  .s6-modal .s6-soon-text { margin-top: 14px; font-size: 17px; }
  .s6-modal .s6-soon-btn { margin-top: 22px; height: 44px; font-size: 16px; }
}