/* =========================================================
   系列講座頁（延續講座海報：筆畫標題、Cold War Era 直書、照片＋講題）
   ========================================================= */
/* ---------- 頁首 ---------- */
.lhero { position: relative; min-height: 100svh; padding: 22vh var(--gutter) 10vh; display: grid; grid-template-columns: 7fr 5fr; gap: 4vw; align-items: end; }
.lhero__cw { position: absolute; top: 22vh; right: var(--gutter); writing-mode: vertical-rl; font-family: var(--f-en); font-weight: 200; font-size: clamp(28px, 3.4vw, 60px); letter-spacing: .04em; opacity: .9; }
.lhero__main { position: relative; }
.lhero__title { display: grid; grid-template-columns: max-content 1fr; column-gap: 1.6vw; font-size: clamp(54px, 8.4vw, 150px); }
.lhero__kv { display: block; grid-column: 1; line-height: 1; padding: .06em 0; }
.lhero__kv .kv-word :is(rect, polygon, path) { translate: none; }
.lhero__en { grid-column: 2; grid-row: 1; align-self: center; font-family: var(--f-en); font-weight: 300; font-size: clamp(13px, 1.1vw, 18px); line-height: 1.4; letter-spacing: .02em; }
.lhero__sub { grid-column: 2; grid-row: 3; align-self: end; font-family: var(--f-serif); font-size: clamp(16px, 1.5vw, 26px); line-height: 1.5; letter-spacing: .16em; padding-bottom: .2em; }
.lhero__spark { position: absolute; right: 6%; top: -8%; width: 22px; height: 22px; background: currentColor; clip-path: polygon(50% 0, 58% 42%, 100% 50%, 58% 58%, 50% 100%, 42% 58%, 0 50%, 42% 42%); opacity: .8; }
.lhero__info { padding-bottom: 1vh; padding-right: clamp(40px, 5vw, 90px); }
.lhero__date { display: flex; align-items: baseline; gap: 14px; font-family: var(--f-en); }
.lhero__date b { font-weight: 300; font-size: clamp(40px, 4.6vw, 80px); letter-spacing: -.01em; line-height: 1; }
.lhero__date span { font-weight: 600; font-size: 14px; letter-spacing: .24em; }
.lhero__time { margin-top: 1.4vh; font-family: var(--f-en); font-weight: 300; font-size: clamp(22px, 2vw, 34px); letter-spacing: .04em; }
.lhero__meta { margin-top: 4vh; border-top: 1px solid var(--fg); }
.lhero__meta > div { display: grid; grid-template-columns: 6.5em 1fr; gap: 1.4vw; padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 14.5px; line-height: 1.8; letter-spacing: .08em; }
.lhero__meta dt { color: var(--muted); font-size: 12.5px; letter-spacing: .2em; padding-top: 2px; }
.lhero__meta small { display: block; margin-top: 4px; font-family: var(--f-en); font-size: 12px; letter-spacing: .02em; line-height: 1.6; color: var(--muted); }
.lhero__reg { display: inline-flex; align-items: center; gap: 12px; margin-top: 4vh; padding: 14px 30px; border: 1px solid var(--fg); border-radius: 99px; font-size: 14px; letter-spacing: .24em; transition: background .4s var(--ease), color .4s var(--ease); }
.lhero__reg:hover { background: var(--fg); color: var(--bg); }
.lhero__reg.is-pending { border-style: dashed; color: var(--muted); border-color: var(--line); pointer-events: none; }

