/* ===================================================================
   Tessly Academy — 新創財務雙週實戰營（初階／進階）專用樣式
   -------------------------------------------------------------------
   疊在 marketing-shell.css 之上：沿用 tessly.app 的字體、主色、灰階，
   只在 .bc 容器內加上實戰營頁面自己的版型；海報視覺（海軍藍→藍綠漸層、
   直向光束紋理、斜切標籤）以 teal 強調色融入 Tessly 藍色系統。
   =================================================================== */
.bc {
  --primary: #3b82f6;
  --primary-hover: #2563eb;
  --primary-deep: #1d4ed8;
  --primary-tint: #eff6ff;
  --primary-border: #bfdbfe;
  --primary-soft: #93c5fd;
  --primary-glow: #60a5fa;
  --teal: #5eead4;            /* 海報 teal，深底強調 */
  --teal-strong: #14b8a6;
  --teal-deep: #0f766e;
  --teal-tint: #ccfbf1;
  --lvl1-pink: #ff779f;        /* 初階海報粉 — 純色塊用（頂線、badge 底色） */
  --lvl2-yellow: #caec00;      /* 進階海報黃 — 純色塊用（頂線、badge 底色） */
  --lvl-ink: #142628;          /* 海報底色，作為粉／黃底上的深色文字 */
  --lvl1-pink-text: #e0356f;   /* 粉的加深版：白底上當文字色，原始粉對白底對比不足 */
  --lvl2-yellow-text: #7a8a00; /* 黃的加深版：同理，caec00 對白底幾乎讀不出來 */
  --navy: #0f172a;
  --navy-deep: #0a0e1a;
  --navy-2: #1e293b;
  --navy-border: #334155;
  --navy-tint: #f1f5f9;
  --success: #22c55e;
  --success-soft: #6ee7b7;
  --success-tint: #dcfce7;
  --warning: #f59e0b;
  --warning-deep: #b45309;
  --warning-tint: #fef3c7;
  --danger: #ef4444;
  --danger-soft: #fca5a5;
  --danger-tint: #fee2e2;
  --border: #e2e8f0;
  --border-strong: #cbd5e1;
  --text: #0f172a;
  --text-muted: #475569;
  --text-faint: #94a3b8;
  --bg: #f7f9fc;
  --surface: #ffffff;
  --sh-sm: 0 1px 2px rgba(15,23,42,.04);
  --sh-md: 0 4px 12px rgba(15,23,42,.06);
  --sh-lg: 0 8px 24px rgba(15,23,42,.12);
  --sh-xl: 0 30px 80px rgba(2,6,23,.45);
  --r-sm: 6px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px; --r-2xl: 20px;
  --head: var(--marketing-font);
  --sans: var(--marketing-font);
  --mono: "JetBrains Mono", "SFMono-Regular", ui-monospace, Consolas, monospace;
  font-family: var(--sans); color: var(--text); line-height: 1.65; overflow-x: clip;
}
.bc *, .bc *::before, .bc *::after { margin:0; padding:0; box-sizing:border-box; }
.bc img { max-width:100%; display:block; }
.bc strong, .bc b { font-weight:700; }
.bc :focus-visible { outline:2px solid var(--primary); outline-offset:3px; }

/* ---------- LAYOUT ---------- */
.wrap { max-width:1140px; margin:0 auto; padding:0 1.5rem; }
.section { padding:6rem 0; }
.section-tint { background:var(--navy-tint); }
.section-dark { background:var(--navy); color:#fff; }
@media(max-width:800px){ .section { padding:4rem 0; } .br-desk { display:none; } }
.label { font-family:var(--mono); font-size:.68rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--primary-deep); margin-bottom:1rem; display:flex; align-items:center; gap:.6rem; }
.label::before { content:''; width:22px; height:2px; background:var(--primary); border-radius:2px; }
.section-dark .label { color:var(--primary-soft); }
.section-dark .label::before { background:var(--primary-glow); }
.h2 { font-family:var(--head); font-weight:700; font-size:clamp(1.85rem,3.4vw,2.6rem); line-height:1.25; letter-spacing:-0.02em; margin-bottom:1.25rem; }
.h2 em { font-style:normal; color:var(--primary); }
.section-dark .h2 em { color:var(--primary-soft); }
.lede { font-size:1.05rem; line-height:1.85; color:var(--text-muted); max-width:680px; }
.section-dark .lede { color:rgba(255,255,255,0.75); }
.lede + .lede { margin-top:1rem; }
#why .lede { max-width:none; }
.center { text-align:center; }
.center .label { justify-content:center; }
.center .label::before { display:none; }
.center .lede { margin-left:auto; margin-right:auto; }

/* ---------- NAV ----------
   Page-local header: not the site's marketing-header (no Solutions/Workflow
   mega-menus, no links out to /pricing /support /academy). Links are this
   page's own section anchors — the "structure" is whatever that page's own
   <section id> set is (see the three HTML files). Reuses .bc's own tokens by
   carrying the .bc class itself, since it sits outside <main class="bc">. */
