.mar-work-showcase { padding-block: clamp(4rem, 7vw, 7rem); scroll-margin-top: 104px; }
.mar-work-showcase .mar-section-heading { gap: 2.5rem; margin-bottom: 2rem; }
.mar-work-showcase .mar-section-heading h2 { font-size: clamp(2.3rem, 4.5vw, 4.3rem); }
.mar-work-showcase .mar-text-link { color: #076f98; }
.mar-work-slider { --mar-work-period: 10000ms; }
.mar-work-slider__layout { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); gap: 1rem; }
.mar-work-project { position: relative; display: block; min-height: 550px; overflow: hidden; color: #fff; background: #0b3048; border-radius: 3px; isolation: isolate; text-decoration: none; }
.mar-work-project__media { position: absolute; inset: 0; z-index: -1; }
.mar-work-project__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0; transition: opacity 1200ms cubic-bezier(.4,0,.2,1); }
.mar-work-project__media img.is-current { z-index: 1; opacity: 1; }
.mar-work-project__media img.is-previous { opacity: 1; transition: none; }
.mar-work-project::after { position: absolute; inset: 0; z-index: -1; content: ''; background: linear-gradient(180deg,rgb(3 26 42 / 9%) 30%,rgb(3 26 42 / 86%) 100%); pointer-events: none; }
.mar-work-project__copy { position: absolute; right: clamp(1.5rem,3vw,3rem); bottom: 2rem; left: clamp(1.5rem,3vw,3rem); }
.mar-work-project.is-project-changing .mar-work-project__copy { animation: mar-work-copy 700ms ease-out both; }
.mar-work-project__copy small { display: block; max-width: 55ch; color: rgb(255 255 255 / 88%); font-size: .7rem; font-weight: 600; line-height: 1.6; letter-spacing: .07em; text-transform: uppercase; }
.mar-work-project__copy h3 { max-width: 28ch; margin: .8rem 0 1.2rem; color: #fff; font-size: clamp(1.8rem,2.6vw,2.7rem); line-height: 1.2; font-weight: 600; letter-spacing: -.025em; }
.mar-work-project__copy > span { display: inline-flex; align-items: center; gap: 1rem; color: #a3e9ff; font-size: .8rem; font-weight: 650; }
.mar-work-project__copy b { font-size: 1.2rem; font-weight: 400; }
.mar-work-project:hover .mar-work-project__copy > span { color: #fff; }
.mar-work-project__photo-count, .mar-work-project__status { position: absolute; z-index: 2; top: 1.2rem; padding: .4rem .7rem; color: #fff; background: rgb(4 31 48 / 80%); font-size: .7rem; font-weight: 600; border: 1px solid rgb(255 255 255 / 23%); border-radius: 2px; }
.mar-work-project__photo-count { left: 1.2rem; font-variant-numeric: tabular-nums; }
.mar-work-project__status { right: 1.2rem; }
.mar-work-project__status.is-ongoing { color: #05334b; background: #6cdcf9; border-color: #6cdcf9; }
.mar-work-project__status[hidden] { display: none; }
.mar-work-previews { display: grid; grid-template-rows: repeat(3, minmax(0,1fr)); gap: 1rem; min-width: 0; }
.mar-work-previews:empty { display: none; }
.mar-work-slider__layout:has(.mar-work-previews:empty) { grid-template-columns: minmax(0,1fr); }
.mar-work-preview { position: relative; display: block; width: 100%; min-width: 0; padding: 0; overflow: hidden; text-align: left; white-space: normal; color: #fff; background: #0b3048; border: 0; border-radius: 3px; cursor: pointer; }
.mar-work-preview img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mar-work-preview::after { position: absolute; inset: 0; content: ''; background: linear-gradient(0deg,rgb(3 26 42 / 94%),rgb(3 26 42 / 10%) 100%); }
.mar-work-preview > span { position: relative; z-index: 1; display: grid; height: 100%; padding: 1.2rem; gap: .4rem .6rem; grid-template-columns: minmax(0,1fr) auto; align-content: end; }
.mar-work-preview small { grid-column: 1 / -1; color: rgb(255 255 255 / 82%); font-size: .65rem; line-height: 1.45; }
.mar-work-preview strong { display: -webkit-box; overflow: hidden; font-size: clamp(.95rem,1.4vw,1.2rem); font-weight: 650; line-height: 1.35; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.mar-work-preview b { align-self: end; color: #68d7fa; font-size: 1.2rem; font-weight: 400; }
.mar-work-preview:hover { box-shadow: inset 0 0 0 2px #67d7fa; }
.mar-work-toolbar { position: relative; display: flex; min-height: 84px; padding: 1rem 150px .8rem 0; align-items: center; justify-content: space-between; gap: 1rem; }
.mar-work-toolbar p { display: flex; margin: 0; align-items: center; gap: 1rem; color: #082f47; }
.mar-work-toolbar p > span { font-size: 1.1rem; font-weight: 650; font-variant-numeric: tabular-nums; }
.mar-work-toolbar small { color: #627c8c; font-size: .8rem; }
.mar-work-toolbar > div { display: flex; gap: .6rem; }
.mar-work-toolbar button { display: grid; width: 44px; height: 44px; padding: 0; color: #08374f; background: #fff; border: 1px solid #bdd2df; border-radius: 50%; font-size: 1.25rem; place-items: center; cursor: pointer; }
.mar-work-toolbar button:is(:hover,:focus) { color: #fff; background: #08374f; border-color: #08374f; }
.mar-work-toolbar button:disabled { opacity: .4; cursor: default; }
.mar-work-toolbar button[hidden] { display: none; }
.mar-work-slider :is(a,button):focus-visible { outline: 3px solid #17b4e6; outline-offset: 4px; }
.mar-work-progress { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; overflow: hidden; background: #d8e6ed; }
.mar-work-progress > span { display: block; width: 100%; height: 100%; background: #13afe1; transform: scaleX(0); transform-origin: left; }
.mar-work-slider.is-playing .mar-work-progress > span { animation: mar-work-progress var(--mar-work-period) linear forwards; }
.mar-work-slider.is-suspended img { transition: none; }
.mar-work-slider.is-suspended .mar-work-project__copy { animation: none; }
.mar-work-fallback { display: grid; margin-top: 1rem; gap: .7rem; grid-template-columns: repeat(3,minmax(0,1fr)); }
.mar-work-fallback a { padding: .7rem; color: #08374f; background: #fff; border: 1px solid #bdd2df; }
@keyframes mar-work-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes mar-work-copy { from { opacity: 0; } to { opacity: 1; } }
@media (max-width:760px) {
  .mar-work-slider__layout { grid-template-columns: minmax(0,1fr); }
  .mar-work-previews { display: none; }
  .mar-work-project { min-height: 470px; }
  .mar-work-project__copy h3 { font-size: clamp(1.65rem,6.5vw,2.25rem); }
  .mar-work-project__copy { right: 1.4rem; bottom: 1.6rem; left: 1.4rem; }
  .mar-work-toolbar { padding-right: 60px; gap: .65rem; }
  .mar-work-toolbar > div { gap: .4rem; }
  .mar-work-toolbar button { width: 40px; height: 40px; }
  .mar-work-toolbar small { display: none; }
  .mar-work-fallback { grid-template-columns: minmax(0,1fr); }
}
@media (prefers-reduced-motion:reduce) {
  .mar-work-project__media img { transition: opacity 250ms ease; transition-duration: 250ms !important; }
  .mar-work-project__media img.is-previous { transition: none; }
  .mar-work-project.is-project-changing .mar-work-project__copy { animation-duration: 250ms !important; }
  .mar-work-slider.is-playing .mar-work-progress > span { animation: none; }
}