/* ---------- 議程 ---------- */
.ag { display: grid; grid-template-columns: 1fr 1fr; gap: 4vw; }
.ag__h { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid var(--fg); font-size: 18px; font-weight: 400; letter-spacing: .2em; }
.ag__h span { font-family: var(--f-en); font-size: 12px; letter-spacing: .16em; color: var(--muted); text-transform: uppercase; }
.ag__row { border-bottom: 1px solid var(--line); }
.ag__row > a, .ag__row:not(:has(a)) { display: grid; grid-template-columns: 7.6em 1fr auto; gap: 1.2vw; align-items: baseline; padding: 16px 0; }
.ag__t { font-family: var(--f-en); font-weight: 500; font-size: 13.5px; letter-spacing: .06em; }
.ag__w b { display: block; font-weight: 400; font-size: 15.5px; letter-spacing: .1em; }
.ag__w em { display: block; margin-top: 4px; font-style: normal; font-family: var(--f-serif); font-size: 13.5px; letter-spacing: .06em; line-height: 1.7; color: var(--muted); }
.ag__row.is-minor { color: var(--muted); }
.ag__row.is-minor b { font-size: 14px; }
.ag__row.is-minor em { font-family: var(--f-en); font-size: 12px; letter-spacing: .02em; margin-top: 2px; }
.ag__row i { font-style: normal; color: var(--muted); transition: transform .5s var(--ease), color .3s; }
.ag__row a:hover i { transform: translateX(6px); color: var(--fg); }

/* ---------- 講者 ---------- */
.lecs { display: flex; flex-direction: column; }
.lec { display: grid; grid-template-columns: minmax(180px, 4fr) 7fr; gap: 3.4vw; padding: 7vh 0; border-top: 1px solid var(--line); scroll-margin-top: 16vh; }
.lec:first-child { border-top-color: var(--fg); }
.lec__fig { position: relative; align-self: start; }
.lec__fig img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 3; object-fit: cover; }
.lec__spark { position: absolute; left: -10px; bottom: 18%; width: 18px; height: 18px; background: var(--fg); clip-path: polygon(50% 0, 58% 42%, 100% 50%, 58% 58%, 50% 100%, 42% 58%, 0 50%, 42% 42%); }
.lec__no { display: flex; align-items: baseline; gap: 16px; }
.lec__no b { font-weight: 400; font-size: 14px; letter-spacing: .3em; padding: 4px 14px; border: 1px solid var(--fg); border-radius: 99px; }
.lec__no span { font-family: var(--f-en); font-weight: 300; font-size: clamp(18px, 1.5vw, 24px); letter-spacing: .04em; }
.lec__title { margin-top: 3.4vh; font-family: var(--f-serif); font-weight: 400; font-size: clamp(22px, 2vw, 34px); line-height: 1.55; letter-spacing: .08em; }
.lec__t1, .lec__t2 { display: block; }
.lec__t2 { font-size: .82em; }
.lec__te { margin-top: 2vh; font-family: var(--f-en); font-weight: 300; font-size: 14px; line-height: 1.6; letter-spacing: .01em; color: var(--muted); }
.lec__aff { margin-top: 4.4vh; font-size: 14px; letter-spacing: .12em; line-height: 1.7; }
.lec__aff span { display: block; font-family: var(--f-en); font-size: 12px; letter-spacing: .02em; color: var(--muted); }
.lec__name { margin-top: 1.4vh; display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 18px; font-weight: 300; font-size: clamp(40px, 4.4vw, 76px); letter-spacing: .1em; line-height: 1.15; }
.lec__name span { font-family: var(--f-en); font-weight: 200; font-size: .42em; letter-spacing: .01em; color: var(--muted); opacity: .8; }
.lec__more { border-top: 1px solid var(--line); }
.lec__more:first-of-type { margin-top: 4.4vh; }
.lec__more:last-child { border-bottom: 1px solid var(--line); }
.lec__more summary { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; cursor: pointer; list-style: none; font-size: 14px; letter-spacing: .22em; }
.lec__more summary::-webkit-details-marker { display: none; }
.lec__more summary i { position: relative; width: 12px; height: 12px; }
.lec__more summary i::before, .lec__more summary i::after { content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 1px; background: currentColor; transition: transform .4s var(--ease); }
.lec__more summary i::after { transform: rotate(90deg); }
.lec__more[open] summary i::after { transform: rotate(0); }
.lec__body { padding: 0 0 22px; font-family: var(--f-serif); font-size: 15px; line-height: 2; letter-spacing: .06em; text-align: justify; color: var(--fg); }
.lec__body p + p { margin-top: 1em; }

