.mc-showcase { position: relative; background: #EAE5D8; color: #00022E; overflow: clip; }
.mc-showcase [hidden] { display: none !important; }
.mc-showcase.is-ready .mc-showcase-slides { display: grid; }
.mc-showcase.is-ready .mc-showcase-slide { grid-area: 1 / 1; }
.mc-showcase-slide { position: relative; min-width: 0; min-height: 77.3vw; }
.mc-showcase-bar { position: absolute; z-index: 2; top: 5.2vw; left: 1.8vw; width: 46.7%; display: flex; align-items: center; gap: 1.5vw; }
.mc-showcase-count { display: flex; flex: 1; gap: 5px; font-size: clamp(14px, .94vw, 18px); font-weight: 400; }
.mc-showcase-count b { font-weight: 400; }
.mc-showcase-count > span { opacity: .35; }
.mc-showcase-arrows { display: flex; gap: 1.5vw; }
.mc-showcase-arrows button { display: grid; place-items: center; width: clamp(44px, 2.6vw, 56px); height: clamp(44px, 2.6vw, 56px); padding: 0; background: transparent; color: inherit; border: 0; border-radius: 50%; cursor: pointer; }
.mc-showcase-arrows svg { width: 100%; height: 100%; }
.mc-showcase-arrows button:disabled { opacity: .25; cursor: default; }
.mc-showcase-arrows button:not(:disabled):hover { background: #00022E; color: #EAE5D8; }
.mc-showcase-pause { border: 0; background: transparent; color: inherit; padding: 10px 4px; min-height: 44px; font: 400 12px var(--mc-font-body); cursor: pointer; }
.mc-showcase-pause { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; overflow: hidden; clip-path: inset(50%); }
.mc-showcase-pause:focus-visible { width: auto; height: auto; min-height: 44px; padding: 10px; clip-path: none; background: #EAE5D8; }
.mc-showcase-pause:disabled { opacity: .35; cursor: default; }
.mc-showcase button:focus-visible, .mc-showcase a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.mc-showcase .mc-showcase-title { position: absolute; top: 9.8vw; left: 1.8vw; width: 47%; margin: 0; color: #00022E; font: 400 6.2vw/.95 var(--mc-font-display); letter-spacing: -.02em; text-transform: uppercase; overflow-wrap: break-word; }
.mc-showcase-project { position: absolute; top: 0; right: 0; width: 49%; height: 56.25vw; overflow: hidden; border-bottom-left-radius: 26vw; }
.mc-showcase-detail { position: absolute; left: 0; top: 25.8vw; bottom: 0; width: 29.6%; overflow: hidden; border-top-right-radius: 26vw; }
.mc-showcase .mc-showcase-project img, .mc-showcase .mc-showcase-detail img, .mc-showcase .mc-showcase-detail video { display: block; width: 100%; height: 100%; object-fit: cover; }
.mc-showcase-story { position: relative; padding-top: 31.5vw; padding-bottom: 5vw; margin-left: 32.2%; width: 18.2%; }
.mc-showcase-quote-mark { display: block; width: 9.9vw; height: 8.3vw; margin-bottom: 2.8vw; }
.mc-showcase-author { margin-bottom: 1.3vw; font-size: clamp(14px, 1.25vw, 24px); line-height: 1.5; text-transform: uppercase; }
.mc-showcase-author strong, .mc-showcase-author span { display: block; }
.mc-showcase-author span { font-weight: 300; }
.mc-showcase-story blockquote { margin: 0; padding: 0; border: 0; font-style: normal; }
.mc-showcase-story p { margin: 0; font-size: clamp(14px, .94vw, 18px); line-height: 1.5; }
.mc-showcase .mc-showcase-story .mc-button { width: 100%; margin-top: 2.8vw; min-height: clamp(48px, 3.55vw, 76px); padding: 12px; background: #00022E; color: #FFFFFF; border-radius: 3px; font-size: clamp(12px, .94vw, 18px); }
.mc-showcase .mc-showcase-story .mc-button:hover { background: #242548; }
@media (max-width: 1024px) and (min-width: 768px) {
  .mc-showcase .mc-showcase-title { top: calc(5.2vw + 60px); }
  .mc-showcase-story { margin-left: 31.5%; width: 19%; }
  .mc-showcase-author { font-size: 13px; }
  .mc-showcase-story p { font-size: 13px; }
}
@media (max-width: 767px) {
  .mc-showcase-slides { touch-action: pan-y pinch-zoom; }
  .mc-showcase-bar { top: 18px; left: 20px; width: calc(100% - 40px); gap: 14px; }
  .mc-showcase-arrows { gap: 12px; }
  .mc-showcase-slide { min-height: 0; display: grid; grid-template-columns: 38% 62%; align-content: start; padding-top: 100px; }
  .mc-showcase .mc-showcase-title { position: static; width: auto; grid-column: 1 / -1; padding: 0 20px 30px; font-size: clamp(42px, 10.5vw, 72px); }
  .mc-showcase-project { position: static; width: 100%; height: 90vw; grid-column: 1 / -1; border-bottom-left-radius: 50vw; }
  .mc-showcase-detail { position: static; width: 100%; height: 100%; min-height: 105vw; margin-top: 30px; border-top-right-radius: 38vw; }
  .mc-showcase-story { width: auto; margin: 0; padding: 45px 20px 45px 22px; }
  .mc-showcase-quote-mark { width: 76px; height: 64px; margin-bottom: 24px; }
  .mc-showcase-author { font-size: 14px; margin-bottom: 18px; }
  .mc-showcase-story p { font-size: 14px; }
  .mc-showcase .mc-showcase-story .mc-button { margin-top: 26px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .mc-showcase *, .mc-showcase *::before { transition: none !important; }
}