.bc-nav-sentinel { position:absolute; top:24px; left:0; width:1px; height:1px; pointer-events:none; }
.bc-nav-skip { position:fixed; top:16px; left:16px; z-index:60; transform:translateY(-160%); border-radius:var(--r-sm); background:var(--surface); padding:.5rem 1rem; color:var(--text); font-size:.85rem; font-weight:700; box-shadow:var(--sh-lg); transition:transform .2s; }
.bc-nav-skip:focus { transform:translateY(0); }
.bc-nav { position:fixed; inset:0 0 auto; z-index:30; border-bottom:1px solid transparent; background:transparent; transition:background-color .3s ease, border-color .3s ease, box-shadow .3s ease; }
.bc-nav.is-scrolled, .bc-nav.is-menu-open { border-color:var(--border); background:rgba(247,249,252,0.92); box-shadow:var(--sh-sm); backdrop-filter:blur(18px); }
.bc-nav-inner { display:flex; width:100%; max-width:1140px; height:64px; margin:0 auto; padding:0 1.5rem; align-items:center; justify-content:space-between; gap:1.5rem; }
.bc-nav-word { flex-shrink:0; font-family:var(--head); font-weight:700; font-size:.92rem; letter-spacing:-.01em; color:#fff; text-decoration:none; }
.bc-nav.is-scrolled .bc-nav-word, .bc-nav.is-menu-open .bc-nav-word { color:var(--text); }
.bc-nav-links { display:flex; align-items:center; gap:1.5rem; }
.bc-nav-links a { color:rgba(255,255,255,0.8); font-size:.85rem; font-weight:600; text-decoration:none; transition:color .2s; }
.bc-nav-links a:hover { color:#fff; }
.bc-nav.is-scrolled .bc-nav-links a, .bc-nav.is-menu-open .bc-nav-links a { color:var(--text-muted); }
.bc-nav.is-scrolled .bc-nav-links a:hover, .bc-nav.is-menu-open .bc-nav-links a:hover { color:var(--text); }
.bc-nav-actions { display:flex; align-items:center; gap:.75rem; flex-shrink:0; }
.bc-nav-lang { color:rgba(255,255,255,0.7); font-family:var(--mono); font-size:.78rem; font-weight:600; letter-spacing:.03em; text-decoration:none; transition:color .2s; }
.bc-nav-lang:hover { color:#fff; }
.bc-nav.is-scrolled .bc-nav-lang, .bc-nav.is-menu-open .bc-nav-lang { color:var(--text-muted); }
.bc-nav.is-scrolled .bc-nav-lang:hover, .bc-nav.is-menu-open .bc-nav-lang:hover { color:var(--text); }
.bc-nav-cta { display:inline-flex; height:36px; align-items:center; justify-content:center; border-radius:var(--r-md); padding:0 .95rem; background:var(--teal); color:var(--navy-deep); font-size:.82rem; font-weight:700; text-decoration:none; white-space:nowrap; transition:background .2s, transform .2s; }
.bc-nav-cta:hover { background:var(--teal-strong); transform:translateY(-1px); }
.bc-nav-toggle { display:none; width:36px; height:36px; flex-shrink:0; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:1px solid rgba(255,255,255,0.24); border-radius:var(--r-md); background:rgba(255,255,255,0.08); cursor:pointer; }
.bc-nav-toggle span { display:block; width:16px; height:2px; border-radius:999px; background:#fff; }
.bc-nav.is-scrolled .bc-nav-toggle, .bc-nav.is-menu-open .bc-nav-toggle { border-color:var(--border); background:rgba(250,250,249,0.7); }
.bc-nav.is-scrolled .bc-nav-toggle span, .bc-nav.is-menu-open .bc-nav-toggle span { background:var(--text); }
.bc-mobile-menu { display:none; }
@media(max-width:900px){
  .bc-nav-links { display:none; }
  .bc-nav-toggle { display:inline-flex; }
  .bc-mobile-menu { gap:.6rem; border-top:1px solid var(--border); background:rgba(247,249,252,0.98); padding:.85rem 1.1rem 1.1rem; box-shadow:var(--sh-lg); }
  .bc-mobile-menu.is-open { display:grid; }
  .bc-mobile-menu a { display:flex; min-height:42px; align-items:center; border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface); padding:0 .75rem; color:var(--text); font-size:.9rem; font-weight:700; text-decoration:none; }
  .bc-mobile-menu a.bc-mobile-cta { background:var(--teal); border-color:var(--teal); color:var(--navy-deep); }
}
@media(max-width:420px){ .bc-nav-cta { display:none; } }

/* ---------- BUTTONS ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.95rem 1.6rem; border-radius:var(--r-md); font-family:inherit; font-weight:700; font-size:.95rem; text-decoration:none; cursor:pointer; border:1px solid transparent; transition:background .2s, border-color .2s, transform .2s, box-shadow .2s; }
.btn-primary { background:var(--primary); color:#fff; box-shadow:0 8px 24px rgba(59,130,246,0.32); }
.btn-primary:hover { background:var(--primary-hover); transform:translateY(-1px); }
.btn-dark { background:var(--navy); color:#fff; }
.btn-dark:hover { background:var(--navy-2); transform:translateY(-1px); }
.btn-ghost-light { background:rgba(255,255,255,0.04); color:#fff; border-color:rgba(255,255,255,0.22); }
.btn-ghost-light:hover { border-color:#fff; background:rgba(255,255,255,0.08); transform:translateY(-1px); }
.btn-ghost { background:transparent; color:var(--text); border-color:var(--border-strong); }
.btn-ghost:hover { border-color:var(--text); transform:translateY(-1px); }
.btn-lg { padding:1.1rem 2.1rem; font-size:1.02rem; }
.btn-white { background:#fff; color:var(--primary-deep); }
.btn-white:hover { background:var(--primary-tint); transform:translateY(-1px); }

/* ---------- HERO ---------- */
.hero { color:#fff; position:relative; overflow:hidden; padding:9.5rem 0 5.5rem;
  background:linear-gradient(120deg, #0a1628 0%, #0f2444 38%, #113a52 72%, #0f4f5c 100%); }
/* 格線背景（比照 2026-08-20 新版海報）：48px 方格、1px 細線，水平+垂直兩層 repeating-linear-
   gradient 疊出網格紙質感，取代舊版單向直紋。顏色／透明度／mask 沿用舊版判斷（頂部全強度、
   中段標題區降到六成、底部 hero-meta 降到三成，避免干擾文字閱讀——見下方 mask-image）。 */
.hero::before { content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    repeating-linear-gradient(90deg, rgba(255,255,255,0.07) 0, rgba(255,255,255,0.07) 1px, transparent 1px, transparent 48px),
    repeating-linear-gradient(0deg, rgba(255,255,255,0.07) 0, rgba(255,255,255,0.07) 1px, transparent 1px, transparent 48px);
  mask-image:linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,.6) 40%, rgba(0,0,0,.3) 100%);
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,.6) 40%, rgba(0,0,0,.3) 100%); }
.hero::after { content:''; position:absolute; width:820px; height:820px; right:-300px; top:-320px; background:radial-gradient(circle, rgba(94,234,212,0.22) 0%, rgba(59,130,246,0.16) 35%, rgba(59,130,246,0) 65%); pointer-events:none; }
.hero .wrap { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr); gap:4rem; align-items:center; }
.hero-badge { display:inline-flex; align-items:center; gap:.55rem; background:rgba(94,234,212,0.12); border:1px solid rgba(94,234,212,0.45); color:#CCFBF1; font-family:var(--mono); font-size:.68rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; padding:.45rem .95rem; border-radius:100px; margin-bottom:1.5rem; }
.hero-badge .dot { width:7px; height:7px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 4px rgba(94,234,212,0.22); animation:pulseDot 2s ease-in-out infinite; }
@keyframes pulseDot { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.4; transform:scale(.8); } }
.hero-kicker { font-family:var(--mono); font-size:.72rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,0.6); margin-bottom:1rem; display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.hero-kicker .lvl { display:inline-flex; align-items:center; gap:.4rem; padding:.25rem .6rem; border-radius:100px; background:var(--primary); color:#fff; font-weight:600; letter-spacing:.1em; }
.hero-title { text-shadow:0 2px 24px rgba(2,6,23,.35); }
.hero-title { font-family:var(--head); font-weight:700; font-size:clamp(2.2rem,5vw,3.9rem); line-height:1.16; letter-spacing:-0.025em; margin-bottom:.75rem; }
.hero-title .line { display:block; }
.hero-title em { font-style:normal; color:var(--teal); }
.hero-sub-title { font-family:var(--head); font-weight:500; font-size:clamp(1.1rem,1.9vw,1.4rem); color:rgba(255,255,255,0.78); margin-bottom:1.5rem; line-height:1.5; letter-spacing:-0.005em; }
.hero-lede { font-size:1.08rem; line-height:1.8; color:rgba(255,255,255,0.8); max-width:600px; }
.hero-lede strong { color:#fff; font-weight:700; }
.hero-actions { display:flex; align-items:center; gap:.85rem; margin-top:2rem; flex-wrap:wrap; }
.hero-meta { display:flex; flex-wrap:wrap; gap:.75rem 1.75rem; margin-top:2rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,0.12); }
.hero-meta div { font-size:.8rem; color:rgba(255,255,255,0.65); }
.hero-meta b { display:block; color:#fff; font-family:var(--mono); font-size:.95rem; font-weight:600; letter-spacing:.01em; margin-bottom:.1rem; }
.hero-meta b .u { font-size:.68rem; opacity:.65; margin-left:.15rem; }
.hero-meta b[data-venue] { font-family:var(--sans); letter-spacing:0; }
@media(max-width:1000px){ .hero { padding:7.5rem 0 4rem; } .hero .wrap { grid-template-columns:1fr; gap:2.75rem; } }
@media(max-width:600px){ .hero { padding:6rem 0 3.5rem; } .hero-actions .btn { width:100%; } .hero-meta { gap:.75rem 1.25rem; } }

/* ---------- SIM WIDGET (深底玻璃卡) ---------- */
.sim { background:rgba(255,255,255,0.045); border:1px solid rgba(255,255,255,0.14); border-radius:var(--r-xl); padding:1.5rem; backdrop-filter:blur(8px); box-shadow:var(--sh-xl); }
.sim-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.sim-head .s-tag { font-family:var(--mono); font-size:.66rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--primary-soft); display:flex; align-items:center; gap:.5rem; }
.sim-head .s-tag::before { content:''; width:7px; height:7px; border-radius:50%; background:var(--primary-glow); box-shadow:0 0 0 4px rgba(96,165,250,0.22); }
.sim-head .s-live { font-family:var(--mono); font-size:.62rem; letter-spacing:.08em; color:rgba(255,255,255,0.62); text-transform:uppercase; }
.sim-q { font-family:var(--head); font-weight:600; font-size:1.08rem; line-height:1.5; margin-bottom:1.25rem; letter-spacing:-0.01em; }
.sim-q span { color:rgba(255,255,255,0.6); font-family:var(--mono); font-weight:500; font-size:.68rem; letter-spacing:.1em; display:block; margin-bottom:.35rem; text-transform:uppercase; }
.sim-grid { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:.9rem; }
.s-field { background:rgba(2,6,23,0.35); border:1px solid rgba(255,255,255,0.1); border-radius:var(--r-lg); padding:.7rem .85rem; transition:border-color .2s, box-shadow .2s; }
.s-field:focus-within { border-color:var(--primary-glow); box-shadow:0 0 0 3px rgba(96,165,250,0.25); }
.s-field label { display:block; font-size:.7rem; color:rgba(255,255,255,0.68); margin-bottom:.25rem; }
.s-field .s-input { display:flex; align-items:baseline; gap:.3rem; }
.s-field input[type=number] { width:100%; background:transparent; border:none; color:#fff; font-family:var(--mono); font-size:1.15rem; font-weight:600; outline:none; -moz-appearance:textfield; }
.s-field input[type=number]::-webkit-outer-spin-button, .s-field input[type=number]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.s-field .unit { font-family:var(--mono); font-size:.66rem; color:rgba(255,255,255,0.62); white-space:nowrap; }
.s-slider { background:rgba(2,6,23,0.35); border:1px solid rgba(255,255,255,0.1); border-radius:var(--r-lg); padding:.8rem .9rem .95rem; margin-bottom:.9rem; }
.s-slider .sl-row { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:.5rem; gap:.75rem; }
.s-slider label { font-size:.74rem; color:rgba(255,255,255,0.72); }
.s-slider output { font-family:var(--mono); font-weight:600; font-size:1rem; color:var(--primary-soft); white-space:nowrap; }
.s-slider input[type=range] { width:100%; -webkit-appearance:none; appearance:none; height:6px; border-radius:3px; background:linear-gradient(90deg, var(--primary-glow) var(--pct,50%), rgba(255,255,255,0.15) var(--pct,50%)); cursor:pointer; }
.s-slider input[type=range]:focus-visible { outline:2px solid var(--primary-glow); outline-offset:6px; }
.s-slider input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; width:20px; height:20px; border-radius:50%; background:#fff; border:3px solid var(--primary); box-shadow:0 2px 8px rgba(0,0,0,0.4); cursor:grab; }
.s-slider input[type=range]::-moz-range-thumb { width:20px; height:20px; border-radius:50%; background:#fff; border:3px solid var(--primary); box-shadow:0 2px 8px rgba(0,0,0,0.4); cursor:grab; }
.s-slider .sl-ticks { position:relative; height:.9rem; font-family:var(--mono); font-size:.6rem; color:rgba(255,255,255,0.6); margin-top:.4rem; }
.s-slider .sl-ticks span { position:absolute; top:0; transform:translateX(-50%); white-space:nowrap; }
.s-slider .sl-ticks span:first-child { transform:none; }
.s-slider .sl-ticks span:last-child { transform:translateX(-100%); }
.sim-out { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.s-card { border-radius:var(--r-lg); padding:.9rem 1rem; border:1px solid rgba(255,255,255,0.12); background:rgba(255,255,255,0.03); }
.s-card .k { font-family:var(--mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,0.62); margin-bottom:.35rem; }
.s-card .v { font-family:var(--head); font-size:1.9rem; line-height:1; font-weight:700; letter-spacing:-0.03em; }
.s-card .v small { font-family:var(--sans); font-size:.72rem; font-weight:500; opacity:.65; margin-left:.25rem; letter-spacing:0; }
.s-card.now .v { color:rgba(255,255,255,0.88); }
.s-card.after { border-color:rgba(252,165,165,0.5); background:rgba(239,68,68,0.12); }
.s-card.after .v { color:var(--danger-soft); }
.s-card.after.ok { border-color:rgba(110,231,183,0.5); background:rgba(34,197,94,0.1); }
.s-card.after.ok .v { color:var(--success-soft); }
.s-card.hl { border-color:rgba(147,197,253,0.5); background:rgba(59,130,246,0.14); }
.s-card.hl .v { color:#DBEAFE; }
.s-card .sub { font-family:var(--mono); font-size:.62rem; letter-spacing:.04em; color:rgba(255,255,255,0.65); margin-top:.45rem; }
.s-card.after.ok .sub, .s-card.hl.ok .sub { color:rgba(255,255,255,0.7); }
.s-card.hl.ok { border-color:rgba(110,231,183,0.5); background:rgba(34,197,94,0.1); }
.s-card.hl.ok .v { color:var(--success-soft); }
.s-bar { grid-column:1/-1; margin-top:1.1rem; }
.s-bar .bar-track { height:10px; border-radius:5px; background:rgba(255,255,255,0.1); position:relative; }
.s-bar .bar-now { position:absolute; inset:0 auto 0 0; background:rgba(255,255,255,0.28); border-radius:5px; transition:width .35s cubic-bezier(.4,0,.2,1); }
.s-bar .bar-after { position:absolute; inset:0 auto 0 0; background:linear-gradient(90deg,#DC2626,#F87171); border-radius:5px; transition:width .35s cubic-bezier(.4,0,.2,1), background .3s; }
.s-bar .bar-after.ok { background:linear-gradient(90deg,#059669,#34D399); }
.s-bar .bar-after.blue { background:linear-gradient(90deg,#2563EB,#60A5FA); }
.s-bar .bar-mark { position:absolute; top:-4px; bottom:-4px; width:2px; background:rgba(255,255,255,0.75); }
.s-bar .bar-mark::after { content:attr(data-label); position:absolute; top:-1.15rem; left:50%; transform:translateX(-50%); font-family:var(--mono); font-size:.58rem; color:rgba(255,255,255,0.7); white-space:nowrap; }
.s-bar .bar-labels { display:flex; justify-content:space-between; font-family:var(--mono); font-size:.6rem; color:rgba(255,255,255,0.6); margin-top:.45rem; }
.sim-verdict { margin-top:1rem; font-size:.84rem; line-height:1.65; color:rgba(255,255,255,0.78); padding:.85rem 1rem; border-radius:var(--r-lg); background:rgba(2,6,23,0.35); border-left:3px solid var(--danger-soft); }
.sim-verdict.ok { border-left-color:var(--success-soft); }
.sim-verdict.blue { border-left-color:var(--primary-glow); }
.sim-verdict b { color:#fff; }
.sim-foot { margin-top:.85rem; font-size:.7rem; color:rgba(255,255,255,0.62); line-height:1.5; }
@media(max-width:420px){ .sim { padding:1.15rem; } .sim-grid, .sim-out { grid-template-columns:1fr; } .s-bar { grid-column:auto; } }

/* ---------- TICKER ---------- */
.ticker { background:var(--navy-2); border-top:1px solid rgba(255,255,255,0.08); border-bottom:1px solid rgba(255,255,255,0.08); overflow:hidden; }
.ticker-inner { display:flex; width:max-content; animation:ticker 48s linear infinite; }
.ticker:hover .ticker-inner, .ticker:focus-within .ticker-inner { animation-play-state:paused; }
.ticker span { display:inline-flex; align-items:center; gap:.75rem; padding:.85rem 2rem; font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,0.62); white-space:nowrap; }
.ticker span::before { content:''; width:5px; height:5px; border-radius:50%; background:var(--primary-glow); }
@keyframes ticker { from { transform:translateX(0); } to { transform:translateX(-33.3333%); } }
@media (prefers-reduced-motion: reduce) { .ticker-inner { animation:none; } .hero-badge .dot { animation:none; } }

/* ---------- CONTRAST PAIR (你說 vs 他們算) ---------- */
.misalign { display:grid; grid-template-columns:1fr auto 1fr; gap:1.5rem; align-items:stretch; margin:3rem 0 2.5rem; }
.ma-card { border-radius:var(--r-xl); padding:2rem; position:relative; }
.ma-card .ma-who { font-family:var(--mono); font-size:.66rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; margin-bottom:1rem; display:flex; align-items:center; gap:.5rem; }
.ma-card .ma-quote { font-family:var(--head); font-weight:600; font-size:clamp(1.2rem,2.1vw,1.55rem); line-height:1.5; letter-spacing:-0.01em; }
.ma-card .ma-note { font-size:.86rem; margin-top:1rem; line-height:1.7; opacity:.8; }
.ma-you { background:var(--surface); border:1px solid var(--border); box-shadow:var(--sh-sm); }
.ma-you .ma-who { color:var(--primary-deep); }
.ma-vc { background:var(--navy); color:#fff; }
.ma-vc .ma-who { color:var(--primary-soft); }
.ma-vs { display:grid; place-items:center; }
.ma-vs span { width:44px; height:44px; border-radius:50%; border:1px solid var(--border-strong); display:grid; place-items:center; background:var(--bg); font-family:var(--mono); font-size:.68rem; font-weight:600; letter-spacing:.05em; color:var(--text-muted); }
@media(max-width:760px){ .misalign { grid-template-columns:1fr; gap:.75rem; } .ma-vs { padding:.25rem 0; } }

/* ---------- PILLARS ---------- */
.pillars { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-top:3rem; }
.pillar { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-xl); padding:2rem; transition:box-shadow .3s, transform .3s, border-color .3s; }
.pillar:hover { box-shadow:var(--sh-md); transform:translateY(-2px); border-color:var(--primary-border); }
.pillar .p-num { font-family:var(--mono); font-size:.66rem; font-weight:600; letter-spacing:.12em; color:var(--text-muted); margin-bottom:1.25rem; }
.pillar .p-icon { width:44px; height:44px; border-radius:var(--r-lg); display:grid; place-items:center; margin-bottom:1.25rem; }
.pillar .p-icon svg { width:22px; height:22px; }
.pillar h3 { font-family:var(--head); font-weight:700; font-size:1.2rem; margin-bottom:.6rem; line-height:1.4; letter-spacing:-0.01em; }
.pillar p { font-size:.9rem; line-height:1.75; color:var(--text-muted); }
.pillar p b { color:var(--text); }
.pi-blue { background:var(--primary-tint); color:var(--primary-deep); }
.pi-green { background:var(--success-tint); color:#047857; }
.pi-navy { background:var(--navy); color:#fff; }
.pi-amber { background:var(--warning-tint); color:var(--warning-deep); }
@media(max-width:900px){ .pillars { grid-template-columns:1fr; } }

/* ---------- AGENDA ---------- */
.agenda-time { display:inline-flex; align-items:center; gap:.6rem; font-family:var(--mono); font-size:.76rem; font-weight:600; letter-spacing:.06em; color:rgba(255,255,255,0.85); border:1px solid rgba(255,255,255,0.2); padding:.5rem .9rem; border-radius:100px; margin-top:.5rem; flex-wrap:wrap; }
.agenda-time svg { width:14px; height:14px; flex-shrink:0; }
.agenda-time .sep { opacity:.4; }
.days { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:3rem; }
.day { background:var(--navy-2); border:1px solid rgba(255,255,255,0.1); border-radius:var(--r-2xl); padding:2.5rem; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.day::before { content:attr(data-num); position:absolute; right:1.5rem; top:.5rem; font-family:var(--head); font-size:8rem; line-height:1; font-weight:700; color:rgba(255,255,255,0.04); pointer-events:none; letter-spacing:-0.06em; }
.day-top { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin-bottom:1.25rem; }
.day-num { font-family:var(--mono); font-size:.68rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#fff; background:var(--primary); padding:.35rem .75rem; border-radius:var(--r-sm); }
.day-week { font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,0.6); }
.day-date { font-family:var(--mono); font-size:.68rem; letter-spacing:.06em; color:rgba(255,255,255,0.75); margin-left:auto; }
.day-tag { font-family:var(--head); font-weight:600; font-size:.9rem; color:var(--primary-soft); letter-spacing:.14em; margin-bottom:.5rem; }
.day h3 { font-family:var(--head); font-weight:700; font-size:clamp(1.4rem,2.3vw,1.75rem); line-height:1.35; margin-bottom:.65rem; letter-spacing:-0.015em; }
.day .day-sub { font-size:.95rem; color:rgba(255,255,255,0.7); line-height:1.7; margin-bottom:1.75rem; padding-bottom:1.5rem; border-bottom:1px solid rgba(255,255,255,0.1); }
.day ul { list-style:none; display:flex; flex-direction:column; gap:1.1rem; flex:1; }
.day li { display:grid; grid-template-columns:28px 1fr; gap:.85rem; align-items:start; }
.day li .li-ic { width:28px; height:28px; border-radius:var(--r-md); background:rgba(59,130,246,0.15); border:1px solid rgba(147,197,253,0.3); display:grid; place-items:center; font-family:var(--mono); font-size:.64rem; font-weight:600; color:var(--primary-soft); margin-top:.1rem; }
.day li b { display:block; font-size:1rem; font-weight:700; margin-bottom:.2rem; color:#fff; }
.day li p { font-size:.9rem; line-height:1.7; color:rgba(255,255,255,0.72); }
.day li p code { font-family:var(--mono); font-size:.82em; background:rgba(255,255,255,0.09); padding:.1em .4em; border-radius:4px; color:#BFDBFE; }
.day-unlock { margin-top:1.75rem; background:rgba(59,130,246,0.12); border:1px solid rgba(147,197,253,0.35); border-radius:var(--r-lg); padding:1.15rem 1.25rem; display:grid; grid-template-columns:auto 1fr; gap:.9rem; align-items:start; }
.day-unlock .du-ic { width:34px; height:34px; border-radius:var(--r-md); background:var(--primary); display:grid; place-items:center; flex-shrink:0; }
.day-unlock .du-ic svg { width:18px; height:18px; }
.day-unlock .du-k { font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:#BFDBFE; margin-bottom:.25rem; }
.day-unlock .du-v { font-size:.92rem; line-height:1.65; color:#fff; }
.day-2 .day-unlock { background:rgba(34,197,94,0.1); border-color:rgba(110,231,183,0.35); }
.day-2 .day-unlock .du-ic { background:#059669; }
.day-2 .day-unlock .du-k { color:var(--success-soft); }
@media(max-width:900px){ .days { grid-template-columns:1fr; } .day { padding:2rem 1.5rem; } .day::before { font-size:6rem; } }

/* ---------- WHO ---------- */
.who-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-top:3rem; }
.who-grid.lead-first { grid-template-columns:1.1fr 1fr 1fr; }
.who { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-xl); padding:2rem; position:relative; box-shadow:var(--sh-sm); }
.who .w-badge { display:inline-block; font-family:var(--mono); font-size:.64rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:.35rem .7rem; border-radius:var(--r-sm); margin-bottom:1.25rem; }
.who h3 { font-family:var(--head); font-weight:700; font-size:1.2rem; line-height:1.4; margin-bottom:.65rem; letter-spacing:-0.01em; }
.who p { font-size:.92rem; line-height:1.75; color:var(--text-muted); }
.who-req { background:var(--navy); color:#fff; border-color:var(--navy); }
.who-req .w-badge { background:var(--primary); color:#fff; }
.who-req p { color:rgba(255,255,255,0.75); }
.who-req .w-check { margin-top:1.5rem; display:flex; flex-direction:column; gap:.6rem; }
.who-req .w-check div { display:flex; gap:.6rem; align-items:flex-start; font-size:.9rem; color:rgba(255,255,255,0.9); }
.who-req .w-check svg { width:18px; height:18px; flex-shrink:0; margin-top:.2rem; color:var(--success-soft); }
.who-a .w-badge { background:var(--primary-tint); color:var(--primary-deep); border:1px solid var(--primary-border); }
.who-b .w-badge { background:var(--warning-tint); color:var(--warning-deep); }
.who-c .w-badge { background:var(--success-tint); color:#047857; }
@media(max-width:900px){ .who-grid, .who-grid.lead-first { grid-template-columns:1fr; } }

/* ---------- PRICING ---------- */
.price-wrap { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,0.95fr); gap:1.5rem; margin-top:3rem; align-items:stretch; }
.price-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-2xl); padding:2.5rem; box-shadow:var(--sh-lg); position:relative; overflow:hidden; display:flex; flex-direction:column; }
.price-card::before { content:''; position:absolute; left:0; top:0; right:0; height:5px; background:linear-gradient(90deg,var(--primary-deep),var(--primary-glow)); }
.price-k { font-family:var(--mono); font-size:.66rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.75rem; }
.price-v { font-family:var(--head); font-size:clamp(2.8rem,5.5vw,4rem); line-height:1; letter-spacing:-0.03em; font-weight:700; display:flex; align-items:baseline; gap:.35rem; flex-wrap:wrap; }
.price-v .cur { font-size:.42em; color:var(--text-muted); font-weight:500; }
.price-v .per { font-family:var(--sans); font-size:.3em; font-weight:500; color:var(--text-muted); letter-spacing:0; }
.price-note { font-size:.95rem; color:var(--text-muted); margin-top:.75rem; line-height:1.7; }
.price-note b { color:var(--text); }
.price-list { list-style:none; margin-top:1.75rem; padding-top:1.5rem; border-top:1px dashed var(--border-strong); display:flex; flex-direction:column; gap:.85rem; }
.price-list li { display:flex; gap:.75rem; align-items:flex-start; font-size:.95rem; line-height:1.6; }
.price-list li svg { width:20px; height:20px; flex-shrink:0; color:var(--primary); margin-top:.15rem; }
.price-cta { margin-top:auto; padding-top:2rem; }
.price-cta .btn { width:100%; }
.price-cta .pc-sub { text-align:center; font-size:.8rem; color:var(--text-muted); margin-top:.75rem; }
.seats { background:var(--navy); color:#fff; border-radius:var(--r-2xl); padding:2.5rem; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.seats::after { content:''; position:absolute; width:340px; height:340px; right:-130px; bottom:-150px; background:radial-gradient(circle, rgba(59,130,246,0.4) 0%, rgba(59,130,246,0) 65%); pointer-events:none; }
.seats .price-k { color:rgba(255,255,255,0.62); }
.seats-num { font-family:var(--head); font-size:clamp(3.4rem,7vw,5.25rem); line-height:.95; font-weight:700; letter-spacing:-0.04em; display:flex; align-items:baseline; gap:.5rem; }
.seats-num small { font-family:var(--sans); font-size:1rem; font-weight:500; opacity:.75; letter-spacing:0; }
.seats-p { font-size:.95rem; color:rgba(255,255,255,0.75); line-height:1.75; margin-top:.85rem; }
.seat-row { display:grid; grid-template-columns:repeat(5,1fr); gap:.6rem; margin:1.75rem 0; position:relative; z-index:1; }
.seat { aspect-ratio:1; border-radius:var(--r-lg); border:1px solid rgba(147,197,253,0.3); background:rgba(59,130,246,0.08); display:grid; place-items:center; font-family:var(--mono); font-size:.7rem; color:rgba(255,255,255,0.65); position:relative; }
.seat::before { content:''; position:absolute; inset:6px; border-radius:8px; border:1px dashed rgba(147,197,253,0.25); }
.seat span { position:relative; }
.seats-warn { margin-top:auto; background:rgba(245,158,11,0.14); border:1px solid rgba(251,191,36,0.4); border-radius:var(--r-lg); padding:1rem 1.15rem; font-size:.86rem; line-height:1.7; color:rgba(255,255,255,0.9); display:grid; grid-template-columns:auto 1fr; gap:.75rem; align-items:start; position:relative; z-index:1; }
.seats-warn .sw-ic { font-size:1rem; margin-top:.05rem; }
.seats-warn b { color:#FCD34D; }
@media(max-width:900px){ .price-wrap { grid-template-columns:1fr; } .price-card, .seats { padding:2rem 1.5rem; } }

/* ---------- FORM ---------- */
.apply-grid { display:grid; grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr); gap:3rem; align-items:start; margin-top:.5rem; }
.apply-grid.single { grid-template-columns:1fr; }
.apply-side { position:sticky; top:88px; }
.apply-side .h2 { margin-bottom:1rem; font-size:clamp(1.65rem,2.5vw,2.15rem); }
.apply-steps { list-style:none; margin-top:2rem; display:flex; flex-direction:column; }
.apply-steps li { display:grid; grid-template-columns:36px 1fr; gap:1rem; padding:1.15rem 0; border-top:1px solid var(--border); }
.apply-steps li:last-child { border-bottom:1px solid var(--border); }
.apply-steps .as-n { width:36px; height:36px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; font-family:var(--mono); font-size:.78rem; font-weight:600; }
.apply-steps b { display:block; font-size:.98rem; margin-bottom:.15rem; }
.apply-steps p { font-size:.86rem; color:var(--text-muted); line-height:1.65; }
.apply-form { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-2xl); padding:2.25rem; box-shadow:var(--sh-md); }
.form-title { font-family:var(--head); font-weight:700; font-size:1.5rem; line-height:1.3; margin-bottom:.35rem; letter-spacing:-0.015em; }
.form-sub { font-size:.88rem; color:var(--text-muted); margin-bottom:1.75rem; line-height:1.65; }
.form-notice { background:var(--warning-tint); border:1px solid #FDE68A; color:#92400E; font-size:.85rem; line-height:1.6; padding:.85rem 1rem; border-radius:var(--r-lg); margin-bottom:1.25rem; }
.fs-title { font-family:var(--mono); font-size:.66rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--primary-deep); margin:1.75rem 0 1rem; padding-bottom:.5rem; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.5rem; }
.fs-title:first-of-type { margin-top:0; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field { margin-bottom:1.1rem; }
.field label { display:block; font-size:.8rem; font-weight:700; letter-spacing:.01em; margin-bottom:.4rem; color:var(--text); }
.field label .req, .form-sub .req { color:#b91c1c; margin-left:.15rem; }
.field label .opt { color:var(--text-muted); font-weight:500; font-size:.72rem; margin-left:.3rem; }
.field input, .field select, .field textarea { width:100%; font-family:inherit; font-size:.95rem; color:var(--text); background:var(--bg); border:1px solid var(--border-strong); border-radius:var(--r-md); padding:.8rem .95rem; transition:border-color .2s, box-shadow .2s, background .2s; -webkit-appearance:none; appearance:none; }
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color:var(--primary); background:#fff; box-shadow:0 0 0 3px rgba(59,130,246,0.18); }
.field input::placeholder, .field textarea::placeholder { color:#64748b; }
.field select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23475569' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .95rem center; padding-right:2.4rem; cursor:pointer; }
.field select.placeholder { color:#64748b; }
.field textarea { min-height:120px; resize:vertical; line-height:1.6; }
.field .hint { font-size:.76rem; color:var(--text-muted); margin-top:.35rem; line-height:1.5; }
.field.invalid input, .field.invalid select, .field.invalid textarea { border-color:var(--danger); background:#FEF2F2; }
.field .err { display:none; font-size:.76rem; color:#B91C1C; margin-top:.35rem; }
.field.invalid .err { display:block; }
.form-foot { margin-top:1.5rem; }
.form-submit { width:100%; padding:1.1rem; background:var(--primary); color:#fff; border:none; border-radius:var(--r-md); font-family:inherit; font-weight:700; font-size:1rem; cursor:pointer; transition:background .2s, transform .2s; box-shadow:0 8px 24px rgba(59,130,246,0.28); }
.form-submit:hover { background:var(--primary-hover); transform:translateY(-1px); }
.form-submit:disabled { background:var(--text-faint); cursor:not-allowed; box-shadow:none; transform:none; }
.form-legal { font-size:.78rem; color:var(--text-muted); text-align:center; margin-top:.85rem; line-height:1.6; }
.form-success { display:none; text-align:center; padding:2rem .5rem; }
.form-success .ok-ic { width:64px; height:64px; border-radius:50%; background:var(--success-tint); color:#047857; display:grid; place-items:center; margin:0 auto 1.25rem; }
.form-success .ok-ic svg { width:30px; height:30px; }
.form-success h3 { font-family:var(--head); font-weight:700; font-size:1.5rem; margin-bottom:.65rem; }
.form-success p { font-size:.95rem; color:var(--text-muted); line-height:1.75; max-width:420px; margin:0 auto; }
@media(max-width:1000px){ .apply-grid { grid-template-columns:1fr; gap:2rem; } .apply-side { position:static; } }
@media(max-width:600px){ .apply-form { padding:1.5rem 1.15rem; border-radius:var(--r-xl); } .form-row { grid-template-columns:1fr; gap:0; } .field input, .field select, .field textarea { font-size:16px; } }

/* ---------- FAQ ---------- */
.faq { max-width:780px; margin:2.5rem auto 0; }
.faq details { border-top:1px solid var(--border); }
.faq details:last-child { border-bottom:1px solid var(--border); }
.faq summary { list-style:none; cursor:pointer; padding:1.35rem 0; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; font-weight:700; font-size:1.02rem; line-height:1.5; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary .pm { width:28px; height:28px; border-radius:50%; border:1px solid var(--border-strong); display:grid; place-items:center; flex-shrink:0; transition:transform .25s, background .25s, color .25s; }
.faq summary .pm svg { width:14px; height:14px; }
.faq details[open] summary .pm { background:var(--primary); color:#fff; border-color:var(--primary); transform:rotate(45deg); }
.faq .faq-a { padding:0 3rem 1.5rem 0; font-size:.95rem; line-height:1.8; color:var(--text-muted); }
.faq .faq-a b { color:var(--text); }
.faq .faq-a a { color:var(--primary-deep); }
@media(max-width:600px){ .faq .faq-a { padding-right:0; } }

/* ---------- SERIES STRIP (另一堂課) ---------- */
.series-strip { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-2xl); padding:2rem 2.25rem; display:grid; grid-template-columns:auto 1fr auto; gap:1.5rem 2rem; align-items:center; box-shadow:var(--sh-sm); }
.series-strip .ss-lvl { font-family:var(--mono); font-size:.66rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; padding:.4rem .75rem; border-radius:100px; background:var(--primary-tint); color:var(--primary-deep); border:1px solid var(--primary-border); white-space:nowrap; }
.series-strip h3 { font-family:var(--head); font-weight:700; font-size:1.2rem; letter-spacing:-0.01em; margin-bottom:.25rem; }
.series-strip p { font-size:.9rem; color:var(--text-muted); line-height:1.65; }
.series-strip .btn { white-space:nowrap; }
@media(max-width:800px){ .series-strip { grid-template-columns:1fr; text-align:left; padding:1.5rem; } .series-strip .btn { width:100%; } }

/* ---------- FINAL CTA ---------- */
.final { background:radial-gradient(ellipse 80% 80% at 50% 120%, #1E3A5F 0%, var(--navy) 60%); color:#fff; border-radius:24px; padding:4rem 3rem; text-align:center; position:relative; overflow:hidden; }
.final::before { content:''; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,0.14) 1px, transparent 1.2px); background-size:24px 24px; mask-image:radial-gradient(ellipse 70% 80% at 50% 50%, black 10%, transparent 75%); -webkit-mask-image:radial-gradient(ellipse 70% 80% at 50% 50%, black 10%, transparent 75%); pointer-events:none; }
.final > * { position:relative; z-index:1; }
.final h2 { font-family:var(--head); font-weight:700; font-size:clamp(1.6rem,3.4vw,2.5rem); line-height:1.3; margin-bottom:1rem; letter-spacing:-0.02em; }
.final h2 em { font-style:normal; color:var(--primary-soft); }
.final p { font-size:1rem; color:rgba(255,255,255,0.75); max-width:560px; margin:0 auto 2rem; line-height:1.75; }
.final .btn-row { display:flex; gap:.85rem; justify-content:center; flex-wrap:wrap; }
@media(max-width:600px){ .final { padding:3rem 1.5rem; border-radius:18px; } .final .btn { width:100%; } }

/* ---------- STICKY MOBILE CTA ---------- */
.mob-cta { display:none; visibility:hidden; position:fixed; left:0; right:0; bottom:0; z-index:900; padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background:rgba(248,250,252,0.96); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-top:1px solid var(--border); align-items:center; gap:.85rem; transform:translateY(110%); transition:transform .3s, visibility 0s .3s; }
.mob-cta.show { transform:translateY(0); visibility:visible; transition:transform .3s, visibility 0s; }
.mob-cta .mc-info { flex:1; min-width:0; }
.mob-cta .mc-info b { display:block; font-family:var(--mono); font-size:.9rem; font-weight:600; }
.mob-cta .mc-info span { font-size:.72rem; color:var(--text-muted); }
.mob-cta .btn { padding:.85rem 1.25rem; font-size:.9rem; white-space:nowrap; }
@media(max-width:940px){ .mob-cta { display:flex; } .bc ~ .marketing-footer { padding-bottom:6.5rem; } }

/* ---------- REVEAL（無 JS 時直接顯示） ---------- */
.js .reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.js .reveal.visible { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) { .js .reveal { opacity:1; transform:none; transition:none; } }

/* ===================================================================
   系列總覽頁（hub）專用
   =================================================================== */
.hub-hero { text-align:center; padding:9.5rem 0 5rem; }
.hub-hero .wrap { display:block; max-width:880px; }
.hub-hero .hero-title { margin-left:auto; margin-right:auto; }
.hub-hero .hero-lede { margin:0 auto; }
.hub-hero .hero-actions { justify-content:center; }
.hub-hero .hero-meta { justify-content:center; }
.hub-hero .hero-badge { margin-bottom:1.5rem; }
@media(max-width:1000px){ .hub-hero { padding:7.5rem 0 4rem; } }
@media(max-width:600px){ .hub-hero { padding:6rem 0 3rem; } }

.path { display:grid; grid-template-columns:1fr auto 1fr; gap:1.5rem; align-items:stretch; margin-top:3rem; }
.path-arrow { display:grid; place-items:center; color:var(--text-faint); }
.path-arrow svg { width:36px; height:36px; }
.course-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-2xl); padding:2.25rem; display:flex; flex-direction:column; box-shadow:var(--sh-md); position:relative; overflow:hidden; transition:box-shadow .3s, transform .3s, border-color .3s; }
.course-card:hover { box-shadow:var(--sh-lg); transform:translateY(-3px); border-color:var(--primary-border); }
.course-card::before { content:''; position:absolute; left:0; top:0; right:0; height:5px; background:var(--lvl1-pink); }
.course-card.adv::before { background:var(--lvl2-yellow); }
.cc-top { display:flex; align-items:center; gap:.6rem; margin-bottom:1.25rem; flex-wrap:wrap; }
.cc-lvl { font-family:var(--mono); font-size:.66rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; padding:.4rem .75rem; border-radius:100px; background:var(--lvl1-pink); color:var(--lvl-ink); border:1px solid var(--lvl1-pink); }
.course-card.adv .cc-lvl { background:var(--lvl2-yellow); color:var(--lvl-ink); border-color:var(--lvl2-yellow); }
.cc-seat { font-family:var(--mono); font-size:.66rem; letter-spacing:.08em; color:var(--text-muted); margin-left:auto; }
.cc-name { font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.4rem; }
.cc-title { font-family:var(--head); font-weight:700; font-size:clamp(1.45rem,2.4vw,1.85rem); line-height:1.3; letter-spacing:-0.02em; margin-bottom:.75rem; }
.cc-title em { font-style:normal; color:var(--lvl1-pink-text); }
.course-card.adv .cc-title em { color:var(--lvl2-yellow-text); }
.cc-one { font-size:.98rem; line-height:1.7; color:var(--text-muted); margin-bottom:1.5rem; }
.cc-facts { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:1.5rem; }
.cc-fact { background:var(--bg); border:1px solid var(--border); border-radius:var(--r-lg); padding:.75rem .9rem; }
.cc-fact .k { font-family:var(--mono); font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.2rem; }
.cc-fact .v { font-family:var(--head); font-weight:700; font-size:1.05rem; letter-spacing:-0.01em; }
.cc-fact .v small { font-family:var(--sans); font-weight:500; font-size:.72rem; color:var(--text-muted); margin-left:.15rem; }
.cc-who { font-size:.86rem; color:var(--text-muted); line-height:1.7; margin-bottom:.5rem; }
.cc-who b { color:var(--text); }
.cc-days { list-style:none; display:flex; flex-direction:column; gap:.6rem; margin:1rem 0 1.5rem; }
.cc-days li { display:grid; grid-template-columns:auto 1fr; gap:.7rem; align-items:baseline; font-size:.9rem; line-height:1.55; }
.cc-days .d { font-family:var(--mono); font-size:.62rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--primary-deep); background:var(--primary-tint); border:1px solid var(--primary-border); padding:.2rem .5rem; border-radius:var(--r-sm); white-space:nowrap; }
.cc-days b { font-weight:700; }
.cc-days span.t { color:var(--text-muted); }
.cc-cta { margin-top:auto; display:flex; gap:.6rem; flex-wrap:wrap; }
.cc-cta .btn { flex:1; padding:.7rem 1rem; font-size:.85rem; white-space:nowrap; }
@media(max-width:420px){ .cc-cta .btn { white-space:normal; } }
@media(max-width:900px){ .path { grid-template-columns:1fr; } .path-arrow svg { transform:rotate(90deg); } .course-card { padding:1.75rem 1.4rem; } }

.compare { margin-top:3rem; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-2xl); overflow:hidden; box-shadow:var(--sh-sm); }
.compare table { width:100%; border-collapse:collapse; font-size:.92rem; }
.compare th, .compare td { padding:1.05rem 1.25rem; text-align:left; vertical-align:top; border-bottom:1px solid var(--border); }
.compare tr:last-child td { border-bottom:none; }
.compare th { font-family:var(--mono); font-size:.66rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); background:var(--bg); }
.compare th.lvl { color:var(--primary-deep); }
.compare td:first-child { font-weight:700; width:22%; color:var(--text); background:var(--bg); }
.compare td { color:var(--text-muted); line-height:1.65; }
.compare td b { color:var(--text); }
.compare-scroll { overflow-x:auto; }
@media(max-width:700px){ .compare table { min-width:640px; } }

.quiz { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-top:2.5rem; }
.quiz-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-xl); padding:1.75rem; box-shadow:var(--sh-sm); }
.quiz-card .q { font-family:var(--mono); font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); margin-bottom:.6rem; }
.quiz-card h4 { font-family:var(--head); font-weight:700; font-size:1.05rem; line-height:1.45; margin-bottom:1rem; letter-spacing:-0.01em; }
.quiz-card .ans { display:flex; flex-direction:column; gap:.55rem; }
.quiz-card .ans a { display:flex; justify-content:space-between; align-items:center; gap:.75rem; text-decoration:none; font-size:.88rem; padding:.7rem .85rem; border-radius:var(--r-md); border:1px solid var(--border); color:var(--text); transition:border-color .2s, background .2s; }
.quiz-card .ans a:hover { border-color:var(--primary-border); background:var(--primary-tint); }
.quiz-card .ans .tag { font-family:var(--mono); font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; padding:.2rem .5rem; border-radius:100px; white-space:nowrap; }
.tag-l1 { background:var(--primary-tint); color:var(--primary-deep); border:1px solid var(--primary-border); }
.tag-l2 { background:var(--navy); color:#fff; }
@media(max-width:900px){ .quiz { grid-template-columns:1fr; } }

.common { display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; margin-top:3rem; }
.common-item { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.12); border-radius:var(--r-xl); padding:1.75rem; }
.common-item .ci-ic { width:40px; height:40px; border-radius:var(--r-lg); background:rgba(59,130,246,0.18); border:1px solid rgba(147,197,253,0.3); display:grid; place-items:center; margin-bottom:1rem; color:var(--primary-soft); }
.common-item .ci-ic svg { width:20px; height:20px; }
.common-item h4 { font-family:var(--head); font-weight:700; font-size:1.02rem; margin-bottom:.4rem; letter-spacing:-0.01em; }
.common-item p { font-size:.88rem; line-height:1.7; color:rgba(255,255,255,0.72); }
@media(max-width:1000px){ .common { grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .common { grid-template-columns:1fr; } }

/* ---------- 斜切標籤／按鈕（海報視覺） ---------- */
.skew-list { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.5rem; }
.skew-tag { display:inline-flex; align-items:center; gap:.5rem; padding:.55rem 1.15rem; font-weight:700; font-size:.86rem; letter-spacing:.06em; color:var(--navy); background:linear-gradient(90deg, #ccfbf1, #99f6e4); clip-path:polygon(6% 0, 100% 0, 94% 100%, 0 100%); white-space:nowrap; }
.skew-tag::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--teal-deep); }
.btn-skew { position:relative; isolation:isolate; background:transparent; color:var(--navy); border:none; padding:1.1rem 2.4rem; box-shadow:none; font-size:1.05rem; letter-spacing:.06em; }
.btn-skew::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg, #99f6e4, #5eead4); clip-path:polygon(4% 0, 100% 0, 96% 100%, 0 100%); transition:background .2s; }
.btn-skew:hover { transform:translateY(-1px); }
.btn-skew:hover::before { background:linear-gradient(90deg, #ccfbf1, #99f6e4); }
.btn-skew:focus-visible { outline:2px solid #fff; outline-offset:4px; }
.hero-when { display:inline-flex; align-items:center; gap:.9rem; flex-wrap:wrap; margin-top:1.75rem; font-family:var(--mono); font-weight:600; font-size:clamp(1.05rem,2.2vw,1.5rem); letter-spacing:.06em; color:var(--teal); }
.hero-when .sep { width:2px; height:1.2em; background:rgba(94,234,212,.5); }
.hero-when .is-tba { font-size:.72em; letter-spacing:.08em; color:#CCFBF1; opacity:.85; }
.hero-when .when-time { color:#CCFBF1; }
@media(max-width:600px){ .hero-when { gap:.6rem; } }

/* ---------- 講師 ---------- */
.instructor { display:grid; grid-template-columns:auto 1fr; gap:2rem; align-items:center; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-2xl); padding:2rem 2.25rem; box-shadow:var(--sh-sm); margin-top:3rem; }
.instructor .in-photo { width:120px; height:120px; border-radius:var(--r-xl); overflow:hidden; background:linear-gradient(135deg, #0f2444, #0f4f5c); display:grid; place-items:center; color:#CCFBF1; font-weight:700; font-size:1.6rem; letter-spacing:.05em; flex-shrink:0; }
.instructor .in-photo img { width:100%; height:100%; object-fit:cover; }
.instructor .in-k { font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--primary-deep); margin-bottom:.4rem; }
.instructor h3 { font-size:1.35rem; margin-bottom:.15rem; }
.instructor h3 small { font-size:.8rem; font-weight:500; color:var(--text-muted); margin-left:.5rem; letter-spacing:0; }
.instructor .in-title { font-size:.95rem; color:var(--text-muted); margin-bottom:.6rem; }
.instructor .in-bio { list-style:none; margin:0; padding:0; display:grid; gap:.45rem; }
.instructor .in-bio li { position:relative; padding-left:1.1rem; font-size:.92rem; line-height:1.6; color:var(--text-muted); }
.instructor .in-bio li::before { content:''; position:absolute; left:0; top:.55em; width:6px; height:6px; border-radius:1px; background:var(--teal-deep); }
@media(max-width:600px){ .instructor { grid-template-columns:1fr; padding:1.5rem; } .instructor .in-photo { width:96px; height:96px; } }

/* ---------- 主辦／合作單位列 ---------- */
.bc-hosts { background:var(--surface); border-top:1px solid var(--border); padding:2rem 0; }
.bc-hosts .hosts-inner { display:flex; flex-wrap:wrap; gap:1rem 3rem; align-items:center; justify-content:space-between; }
.bc-hosts .host { font-size:.86rem; color:var(--text-muted); }
.bc-hosts .host b { display:block; font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); font-weight:600; margin-bottom:.25rem; }
.bc-hosts .host span { color:var(--text); font-weight:600; }
.bc-hosts .host .sep { margin:0 .5rem; color:var(--text-faint); font-weight:400; }
.bc-hosts .host a { color:var(--text); text-decoration:none; border-bottom:1px solid var(--border-strong); }
.bc-hosts .host a:hover { border-color:var(--text); }
.bc-hosts .host-links { display:flex; gap:1.25rem; flex-wrap:wrap; font-size:.86rem; }
.bc-hosts .host-links a { color:var(--text-muted); text-decoration:none; }
.bc-hosts .host-links a:hover { color:var(--primary-deep); }

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.compare th[scope="row"] { font-weight:700; width:22%; color:var(--text); background:var(--bg); text-align:left; }