/* ---------- RWD ---------- */
@media (max-width: 1100px) {
  .lhero { grid-template-columns: 1fr; align-items: start; padding-top: 24vh; }
  .lhero__info { max-width: 620px; padding-right: 0; }
  .ag { grid-template-columns: 1fr; gap: 6vh; }
}
@media (max-width: 860px) {
  .lhero { padding: 20vh var(--gutter) 8vh; gap: 6vh; min-height: 0; }
  .lhero__cw { top: 19vh; font-size: 22px; }
  .lhero__title { font-size: clamp(44px, 15vw, 84px); padding-right: 36px; }
  .lhero__en { font-size: 11px; }
  .lhero__sub { font-size: 14px; letter-spacing: .12em; }
  .lhero__spark { width: 14px; height: 14px; top: -6%; right: 2%; }
  .lhero__meta > div { grid-template-columns: 1fr; gap: 4px; }
  .ag__row > a, .ag__row:not(:has(a)) { grid-template-columns: 6.6em 1fr auto; gap: 10px; }
  .lec { grid-template-columns: 1fr; gap: 3.4vh; padding: 6vh 0; }
  .lec__fig { width: 62%; }
  .lec__name { font-size: 38px; }
  .yidx { position: sticky; }
}
.lhero__meta dd, .lec__fig { margin: 0; }
@media (max-width: 860px) { .lec__title { font-size: 20px; } .lec__spark { left: -8px; width: 14px; height: 14px; } }

/* 頁首副標與首頁主視覺統一：英文粗體＋引線、中文副標細體無襯線，位置同首頁（英文在第一列底、中文在第二列） */
.lhero__title { column-gap: 2vw; }
.lhero__en { grid-row: 1; align-self: end; margin-bottom: 1.4vw; position: relative; padding-left: clamp(46px, 6vw, 110px); font-family: var(--f-en); font-weight: 700; font-size: clamp(12px, 1vw, 17px); line-height: 1.25; letter-spacing: .02em; }
.lhero__en::before { content: ""; position: absolute; left: 0; top: 50%; width: clamp(36px, 4.8vw, 90px); height: 1px; background: var(--fg); }
.lhero__sub { grid-row: 2; align-self: center; padding: 0 0 0 clamp(46px, 6vw, 110px); font-family: inherit; font-weight: 300; font-size: clamp(16px, 1.5vw, 26px); line-height: 1.5; letter-spacing: .12em; }
@media (max-width: 860px) {
  .lhero__en { padding-left: 30px; font-size: 10.5px; margin-bottom: 2vw; }
  .lhero__en::before { width: 22px; }
  .lhero__sub { padding-left: 30px; font-size: 13px; }
}
@media (max-width: 860px) { .lhero__sub { white-space: nowrap; font-size: 12px; letter-spacing: .08em; } .lhero__title { padding-right: 44px; column-gap: 3vw; } }
.ag__w small { display: block; margin-top: 6px; font-family: var(--f-en); font-weight: 300; font-size: 12.5px; line-height: 1.6; letter-spacing: .01em; color: var(--muted); }
.ag__en { margin-left: 10px; font-family: var(--f-en); font-weight: 300; font-size: 13px; letter-spacing: .02em; color: var(--muted); }
/* 場次標籤與時間置中對齊，後接灰色日期 */
.lec__no { align-items: center; }
.lec__no b { line-height: 1.4; }
.lec__no span { line-height: 1; }
.lec__no em { font-style: normal; font-family: var(--f-en); font-size: 12px; font-weight: 500; letter-spacing: .12em; color: var(--muted); }
.lec__no em { opacity: .55; font-weight: 400; }

