/* ==========================================================================
   SAIP TAIWAN 線上學院 · 依 SAIP TAIWAN CIS Manual 2026

   藏青（信任、專業）為主色，金色只用在重點與動作；紙白底、墨黑字。
   標題用思源宋體（中文）與 Cormorant Garamond（英文斜體副標），內文用思源黑體與 Inter。
   直角、細線、章節編號與羅馬數字，呈現商業學院的沉穩感。
   這個檔案載入在 platform.css 之後：先改寫共用的色彩與字型變數，再補上 SAIP 自己的元件。
   ========================================================================== */
:root {
  --navy: #1B2C5A;
  --navy-deep: #13204A;
  --navy-soft: #2C3F73;
  --navy-900: #0A1638;
  --navy-300: #5A6B96;
  --navy-200: #A6B0CC;
  --navy-100: #E2E5EE;
  --gold: #D9A441;
  --gold-light: #E8C078;
  --gold-pale: #F8EAD0;
  --gold-deep: #A47C2C;
  --paper: #FAFAF7;

  /* 共用元件用到的變數改成 SAIP 的顏色 */
  --blue: #1B2C5A;
  --blue-600: #13204A;
  --blue-700: #0A1638;
  --ink: #1A1A1A;
  --text: #3A3F4B;
  --muted: #5F6676;
  --sky: #F1F3F5;
  --sky-2: #FAFAF7;
  --sky-3: #E2E5EE;
  --line: #DEE2E6;
  --cyan: #D9A441;
  --lime: #D9A441;
  --yellow: #D9A441;
  --lime-ink: #A47C2C;
  --cyan-ink: #2D6CA8;
  --brand-grad: linear-gradient(90deg, #A47C2C 0%, #D9A441 50%, #E8C078 100%);
  --brand-text: none;
  --green: #2E7D52;
  --red: #C0392B;
  --radius: 2px;
  --shadow-sm: 0 1px 2px rgba(10, 22, 56, .06);
  --shadow: 0 10px 30px rgba(10, 22, 56, .08);
  --shadow-lg: 0 24px 56px rgba(10, 22, 56, .16);
  --sans: "Inter", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --serif: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  --latin: "Cormorant Garamond", "Times New Roman", serif;
  --ease: cubic-bezier(.16, 1, .3, 1);
  --wrap: 1280px;
}

body.saip { background: var(--paper); color: var(--text); letter-spacing: .01em; }
.saip h1, .saip h2, .saip h3, .saip h4 { font-family: var(--serif); color: var(--navy); font-weight: 700; letter-spacing: .02em; }
.saip ::selection { background: var(--gold); color: var(--navy-900); }
.saip :focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 0; }
.saip .hl { color: var(--gold-deep); }
.saip .bg-ink { background: var(--navy); color: var(--navy-100); }
.saip .bg-ink .hl, .saip .bg-ink .eyebrow { color: var(--gold-light); }
.saip .bg-soft, .saip .bg-cream { background: #F3F4F1; }
.saip .eyebrow { color: var(--gold-deep); letter-spacing: .24em; font-family: var(--sans); }
.saip .pill { border-radius: 0; background: transparent; color: var(--gold-deep); border: 1px solid var(--gold); letter-spacing: .08em; }
.saip .script, .saip .plane, .saip .aurora, .saip .spot { display: none !important; }
.saip .progress { background: var(--gold); height: 2px; }

/* ---------- 按鈕：直角、粗細一致；主要動作用金色，次要用藏青 ---------- */
.saip-btn, .saip .btn-main, .saip .btn-ghost, .saip .btn-accent {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  padding: 15px 30px; border-radius: 2px; border: 1px solid var(--navy);
  font-family: var(--sans); font-weight: 600; font-size: calc(15px * var(--fs)); letter-spacing: .08em; line-height: 1.3; white-space: nowrap;
  transition: background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease); box-shadow: none;
}
.saip-btn::after { content: ""; width: 18px; height: 1px; background: currentColor; transition: width .35s var(--ease); }
.saip-btn:hover::after { width: 30px; }
.saip-btn-sm { padding: 10px 18px; font-size: calc(13.5px * var(--fs)); }
.saip-btn-sm::after { display: none; }
.saip-btn-gold { background: var(--gold); border-color: var(--gold); color: var(--navy-900); }
.saip-btn-gold:hover { background: var(--gold-light); border-color: var(--gold-light); color: var(--navy-900); }
.saip-btn-navy, .saip .btn-main { background: var(--navy); color: #fff; }
.saip-btn-navy:hover, .saip .btn-main:hover { background: var(--navy-900); border-color: var(--navy-900); color: #fff; box-shadow: none; }
.saip-btn-line { background: transparent; border-color: rgba(255, 255, 255, .6); color: #fff; }
.saip-btn-line:hover { background: #fff; border-color: #fff; color: var(--navy); }
.saip .btn-ghost { background: transparent; color: var(--navy); }
.saip .btn-ghost:hover { background: var(--navy); color: #fff; }
.saip .btn-accent { background: var(--gold); border-color: var(--gold); color: var(--navy-900); }
.saip .btn-accent:hover { background: var(--gold-light); color: var(--navy-900); }
.saip .btn-pill { border-radius: 2px; }
.saip-link-arrow { display: inline-flex; align-items: center; gap: 12px; font-weight: 600; font-size: calc(14.5px * var(--fs)); letter-spacing: .06em; color: var(--navy); }
.saip-link-arrow::after { content: ""; width: 26px; height: 1px; background: var(--gold); transition: width .35s var(--ease); }
.saip-link-arrow:hover { color: var(--gold-deep); }
.saip-link-arrow:hover::after, a:hover .saip-link-arrow::after { width: 42px; }

/* ---------- 頁首 ---------- */
.saip-topline { background: var(--navy-900); color: var(--navy-200); font-size: calc(11.5px * var(--fs)); letter-spacing: .16em; }
.saip-topline .container { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 34px; }
.saip-topline a { color: var(--gold-light); letter-spacing: .08em; }
.saip-topline a:hover { color: #fff; }
.saip-header { background: rgba(250, 250, 247, .94); border-bottom: 1px solid var(--line); }
.saip-header.scrolled { box-shadow: 0 8px 26px rgba(10, 22, 56, .07); }
.saip .nav-wrap { min-height: 80px; }
.saip-brand { display: flex; align-items: center; gap: 14px; color: var(--navy); }
.saip-logo { height: 52px; width: auto; flex-shrink: 0; overflow: visible; }
.saip-logo text { font-family: "Inter", Arial, sans-serif; }
.saip-brand-sub { display: flex; flex-direction: column; padding-left: 14px; border-left: 1px solid var(--gold); line-height: 1.25; }
.saip-brand-sub b { font-family: var(--serif); font-size: calc(17px * var(--fs)); font-weight: 700; color: var(--navy); letter-spacing: .12em; }
.saip-brand-sub small { font-size: calc(10px * var(--fs)); letter-spacing: .26em; color: var(--navy-300); }
.saip-brand-rev .saip-brand-sub b { color: #fff; }
.saip-brand-rev .saip-brand-sub small { color: var(--navy-200); }
.saip .site-nav a { display: flex; flex-direction: column; align-items: center; line-height: 1.25; padding: 8px 16px; color: var(--ink); font-weight: 600; letter-spacing: .06em; }
.saip .site-nav a small { font-size: calc(10px * var(--fs)); letter-spacing: .18em; color: var(--navy-300); font-weight: 500; text-transform: uppercase; margin-top: 2px; }
.saip .site-nav a::after { left: 16px; right: 16px; height: 1px; border-radius: 0; background: var(--gold); bottom: -2px; }
.saip .site-nav a:hover, .saip .site-nav a.active { color: var(--navy); }
.saip .site-nav .saip-nav-home { color: var(--gold-deep); }
@media (min-width: 992px) { .saip .site-nav .saip-nav-home { display: none; } }
.saip .site-nav .saip-nav-home small { text-transform: none; letter-spacing: .04em; }
.saip .icon-btn, .saip .cart-link { border-radius: 0; color: var(--navy); }
.saip .icon-btn:hover, .saip .cart-link:hover { background: var(--navy-100); color: var(--navy); }
.saip .cart-badge { background: var(--gold); color: var(--navy-900); border-radius: 0; }
.saip .nav-login { color: var(--navy); letter-spacing: .06em; }
.saip .search-bar { background: var(--paper); }
.saip .input, .saip input.input, .saip select.input, .saip textarea.input { border-radius: 2px; }
.saip .input:focus { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(217, 164, 65, .25); }

/* ---------- 共用：章節標題 ---------- */
.saip-section { padding: clamp(72px, 9vw, 128px) 0; }
.saip-paper { background: #F3F4F1; }
.saip-kicker { font-family: var(--sans); font-size: calc(12px * var(--fs)); font-weight: 600; letter-spacing: .28em; color: var(--gold-deep); margin: 0 0 18px; display: flex; align-items: center; gap: 14px; }
.saip-kicker::before { content: ""; width: 34px; height: 1px; background: var(--gold); }
.saip-chapter { max-width: 760px; margin-bottom: clamp(40px, 5vw, 64px); }
.saip-chapter h2 { font-size: calc(clamp(30px, 3.6vw, 46px) * var(--fs)); line-height: 1.3; margin: 0 0 18px; }
.saip-chapter h2 em, .saip-faculty-copy h2 em { display: block; font-family: var(--latin); font-style: italic; font-weight: 500; font-size: .52em; letter-spacing: .02em; color: var(--navy-300); margin-top: 8px; }
.saip-chapter p { color: var(--muted); font-size: calc(16.5px * var(--fs)); margin: 0; max-width: 640px; }
.saip-chapter-row { max-width: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.saip-chapter-row h2 { margin: 0; }
.saip-roman { font-family: var(--latin); font-size: calc(46px * var(--fs)); line-height: 1; font-weight: 500; color: var(--gold); display: block; margin-bottom: 22px; }

/* ---------- 首頁主視覺 ---------- */
.saip-hero { position: relative; min-height: min(86vh, 760px); display: flex; align-items: center; overflow: hidden; background: var(--navy-900); color: #fff; isolation: isolate; }
.saip-hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 30%; z-index: -2; transform: scale(1.04); animation: saipZoom 14s var(--ease) forwards; }
@keyframes saipZoom { to { transform: none; } }
.saip-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10, 22, 56, .95) 0%, rgba(19, 32, 74, .86) 42%, rgba(27, 44, 90, .38) 100%); }
.saip-hero-inner { padding-top: clamp(64px, 9vw, 120px); padding-bottom: clamp(64px, 9vw, 110px); }
.saip-eyebrow { font-size: calc(12px * var(--fs)); letter-spacing: .32em; color: var(--gold-light); font-weight: 600; margin: 0 0 26px; display: flex; align-items: center; gap: 14px; }
.saip-eyebrow::before { content: ""; width: 44px; height: 1px; background: var(--gold); }
.saip-hero h1 { color: #fff; font-size: calc(clamp(42px, 6.4vw, 84px) * var(--fs)); line-height: 1.15; letter-spacing: .06em; margin: 0 0 18px; font-weight: 900; }
.saip-hero h1 span { display: block; font-size: .5em; font-weight: 600; letter-spacing: .12em; color: var(--gold-light); margin-top: 16px; }
.saip-en { font-family: var(--latin); font-style: italic; font-size: calc(clamp(19px, 1.8vw, 24px) * var(--fs)); color: var(--navy-200); margin: 0 0 22px; }
.saip-lead { max-width: 560px; color: #D5DAE6; font-size: calc(clamp(15.5px, 1.2vw, 17px) * var(--fs)); line-height: 1.95; margin: 0 0 36px; }
.saip-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.saip-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 760px; margin: clamp(48px, 6vw, 72px) 0 0; border-top: 1px solid rgba(255, 255, 255, .18); }
.saip-facts > div { padding: 22px 20px 0 0; }
.saip-facts > div + div { padding-left: 20px; border-left: 1px solid rgba(255, 255, 255, .12); }
.saip-facts dt { font-size: calc(10.5px * var(--fs)); letter-spacing: .26em; color: var(--gold-light); font-weight: 600; margin-bottom: 8px; }
.saip-facts dd { margin: 0; color: var(--navy-200); font-size: calc(13px * var(--fs)); }
.saip-facts b { display: block; font-family: var(--sans); font-size: calc(clamp(30px, 3vw, 40px) * var(--fs)); font-weight: 700; color: #fff; line-height: 1.1; margin-bottom: 4px; letter-spacing: 0; }

/* ---------- 課程體系 ---------- */
.saip-pillars { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); border-top: 1px solid var(--navy); }
.saip-pillars li { border-bottom: 1px solid var(--line); }
.saip-pillars li + li { border-left: 1px solid var(--line); }
.saip-pillars a { display: flex; flex-direction: column; height: 100%; padding: 40px 32px 36px; color: var(--text); position: relative; transition: background .5s var(--ease); }
.saip-pillars a::before { content: ""; position: absolute; left: 0; top: -1px; height: 3px; width: 0; background: var(--gold); transition: width .6s var(--ease); }
.saip-pillars a:hover { background: #fff; color: var(--text); }
.saip-pillars a:hover::before { width: 100%; }
.saip-pillars h3 { font-size: calc(23px * var(--fs)); margin: 0 0 14px; }
.saip-pillars h3 small { display: block; font-family: var(--latin); font-style: italic; font-weight: 500; font-size: .7em; color: var(--navy-300); margin-top: 4px; letter-spacing: .02em; }
.saip-pillars p { font-size: calc(15px * var(--fs)); color: var(--muted); margin: 0 0 24px; flex: 1; }
.saip-pillar-meta { font-size: calc(12.5px * var(--fs)); letter-spacing: .08em; color: var(--navy-300); margin-bottom: 18px; }

/* ---------- 課程卡 ---------- */
.saip-course-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.saip-course { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); color: var(--text); transition: border-color .4s var(--ease), box-shadow .5s var(--ease), transform .5s var(--ease); }
.saip-course:hover { color: var(--text); border-color: var(--navy-200); box-shadow: var(--shadow); transform: translateY(-4px); }
/* 內建插圖是白底的線條圖：封面區也用白底，再用色彩增值混合，插圖的白底就看不出來 */
.saip-course-cover { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #fff; display: block; border-bottom: 1px solid var(--line); }
.saip-course-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 7% 16%; mix-blend-mode: multiply; transition: transform .9s var(--ease); }
.saip-course-cover img.photo { mix-blend-mode: normal; }
.saip-course-cover img.photo { object-fit: cover; padding: 0; }
.saip-course:hover .saip-course-cover img { transform: scale(1.05); }
.saip-course-body { display: flex; flex-direction: column; flex: 1; padding: 26px 26px 22px; }
.saip-course-cat { font-size: calc(12px * var(--fs)); letter-spacing: .14em; color: var(--gold-deep); font-weight: 600; margin-bottom: 12px; }
.saip-course h3 { font-size: calc(19px * var(--fs)); line-height: 1.5; margin: 0 0 12px; }
.saip-course-meta { font-size: calc(13.5px * var(--fs)); color: var(--muted); margin-bottom: 20px; }
.saip-course-foot { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; }
.saip-price { font-family: var(--sans); font-weight: 700; font-size: calc(17px * var(--fs)); color: var(--navy); }
.saip-price del { font-weight: 400; color: var(--navy-300); font-size: .8em; margin-right: 8px; }
.saip-arrow { width: 26px; height: 1px; background: var(--gold); position: relative; transition: width .4s var(--ease); }
.saip-arrow::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-top: 1px solid var(--gold); border-right: 1px solid var(--gold); transform: rotate(45deg); }
.saip-course:hover .saip-arrow { width: 40px; }

/* ---------- 講師 ---------- */
.saip-faculty { background: var(--paper); }
.saip-faculty-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.saip-faculty-photo { position: relative; margin: 0; }
.saip-faculty-photo::before { content: ""; position: absolute; inset: 22px -22px -22px 22px; border: 1px solid var(--gold); z-index: 0; }
.saip-faculty-photo img { position: relative; z-index: 1; width: 100%; aspect-ratio: 5 / 6; object-fit: cover; object-position: center 15%; filter: saturate(.92); }
.saip-faculty-photo figcaption { position: absolute; z-index: 2; left: 0; bottom: 0; background: var(--navy); color: var(--gold-light); font-size: calc(11px * var(--fs)); letter-spacing: .3em; padding: 12px 18px; }
.saip-faculty-copy h2 { font-size: calc(clamp(34px, 4vw, 52px) * var(--fs)); margin: 0 0 12px; letter-spacing: .12em; }
.saip-role { color: var(--gold-deep); font-weight: 600; letter-spacing: .08em; margin-bottom: 24px; }
.saip-faculty-copy > p:not(.saip-kicker):not(.saip-role) { color: var(--text); line-height: 2; }
.saip-ticks { list-style: none; margin: 26px 0 36px; display: grid; gap: 12px; }
.saip-ticks li { position: relative; padding-left: 30px; font-size: calc(15px * var(--fs)); }
.saip-ticks li::before { content: ""; position: absolute; left: 0; top: .85em; width: 16px; height: 1px; background: var(--gold); }

/* ---------- 學習方式 ---------- */
.saip-steps { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; counter-reset: s; }
.saip-steps li { padding: 0 32px 0 0; }
.saip-steps li + li { padding-left: 32px; border-left: 1px solid var(--line); }
.saip-steps h3 { font-size: calc(20px * var(--fs)); margin: 0 0 12px; }
.saip-steps p { font-size: calc(15px * var(--fs)); color: var(--muted); margin: 0; }

/* ---------- 企業方案色帶 ---------- */
.saip-band { position: relative; overflow: hidden; isolation: isolate; color: #fff; padding: clamp(80px, 10vw, 140px) 0; background: var(--navy); }
.saip-band-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 25%; z-index: -2; }
.saip-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10, 22, 56, .96) 0%, rgba(19, 32, 74, .9) 50%, rgba(27, 44, 90, .55) 100%); }
.saip-band-inner { max-width: 640px; }
.saip-band h2 { color: #fff; font-size: calc(clamp(30px, 3.6vw, 46px) * var(--fs)); letter-spacing: .08em; margin: 0 0 18px; }
.saip-band p:not(.saip-kicker) { color: #D5DAE6; margin: 0 0 36px; line-height: 1.95; }
.saip-band .saip-kicker { color: var(--gold-light); }

/* ---------- 常見問題 ---------- */
.saip-faq-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.saip-faq { border-top: 1px solid var(--navy); }
.saip-faq details { border-bottom: 1px solid var(--line); }
.saip-faq summary { list-style: none; cursor: pointer; padding: 24px 48px 24px 0; position: relative; font-family: var(--serif); font-weight: 600; font-size: calc(18px * var(--fs)); color: var(--navy); line-height: 1.6; }
.saip-faq summary::-webkit-details-marker { display: none; }
.saip-faq summary::before, .saip-faq summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 16px; height: 1px; background: var(--gold-deep); transition: transform .4s var(--ease); }
.saip-faq summary::after { transform: rotate(90deg); }
.saip-faq details[open] summary::after { transform: rotate(0); }
.saip-faq details p { margin: 0; padding: 0 48px 26px 0; color: var(--muted); line-height: 1.95; }

/* ---------- 頁尾 ---------- */
.saip-footer { background: var(--navy-900); color: var(--navy-200); font-size: calc(14.5px * var(--fs)); }
.saip-footer a { color: var(--navy-100); }
.saip-footer a:hover { color: var(--gold-light); }
.saip-footer-grid { display: grid; grid-template-columns: minmax(0, 5fr) repeat(3, minmax(0, 2.4fr)); gap: 40px; padding: clamp(64px, 7vw, 96px) 0 56px; }
.saip-footer .saip-logo { height: 64px; }
.saip-motto { font-family: var(--serif); color: #fff; font-size: calc(18px * var(--fs)); letter-spacing: .16em; margin: 28px 0 6px; }
.saip-motto em { display: block; font-family: var(--latin); font-style: italic; letter-spacing: .02em; color: var(--gold-light); font-size: .9em; margin-top: 4px; }
.saip-footer-brand > p:last-child { max-width: 380px; line-height: 1.9; margin-top: 18px; }
.saip-footer-col { display: flex; flex-direction: column; gap: 12px; }
.saip-footer-col h2 { font-family: var(--serif); color: #fff; font-size: calc(16px * var(--fs)); letter-spacing: .14em; margin: 0 0 10px; padding-bottom: 14px; border-bottom: 1px solid rgba(217, 164, 65, .45); }
.saip-footer-col h2 small { display: block; font-family: var(--sans); font-size: calc(10px * var(--fs)); color: var(--gold-light); letter-spacing: .26em; text-transform: uppercase; font-weight: 500; margin-top: 4px; }
.saip-footer-contact p { margin: 0; }
.saip-footer .saip-link-arrow { color: var(--gold-light); margin-top: 6px; }
.saip-footer-bar { border-top: 1px solid rgba(255, 255, 255, .08); font-size: calc(12.5px * var(--fs)); }
.saip-footer-bar .container { display: flex; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; padding-top: 22px; padding-bottom: 22px; }
.saip-footer-bar a { margin-left: 18px; color: var(--navy-200); }
.saip-footer-bar a:first-child { margin-left: 0; }
.saip .chat-fab { border-radius: 0; background: var(--navy); box-shadow: 0 14px 34px rgba(10, 22, 56, .3); }
.saip .chat-fab span { background: var(--gold); color: var(--navy-900); border-radius: 0; }

/* ---------- 沿用預設頁面的元件：改成 SAIP 的樣子 ---------- */
.saip .page-hero { background: var(--navy); color: var(--navy-100); position: relative; }
.saip .page-hero h1 { color: #fff; letter-spacing: .06em; }
.saip .page-hero p { color: #D5DAE6; }
.saip .page-hero .eyebrow, .saip .page-hero .pill { color: var(--gold-light); border-color: var(--gold); }
.saip .page-hero img { mix-blend-mode: normal; filter: drop-shadow(0 16px 30px rgba(0, 0, 0, .25)); }
.saip .card-item, .saip .dest, .saip .post, .saip .form-card, .saip .panel, .saip .faq, .saip .step { border-radius: 2px; box-shadow: none; border-color: var(--line); }
.saip a.card-item:hover { box-shadow: var(--shadow); border-color: var(--navy-200); transform: translateY(-4px); }
.saip .card-cover { background: #fff !important; border-bottom: 1px solid var(--line); }
.saip .card-body2 h3 { font-family: var(--serif); color: var(--navy); }
.saip .chip { border-radius: 0; background: var(--navy); color: var(--gold-light); box-shadow: none; letter-spacing: .08em; }
.saip .go { border-radius: 0 !important; }
.saip a.card-item:hover .go { background: var(--gold); color: var(--navy-900); }
.saip .price { color: var(--navy); }
.saip .sec-head h2 { letter-spacing: .04em; }
.saip .flash { border-radius: 2px; }

/* ---------- 平板 ---------- */
@media (max-width: 1199px) {
  .saip .site-nav a { padding: 8px 10px; }
  .saip .site-nav a::after { left: 10px; right: 10px; }
  .saip-brand-sub { display: none; }
  .saip-footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .saip-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 991px) {
  .saip-topline span { display: none; }
  .saip-topline .container { justify-content: flex-end; }
  .saip .site-nav { background: var(--paper); box-shadow: 0 24px 34px rgba(10, 22, 56, .12); border-top: 1px solid var(--line); }
  .saip .site-nav a { flex-direction: row; justify-content: space-between; align-items: baseline; padding: 16px 2px; }
  .saip .site-nav a small { margin: 0; }
  .saip .nav-actions .saip-btn { display: none; }
  .saip .nav-wrap { min-height: 68px; }
  .saip-logo { height: 44px; }
  .saip-brand-sub { display: flex; padding-left: 12px; }
  .saip-course-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .saip-faculty-grid, .saip-faq-grid { grid-template-columns: 1fr; }
  .saip-faculty-photo { max-width: 440px; }
  .saip-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 0; }
  .saip-steps li:nth-child(odd) { padding-left: 0; border-left: 0; }
  .saip-pillars li + li { border-left: 0; }
  .saip-pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saip-pillars li:nth-child(even) { border-left: 1px solid var(--line); }
  .saip-hero::before { background: linear-gradient(180deg, rgba(10, 22, 56, .78) 0%, rgba(19, 32, 74, .9) 55%, rgba(10, 22, 56, .97) 100%); }
}

/* ---------- 手機 ---------- */
@media (max-width: 640px) {
  .saip .container { padding-left: 20px; padding-right: 20px; }
  /* 英文小標在手機上縮小字距，避免折成兩行；真的折行時拿掉前面的短線，對齊才不會亂 */
  .saip-kicker, .saip-eyebrow { font-size: calc(11px * var(--fs)); letter-spacing: .16em; flex-wrap: wrap; }
  .saip-kicker::before, .saip-eyebrow::before { width: 22px; }
  .saip-eyebrow { gap: 10px; }
  .saip-wide { display: none; }
  .saip-brand-sub b { font-size: calc(15px * var(--fs)); letter-spacing: .08em; }
  .saip-brand-sub small { display: none; }
  .saip-logo { height: 40px; }
  .saip-hero { min-height: 0; }
  .saip-hero-bg { object-position: 58% 20%; }
  .saip-hero h1 { letter-spacing: .04em; }
  .saip-actions .saip-btn { flex: 1 1 100%; }
  .saip-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saip-facts > div { padding: 20px 14px 18px 0; }
  .saip-facts > div + div { padding-left: 0; border-left: 0; }
  .saip-facts > div:nth-child(even) { padding-left: 16px; border-left: 1px solid rgba(255, 255, 255, .12); }
  .saip-facts > div:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .12); }
  .saip-pillars { grid-template-columns: 1fr; }
  .saip-pillars li:nth-child(even) { border-left: 0; }
  .saip-pillars a { padding: 32px 4px 30px; }
  .saip-roman { font-size: calc(38px * var(--fs)); margin-bottom: 14px; }
  .saip-course-grid { grid-template-columns: 1fr; }
  .saip-course { flex-direction: row; }
  .saip-course-cover { flex: 0 0 36%; aspect-ratio: auto; min-height: 148px; }
  .saip-course-cover img { padding: 10%; }
  .saip-course-body { padding: 16px 16px 14px; }
  .saip-course-cat { font-size: calc(11px * var(--fs)); margin-bottom: 6px; letter-spacing: .08em; }
  .saip-course h3 { font-size: calc(16px * var(--fs)); margin-bottom: 6px; }
  .saip-course-meta { font-size: calc(12.5px * var(--fs)); margin-bottom: 10px; }
  .saip-course-foot { padding-top: 10px; }
  .saip-price { font-size: calc(15.5px * var(--fs)); }
  .saip-steps { grid-template-columns: 1fr; gap: 0; }
  .saip-steps li, .saip-steps li + li { padding: 26px 0; border-left: 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: 56px 1fr; column-gap: 8px; }
  .saip-steps .saip-roman { grid-row: span 2; margin: 0; font-size: calc(34px * var(--fs)); }
  .saip-steps h3 { margin-bottom: 6px; }
  .saip-faculty-photo::before { inset: 14px -14px -14px 14px; }
  .saip-faculty-photo { margin-right: 14px; }
  .saip-faq summary { font-size: calc(16.5px * var(--fs)); padding: 20px 40px 20px 0; }
  .saip-faq details p { padding-right: 0; }
  .saip-footer-grid { grid-template-columns: 1fr 1fr; gap: 36px 24px; }
  .saip-footer-contact { grid-column: 1 / -1; }
  .saip-footer-bar a { margin: 0 16px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  .saip-hero-bg { animation: none; transform: none; }
}

/* ---------- 內頁：課程清單、課程頁、講師頁沿用預設的版面，這裡把形狀與色彩改成 SAIP ---------- */
/* 深色主視覺上的標題一律白色（.saip h1 的藏青色不能套到這裡） */
.saip .detail-hero, .saip .cl-hero { background: var(--navy); }
.saip .detail-hero::after { display: none; }
.saip .detail-hero h1, .saip .cl-hero h1, .saip .page-hero h1 { color: #fff; }
.saip .detail-hero .crumbs, .saip .detail-hero .crumbs a, .saip .cl-hero .crumbs, .saip .cl-hero .crumbs a, .saip .page-hero .crumbs a { color: var(--navy-200); }
.saip .detail-hero .lead2, .saip .cl-lead { color: #D5DAE6; }
.saip .detail-meta span, .saip .cl-facts li { border-radius: 0; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16); color: #fff; }
.saip .detail-meta i, .saip .cl-facts i { color: var(--gold-light); }
.saip .cl-search { border-radius: 2px; border: 1px solid var(--navy-200); box-shadow: none; }
.saip .cl-search:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(217, 164, 65, .3); }
.saip .cl-search button { border-radius: 0; background: var(--gold); color: var(--navy-900); letter-spacing: .08em; }
.saip .cl-search button:hover { background: var(--gold-light); }
.saip .cl-hero-art span { border-radius: 0; background: rgba(255, 255, 255, .92) !important; }
/* 分類卡與學習路徑：底色統一成白色，只留細框線 */
.saip .cl-cat, .saip .cl-cat-art, .saip .path-art, .saip .cl-group-art, .saip .path-side .dot { --tint: #fff !important; }
.saip .cl-cat, .saip .path-step, .saip .path-art, .saip .cl-group-art { border-radius: 0; box-shadow: none; }
.saip .cl-cat:hover, .saip .path-step:hover { box-shadow: var(--shadow); border-color: var(--navy-200); transform: translateY(-4px); }
.saip .cl-cat-art, .saip .path-art { border-bottom: 1px solid var(--line); }
.saip .path-art { background: #fff !important; }
.saip .cl-group-art { border: 1px solid var(--line); }
.saip .path-no { border-radius: 0; background: var(--navy); color: var(--gold-light); font-family: var(--latin); font-weight: 600; }
.saip .path-step + .path-step::before { color: var(--gold); }
.saip .path-links a, .saip .path-side a, .saip .path-tabs label, .saip .level-nav a, .saip .filter-pills a, .saip .tag { border-radius: 0; }
.saip .path-links a { background: #fff; color: var(--navy); }
.saip .path-links a:hover { background: var(--navy); border-color: var(--navy); color: #fff; }
.saip .path-side .dot { border-radius: 0; border: 1px solid var(--line); }
.saip .level-nav a.active { background: var(--navy); border-color: var(--navy); color: #fff; }
/* 內頁小插圖在藏青底上會變成一塊白框，SAIP 版不顯示，改用一條金線收尾 */
.saip .page-hero img { display: none; }
.saip .page-hero .inner::after { content: ""; flex: 0 0 120px; height: 1px; background: var(--gold); align-self: center; }
.saip .split-art .frame, .saip .frame { border-radius: 0 !important; }
.saip .about-id img { display: none; }
.saip .about-id { border-radius: 0; }
.saip .buy-box, .saip .buy-box .card-cover, .saip .curriculum, .saip .chapter, .saip .lesson-row, .saip .review, .saip .instructor-card { border-radius: 0; }
.saip .buy-box { box-shadow: var(--shadow); }
@media (max-width: 640px) {
  .saip .page-hero .inner::after { display: none; }
}

/* 課程籌備中：較矮的主視覺，課程體系只列出、不連結 */
.saip-hero-short { min-height: min(62vh, 560px); }
.saip-pillars li > div { display: flex; flex-direction: column; height: 100%; padding: 40px 32px 36px; }
.saip-pillars li > div p { margin: 0; }
@media (max-width: 640px) {
  .saip-pillars li > div { padding: 32px 4px 30px; }
}

/* 有序清單的預設內距會讓整排往右縮，課程體系與學習方式都要對齊章節標題 */
.saip-pillars, .saip-steps { padding-left: 0; margin: 0; }

/* ---------- 首頁主視覺影片 ---------- */
/* 封面圖是影片的第一格；影片可以播放後淡入蓋上去。影片畫面偏亮，左側的藏青漸層加深，標題才讀得清楚 */
.saip-hero-film .saip-hero-bg { animation: none; transform: none; object-position: center; }
.saip-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; opacity: 0; transition: opacity 1.2s var(--ease); pointer-events: none; }
.saip-hero-film.is-playing .saip-hero-video { opacity: 1; }
.saip-hero-film::before { background: linear-gradient(90deg, rgba(10, 22, 56, .96) 0%, rgba(10, 22, 56, .88) 38%, rgba(19, 32, 74, .55) 68%, rgba(19, 32, 74, .25) 100%), linear-gradient(0deg, rgba(10, 22, 56, .55) 0%, rgba(10, 22, 56, 0) 35%); }
.saip-film-toggle { position: absolute; right: clamp(20px, 3vw, 40px); bottom: clamp(20px, 3vw, 36px); z-index: 2; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .45); border-radius: 0; background: rgba(10, 22, 56, .45); color: #fff; cursor: pointer; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: background .3s var(--ease), border-color .3s var(--ease); }
.saip-film-toggle:hover { background: var(--gold); border-color: var(--gold); color: var(--navy-900); }
/* 播放中顯示「暫停」的兩條直線，暫停中顯示三角形，播完顯示重播的圓弧箭頭 */
.saip-film-toggle span { width: 12px; height: 14px; border-left: 3px solid currentColor; border-right: 3px solid currentColor; box-sizing: border-box; }
.saip-film-toggle[data-state="play"] span { width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 12px; border-color: transparent transparent transparent currentColor; margin-left: 3px; }
@media (prefers-reduced-motion: reduce) {
  .saip-hero-video, .saip-film-toggle { display: none; }
}
/* 手機的標題佔滿整個寬度：封面圖整片壓暗，上淺下深，不是只壓左半邊 */
@media (max-width: 991px) {
  .saip-hero-film::before { background: linear-gradient(180deg, rgba(10, 22, 56, .8) 0%, rgba(19, 32, 74, .88) 50%, rgba(10, 22, 56, .97) 100%); }
}
.saip-film-toggle[data-state="replay"] span { width: 16px; height: 16px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; position: relative; }
.saip-film-toggle[data-state="replay"] span::after { content: ""; position: absolute; top: -3px; right: -1px; border-style: solid; border-width: 4px 0 4px 6px; border-color: transparent transparent transparent currentColor; transform: rotate(-30deg); }
/* 影片播完停在右側的標誌：畫面本身是黑底，左側的標題不需要漸層也看得清楚，把漸層淡掉讓標誌維持原本的亮度 */
.saip-hero-film::before { transition: opacity 1.4s var(--ease); }
.saip-hero-film.is-ended::before { opacity: 0; }
/* 標誌在中央亮相時，標題與按鈕暫時淡出（約 3 秒），標誌滑到右側後淡入回來 */
.saip-hero-film .saip-hero-inner { transition: opacity .7s var(--ease), transform .9s var(--ease); }
.saip-hero-film.is-stage .saip-hero-inner { opacity: 0; transform: translateX(-12px); pointer-events: none; }

/* ==========================================================================
   B2B 改版（2026-10）：痛點、實戰任務制、三種方案、預約表單、手機底部聯絡列
   ========================================================================== */
.saip-btn-block { width: 100%; }
.saip-cta-top { margin-left: 6px; }

/* 主視覺下方的信任標記（取代原本的課程數字） */
.saip-trust { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 760px; margin: clamp(44px, 5vw, 64px) 0 0; border-top: 1px solid rgba(255, 255, 255, .18); }
.saip-trust > div { padding: 20px 20px 0 0; }
.saip-trust > div + div { padding-left: 20px; border-left: 1px solid rgba(255, 255, 255, .12); }
.saip-trust dt { font-family: var(--sans); font-size: calc(clamp(19px, 1.8vw, 24px) * var(--fs)); font-weight: 700; color: #fff; letter-spacing: .02em; line-height: 1.2; margin-bottom: 6px; }
.saip-trust dd { margin: 0; font-size: calc(13px * var(--fs)); color: var(--navy-200); line-height: 1.6; }

/* 合作企業 */
.saip-clients { background: #fff; border-bottom: 1px solid var(--line); }
.saip-clients .container { display: flex; align-items: center; gap: 18px 40px; flex-wrap: wrap; min-height: 92px; padding-top: 18px; padding-bottom: 18px; }
.saip-clients p { margin: 0; font-size: calc(12px * var(--fs)); letter-spacing: .2em; color: var(--navy-300); font-weight: 600; }
.saip-clients ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 44px; }
.saip-clients li { font-family: var(--serif); font-weight: 700; font-size: calc(19px * var(--fs)); letter-spacing: .14em; color: var(--navy); position: relative; }
.saip-clients li + li::before { content: ""; position: absolute; left: -23px; top: 50%; width: 4px; height: 4px; background: var(--gold); transform: translateY(-50%) rotate(45deg); }

/* 痛點 → 解法 */
.saip-pains { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.saip-pain { display: grid; grid-template-rows: auto 1fr; background: #fff; border: 1px solid var(--line); transition: box-shadow .5s var(--ease), border-color .4s var(--ease); }
.saip-pain:hover { box-shadow: var(--shadow); border-color: var(--navy-200); }
.saip-pain-q { padding: 34px 34px 28px; }
.saip-pain-q .saip-roman { font-size: calc(36px * var(--fs)); margin-bottom: 14px; }
.saip-pain-q h3 { font-size: calc(22px * var(--fs)); margin: 0 0 12px; line-height: 1.45; }
.saip-pain-q p { margin: 0; color: var(--muted); font-size: calc(15.5px * var(--fs)); line-height: 1.9; }
.saip-pain-a { display: flex; flex-direction: column; padding: 26px 34px 30px; background: #F3F4F1; border-top: 1px solid var(--line); position: relative; }
.saip-pain-a::before { content: ""; position: absolute; left: 0; top: -1px; width: 56px; height: 3px; background: var(--gold); }
.saip-pain-label { font-size: calc(11.5px * var(--fs)); letter-spacing: .24em; color: var(--gold-deep); font-weight: 700; margin-bottom: 8px; }
.saip-pain-a h4 { font-family: var(--serif); color: var(--navy); font-size: calc(18px * var(--fs)); margin: 0 0 8px; }
.saip-pain-a p { margin: 0 0 18px; font-size: calc(15px * var(--fs)); color: var(--text); flex: 1; }

/* 藏青底的章節（實戰任務制） */
.saip-navy { background: var(--navy-deep); color: var(--navy-100); }
.saip-navy .saip-chapter h2 { color: #fff; }
.saip-navy .saip-chapter h2 em { color: var(--navy-200); }
.saip-navy .saip-chapter p { color: #C9D0E0; }
.saip-navy .saip-kicker { color: var(--gold-light); }
.saip-steps-dark li + li { border-left-color: rgba(255, 255, 255, .14); }
.saip-steps-dark h3 { color: #fff; }
.saip-steps-dark p { color: #C9D0E0; }
.saip-method-cta { margin-top: clamp(40px, 5vw, 56px); padding-top: 32px; border-top: 1px solid rgba(255, 255, 255, .14); }

/* 三種企業方案 */
.saip-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.saip-plan { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); padding: 36px 32px 32px; transition: box-shadow .5s var(--ease), transform .5s var(--ease); }
.saip-plan:hover { box-shadow: var(--shadow); transform: translateY(-4px); }
.saip-plan.is-hot { border: 2px solid var(--navy); box-shadow: var(--shadow); }
.saip-plan-tag { position: absolute; top: -1px; right: 24px; transform: translateY(-50%); background: var(--gold); color: var(--navy-900); font-size: calc(12px * var(--fs)); font-weight: 700; letter-spacing: .1em; padding: 6px 14px; }
.saip-plan-code { font-family: var(--sans); font-size: calc(11.5px * var(--fs)); letter-spacing: .3em; color: var(--gold-deep); font-weight: 700; margin: 0 0 10px; }
.saip-plan h3 { font-size: calc(26px * var(--fs)); margin: 0 0 12px; }
.saip-plan-one { color: var(--text); margin: 0 0 16px; }
.saip-plan-fit { font-size: calc(14px * var(--fs)); color: var(--muted); margin: 0 0 8px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.saip-plan-fit b { display: block; font-size: calc(11.5px * var(--fs)); letter-spacing: .2em; color: var(--navy-300); margin-bottom: 4px; }
.saip-plan .saip-ticks { margin: 18px 0 24px; flex: 1; }
.saip-plan-price { font-family: var(--serif); font-weight: 700; color: var(--navy); font-size: calc(18px * var(--fs)); margin: 0 0 16px; letter-spacing: .06em; }

/* 預約表單區 */
.saip-consult { background: var(--navy-900); color: var(--navy-100); padding: clamp(72px, 9vw, 120px) 0; }
.saip-consult-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(36px, 6vw, 88px); align-items: start; }
.saip-consult h2 { color: #fff; font-size: calc(clamp(28px, 3.2vw, 42px) * var(--fs)); line-height: 1.4; letter-spacing: .06em; margin: 0 0 20px; }
.saip-consult-copy > p:not(.saip-kicker) { color: #C9D0E0; line-height: 1.95; }
.saip-consult .saip-kicker { color: var(--gold-light); }
.saip-consult .saip-ticks li { color: #E2E5EE; }
.saip-consult-direct { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.saip-line, .saip-tel { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 20px; border: 1px solid rgba(255, 255, 255, .3); color: #fff; font-weight: 600; letter-spacing: .04em; transition: background .3s var(--ease), border-color .3s var(--ease); }
.saip-line span { background: #06C755; color: #fff; font-size: calc(11px * var(--fs)); font-weight: 800; padding: 3px 7px; letter-spacing: .04em; }
.saip-line:hover, .saip-tel:hover { background: rgba(255, 255, 255, .08); border-color: #fff; color: #fff; }
.saip-form { background: #fff; color: var(--text); padding: clamp(28px, 3.4vw, 44px); border-top: 3px solid var(--gold); }
.saip-form-title { font-size: calc(24px * var(--fs)); margin: 0 0 8px; }
.saip-form-note { font-size: calc(14.5px * var(--fs)); color: var(--muted); margin: 0 0 22px; }
.saip-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.saip-field { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.saip-field span { font-size: calc(13.5px * var(--fs)); font-weight: 600; color: var(--ink); letter-spacing: .02em; }
.saip-field input, .saip-field select, .saip-field textarea { width: 100%; min-height: 48px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 0; background: var(--paper); font: inherit; font-size: calc(16px * var(--fs)); color: var(--ink); transition: border-color .25s, box-shadow .25s, background .25s; }
.saip-field textarea { min-height: 96px; resize: vertical; }
.saip-field input:focus, .saip-field select:focus, .saip-field textarea:focus { outline: 0; border-color: var(--navy); background: #fff; box-shadow: 0 0 0 3px rgba(217, 164, 65, .28); }
.saip-field-wide { margin: 16px 0 22px; }
.saip-choices { border: 0; padding: 0; margin: 20px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.saip-choices legend { font-size: calc(13.5px * var(--fs)); font-weight: 600; color: var(--ink); margin-bottom: 10px; float: left; width: 100%; }
.saip-choices label { position: relative; margin: 0; cursor: pointer; }
.saip-choices input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.saip-choices span { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1px solid var(--line); background: var(--paper); font-size: calc(14px * var(--fs)); color: var(--text); transition: all .25s var(--ease); }
.saip-choices input:checked + span { background: var(--navy); border-color: var(--navy); color: #fff; }
.saip-choices input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
.saip-form-fine { font-size: calc(12.5px * var(--fs)); color: var(--muted); margin: 14px 0 0; }
.saip-form-done .saip-done-mark { display: block; width: 52px; height: 52px; background: var(--navy); margin-bottom: 18px; position: relative; }
.saip-form-done .saip-done-mark::after { content: ""; position: absolute; left: 18px; top: 13px; width: 12px; height: 22px; border-right: 3px solid var(--gold); border-bottom: 3px solid var(--gold); transform: rotate(45deg); }
.saip-next { padding-left: 20px; margin: 10px 0 18px; color: var(--text); line-height: 1.9; }

/* 手機底部聯絡列 */
.saip-mbar { display: none; }

@media (max-width: 1199px) {
  .saip-plans { grid-template-columns: 1fr; max-width: 640px; }
}
@media (max-width: 991px) {
  .saip .nav-actions .saip-cta-top { display: inline-flex; }
  .saip-pains { grid-template-columns: 1fr; }
  .saip-consult-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .saip .nav-actions .saip-cta-top { display: none; }
  .saip .nav-login { display: none; }
  .saip-trust { grid-template-columns: 1fr; border-top: 0; margin-top: 36px; }
  .saip-trust > div, .saip-trust > div + div { padding: 14px 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .14); display: flex; align-items: baseline; gap: 14px; }
  .saip-trust dt { margin: 0; min-width: 112px; font-size: calc(18px * var(--fs)); }
  .saip-clients .container { flex-direction: column; align-items: flex-start; gap: 10px; }
  .saip-clients ul { gap: 6px 32px; }
  .saip-clients li { font-size: calc(17px * var(--fs)); }
  .saip-clients li + li::before { left: -18px; }
  .saip-pain-q { padding: 26px 22px 22px; }
  .saip-pain-a { padding: 22px 22px 24px; }
  .saip-plan { padding: 32px 22px 24px; }
  .saip-form-grid { grid-template-columns: 1fr; }
  .saip-form { padding: 26px 20px; }
  .has-mbar .saip-mbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 950; background: rgba(250, 250, 247, .97); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid var(--line); padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); gap: 10px; box-shadow: 0 -8px 24px rgba(10, 22, 56, .1); }
  .saip-mbar a { display: flex; align-items: center; justify-content: center; min-height: 48px; font-weight: 700; font-size: calc(15px * var(--fs)); letter-spacing: .04em; }
  .saip-mbar-line { flex: 0 0 38%; border: 1px solid #06C755; color: #05A548; background: #fff; }
  .saip-mbar-cta { flex: 1; background: var(--gold); color: var(--navy-900); }
  .saip-mbar-cta:hover { color: var(--navy-900); }
  .has-mbar .saip-footer { padding-bottom: 72px; }
  .has-mbar .chat-fab { display: none; }
}

/* ==========================================================================
   多語版本與免費工具（2026-10）：語言切換、痛點照片、健檢測驗、省錢試算、檢核表
   ========================================================================== */
/* 頂列右側：語言切換 + 回官網 */
.saip-topline-r { display: flex; align-items: center; gap: 22px; }
.saip-langs { display: flex; align-items: center; gap: 2px; }
.saip-langs a { color: var(--navy-200); font-size: calc(11.5px * var(--fs)); letter-spacing: .12em; padding: 4px 8px; font-weight: 600; transition: color .25s; }
.saip-langs a:hover { color: #fff; }
.saip-langs a.on { color: var(--navy-900); background: var(--gold); }
.saip-topline-home { white-space: nowrap; }

/* 外語版的字型：西文用 Inter，越南文需要完整的變音符號 */
.saip:not(.lang-zh) { --serif: "Cormorant Garamond", "Noto Serif TC", Georgia, serif; }
.saip:not(.lang-zh) h1, .saip:not(.lang-zh) h2, .saip:not(.lang-zh) h3, .saip:not(.lang-zh) h4 { font-family: "Inter", "Noto Sans TC", sans-serif; letter-spacing: -.01em; font-weight: 700; }
.saip:not(.lang-zh) .saip-hero h1 { letter-spacing: -.02em; font-weight: 800; }
.saip:not(.lang-zh) .saip-hero h1 span { letter-spacing: 0; font-weight: 600; }
.saip:not(.lang-zh) .saip-chapter h2 em { font-family: var(--latin); }
.saip:not(.lang-zh) .saip-faq summary { font-family: "Inter", sans-serif; font-weight: 600; }
.saip:not(.lang-zh) .saip-brand-sub b { font-family: "Inter", sans-serif; letter-spacing: .04em; }
.saip:not(.lang-zh) .site-nav a { letter-spacing: .01em; }
.saip:not(.lang-zh) .saip-motto { font-family: var(--latin); font-style: italic; letter-spacing: .02em; font-size: calc(20px * var(--fs)); }

/* 痛點卡片上方的實景照片 */
.saip-pain { grid-template-rows: auto auto 1fr; }
.saip-pain-photo { margin: 0; aspect-ratio: 16 / 9; overflow: hidden; background: var(--navy-100); }
.saip-pain-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); filter: saturate(.9); }
.saip-pain:hover .saip-pain-photo img { transform: scale(1.04); }

/* 首頁的三個免費工具 */
.saip-tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--navy); }
.saip-tool { display: flex; flex-direction: column; padding: 36px 32px 34px; color: var(--text); border-bottom: 1px solid var(--line); position: relative; transition: background .5s var(--ease); }
.saip-tool + .saip-tool { border-left: 1px solid var(--line); }
.saip-tool::before { content: ""; position: absolute; left: 0; top: -1px; height: 3px; width: 0; background: var(--gold); transition: width .6s var(--ease); }
.saip-tool:hover { background: #fff; color: var(--text); }
.saip-tool:hover::before { width: 100%; }
.saip-tool h3 { font-size: calc(22px * var(--fs)); margin: 0 0 10px; }
.saip-tool p { color: var(--muted); margin: 0 0 22px; flex: 1; }

/* 白底按鈕（測驗的上一題、重新作答） */
.saip-btn-ghost { background: transparent; border-color: var(--navy-200); color: var(--navy); }
.saip-btn-ghost:hover { background: var(--navy); border-color: var(--navy); color: #fff; }
.saip-btn[disabled] { opacity: .4; cursor: not-allowed; }

/* AI 導入健檢 */
.saip-quiz { max-width: 820px; margin: 0 auto; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--gold); padding: clamp(28px, 4vw, 52px); box-shadow: var(--shadow); }
.saip-quiz-step { border: 0; padding: 0; margin: 0; min-width: 0; }
.saip-quiz-count { font-size: calc(12px * var(--fs)); letter-spacing: .24em; color: var(--gold-deep); font-weight: 700; margin: 0 0 10px; text-transform: uppercase; }
.saip-quiz-bar { height: 2px; background: var(--navy-100); margin-bottom: 26px; }
.saip-quiz-bar span { display: block; height: 100%; background: var(--navy); transition: width .6s var(--ease); }
.saip-quiz legend { font-family: var(--serif); font-weight: 700; color: var(--navy); font-size: calc(clamp(22px, 2.4vw, 30px) * var(--fs)); line-height: 1.4; margin-bottom: 22px; float: left; width: 100%; }
.saip:not(.lang-zh) .saip-quiz legend { font-family: "Inter", sans-serif; letter-spacing: -.01em; }
.saip-quiz-options { clear: both; display: grid; gap: 10px; margin-bottom: 28px; }
.saip-quiz-option { position: relative; margin: 0; cursor: pointer; }
.saip-quiz-option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.saip-quiz-option span { display: flex; align-items: center; gap: 16px; min-height: 58px; padding: 12px 18px; border: 1px solid var(--line); background: var(--paper); font-size: calc(16px * var(--fs)); color: var(--ink); transition: border-color .25s, background .25s, color .25s; }
.saip-quiz-option b { flex: 0 0 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--navy-200); font-family: var(--sans); font-size: calc(13px * var(--fs)); color: var(--navy-300); transition: all .25s; }
.saip-quiz-option:hover span { border-color: var(--navy-200); background: #fff; }
.saip-quiz-option input:checked + span { border-color: var(--navy); background: #fff; box-shadow: inset 3px 0 0 var(--gold); }
.saip-quiz-option input:checked + span b { background: var(--navy); border-color: var(--navy); color: var(--gold-light); }
.saip-quiz-option input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
.saip-quiz-nav { display: flex; justify-content: space-between; gap: 12px; }
.saip-quiz-nav [data-next] { margin-left: auto; }
.saip-quiz-result h2 { font-size: calc(clamp(26px, 3vw, 38px) * var(--fs)); margin: 0 0 14px; }
.saip-quiz-why { font-size: calc(17px * var(--fs)); color: var(--text); line-height: 1.9; }
.saip-quiz-focus { margin: 6px 0 22px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

/* 省錢試算器 */
.saip-roi { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
.saip-roi-form input[type="range"] { -webkit-appearance: none; appearance: none; height: 2px; padding: 0; min-height: 0; margin: 20px 0 8px; background: var(--navy-200); border: 0; }
.saip-roi-form input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; background: var(--gold); border: 3px solid var(--navy); cursor: pointer; }
.saip-roi-form input[type="range"]::-moz-range-thumb { width: 18px; height: 18px; background: var(--gold); border: 3px solid var(--navy); border-radius: 0; cursor: pointer; }
.saip-roi-form output { font-family: var(--sans); font-weight: 700; color: var(--navy); margin-left: 6px; }
.saip-roi-result { background: var(--navy-deep); color: var(--navy-100); padding: clamp(28px, 3.6vw, 44px); }
.saip-roi-result > div { padding: 18px 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.saip-roi-result > div:first-child { padding-top: 0; }
.saip-roi-result span { display: block; font-size: calc(13px * var(--fs)); letter-spacing: .08em; color: var(--navy-200); margin-bottom: 4px; }
.saip-roi-result b { font-family: var(--sans); font-size: calc(clamp(26px, 3vw, 38px) * var(--fs)); color: #fff; letter-spacing: -.01em; font-weight: 700; }
.saip-roi-result > div:first-child b { color: var(--gold-light); font-size: calc(clamp(32px, 3.8vw, 48px) * var(--fs)); }
.saip-roi-result b span { display: inline; font-size: inherit; color: inherit; margin: 0; letter-spacing: inherit; }
.saip-roi-result small { font-size: .45em; color: var(--navy-200); font-weight: 500; }
.saip-roi-cta { border-bottom: 0 !important; padding-bottom: 0 !important; }
.saip-roi-cta h2 { color: #fff; font-size: calc(22px * var(--fs)); margin: 8px 0 8px; }
.saip-roi-cta p { color: #C9D0E0; font-size: calc(14.5px * var(--fs)); }

/* 檢核表 */
.saip-checklist-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.saip-cl-aside { position: sticky; top: 110px; }
.saip-cl-section { margin-bottom: 30px; }
.saip-cl-section h3 { display: flex; align-items: baseline; gap: 14px; font-size: calc(21px * var(--fs)); margin: 0 0 6px; padding-bottom: 12px; border-bottom: 1px solid var(--navy); }
.saip-cl-section .saip-roman { display: inline; margin: 0; font-size: calc(28px * var(--fs)); }
.saip-cl-items { list-style: none; margin: 0; padding: 0; }
.saip-cl-items li { position: relative; padding: 14px 0 14px 34px; border-bottom: 1px solid var(--line); color: var(--text); line-height: 1.8; }
.saip-cl-items li::before { content: ""; position: absolute; left: 2px; top: 19px; width: 16px; height: 16px; border: 1.5px solid var(--navy); background: #fff; }
.saip-cl-aside .saip-field { margin-bottom: 14px; }

/* 外語版課程列表 */
.saip-cat-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.saip-cat-pills a { padding: 8px 16px; border: 1px solid rgba(255, 255, 255, .35); color: #fff; font-size: calc(14px * var(--fs)); font-weight: 600; transition: all .25s; }
.saip-cat-pills a:hover, .saip-cat-pills a[aria-current] { background: var(--gold); border-color: var(--gold); color: var(--navy-900); }
.saip-course-sub { display: block; font-size: calc(14px * var(--fs)); color: var(--muted); line-height: 1.7; margin: -4px 0 12px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.saip-course-group + .saip-course-group { padding-top: 0; }
.saip-inline-h { margin: 0; font-size: calc(clamp(24px, 2.6vw, 32px) * var(--fs)); }

@media (max-width: 991px) {
  .saip-tools { grid-template-columns: 1fr; }
  .saip-tool + .saip-tool { border-left: 0; }
  .saip-roi, .saip-checklist-grid { grid-template-columns: 1fr; }
  .saip-cl-aside { position: static; }
}
@media (max-width: 767px) {
  .saip-topline-home { display: none; }
  .saip-topline .container { justify-content: center; }
  .saip-langs a { padding: 6px 10px; font-size: calc(12px * var(--fs)); }
  .saip-tool { padding: 30px 4px; }
  .saip-quiz { padding: 24px 18px; }
  .saip-quiz-option span { min-height: 52px; padding: 10px 14px; font-size: calc(15px * var(--fs)); }
}

/* 外語的選單文字比較長：寬度不夠時先收起標誌旁的「線上學院」字樣、縮小選單間距 */
@media (max-width: 1399px) {
  .saip:not(.lang-zh) .saip-brand-sub { display: none; }
  .saip:not(.lang-zh) .site-nav a { padding-left: 10px; padding-right: 10px; font-size: calc(14px * var(--fs)); }
}

/* ---------- 內頁一致性：共用頁面（登入、註冊、聯絡、購物車、AI 助教）的卡通插圖換成企業實景照片 ---------- */
.saip .auth-art img, .saip .assistant-side > img, .saip .empty > img, .saip .panel > img[src*="illustrations/"] {
  content: url(img/b2b-team-800.webp); width: 100% !important; max-width: 420px; height: auto; aspect-ratio: 4 / 3; object-fit: cover; mix-blend-mode: normal !important; margin: 0 auto 22px !important; animation: none !important; filter: saturate(.92);
}
.saip .auth-art img { content: url(img/b2b-office-800.webp); }
.saip .empty > img { content: url(img/b2b-laptop-800.webp); max-width: 360px; }
.saip .panel > img[src*="illustrations/"] { max-width: 100%; }
.saip .auth-art h2 { font-size: calc(26px * var(--fs)); }
.saip .form-card, .saip .panel, .saip .reg-card, .saip .ent-tier, .saip .faq, .saip .assistant-box, .saip .chat-box { border-radius: 2px !important; }
.saip .form-card { border-top: 3px solid var(--gold); box-shadow: var(--shadow); }
.saip .form-title { font-family: var(--serif); color: var(--navy); }
.saip .bg-soft { background: #F3F4F1; }
.saip .faq summary { font-family: var(--serif); color: var(--navy); }
.saip .social-btn, .saip .btn-social { border-radius: 2px !important; }
.saip .proof i, .saip .ico { border-radius: 0 !important; background: var(--navy) !important; color: var(--gold-light) !important; }
.saip .course-faq .faq, .saip .lesson-row, .saip .chapter { border-radius: 0; }
.saip .detail-hero { background: var(--navy) url(img/b2b-team.webp) right center / cover no-repeat; }
.saip .detail-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 22, 56, .96) 0%, rgba(19, 32, 74, .9) 55%, rgba(27, 44, 90, .6) 100%); }
.saip .page-hero { background: var(--navy) url(img/b2b-office.webp) right 30% / cover no-repeat; position: relative; }
.saip .page-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 22, 56, .97) 0%, rgba(19, 32, 74, .9) 55%, rgba(27, 44, 90, .62) 100%); }
.saip .page-hero .container { position: relative; z-index: 1; }

/* 課程的語言版本（同一門課的中文、越南文、印尼文、泰文版） */
.saip-course-wrap { display: flex; flex-direction: column; }
.saip-course-wrap .saip-course { flex: 1; }
.saip-course-langs, .course-langs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; }
.saip-course-langs a, .course-langs a { padding: 5px 11px; border: 1px solid var(--line); background: #fff; font-size: calc(12.5px * var(--fs)); font-weight: 600; color: var(--navy); transition: all .25s; }
.saip-course-langs a:hover, .saip-course-langs a[aria-current], .course-langs a:hover, .course-langs a[aria-current] { background: var(--navy); border-color: var(--navy); color: #fff; }
.course-langs { margin-top: 18px; }
.course-langs span { font-size: calc(12px * var(--fs)); letter-spacing: .16em; color: var(--gold-light); margin-right: 6px; }
.course-langs a { background: transparent; border-color: rgba(255, 255, 255, .35); color: #fff; }
.course-langs a[aria-current], .course-langs a:hover { background: var(--gold); border-color: var(--gold); color: var(--navy-900); }

/* ---------- 課程列表：目錄式版面（依後台的課程體系排序分章，每章左邊是章名、右邊是課程清單，細線分隔） ---------- */
.saip-cx-index { background: #fff; border-bottom: 1px solid var(--line); }
.saip-cx-index .container { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 clamp(32px, 5vw, 80px); align-items: stretch; }
.saip-cx-index .container > :only-child { grid-column: 1 / -1; }
.saip-cx-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.saip-cx-stats > div { padding: clamp(26px, 3vw, 40px) 0 clamp(26px, 3vw, 40px) clamp(16px, 2vw, 28px); border-left: 1px solid var(--line); display: flex; flex-direction: column-reverse; justify-content: center; gap: 10px; }
.saip-cx-stats > div:first-child { border-left: 0; padding-left: 0; }
.saip-cx-stats dt { font-size: calc(12.5px * var(--fs)); letter-spacing: .14em; color: var(--muted); font-weight: 600; }
.saip-cx-stats dd { margin: 0; font-family: var(--latin); font-size: calc(clamp(40px, 4.4vw, 60px) * var(--fs)); line-height: 1; color: var(--navy); font-weight: 500; font-variant-numeric: lining-nums; }
.saip-cx-toc { list-style: none; margin: 0; padding: 18px 0 18px clamp(24px, 3vw, 48px); border-left: 1px solid var(--line); }
.saip-cx-toc a { display: flex; align-items: baseline; gap: 14px; padding: 9px 0; color: var(--navy); }
.saip-cx-toc-no { font-family: var(--latin); font-style: italic; color: var(--gold-deep); font-size: calc(18px * var(--fs)); min-width: 28px; }
.saip-cx-toc-name { font-family: var(--serif); font-weight: 700; font-size: calc(16.5px * var(--fs)); transition: color .25s; }
.saip-cx-toc-dots { flex: 1; border-bottom: 1px dotted var(--navy-200); transform: translateY(-4px); }
.saip-cx-toc-n { font-size: calc(13px * var(--fs)); color: var(--muted); }
.saip-cx-toc a:hover .saip-cx-toc-name { color: var(--gold-deep); }

.saip-cx-track { padding: clamp(64px, 8vw, 112px) 0; scroll-margin-top: 80px; }
.saip-cx-track + .saip-cx-track { border-top: 1px solid var(--line); }
.saip-cx-grid { display: grid; grid-template-columns: minmax(240px, 3.2fr) minmax(0, 9fr); gap: clamp(32px, 5vw, 88px); align-items: start; }
.saip-cx-aside { position: sticky; top: 120px; }
.saip-cx-chapter { display: flex; align-items: flex-end; gap: 14px; margin: 0 0 26px; padding-bottom: 18px; border-bottom: 1px solid var(--navy); }
.saip-cx-chapter span { font-size: calc(11.5px * var(--fs)); letter-spacing: .32em; font-weight: 600; color: var(--gold-deep); padding-bottom: 6px; }
.saip-cx-chapter b { margin-left: auto; font-variant-numeric: lining-nums; font-family: var(--latin); font-style: italic; font-weight: 500; font-size: calc(clamp(56px, 6vw, 84px) * var(--fs)); line-height: .8; color: var(--gold); }
.saip-cx-aside h2 { font-size: calc(clamp(28px, 3vw, 38px) * var(--fs)); line-height: 1.3; margin: 0 0 16px; }
.saip-cx-aside h2 em { display: block; font-family: var(--latin); font-style: italic; font-weight: 500; font-size: .56em; color: var(--navy-300); letter-spacing: .02em; margin-top: 6px; }
.saip-cx-aside p { color: var(--muted); font-size: calc(15.5px * var(--fs)); line-height: 1.9; margin: 0; }
.saip-cx-aside .saip-cx-aside-meta { margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line); font-size: calc(13px * var(--fs)); letter-spacing: .06em; color: var(--navy); font-weight: 600; }

.saip-cx-list { list-style: none; margin: 0; padding: 0; }
.saip-cx-item { display: grid; grid-template-columns: minmax(0, 4.4fr) minmax(0, 6fr); gap: clamp(24px, 3.4vw, 52px); padding: 0 0 clamp(40px, 4.6vw, 64px); }
.saip-cx-item:last-child { padding-bottom: 0; }
.saip-cx-item + .saip-cx-item { padding-top: clamp(40px, 4.6vw, 64px); border-top: 1px solid var(--line); }
.saip-cx-cover { position: relative; display: block; aspect-ratio: 16 / 10; align-self: start; margin: 0 14px 14px 0; }
.saip-cx-cover::before { content: ""; position: absolute; inset: 14px -14px -14px 14px; border: 1px solid var(--gold); transition: inset .6s var(--ease); }
.saip-cx-cover img { position: relative; display: block; width: 100%; height: 100%; object-fit: contain; padding: 7% 14%; background: #fff; border: 1px solid var(--line); transition: box-shadow .6s var(--ease); }
.saip-cx-cover img.photo { object-fit: cover; padding: 0; border: 0; }
.saip-cx-item:hover .saip-cx-cover::before { inset: 8px -8px -8px 8px; }
.saip-cx-item:hover .saip-cx-cover img { box-shadow: var(--shadow-lg); }
.saip-cx-body { display: flex; flex-direction: column; min-width: 0; }
.saip-cx-no { display: flex; align-items: center; gap: 14px; margin: 0 0 14px; font-size: calc(12px * var(--fs)); letter-spacing: .16em; color: var(--gold-deep); font-weight: 600; }
.saip-cx-no span { font-family: var(--latin); font-style: italic; font-variant-numeric: lining-nums; font-size: calc(20px * var(--fs)); letter-spacing: 0; color: var(--navy); display: flex; align-items: center; gap: 14px; }
.saip-cx-no span::after { content: ""; width: 28px; height: 1px; background: var(--gold); }
.saip-cx-body h3 { font-size: calc(clamp(21px, 2vw, 26px) * var(--fs)); line-height: 1.45; margin: 0 0 14px; }
.saip-cx-body h3 a { color: var(--navy); background: linear-gradient(var(--gold), var(--gold)) 0 100% / 0 1px no-repeat; transition: background-size .6s var(--ease), color .25s; }
.saip-cx-item:hover h3 a { background-size: 100% 1px; }
.saip-cx-sub { color: var(--muted); font-size: calc(15px * var(--fs)); line-height: 1.85; margin: 0 0 18px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.saip-cx-facts { list-style: none; display: flex; flex-wrap: wrap; margin: 0 0 18px; padding: 0; font-size: calc(13px * var(--fs)); color: var(--navy); font-weight: 600; }
.saip-cx-facts li + li::before { content: ""; display: inline-block; width: 1px; height: 11px; background: var(--navy-200); margin: 0 12px; vertical-align: -1px; }
.saip-cx-langs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; margin: 0 0 20px; font-size: calc(13px * var(--fs)); }
.saip-cx-langs span { font-size: calc(11px * var(--fs)); letter-spacing: .2em; color: var(--muted); margin-right: 14px; font-weight: 600; }
.saip-cx-langs a { color: var(--navy-300); padding: 2px 0; border-bottom: 1px solid transparent; transition: color .25s, border-color .25s; }
.saip-cx-langs a + a { margin-left: 21px; position: relative; }
.saip-cx-langs a + a::before { content: ""; position: absolute; left: -11px; top: 50%; width: 1px; height: 11px; margin-top: -5px; background: var(--navy-200); }
.saip-cx-langs a[aria-current] { color: var(--navy); font-weight: 700; border-bottom-color: var(--gold); }
.saip-cx-langs a:hover { color: var(--gold-deep); }
.saip-cx-foot { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.saip-cx-go { display: inline-flex; align-items: center; gap: 14px; font-size: calc(14px * var(--fs)); font-weight: 700; letter-spacing: .08em; color: var(--navy); }
.saip-cx-go:hover { color: var(--gold-deep); }
.saip-cx-item:hover .saip-arrow { width: 40px; }

@media (max-width: 1199px) {
  .saip-cx-index .container { grid-template-columns: 1fr; }
  .saip-cx-toc { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); }
  .saip-cx-grid { grid-template-columns: minmax(220px, 3fr) minmax(0, 9fr); }
  .saip-cx-item { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 28px; }
}
@media (max-width: 991px) {
  .saip-cx-grid { grid-template-columns: 1fr; gap: 36px; }
  .saip-cx-aside { position: static; max-width: 640px; }
}
@media (max-width: 767px) {
  .saip-cx-item { grid-template-columns: 1fr; gap: 26px; }
}
@media (max-width: 640px) {
  .saip-cx-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saip-cx-stats > div { padding: 20px 0 20px 18px; }
  .saip-cx-stats > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .saip-cx-stats > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .saip-cx-track { padding: 56px 0; }
  .saip-cx-chapter { margin-bottom: 20px; }
  .saip-cx-cover { margin: 0 10px 10px 0; }
  .saip-cx-cover::before { inset: 10px -10px -10px 10px; }
  .saip-cx-foot { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .saip-cx-cover::before, .saip-cx-cover img, .saip-cx-body h3 a { transition: none; }
}
.saip:not(.lang-zh) .saip-cx-toc-name { font-family: var(--sans); font-weight: 600; font-size: calc(15px * var(--fs)); }

/* ---------- 首頁主視覺：平板與手機（寬 992 以下）改成標題上方的 16:9 影片帶 ----------
   直式螢幕裝不下 16:9 的影片又要壓上標題，所以影片完整放在上方，標題、按鈕接在下方的藏青底；
   影片帶的下緣漸層融進藏青，右下角是暫停／重播按鈕。橫拿手機時影片帶最多佔畫面高度的 72%。 */
@media (max-width: 991px) {
  .saip-hero-film { --band: min(56.25vw, 72vh); display: block; min-height: 0; padding-top: var(--band); }
  .saip-hero-film .saip-hero-bg, .saip-hero-film .saip-hero-video { inset: 0 0 auto 0; height: var(--band); }
  .saip-hero-film::before, .saip-hero-film.is-ended::before { opacity: 1; background: linear-gradient(180deg, rgba(10, 22, 56, 0) 0, rgba(10, 22, 56, 0) calc(var(--band) - 72px), #0A1638 var(--band), #0A1638 100%); }
  .saip-hero-film .saip-hero-inner { padding-top: 34px; padding-bottom: 56px; }
  .saip-hero-film.is-stage .saip-hero-inner { opacity: 1; transform: none; pointer-events: auto; }
  .saip-film-toggle { top: calc(var(--band) - 58px); bottom: auto; right: 16px; width: 40px; height: 40px; }
}

/* ---------- 章節標題旁的實景照片（實戰任務制、主管管理功能）：左文右圖，照片後面一道金色細框 ---------- */
.saip-chapter-split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 80px); align-items: center; margin-bottom: clamp(40px, 5vw, 64px); }
.saip-chapter-split .saip-chapter { margin-bottom: 0; }
.saip-chapter-photo { position: relative; margin: 0 18px 18px 0; }
.saip-chapter-photo::before { content: ""; position: absolute; inset: 18px -18px -18px 18px; border: 1px solid var(--gold); }
.saip-chapter-photo img { position: relative; display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; filter: saturate(.9); }
.saip-navy .saip-chapter-photo::before { border-color: rgba(217, 164, 65, .6); }

/* ---------- 首頁講師段落：經營團隊兩位的小卡 ---------- */
.saip-fa-team { margin: 4px 0 34px; padding-top: 22px; border-top: 1px solid var(--line); }
.saip-fa-team > p { font-size: calc(12px * var(--fs)); letter-spacing: .2em; color: var(--muted); font-weight: 600; margin: 0 0 14px; }
.saip-fa-team ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.saip-fa-team a { display: flex; align-items: center; gap: 14px; padding: 10px 14px 10px 10px; background: #fff; border: 1px solid var(--line); color: var(--navy); transition: border-color .3s, box-shadow .4s var(--ease); }
.saip-fa-team a:hover { border-color: var(--gold); box-shadow: var(--shadow); }
.saip-fa-team img { width: 56px; height: 56px; object-fit: cover; object-position: center 20%; flex: none; }
.saip-fa-team span { display: flex; flex-direction: column; gap: 2px; font-size: calc(12.5px * var(--fs)); color: var(--muted); line-height: 1.5; }
.saip-fa-team b { font-family: var(--serif); font-size: calc(17px * var(--fs)); color: var(--navy); letter-spacing: .06em; }
.saip:not(.lang-zh) .saip-fa-team b { font-family: var(--sans); letter-spacing: 0; }

/* ---------- 師資團隊頁 ---------- */
.saip-ab-org { background: #fff; border-bottom: 1px solid var(--line); }
.saip-ab-years { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.saip-ab-years > div { padding: clamp(26px, 3vw, 40px) clamp(16px, 2vw, 28px); border-left: 1px solid var(--line); }
.saip-ab-years > div:first-child { border-left: 0; padding-left: 0; }
.saip-ab-years dt { font-family: var(--latin); font-size: calc(clamp(36px, 3.6vw, 52px) * var(--fs)); line-height: 1; color: var(--navy); font-variant-numeric: lining-nums; margin-bottom: 12px; }
.saip-ab-years dd { margin: 0; font-size: calc(13.5px * var(--fs)); color: var(--muted); line-height: 1.7; }
.saip-ab-quote { margin: 0 0 24px; padding: 4px 0 4px 22px; border-left: 2px solid var(--gold); font-family: var(--serif); font-size: calc(17px * var(--fs)); line-height: 1.8; color: var(--navy); }
.saip:not(.lang-zh) .saip-ab-quote { font-family: var(--latin); font-style: italic; font-size: calc(20px * var(--fs)); line-height: 1.5; }
.saip-ab-facts { margin: 28px 0 34px; border-top: 1px solid var(--line); }
.saip-ab-facts > div { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 18px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.saip-ab-facts dt { font-size: calc(12px * var(--fs)); letter-spacing: .14em; color: var(--gold-deep); font-weight: 600; padding-top: 2px; }
.saip-ab-facts dd { margin: 0; font-size: calc(14.5px * var(--fs)); color: var(--text); line-height: 1.8; }
.saip-ab-team { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 3vw, 40px); }
.saip-ab-person { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--navy); padding: clamp(26px, 3vw, 40px); scroll-margin-top: 100px; }
.saip-ab-person > header { display: flex; align-items: center; gap: 22px; margin-bottom: 24px; }
.saip-ab-person > header img { width: 132px; height: 132px; object-fit: cover; object-position: center 18%; flex: none; }
.saip-ab-person h3 { font-size: calc(28px * var(--fs)); letter-spacing: .1em; margin: 0 0 6px; }
.saip-ab-person h3 em { display: block; font-family: var(--latin); font-style: italic; font-weight: 500; font-size: .6em; letter-spacing: .02em; color: var(--navy-300); margin-top: 4px; }
.saip:not(.lang-zh) .saip-ab-person h3 { letter-spacing: 0; }
.saip-ab-person .saip-role { margin: 0; font-size: calc(13.5px * var(--fs)); }
.saip-ab-person > p { color: var(--text); line-height: 1.95; margin: 0; }
.saip-ab-person .saip-ab-facts { margin-bottom: 0; }
.saip-ab-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.saip-ab-flow small { display: inline-block; margin-top: 18px; font-size: calc(12px * var(--fs)); letter-spacing: .16em; color: var(--gold-light); border-top: 1px solid rgba(217, 164, 65, .5); padding-top: 10px; }
.saip-ab-sources { padding: clamp(48px, 6vw, 72px) 0; }
.saip-ab-sources .container { max-width: 900px; }
.saip-ab-sources h2 { font-size: calc(20px * var(--fs)); margin: 0 0 12px; }
.saip-ab-sources p { color: var(--muted); font-size: calc(14px * var(--fs)); line-height: 1.9; margin: 0 0 14px; }
.saip-ab-sources ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 28px; font-size: calc(14px * var(--fs)); }
.saip-ab-sources a { color: var(--navy); border-bottom: 1px solid var(--gold); }

@media (max-width: 991px) {
  .saip-chapter-split { grid-template-columns: 1fr; }
  .saip-chapter-photo { max-width: 620px; }
  .saip-ab-team { grid-template-columns: 1fr; }
  .saip-ab-flow { grid-template-columns: 1fr; gap: 0; }
  .saip-ab-flow li, .saip-ab-flow li + li { padding: 28px 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .14); }
}
@media (max-width: 640px) {
  .saip-ab-years { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saip-ab-years > div { padding: 20px 0 20px 16px; }
  .saip-ab-years > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .saip-ab-years > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .saip-ab-facts > div { grid-template-columns: 1fr; gap: 4px; }
  .saip-ab-person > header { gap: 16px; }
  .saip-ab-person > header img { width: 92px; height: 92px; }
  .saip-ab-person h3 { font-size: calc(23px * var(--fs)); }
  .saip-fa-team ul { grid-template-columns: 1fr; }
  .saip-chapter-photo { margin: 0 12px 12px 0; }
  .saip-chapter-photo::before { inset: 12px -12px -12px 12px; }
}

/* ---------- AI 導入成熟度健檢：說明、題目與報告 ---------- */
.saip-ck-gets { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 26px; font-size: calc(14px * var(--fs)); color: #E2E5EE; }
.saip-ck-gets li { position: relative; padding-left: 26px; }
.saip-ck-gets li::before { content: ""; position: absolute; left: 0; top: .8em; width: 14px; height: 1px; background: var(--gold); }
.saip-ck-dims { background: #fff; border-bottom: 1px solid var(--line); padding: clamp(36px, 4vw, 56px) 0; }
.saip-ck-dims ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.saip-ck-dims li { padding: 0 28px; border-left: 1px solid var(--line); }
.saip-ck-dims li:first-child { padding-left: 0; border-left: 0; }
.saip-ck-dims .saip-roman { font-size: calc(32px * var(--fs)); margin-bottom: 12px; }
.saip-ck-dims h2 { font-size: calc(18px * var(--fs)); margin: 0 0 8px; }
.saip-ck-dims p { margin: 0; color: var(--muted); font-size: calc(14px * var(--fs)); line-height: 1.8; }
.saip-quiz-count { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.saip-quiz-count span { color: var(--navy); letter-spacing: .16em; }
.saip-ck-privacy { margin: 26px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: calc(13px * var(--fs)); color: var(--muted); }

.saip-ck-report { max-width: 980px; margin: 0 auto; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--navy); box-shadow: var(--shadow); padding: clamp(28px, 4.4vw, 64px); outline: 0; }
.saip-ck-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: start; padding-bottom: 28px; border-bottom: 1px solid var(--navy); }
.saip-ck-head h2 { font-size: calc(clamp(26px, 3vw, 38px) * var(--fs)); line-height: 1.35; margin: 0 0 14px; }
.saip-ck-level-text { margin: 0; color: var(--text); line-height: 1.95; max-width: 620px; }
.saip-ck-score { text-align: right; min-width: 150px; padding-left: 28px; border-left: 1px solid var(--line); }
.saip-ck-score b { font-family: var(--latin); font-weight: 500; font-size: calc(clamp(64px, 7vw, 96px) * var(--fs)); line-height: .9; color: var(--navy); font-variant-numeric: lining-nums; }
.saip-ck-score span { font-family: var(--latin); font-size: calc(22px * var(--fs)); color: var(--navy-300); margin-left: 4px; }
.saip-ck-score small { display: block; margin-top: 10px; font-size: calc(12px * var(--fs)); letter-spacing: .18em; color: var(--gold-deep); font-weight: 600; }
.saip-ck-profile { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-bottom: 1px solid var(--line); }
.saip-ck-profile > div { padding: 18px 18px 18px 0; }
.saip-ck-profile > div + div { padding-left: 18px; border-left: 1px solid var(--line); }
.saip-ck-profile dt { font-size: calc(11.5px * var(--fs)); letter-spacing: .16em; color: var(--gold-deep); font-weight: 600; margin-bottom: 6px; }
.saip-ck-profile dd { margin: 0; font-size: calc(14px * var(--fs)); color: var(--navy); font-weight: 600; line-height: 1.6; }
.saip-ck-block { padding: clamp(28px, 3.4vw, 44px) 0 0; }
.saip-ck-block > h3 { display: flex; align-items: baseline; gap: 14px; font-size: calc(clamp(20px, 2vw, 24px) * var(--fs)); margin: 0 0 20px; }
.saip-ck-block > h3 span { font-family: var(--latin); font-style: italic; font-weight: 500; color: var(--gold); font-size: 1.15em; font-variant-numeric: lining-nums; }
.saip-ck-note { color: var(--muted); font-size: calc(14.5px * var(--fs)); line-height: 1.85; margin: 0 0 18px; }
.saip-ck-note:empty { display: none; }
.saip-ck-bars { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 14px; }
.saip-ck-bars li { display: grid; grid-template-columns: 150px minmax(0, 1fr) 44px; gap: 16px; align-items: center; }
.saip-ck-bar-name { font-size: calc(14.5px * var(--fs)); color: var(--navy); font-weight: 600; }
.saip-ck-bar-track { height: 10px; background: var(--navy-100); position: relative; }
.saip-ck-bar-track::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 calc(25% - 1px), #fff calc(25% - 1px) 25%); }
.saip-ck-bar-fill { display: block; height: 100%; background: linear-gradient(90deg, var(--navy) 0%, var(--navy-soft) 100%); transition: width 1s var(--ease); }
.saip-ck-bar-val { font-family: var(--latin); font-size: calc(22px * var(--fs)); font-weight: 500; color: var(--navy); text-align: right; font-variant-numeric: lining-nums; }
.saip-ck-findings { list-style: none; margin: 0; padding: 0; counter-reset: f; }
.saip-ck-findings > li { counter-increment: f; position: relative; padding: 22px 0 22px 52px; border-top: 1px solid var(--line); }
.saip-ck-findings > li::before { content: counter(f, decimal-leading-zero); position: absolute; left: 0; top: 20px; font-family: var(--latin); font-style: italic; font-size: calc(24px * var(--fs)); color: var(--gold); font-variant-numeric: lining-nums; }
.saip-ck-findings h4 { font-family: var(--serif); font-size: calc(18px * var(--fs)); color: var(--navy); margin: 0 0 12px; }
.saip:not(.lang-zh) .saip-ck-findings h4, .saip:not(.lang-zh) .saip-ck-services h4, .saip:not(.lang-zh) .saip-ck-road h4 { font-family: var(--sans); }
.saip-ck-findings dl { margin: 0; display: grid; gap: 8px; }
.saip-ck-findings dl > div { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; }
.saip-ck-findings dt { font-size: calc(12px * var(--fs)); letter-spacing: .12em; font-weight: 700; padding-top: 3px; }
.saip-ck-pain dt { color: #A1442F; }
.saip-ck-fix dt { color: var(--green); }
.saip-ck-findings dd { margin: 0; font-size: calc(15px * var(--fs)); line-height: 1.85; color: var(--text); }
.saip-ck-tags { margin: 12px 0 0 102px; font-size: calc(13px * var(--fs)); color: var(--gold-deep); font-weight: 600; }
.saip-ck-road { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--navy); }
.saip-ck-road > li { padding: 20px 20px 4px 0; }
.saip-ck-road > li + li { padding-left: 20px; border-left: 1px solid var(--line); }
.saip-ck-road h4 { font-family: var(--serif); font-size: calc(15.5px * var(--fs)); color: var(--navy); margin: 0 0 12px; }
.saip-ck-road ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.saip-ck-road ul li { position: relative; padding-left: 18px; font-size: calc(14px * var(--fs)); line-height: 1.75; color: var(--text); }
.saip-ck-road ul li::before { content: ""; position: absolute; left: 0; top: .72em; width: 7px; height: 7px; border: 1px solid var(--gold); transform: rotate(45deg); }
.saip-ck-services { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.saip-ck-services li { padding: 20px 22px; border: 1px solid var(--line); background: var(--paper); position: relative; }
.saip-ck-services li:first-child { border-color: var(--navy); background: #fff; box-shadow: inset 3px 0 0 var(--gold); }
.saip-ck-services h4 { font-family: var(--serif); font-size: calc(16.5px * var(--fs)); color: var(--navy); margin: 0 0 6px; }
.saip-ck-services .saip-ck-meta { font-size: calc(12px * var(--fs)); letter-spacing: .08em; color: var(--gold-deep); font-weight: 600; margin: 0 0 10px; }
.saip-ck-services p { margin: 0; font-size: calc(14px * var(--fs)); line-height: 1.8; color: var(--text); }
.saip-ck-foot { margin-top: clamp(32px, 4vw, 48px); padding-top: 24px; border-top: 1px solid var(--line); }
.saip-ck-foot > p { color: var(--muted); font-size: calc(13px * var(--fs)); margin: 0 0 22px; }

@media (max-width: 991px) {
  .saip-ck-dims ol { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 0; }
  .saip-ck-dims li:nth-child(odd) { padding-left: 0; border-left: 0; }
  .saip-ck-road { grid-template-columns: 1fr; }
  .saip-ck-road > li, .saip-ck-road > li + li { padding: 18px 0 8px; border-left: 0; border-top: 1px solid var(--line); }
  .saip-ck-road > li:first-child { border-top: 0; }
}
@media (max-width: 640px) {
  .saip-ck-dims ol { grid-template-columns: 1fr; gap: 0; }
  .saip-ck-dims li, .saip-ck-dims li:nth-child(odd) { padding: 18px 0; border-left: 0; border-top: 1px solid var(--line); }
  .saip-ck-dims li:first-child { border-top: 0; }
  .saip-ck-report { padding: 24px 18px; }
  .saip-ck-head { grid-template-columns: 1fr; gap: 20px; }
  .saip-ck-score { text-align: left; padding-left: 0; border-left: 0; }
  .saip-ck-profile { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .saip-ck-profile > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .saip-ck-profile > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .saip-ck-bars li { grid-template-columns: minmax(0, 1fr) 40px; gap: 6px 12px; }
  .saip-ck-bar-name { grid-column: 1 / -1; }
  .saip-ck-findings > li { padding-left: 40px; }
  .saip-ck-findings dl > div { grid-template-columns: 1fr; gap: 2px; }
  .saip-ck-tags { margin-left: 0; }
  .saip-ck-services { grid-template-columns: 1fr; }
}

/* 列印／存成 PDF：只印報告 */
@media print {
  html.ck-print body > :not(main), html.ck-print main > :not(#quiz), html.ck-print .saip-quiz, html.ck-print .saip-ck-actions { display: none !important; }
  html.ck-print body, html.ck-print #quiz { background: #fff !important; padding: 0 !important; }
  html.ck-print .saip-ck-report { box-shadow: none; border: 0; border-top: 4px solid var(--navy); padding: 0; max-width: none; }
  html.ck-print .saip-ck-findings > li, html.ck-print .saip-ck-services li, html.ck-print .saip-ck-road > li { break-inside: avoid; }
  html.ck-print * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  @page { margin: 16mm 14mm; }
}
.saip .saip-ck-report:focus, .saip .saip-ck-report:focus-visible { outline: 0; }

/* ---------- 企業方案頁：痛點（手繪插圖）、比較表、導入後的改變 ---------- */
.saip .visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.saip-ent-pains { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 40px); }
.saip-ent-pains article { display: flex; flex-direction: column; padding: 0 0 26px; border-bottom: 1px solid var(--line); }
.saip-ent-pains img { width: 100%; max-width: 300px; height: 210px; object-fit: contain; object-position: left bottom; margin-bottom: 26px; }
.saip-ent-no { font-family: var(--latin); font-style: italic; font-size: calc(22px * var(--fs)); color: var(--gold); margin: 0 0 6px; padding-top: 18px; border-top: 2px solid var(--navy); font-variant-numeric: lining-nums; }
.saip-ent-pains h3 { font-size: calc(clamp(21px, 2vw, 26px) * var(--fs)); margin: 0 0 16px; line-height: 1.4; }
.saip-ent-fix { margin: 0; font-size: calc(15px * var(--fs)); line-height: 1.85; color: var(--text); }
.saip-ent-fix b { display: block; font-size: calc(11.5px * var(--fs)); letter-spacing: .2em; color: var(--gold-deep); margin-bottom: 4px; }

.saip-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; background: #fff; border: 1px solid var(--line); }
.saip-table { width: 100%; border-collapse: collapse; min-width: 640px; font-size: calc(15px * var(--fs)); }
.saip-table th, .saip-table td { padding: 18px 22px; border-bottom: 1px solid var(--line); text-align: center; vertical-align: middle; }
.saip-table tbody tr:last-child th, .saip-table tbody tr:last-child td { border-bottom: 0; }
.saip-table tbody th { text-align: left; font-weight: 600; color: var(--navy); width: 34%; }
.saip-table thead th { font-family: var(--serif); font-size: calc(16.5px * var(--fs)); color: var(--navy); background: var(--paper); border-bottom: 2px solid var(--navy); padding-top: 22px; padding-bottom: 18px; }
.saip:not(.lang-zh) .saip-table thead th { font-family: var(--sans); font-weight: 700; }
.saip-table thead th small { display: block; font-family: var(--sans); font-size: calc(11px * var(--fs)); letter-spacing: .24em; color: var(--gold-deep); margin-bottom: 4px; font-weight: 600; }
.saip-table .is-saip { background: rgba(217, 164, 65, .07); }
.saip-table thead .is-saip { background: var(--navy); color: #fff; border-bottom-color: var(--gold); position: relative; }
.saip-table thead .is-saip small { color: var(--gold-light); }
.saip-table .saip-plan-tag { position: static; transform: none; display: inline-block; margin-bottom: 8px; }
.saip-table tr.is-text td { font-size: calc(14px * var(--fs)); line-height: 1.75; color: var(--text); text-align: left; vertical-align: top; }
.saip-table tr.is-cta td { padding-top: 22px; padding-bottom: 24px; }
.saip-table tr.is-cta b { display: block; font-family: var(--serif); color: var(--navy); margin-bottom: 12px; }
.saip-mark { display: inline-block; width: 22px; height: 22px; vertical-align: middle; position: relative; }
.saip-mark-2 { border-radius: 50%; background: var(--navy); }
.saip-mark-2::after { content: ""; position: absolute; left: 7px; top: 4px; width: 6px; height: 11px; border: solid var(--gold-light); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.saip-mark-1 { border-radius: 50%; border: 1.5px solid var(--navy-300); background: linear-gradient(90deg, var(--navy-300) 50%, transparent 50%); }
.saip-mark-0::after { content: ""; position: absolute; left: 5px; right: 5px; top: 50%; height: 1.5px; background: var(--navy-200); }
.saip-table-legend { display: flex; flex-wrap: wrap; gap: 8px 26px; margin: 16px 0 0; font-size: calc(13px * var(--fs)); color: var(--muted); }
.saip-table-legend span { display: inline-flex; align-items: center; gap: 8px; }
.saip-table-legend .saip-mark { transform: scale(.8); }
.saip-table-hint { margin: 16px 0 0; font-size: calc(14px * var(--fs)); color: var(--muted); }

.saip-ent-benefits { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.saip-ent-benefits .saip-chapter { margin-bottom: 30px; }
.saip-ent-gains { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line); }
.saip-ent-gains li { display: flex; gap: 16px; padding: 22px 20px 22px 0; border-bottom: 1px solid var(--line); }
.saip-ent-gains li:nth-child(even) { padding-left: 20px; border-left: 1px solid var(--line); }
.saip-ent-gains .saip-roman { font-size: calc(28px * var(--fs)); margin: 0; min-width: 34px; }
.saip-ent-gains h3 { font-size: calc(18px * var(--fs)); margin: 2px 0 8px; }
.saip-ent-gains p { margin: 0; font-size: calc(14.5px * var(--fs)); line-height: 1.8; color: var(--text); }
.saip-ent-gains .saip-link-arrow { margin-top: 8px; font-size: calc(13.5px * var(--fs)); }
.saip-faq-art { display: block; width: 100%; max-width: 280px; margin-top: 36px; }

@media (max-width: 991px) {
  .saip-ent-pains { grid-template-columns: 1fr; gap: 0; }
  .saip-ent-pains article { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 0 24px; padding: 24px 0; }
  .saip-ent-pains img { grid-row: 1 / span 3; height: 130px; margin: 0; object-position: center; }
  .saip-ent-no { border-top: 0; padding-top: 0; }
  .saip-ent-benefits { grid-template-columns: 1fr; }
  .saip-faq-art { display: none; }
}
@media (max-width: 640px) {
  .saip-ent-pains article { grid-template-columns: 96px minmax(0, 1fr); gap: 0 16px; }
  .saip-ent-pains img { height: 96px; }
  .saip-ent-pains h3 { font-size: calc(19px * var(--fs)); margin-bottom: 10px; }
  .saip-table { min-width: 560px; font-size: calc(14px * var(--fs)); }
  .saip-table th, .saip-table td { padding: 14px 12px; }
  .saip-table tbody th { position: sticky; left: 0; background: #fff; z-index: 1; width: 40%; box-shadow: 1px 0 0 var(--line); }
  .saip-ent-gains { grid-template-columns: 1fr; }
  .saip-ent-gains li:nth-child(even) { padding-left: 0; border-left: 0; }
}
@media (max-width: 640px) {
  .saip-table-compare { min-width: 0; table-layout: fixed; }
  .saip-table-compare tbody th { position: static; width: 46%; box-shadow: none; font-size: calc(13px * var(--fs)); }
  .saip-table-compare thead th { font-size: calc(12.5px * var(--fs)); line-height: 1.4; padding: 14px 6px; }
  .saip-table-compare td { padding: 12px 4px; }
  .saip-table-compare thead th:first-child { width: 46%; }
}
.saip-plans-cards { display: none; }
@media (max-width: 767px) {
  .saip-plans-cards { display: block; }
  .saip-plans-table { display: none; }
}
.saip-table-plans { table-layout: fixed; }
.saip-table-plans thead th:first-child, .saip-table-plans tbody th { width: 26%; }
@media (max-width: 991px) {
  .saip-table-plans thead th:first-child, .saip-table-plans tbody th { width: 30%; }
  .saip-table-plans th, .saip-table-plans td { padding-left: 14px; padding-right: 14px; }
}

/* ---------- AI 效益試算：左邊條件、右邊報告 ---------- */
.saip-rx { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(24px, 3vw, 44px); align-items: start; }
.saip-rx-form { position: sticky; top: 100px; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--gold); padding: clamp(22px, 2.6vw, 34px); display: grid; gap: 18px; }
.saip-rx-form .saip-kicker { margin-bottom: 0; }
.saip-rx-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.saip-rx-form .saip-field { display: grid; gap: 8px; margin: 0; }
.saip-rx-form .saip-field > span { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: calc(13.5px * var(--fs)); font-weight: 600; color: var(--navy); }
.saip-rx-form .saip-field output { font-family: var(--latin); font-size: calc(22px * var(--fs)); font-weight: 500; color: var(--navy); font-variant-numeric: lining-nums; }
.saip-rx-form input[type="number"], .saip-rx-form select { width: 100%; height: 46px; padding: 0 12px; border: 1px solid var(--line); background: var(--paper); font: inherit; font-size: calc(15px * var(--fs)); color: var(--ink); border-radius: 0; }
.saip-rx-form input[type="number"]:focus, .saip-rx-form select:focus { border-color: var(--navy); background: #fff; outline: 0; }
.saip-rx-form input[type="range"] { width: 100%; accent-color: var(--navy); }
.saip-rx-form small { font-size: calc(12px * var(--fs)); color: var(--muted); line-height: 1.6; }
.saip-rx-tasks { border: 0; margin: 0; padding: 0; min-width: 0; }
.saip-rx-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.saip-rx-table tr[data-row="money"] td { white-space: nowrap; }
.saip-rx-tasks legend { font-size: calc(13.5px * var(--fs)); font-weight: 600; color: var(--navy); margin-bottom: 10px; padding: 0; }
.saip-rx-tasks label { position: relative; cursor: pointer; margin: 0; }
.saip-rx-tasks input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.saip-rx-tasks span { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--line); background: var(--paper); font-size: calc(13.5px * var(--fs)); color: var(--ink); line-height: 1.4; transition: border-color .2s, background .2s; }
.saip-rx-tasks small { color: var(--gold-deep); font-weight: 600; font-size: calc(11.5px * var(--fs)); }
.saip-rx-tasks input:checked + span { border-color: var(--navy); background: #fff; box-shadow: inset 3px 0 0 var(--gold); }
.saip-rx-tasks input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
.saip-rx-form .saip-ck-privacy { margin: 0; }

.saip-rx-report { max-width: none; margin: 0; }
.saip-rx-head { padding-bottom: 24px; border-bottom: 1px solid var(--navy); }
.saip-rx-head h2 { font-size: calc(clamp(18px, 1.8vw, 22px) * var(--fs)); margin: 0 0 6px; color: var(--muted); font-family: var(--sans); font-weight: 600; letter-spacing: .04em; }
.saip-rx-big { font-family: var(--latin); font-weight: 500; font-size: calc(clamp(44px, 5.4vw, 76px) * var(--fs)); line-height: 1.05; color: var(--navy); margin: 0 0 22px; font-variant-numeric: lining-nums; word-break: break-word; }
.saip-rx-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--line); }
.saip-rx-stats > div { padding: 16px 16px 4px 0; }
.saip-rx-stats > div + div { padding-left: 16px; border-left: 1px solid var(--line); }
.saip-rx-stats dt { font-size: calc(11.5px * var(--fs)); letter-spacing: .14em; color: var(--gold-deep); font-weight: 600; margin-bottom: 6px; }
.saip-rx-stats dd { margin: 0; font-size: calc(15px * var(--fs)); color: var(--muted); }
.saip-rx-stats dd span, .saip-rx-stats-sm dd { font-family: var(--latin); font-size: calc(30px * var(--fs)); color: var(--navy); font-variant-numeric: lining-nums; }
.saip-rx-meta { display: flex; flex-wrap: wrap; gap: 6px 28px; margin: 18px 0 0; font-size: calc(13px * var(--fs)); color: var(--muted); }
.saip-rx-meta b { color: var(--navy); font-weight: 600; margin-left: 6px; }
.saip-rx-table { min-width: 520px; }
.saip-rx-table td { font-variant-numeric: tabular-nums; font-size: calc(14.5px * var(--fs)); color: var(--ink); }
.saip-rx-table tr[data-row="money"] td { font-weight: 700; color: var(--navy); font-size: calc(15.5px * var(--fs)); }
.saip-rx-table thead .is-saip { background: var(--navy); color: #fff; }
.saip-rx-bars { display: grid; gap: 14px; margin-bottom: 20px; }
.saip-rx-bars > div { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 14px; align-items: center; font-size: calc(14px * var(--fs)); color: var(--navy); font-weight: 600; }
.saip-rx-bars i { display: block; height: 14px; background: var(--navy-100); }
.saip-rx-bars b { display: block; height: 100%; background: var(--navy-300); transition: width .8s var(--ease); }
.saip-rx-bars b.is-gain { background: linear-gradient(90deg, var(--gold-deep), var(--gold)); }
.saip-rx-bars em { font-style: normal; font-variant-numeric: tabular-nums; min-width: 120px; text-align: right; }
.saip-rx-stats-sm dd { font-size: calc(24px * var(--fs)); }
.saip-rx-method { list-style: none; margin: 0 0 22px; padding: 0; counter-reset: m; border-top: 1px solid var(--line); }
.saip-rx-method li { counter-increment: m; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 14px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--line); }
.saip-rx-method li::before { content: counter(m); font-family: var(--latin); font-style: italic; font-size: calc(20px * var(--fs)); color: var(--gold); font-variant-numeric: lining-nums; }
.saip-rx-method p { margin: 0; font-size: calc(14px * var(--fs)); line-height: 1.75; color: var(--text); }
.saip-rx-method b { font-variant-numeric: tabular-nums; color: var(--navy); font-size: calc(15px * var(--fs)); white-space: nowrap; }
.saip-rx-assume { background: var(--paper); border-left: 3px solid var(--gold); padding: 18px 22px; }
.saip-rx-assume h4 { font-family: var(--serif); color: var(--navy); font-size: calc(16px * var(--fs)); margin: 0 0 10px; }
.saip:not(.lang-zh) .saip-rx-assume h4 { font-family: var(--sans); }
.saip-rx-assume ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-size: calc(13.5px * var(--fs)); line-height: 1.75; color: var(--text); }
.saip-rx-next p { margin: 0; font-size: calc(14px * var(--fs)); line-height: 1.75; color: var(--text); }

@media (max-width: 1199px) {
  .saip-rx { grid-template-columns: 1fr; }
  .saip-rx-form { position: static; }
}
@media (max-width: 640px) {
  .saip-rx-row, .saip-rx-chips { grid-template-columns: 1fr 1fr; gap: 8px; }
  .saip-rx-table tr[data-row="money"] td { white-space: normal; }
  .saip-rx-stats { grid-template-columns: 1fr; }
  .saip-rx-stats > div, .saip-rx-stats > div + div { padding: 12px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  .saip-rx-bars > div { grid-template-columns: 1fr auto; }
  .saip-rx-bars i { grid-column: 1 / -1; grid-row: 2; }
  .saip-rx-method li { grid-template-columns: 26px minmax(0, 1fr); }
  .saip-rx-method b { grid-column: 2; white-space: normal; }
  .saip-rx-table { min-width: 0; table-layout: fixed; }
  .saip-rx-table th, .saip-rx-table td { padding: 12px 6px; font-size: calc(12.5px * var(--fs)); }
  .saip-rx-table tbody th { position: static; width: 34%; box-shadow: none; }
  .saip-rx-table tr[data-row="money"] td { font-size: calc(13px * var(--fs)); }
}
@media print {
  html.rx-print body > :not(main), html.rx-print main > :not(#calculator), html.rx-print .saip-rx-form, html.rx-print .saip-ck-actions { display: none !important; }
  html.rx-print body, html.rx-print #calculator { background: #fff !important; padding: 0 !important; }
  html.rx-print .saip-rx { display: block; }
  html.rx-print .saip-rx-report { box-shadow: none; border: 0; border-top: 4px solid var(--navy); padding: 0; }
  html.rx-print .saip-ck-block { break-inside: avoid; }
  html.rx-print * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
.saip-rx > * { min-width: 0; }
@media (max-width: 640px) { .saip-rx-meta { display: grid; gap: 4px; } .saip-rx-bars em { min-width: 0; } }

/* ---------- 手機版體驗（2026-10-25）：可以點的東西至少 44px 高、英文小標與標籤不小於 12px ---------- */
@media (max-width: 767px) {
  /* 頂部的語言切換：原本 35×34，手指不好點 */
  .saip-langs { gap: 4px; }
  .saip-langs a { min-width: 44px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; font-size: calc(12.5px * var(--fs)); }

  /* 「看課程」「看 AI 工作效率課程」這類箭頭連結、課程的語言版本 */
  .saip-link-arrow, .saip-cx-go { min-height: 44px; }
  /* 課程的語言版本：換行後第二行開頭會掛著分隔線，手機上改成標籤自己一行、語言用間距排開 */
  .saip-cx-langs { gap: 0 22px; }
  .saip-cx-langs span { flex-basis: 100%; margin: 0; font-size: calc(12px * var(--fs)); }
  .saip-cx-langs a { padding: 11px 0; }
  .saip-course-langs a, .course-langs a { min-height: 44px; display: inline-flex; align-items: center; padding: 0 14px; }
  .saip-cx-langs a + a { margin-left: 0; }
  .saip-cx-langs a + a::before { display: none; }

  /* 頁尾：每個連結都是一整條好點的區塊 */
  .saip-footer-col { gap: 0; }
  .saip-footer-col a { display: block; padding: 10px 0; }
  .saip-footer-col h2 { margin-bottom: 6px; }
  .saip-footer-col h2 small { font-size: calc(12px * var(--fs)); letter-spacing: .2em; }
  .saip-footer-bar a { display: inline-block; padding: 10px 0; }

  /* 英文小標、標籤：手機上原本只有 11px */
  .saip-eyebrow, .saip-kicker { font-size: calc(12px * var(--fs)); letter-spacing: .22em; }
  .saip-pain-label, .saip-plan-code, .saip-plan-fit b, .saip-cx-chapter span, .saip-faculty-photo figcaption, .saip-line span, .saip-rx dt, .saip-ent-fix b, .saip-rx-tasks small { font-size: calc(12px * var(--fs)); }
}

/* ---------- 平板與觸控螢幕（2026-10-25）：768～1024px 與所有觸控裝置也要點得到、看得清楚，版面不留半邊空白 ---------- */
@media (max-width: 1024px), (pointer: coarse) {
  .saip-langs a { min-width: 44px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; font-size: calc(12.5px * var(--fs)); }
  .saip-link-arrow, .saip-cx-go { min-height: 44px; }
  .saip-course-langs a, .course-langs a { min-height: 44px; display: inline-flex; align-items: center; padding: 0 14px; }
  .saip-cx-langs a { padding: 11px 0; }
  .saip-footer-col { gap: 0; }
  .saip-footer-col a { display: block; padding: 10px 0; }
  .saip-footer-bar a { display: inline-block; padding: 10px 0; }
  .saip-eyebrow, .saip-kicker, .saip-footer-col h2 small, .saip-cx-langs span { font-size: calc(12px * var(--fs)); }
  .saip-pain-label, .saip-plan-code, .saip-plan-fit b, .saip-cx-chapter span, .saip-faculty-photo figcaption, .saip-line span, .saip-rx dt, .saip-ent-fix b, .saip-rx-tasks small { font-size: calc(12px * var(--fs)); }
}
@media (min-width: 768px) and (max-width: 991px) {
  /* 四大痛點：平板上單欄配滿版照片要捲很久，改成兩欄 */
  .saip-pains { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .saip-pain-q { padding: 26px 24px 22px; }
  .saip-pain-a { padding: 22px 24px 24px; }
  .saip-pain-q h3 { font-size: calc(19px * var(--fs)); }
}
@media (min-width: 641px) and (max-width: 991px) {
  /* 課程體系兩欄：落單的最後一個佔滿整列 */
  .saip-pillars li:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (min-width: 641px) and (max-width: 1199px) {
  /* 企業方案改成單欄時用滿整個寬度，不再只佔左邊 640px */
  .saip-plans { max-width: none; }
}