.work-slider { position: relative; margin: 0 12px; }
.theme-dark #work .section-head h2,
.theme-dark #work .section-head p { color: #a0a0a0; }
.theme-light #work .section-head h2,
.theme-light #work .section-head p { color: #000000; }
.theme-dark #work { background: transparent; position: relative; overflow: visible; }
.theme-light #work { background: #ffffff; }
.theme-dark #work::before { content: none; }
.work-track { display: grid; grid-auto-flow: column; grid-auto-columns: 85%; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.work-track.is-autoplaying { scroll-snap-type: none; }
.work-track::-webkit-scrollbar { display: none; }
.work-slide { position: relative; border-radius: 16px; overflow: hidden; scroll-snap-align: start; border: 1px solid var(--border); background: #0c1426; box-shadow: 0 0 20px rgba(179,11,28,0.24); }
.work-slider:hover .work-arrow { opacity: 1; }
.work-slide img { width: 100%; height: 380px; object-fit: cover; display: block; transform: scale(1.02); transition: transform 0.6s ease; position: relative; z-index: 1; }
.work-slide:hover img { transform: scale(1.06); }
.work-slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.02), rgba(0,0,0,0.45)); z-index: 3; }
.work-slide figcaption { position: absolute; left: 16px; right: 16px; bottom: 14px; color: #ffffff; z-index: 6; font-weight: 600; text-shadow: 0 1px 14px rgba(0,0,0,0.6); }
.work-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border); background: rgba(0,0,0,0.35); color: #fff; cursor: pointer; backdrop-filter: blur(6px); }
.work-arrow:hover { background: rgba(0,0,0,0.5); }
.work-arrow.prev { left: 4px; }
.work-arrow.next { right: 4px; }

/* Neon ring along edges only */
.work-slide::before { content: ""; position: absolute; inset: 0; border-radius: 16px; border: 6px solid #fcf8f3; box-shadow: 0 0 8px var(--brand-red-1), 0 0 18px var(--brand-red-09), 0 0 36px var(--brand-red-072); z-index: 5; pointer-events: none; animation: neonPulse 4.5s ease-in-out infinite; }

@media (max-width: 960px) { .work-track { grid-auto-columns: 88%; } .work-slide img { height: 320px; } }
@media (max-width: 720px) { .work-track { grid-auto-columns: 92%; } .work-slide img { height: 260px; } }