.work-gallery { display: block; min-height: 0; padding: clamp(74px,8vw,122px) 0 70px; overflow: hidden; background: #e8e6df; color: #263028; }
.work-gallery-head { max-width: 1500px; margin: 0 auto; padding: 0 7.4vw 45px; display: flex; align-items: end; justify-content: space-between; gap: 60px; }
.work-gallery-head .section-label { color: #526052; }
.work-gallery-head h2 { font-size: clamp(64px,8vw,132px); line-height: .83; letter-spacing: -.055em; }
.work-gallery-head h2 em { font-weight: 400; }
.work-gallery-head > p { max-width: 330px; color: #4d5a50; font-size: 16px; line-height: 1.65; }
.work-gallery-view { --work-card-width: clamp(480px,49vw,700px); --work-gap: 18px; position: relative; }
.work-gallery-controls { max-width: 1500px; margin: 0 auto; padding: 0 7.4vw 20px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #afb7a9; font-size: 13px; color: #526052; }
.work-gallery-controls > div { display: flex; gap: 8px; }
.work-gallery-controls button { width: 52px; height: 52px; border: 1px solid #9ba999; border-radius: 50%; background: transparent; font-size: 25px; line-height: 1; transition: background .2s,color .2s,transform .2s; }
.work-gallery-controls button:not(:disabled):hover { background: #263028; color: #f7f5f0; transform: translateY(-2px); }
.work-gallery-controls button:disabled { opacity: .35; cursor: default; }
.work-gallery-track { --work-step: calc(var(--work-card-width) + var(--work-gap)); display: flex; gap: var(--work-gap); overflow-x: hidden; overflow-anchor: none; overscroll-behavior-x: contain; scroll-behavior: auto; scrollbar-width: none; padding: 28px calc((100vw - var(--work-card-width))/2) 40px 7.4vw; }
.work-gallery-track::-webkit-scrollbar { display: none; }
.work-gallery-card { --i: 0; position: relative; flex: 0 0 var(--work-card-width); height: clamp(480px,42vw,600px); padding: 0; border: 0; border-radius: 36px; background: #d4d5ce; overflow: hidden; box-shadow: 0 18px 40px rgba(29,39,31,.13); transform: translateX(calc(var(--i) * -1 * var(--work-step) + var(--i) * 8px)) translateY(calc(var(--i) * 5px)); transition: transform .78s cubic-bezier(.18,.72,.18,1),box-shadow .3s ease; }
.work-gallery-card:nth-child(1) { --i: 0; z-index: 5; }
.work-gallery-card:nth-child(2) { --i: 1; z-index: 4; }
.work-gallery-card:nth-child(3) { --i: 2; z-index: 3; }
.work-gallery-card:nth-child(4) { --i: 3; z-index: 2; }
.work-gallery-card:nth-child(5) { --i: 4; z-index: 1; }
.work-gallery-card img { width: 100%; height: 100%; object-fit: contain; background: #d4d5ce; }
.work-gallery-card:first-child img { object-fit: cover; object-position: 50% 57%; }
.work-gallery-view:not(.is-expanded) .work-gallery-track { pointer-events: none; }
.work-gallery-view.is-expanded .work-gallery-track { overflow-x: auto; }
.work-gallery-view.is-expanded .work-gallery-card { transform: translateX(0) translateY(0); }
.work-gallery-view.is-expanded .work-gallery-card:nth-child(2) { transition-delay: 35ms; }
.work-gallery-view.is-expanded .work-gallery-card:nth-child(3) { transition-delay: 70ms; }
.work-gallery-view.is-expanded .work-gallery-card:nth-child(4) { transition-delay: 105ms; }
.work-gallery-view.is-expanded .work-gallery-card:nth-child(5) { transition-delay: 140ms; }
.work-gallery-view.is-expanded .work-gallery-card:hover { transform: translateY(-5px); box-shadow: 0 25px 48px rgba(29,39,31,.16); }
.work-gallery-open { position: absolute; z-index: 7; left: calc(7.4vw + var(--work-card-width) / 2); bottom: 65px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 24px; padding: 13px 19px; border: 1px solid rgba(255,255,255,.7); border-radius: 50px; background: rgba(247,246,240,.92); color: #263028; box-shadow: 0 10px 30px rgba(0,0,0,.16); backdrop-filter: blur(10px); font-size: 13px; white-space: nowrap; transition: opacity .25s,transform .25s; }
.work-gallery-open span { font-size: 21px; line-height: 1; }
.work-gallery-open:hover { transform: translateX(-50%) translateY(-3px); }
.work-gallery-view.is-expanded .work-gallery-open { opacity: 0; pointer-events: none; transform: translateX(-50%) translateY(12px); }
.work-gallery-foot { max-width: 1500px; margin: 0 auto; padding: 0 7.4vw; display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.work-gallery-progress { width: min(260px,25vw); height: 2px; flex: 0 0 auto; background: #bac2b6; }
.work-gallery-progress span { display: block; width: 20%; height: 100%; background: #263028; transition: width .35s ease; }
.work-gallery-foot p { max-width: 560px; margin: 0; font-size: 12px; line-height: 1.6; color: #667166; }
.work-gallery-foot a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 760px) {
  .work-gallery { padding: 70px 0 55px; }
  .work-gallery-head { display: block; padding: 0 8vw 28px; }
  .work-gallery-head h2 { font-size: clamp(64px,14vw,98px); }
  .work-gallery-head > p { max-width: 440px; margin-top: 25px; font-size: 15px; }
  .work-gallery-controls { padding: 0 8vw 13px; }
  .work-gallery-controls > span { max-width: 185px; line-height: 1.4; }
  .work-gallery-controls button { width: 46px; height: 46px; }
  .work-gallery-view { --work-card-width: 89vw; --work-gap: 12px; }
  .work-gallery-track { padding: 23px 5vw 34px; }
  .work-gallery-card { height: min(118vw,530px); border-radius: 26px; }
  .work-gallery-open { left: calc(5vw + var(--work-card-width) / 2); bottom: 55px; }
  .work-gallery-foot { display: block; padding: 0 8vw; }
  .work-gallery-progress { width: 100%; margin-bottom: 20px; }
}
@media (prefers-reduced-motion: reduce) { .work-gallery-track { scroll-behavior: auto; } .work-gallery-card,.work-gallery-controls button,.work-gallery-open,.work-gallery-progress span { transition: none; } }