/* ---------- 頁首進場：大標逐行淡入上移 → 英文引線長出 → 副標浮現 ---------- */
.lhero.is-anim .lhero__kv, .lhero.is-anim .lhero__en, .lhero.is-anim .lhero__sub, .lhero.is-anim .lhero__spark { opacity: 0; transform: translateY(24px); filter: blur(6px); }
.lhero.is-anim .lhero__en::before { transform: scaleX(0); transform-origin: left; }
.lhero.is-anim.is-in .lhero__kv, .lhero.is-anim.is-in .lhero__en, .lhero.is-anim.is-in .lhero__sub, .lhero.is-anim.is-in .lhero__spark { opacity: 1; transform: none; filter: none; transition: opacity 1.1s var(--ease), transform 1.1s var(--ease), filter 1.1s var(--ease); }
.lhero.is-anim.is-in .lhero__kv:nth-of-type(3) { transition-delay: .12s; }
.lhero.is-anim.is-in .lhero__kv:nth-of-type(4) { transition-delay: .24s; }
.lhero.is-anim.is-in .lhero__en { transition-delay: .5s; }
.lhero.is-anim.is-in .lhero__en::before { transform: none; transition: transform 1s var(--ease) .45s; }
.lhero.is-anim.is-in .lhero__sub { transition-delay: .65s; }
.lhero.is-anim.is-in .lhero__spark { transition-delay: .8s; }

/* 右側 Cold War Era：縮小、淡一點 */
.lhero__cw { font-size: clamp(22px, 2.2vw, 40px); opacity: .4; }
@media (max-width: 860px) { .lhero__cw { font-size: 18px; } }
@media (max-width: 860px) { .lhero__spark { display: none; } }   /* 手機版右上星星與直書標題重疊，移除 */
@media (min-width: 1101px) { .lhero { align-items: start; min-height: 0; padding-bottom: 12vh; } .lhero__info { padding-top: .4vw; } }   /* 主標與右側日期頂端對齊 */

/* ---------- 研討會電子版手冊（嵌入 FlipHTML5） ---------- */
.hb { margin: 0; }
.hb__cap { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--fg); }
.hb__t { font-size: 18px; font-weight: 400; letter-spacing: .2em; }
.hb__t small { margin-left: 16px; font-family: var(--f-en); font-size: 12px; letter-spacing: .16em; color: var(--muted); text-transform: uppercase; }
.hb__tip { font-size: 12px; letter-spacing: .22em; color: var(--muted); white-space: nowrap; }
.hb__stage { position: relative; margin-top: 3.4vh; padding: clamp(10px, 1.6vw, 26px); background: color-mix(in srgb, var(--bg) 30%, transparent); -webkit-backdrop-filter: blur(2.5px); backdrop-filter: blur(2.5px); border: 1px solid color-mix(in srgb, #fff 55%, transparent); box-shadow: 0 0 0 1px var(--line); }
.hb__spark { position: absolute; left: -10px; top: 22px; z-index: 1; width: 18px; height: 18px; background: var(--fg); clip-path: polygon(50% 0, 58% 42%, 100% 50%, 58% 58%, 50% 100%, 42% 58%, 0 50%, 42% 42%); }
.hb__frame { position: relative; width: 100%; height: 0; padding-top: max(60%, 324px); background: var(--panel); }
.hb__frame iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 0; }
.hb__foot { display: flex; justify-content: flex-end; margin-top: 2.6vh; padding-top: 14px; border-top: 1px solid var(--line); }
.hb__more { display: inline-flex; align-items: center; gap: 14px; font-size: 14px; letter-spacing: .2em; }
.hb__more i { font-style: normal; color: var(--muted); transition: transform .5s var(--ease), color .3s; }
.hb__more:hover i { transform: translate(4px, -4px); color: var(--fg); }
@media (max-width: 860px) {
  .hb__cap { flex-direction: column; gap: 6px; }
  .hb__t small { display: block; margin: 4px 0 0; }
  .hb__stage { padding: 8px; }
  .hb__spark { left: -6px; width: 14px; height: 14px; }
}
