/* AI 剪片入門課（course-ai-video-intro.html）＋下載頁共用。手機先排，價錢放最後。 */
.ivi { --g9: #12352e; --g7: #1f4d3a; --mint: #e6f3ea; --cream: #fbf8f1; --line: #d9e4dc; --ink: #1d2a24; --muted: #5d6b63; --gold: #b8873a; color: var(--ink); background: #fff; padding-bottom: 88px; }
.ivi-wrap { width: min(1080px, 100% - 32px); margin: 0 auto; }
.ivi-narrow { max-width: 720px; }
.ivi-buyer { margin: 0; padding: 10px 16px; background: var(--mint); border-bottom: 1px solid #cfe2c6; color: var(--g7); font-size: 15px; line-height: 1.6; text-align: center; }
.ivi-buyer a { color: var(--g7); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.ivi-kicker { margin: 0 0 10px; color: var(--gold); font-weight: 800; letter-spacing: .08em; font-size: 14px; }
.ivi h1, .ivi h2 { font-family: "Noto Serif TC", serif; color: var(--g9); letter-spacing: .01em; }
.ivi h1 { font-size: clamp(28px, 7vw, 46px); line-height: 1.3; margin: 0 0 16px; }
.ivi h2 { font-size: clamp(24px, 5.4vw, 34px); line-height: 1.35; margin: 0 0 20px; }
.ivi h3 { margin: 0 0 6px; font-size: 20px; color: var(--g9); }
.ivi p, .ivi li { font-size: 17px; line-height: 1.85; }
.ivi-hero { background: linear-gradient(180deg, var(--cream), #fff); padding: 36px 0 28px; }
.ivi-hero-grid { display: grid; gap: 28px; align-items: center; }
.ivi-lead { color: var(--muted); margin: 0 0 22px; }
.ivi-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ivi-phone { margin: 0 auto; width: min(300px, 78vw); text-align: center; }
.ivi-phone video { display: block; width: 100%; height: auto; aspect-ratio: 9 / 16; border-radius: 26px; border: 8px solid #101c17; background: #101c17; box-shadow: 0 18px 40px rgba(18, 53, 46, .22); }
.ivi-phone figcaption { margin-top: 10px; font-size: 14px; color: var(--muted); }
.ivi-phone--small { width: min(230px, 62vw); margin-top: 28px; }
.ivi-sec { padding: 48px 0; }
.ivi-soft { background: var(--cream); }
.ivi-checks { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 10px; }
.ivi-checks li { position: relative; padding: 12px 14px 12px 44px; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.ivi-checks li::before { content: "✓"; position: absolute; left: 16px; top: 12px; color: var(--g7); font-weight: 900; }
.ivi-pain .ivi-checks li::before { content: "·"; font-size: 28px; top: 2px; }
.ivi-scan { margin: 0; }
.ivi-scan img { display: block; width: 100%; height: auto; border-radius: 16px; border: 1px solid var(--line); }
.ivi-scan figcaption { margin-top: 10px; font-size: 14px; color: var(--muted); }
.ivi-cards { display: grid; gap: 14px; }
.ivi-card { position: relative; padding: 20px 20px 18px 64px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.ivi-num { position: absolute; left: 18px; top: 18px; width: 32px; height: 32px; border-radius: 50%; background: var(--g9); color: #fff; font-weight: 900; display: grid; place-items: center; }
.ivi-say { margin: 0 0 6px; color: var(--g7); font-weight: 800; }
.ivi-card p:last-child { margin: 0; color: var(--muted); }
.ivi-extras { display: grid; gap: 10px; margin-top: 14px; }
.ivi-extras div { padding: 14px 16px; border-radius: 14px; background: var(--mint); }
.ivi-extras strong { display: block; color: var(--g9); }
.ivi-extras span { color: var(--muted); font-size: 15px; line-height: 1.7; }
.ivi-two { display: grid; gap: 32px; }
.ivi-list, .ivi-steps { margin: 0; padding-left: 22px; display: grid; gap: 8px; }
.ivi-note { margin-top: 16px; padding: 12px 14px; border-left: 3px solid var(--gold); background: #fff; }
.ivi details { border-bottom: 1px solid var(--line); padding: 14px 0; }
.ivi summary { cursor: pointer; font-weight: 800; color: var(--g9); font-size: 17px; }
.ivi details p { margin: 10px 0 0; color: var(--muted); }
.ivi-price-sec { background: var(--g9); }
.ivi-price { max-width: 460px; margin: 0 auto; background: #fff; border-radius: 22px; padding: 28px 24px; text-align: center; }
.ivi-req { margin: 0 0 8px; font-size: 14px !important; color: var(--muted); }
.ivi-price h2 { margin: 0 0 8px; }
.ivi-badge { display: inline-block; margin: 0; padding: 2px 12px; border-radius: 999px; background: var(--mint); color: var(--g7); font-weight: 800; font-size: 14px !important; }
.ivi-amount { display: block; font-size: 48px; color: var(--g9); line-height: 1.2; margin: 8px 0 0; font-family: "Noto Serif TC", serif; }
.ivi-later { margin: 0 0 14px; color: var(--muted); font-size: 15px !important; }
.ivi-price ul { text-align: left; margin: 0 0 18px; padding-left: 22px; }
.ivi-price .store-primary { width: 100%; }
.ivi-line, .ivi-pay { margin: 12px 0 0; font-size: 14px !important; color: var(--muted); }
.ivi a:not(.btn) { color: var(--g7); }
.ivi a.btn { color: #fff; }
.ivi a.btn.secondary { color: var(--g9); }
@media (min-width: 860px) {
  .ivi-hero { padding: 64px 0 48px; }
  .ivi-hero-grid { grid-template-columns: 1.2fr .8fr; }
  .ivi-cards { grid-template-columns: repeat(3, 1fr); }
  .ivi-card { padding: 64px 20px 20px; }
  .ivi-extras { grid-template-columns: 1fr 1fr; }
  .ivi-two { grid-template-columns: 1fr 1fr; }
  .ivi-sec { padding: 72px 0; }
}
/* 下載頁 */
.ivi-class-box { max-width: 720px; margin: 0 auto; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 24px; }
.ivi-download { display: inline-block; margin: 8px 0; }
.ivi-state[hidden] { display: none; }

.ivi-videos { margin: 0 0 14px; }
.ivi-videos div { background: var(--g9); }
.ivi-videos strong, .ivi-videos span { color: #fff; }
.ivi-video-embed { position: relative; aspect-ratio: 16 / 9; margin: 12px 0; border-radius: 14px; overflow: hidden; background: #000; }
.ivi-video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ivi-lesson { padding: 18px 0; border-bottom: 1px solid var(--line); }
.ivi-lesson:last-child { border-bottom: 0; }
.ivi-tip { margin: 8px 0; padding: 12px 14px; border-left: 3px solid var(--gold); background: var(--cream); font-size: 15px; }
.ivi-demo { display: flex; gap: 12px; flex-wrap: wrap; }
.ivi-demo video { width: min(200px, 44%); aspect-ratio: 9 / 16; border-radius: 14px; background: #000; }

/* Keep the expanded lesson instructions readable on phones. */
.ivi-lesson p{line-height:1.9;margin:18px 0}.ivi-lesson h3{margin:28px 0 14px}.ivi-lesson .ivi-steps li{line-height:1.9;margin-bottom:18px}.ivi-lesson .ivi-tip{margin:18px 0;padding:16px}
.ivi-md { margin-top: 12px; }
.ivi-md h3 { margin: 22px 0 8px; font-size: 18px; }
.ivi-md p, .ivi-md li { font-size: 16px; line-height: 1.85; }
.ivi-md table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size: 15px; display: block; overflow-x: auto; }
.ivi-md th, .ivi-md td { padding: 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.ivi-md thead th { background: var(--mint); }
.ivi-md pre { background: #1f2a24; color: #f3efe6; padding: 14px 16px; border-radius: 10px; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 15px; line-height: 1.7; margin: 0 0 14px; }
.ivi-md code { font-size: .95em; }
.ivi-md hr { border: 0; border-top: 1px solid var(--line); margin: 20px 0; }
.ivi-copy { display: inline-block; margin: 6px 0; border: 0; border-radius: 999px; background: var(--g9); color: #fff; font: inherit; font-size: 14px; font-weight: 800; padding: 6px 16px; cursor: pointer; }