/* work-gallery — merged from the static build's app.css, source order preserved. */

.digital-work { height: 727px; margin-top: 120px; }
.digital-work .digital-intro h2 { width: 640px; }
.digital-work .digital-intro h2 em { display: inline; }
.digital-work .digital-intro > p:last-child { color: #000; letter-spacing: .04em; }
.digital-work .web-work__viewport { margin-top: 75px; }
.digital-work .web-work__track img { height: 440px; border-radius: 0; }
.work-rail { overflow-x: auto; scroll-behavior: smooth; scroll-padding-inline: max(40px, calc((100% - 1440px) / 2 + 40px)); scroll-snap-type: x proximity; scrollbar-width: none; overscroll-behavior-inline: contain; }
.work-rail::-webkit-scrollbar { display: none; }
.work-gallery { padding: 99px 0 87px; overflow: hidden; border-top: 1px solid rgba(0,0,0,.1); background: #fff url("../../assets/img/work-background.png") top center / 100% 958px no-repeat; }
.work-gallery .section-intro h2 { margin-top: 26px; }
.work-gallery .section-intro > p:last-of-type:not(.eyebrow):not(.eyebrow) { margin-top: 14px; color: #000; font-size: 18px; }
.work-tabs { display: inline-flex; align-items: center; margin-top: 35px; padding: 5px; background: rgba(232,71,59,.1); }
.work-tab { position: relative; min-width: 112px; height: 40px; padding: 0 18px; border: 0; background: transparent; font: inherit; font-size: 16px; cursor: pointer; }
.work-tab.is-active { color: #fff; background: var(--coral); }
.work-tab:not(.is-active) .corner-frame__ornaments { opacity: 0; }
.work-rail { margin-top: 85px; }
.work-rail__track { display: flex; width: max-content; gap: 20px; padding-inline: max(40px, calc((100% - 1440px) / 2 + 40px)); }
.work-rail__track img { width: 305px; height: 440px; flex: none; object-fit: cover; scroll-snap-align: start; }
.web-work { padding: 120px 0 102px; }
.web-work__viewport { width: 100%; margin-top: 116px; overflow-x: auto; scroll-padding-inline: max(40px, calc((100% - 1440px) / 2 + 40px)); scroll-snap-type: x mandatory; scrollbar-width: none; }
.web-work__viewport::-webkit-scrollbar { display: none; }
.web-work__track { display: flex; width: max-content; gap: 20px; padding-inline: max(40px, calc((100% - 1440px) / 2 + 40px)); }
.web-work__track img { width: 305px; height: 440px; flex: none; border-radius: 16px; object-fit: cover; scroll-snap-align: start; }
.web-work__controls { position: relative; z-index: 3; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; margin-top: 38px; }
body.web-development-page .web-work__controls { width: min(100%, var(--wd-page)); margin-inline: auto; padding-inline: var(--wd-gutter); }
body.web-development-page .web-work h2 { width: 587px; }
body.web-development-page .web-work .web-section-intro > p:last-child { width: 587px; }
body.web-development-page .web-work { min-height: 0; padding: 120px 0; }
body.web-development-page .web-work__viewport { margin-top: 72.7px; scroll-padding-inline: max(var(--wd-gutter), calc((100% - var(--wd-page)) / 2 + var(--wd-gutter))); }
body.web-development-page .web-work__track { gap: 20px; padding-inline: max(var(--wd-gutter), calc((100% - var(--wd-page)) / 2 + var(--wd-gutter))); }
body.web-development-page .web-work__track img { width: 305px; height: 440px; border-radius: 16px; }
body.web-development-page .web-work__controls { position: relative; z-index: 3; display: grid; align-items: center; margin: 40px auto 0; gap: 0; grid-template-columns: 1fr auto 1fr; }
.web-development-page .web-work__controls { width: min(100%, var(--wd-page)); margin-inline: auto; padding-inline: var(--wd-gutter); }
.web-development-page .web-work h2 { width: 587px; }
.web-development-page .web-work .web-section-intro > p:last-child { width: 587px; }
.web-development-page .web-work { min-height: 0; padding: 120px 0; }
.web-development-page .web-work__viewport { margin-top: 72.7px; scroll-padding-inline: max(var(--wd-gutter), calc((100% - var(--wd-page)) / 2 + var(--wd-gutter))); }
.web-development-page .web-work__track { gap: 20px; padding-inline: max(var(--wd-gutter), calc((100% - var(--wd-page)) / 2 + var(--wd-gutter))); }
.web-development-page .web-work__track img { width: 305px; height: 440px; border-radius: 16px; }
.web-development-page .web-work__controls { position: relative; z-index: 3; display: grid; align-items: center; margin: 40px auto 0; gap: 0; grid-template-columns: 1fr auto 1fr; }
