/* หน้าแรก — แถบ "ผลงานเด่น" (front-page.php) · โทนเข้ม รูปใหญ่ เลื่อนแนวนอน */
.showcase{background:var(--navy);color:#dfe5f0;padding:clamp(48px,7vw,88px) 0;overflow:hidden}
.showcase h2{color:#fff;margin:0}
.showcase .eyebrow::before{background:#ffb599}
.showcase-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px}
.showcase-nav{display:flex;gap:10px}
.showcase-nav button{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;font-size:1.2rem;cursor:pointer;transition:.2s}
.showcase-nav button:hover:not(:disabled){background:var(--accent);border-color:var(--accent)}
.showcase-nav button:disabled{opacity:.3;cursor:default}
.showcase-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;
  padding:0 max(4%,calc((100vw - 1180px)/2));scroll-padding:0 max(4%,calc((100vw - 1180px)/2))}
.showcase-track::-webkit-scrollbar{display:none}
.sc-item{position:relative;flex:0 0 clamp(280px,40vw,560px);aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;scroll-snap-align:start;background:var(--navy-2);color:#fff}
.sc-item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.sc-item::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(19,35,64,0) 40%,rgba(19,35,64,.92))}
.sc-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 24px}
.sc-cap span{display:block;color:#ffb599;font-family:var(--font-head);font-size:.85rem;margin-bottom:4px}
.sc-cap h3{color:#fff;margin:0;font-size:clamp(1.05rem,1.8vw,1.35rem)}
.sc-cap em{display:inline-block;font-style:normal;font-family:var(--font-head);font-size:.88rem;margin-top:10px;opacity:0;transform:translateY(6px);transition:.25s}
.sc-item:hover img{transform:scale(1.06)}
.sc-item:hover em,.sc-item:focus-visible em{opacity:1;transform:none}
.showcase-foot{margin-top:30px}
@media (hover:none){.sc-cap em{opacity:1;transform:none}}
@media (max-width:640px){.showcase-nav{display:none}.sc-item{flex-basis:82vw}}

/* หน้าแรก — วิดีโอพื้นหลัง Hero (ซ้อนบนภาพนิ่ง ค่อย ๆ จางเข้าเมื่อเริ่มเล่น) */
.hero video.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
.hero video.bg.is-on{opacity:.55}
/* เมื่อวิดีโอเล่นแล้ว ซ่อนภาพนิ่งด้านล่าง ไม่ให้ภาพซ้อนเป็นเงา */
.hero img.bg{transition:opacity 1.2s ease}
.hero.video-on img.bg{opacity:0}