.video-hero{padding:65px 0 58px;background:#17382f;color:#f8f5e9}
.video-hero .eyebrow{color:#c7d7b8}
.video-hero h1{max-width:800px;margin:15px 0 18px;font:600 clamp(38px,5vw,60px)/1.35 NotoSerifTC,serif;letter-spacing:.02em}
.video-hero p{max-width:680px;margin:0;color:#e2e9dc;font-size:17px;line-height:1.85}
.video-hero .video-compare{max-width:none;margin-top:24px;padding-top:19px;border-top:1px solid #678575;font-size:13px;color:#d7e4d5}
.video-compare a{color:#fff;text-underline-offset:4px;font-weight:700}
.video-jump{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.video-jump a{padding:8px 15px;border:1px solid #a8bca3;border-radius:100px;color:#faf8ef;font-size:14px;font-weight:700;text-decoration:none}
.video-jump a:hover{background:#f7f4e9;color:#17382f}
.video-sections{padding-top:16px;padding-bottom:86px}
.video-section{padding-top:52px;scroll-margin-top:94px}
.video-section+.video-section{margin-top:35px;border-top:1px solid #dee4d8}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:22px;margin-bottom:25px}
.section-heading h2{margin:5px 0 0;font:600 clamp(28px,3vw,38px)/1.4 NotoSerifTC,serif}
.section-heading p{margin:0;color:#637468;font-size:14px}
.video-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px 15px}
.video-card{min-width:0}
.video-poster{display:block;position:relative;aspect-ratio:9/16;overflow:hidden;border:1px solid #d3ddcf;border-radius:11px;background:#dce6d8;box-shadow:0 7px 20px #193c2d14}
.video-poster[hidden]{display:none}
.video-poster img{width:100%;height:100%;object-fit:cover;transition:transform .2s}
.video-poster:hover img{transform:scale(1.035)}
.play-icon{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:#fffef1ed;color:#17382f;font-size:14px;transform:translate(-50%,-50%);box-shadow:0 3px 12px #142e2b55}
.video-duration{position:absolute;right:9px;bottom:9px;padding:3px 7px;border-radius:4px;background:#17382fdf;color:#fff;font:700 12px/1.4 NotoSansTC,sans-serif}
.video-card h3{margin:10px 0 3px;font:700 16px/1.5 NotoSansTC,sans-serif}
.youtube-link{font-size:12px;color:#38664a;text-underline-offset:3px}
.inline-stage{position:relative;aspect-ratio:9/16;overflow:hidden;border-radius:11px;background:#000}
.inline-frame{width:100%;height:100%;border:0;background:#000}
.video-close{position:absolute;z-index:2;right:8px;top:8px;width:32px;height:32px;border:0;border-radius:50%;background:#f9f8eef2;color:#17382f;font-size:20px;cursor:pointer}
.video-end{background:#e7eee6;padding:31px 0}
.video-end .container{display:flex;justify-content:space-between;align-items:center;gap:24px}
.video-end p{max-width:720px;margin:0;color:#55685a;font-size:14px}
.video-end a{flex:none;color:#24533c;font-size:14px;font-weight:700;text-underline-offset:4px}
@media(max-width:980px){.video-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:700px){.video-hero{padding:43px 0 42px}.video-hero h1{font-size:38px}.video-hero p{font-size:16px}.video-jump{gap:8px;margin-top:24px}.video-jump a{font-size:13px;padding:7px 12px}.video-sections{padding-bottom:58px}.video-section{padding-top:38px;scroll-margin-top:78px}.video-section+.video-section{margin-top:27px}.section-heading{display:block;margin-bottom:18px}.section-heading p{margin-top:7px}.video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 12px}.video-card h3{font-size:15px}.video-end .container{display:block}.video-end a{display:inline-block;margin-top:11px}}
@media(prefers-reduced-motion:reduce){.video-poster img{transition:none}}