.khwshowcase {
  --khwshowcase-brand: #17324d;
  --khwshowcase-muted: #4f6476;
  --khwshowcase-border: #d8e1e8;
  --khwshowcase-bg: #ffffff;
  --khwshowcase-accent: #d9eaf7;
  margin: 36px 0;
  color: var(--khwshowcase-brand);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.khwshowcase-block {
  width: 100%;
  max-width: 100%;
}

.khwshowcase-block.alignfull,
.wp-block-khalegi-works-showcase.alignfull {
  width: 100%;
  max-width: none;
}

.khwshowcase__inner {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
}

.khwshowcase__viewport {
  touch-action: pan-y;
}

.khwshowcase--height-full:not(.khwshowcase--parallax) {
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  align-items: stretch;
}

.khwshowcase--height-full:not(.khwshowcase--parallax) .khwshowcase__inner {
  min-height: inherit;
  display: flex;
  flex-direction: column;
}

.khwshowcase--height-full:not(.khwshowcase--parallax) .khwshowcase__viewport {
  flex: 1 1 auto;
  display: flex;
  min-height: 0;
}

.khwshowcase--height-full:not(.khwshowcase--parallax) .khwshowcase__items {
  flex: 1 1 auto;
  width: 100%;
  align-content: stretch;
}

.khwshowcase--height-full:not(.khwshowcase--parallax) .khwshowcase__card {
  min-height: clamp(420px, 62vh, 820px);
}

.khwshowcase--vertical .khwshowcase__viewport {
  touch-action: pan-x;
}

.khwshowcase--wide .khwshowcase__inner {
  width: min(1360px, calc(100% - 32px));
}

/* Width belongs to the outer Gutenberg block. Never escape a parent column. */
.khwshowcase--full { position: relative; width: 100%; max-width: 100%; background: #fff; }

.khwshowcase--full .khwshowcase__inner {
  width: min(1480px, calc(100% - 32px));
}

.khwshowcase--advanced.khwshowcase--full {
  background: #121212;
  padding: 34px 0;
}

.khwshowcase-block.alignfull > .khwshowcase--full,
.khwshowcase-block.alignfull > .khwshowcase--parallax,
.wp-block-khalegi-works-showcase.alignfull > .khwshowcase--full,
.wp-block-khalegi-works-showcase.alignfull > .khwshowcase--parallax {
  left: auto;
  right: auto;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.khwshowcase--advanced.khwshowcase--full .khwshowcase__inner {
  width: min(1560px, calc(100% - 48px));
}

.khwshowcase--advanced {
  background: #121212;
  color: #fff;
  padding: 30px 0;
}

.khwshowcase--grid.khwshowcase--full,
.khwshowcase--list.khwshowcase--full,
.khwshowcase--carousel.khwshowcase--full {
  padding-top: clamp(46px, 5.5vw, 86px);
  padding-bottom: clamp(48px, 5vw, 82px);
}

.khwshowcase--grid.khwshowcase--full .khwshowcase__inner,
.khwshowcase--list.khwshowcase--full .khwshowcase__inner,
.khwshowcase--carousel.khwshowcase--full .khwshowcase__inner {
  width: min(1480px, calc(100% - clamp(36px, 7vw, 104px)));
}

.khwshowcase--k1,
.khwshowcase--advanced {
  background: #121212;
  color: #fff;
}

.khwshowcase--k2 {
  background: #17324d;
  color: #fff;
}

.khwshowcase--k3 {
  background: #f7fafc;
  color: #17324d;
}

.khwshowcase--k4 {
  background: #101820;
  color: #fff;
}

.khwshowcase--k5 {
  background: #fff;
  color: #17324d;
}

.khwshowcase--k6 {
  background: #171412;
  color: #fff;
}

.khwshowcase--k7 {
  background: #092033;
  color: #fff;
}

.khwshowcase--k8 {
  background: #eef3f7;
  color: #17324d;
}

.khwshowcase--k9 {
  background: #050607;
  color: #fff;
}

.khwshowcase--k10 {
  background: #f4f7f8;
  color: #17324d;
}

.khwshowcase--advanced .khwshowcase__header h2,
.khwshowcase--advanced .khwshowcase__header p,
.khwshowcase--k1 .khwshowcase__header h2,
.khwshowcase--k1 .khwshowcase__header p,
.khwshowcase--k2 .khwshowcase__header h2,
.khwshowcase--k2 .khwshowcase__header p,
.khwshowcase--k4 .khwshowcase__header h2,
.khwshowcase--k4 .khwshowcase__header p,
.khwshowcase--k6 .khwshowcase__header h2,
.khwshowcase--k6 .khwshowcase__header p,
.khwshowcase--k7 .khwshowcase__header h2,
.khwshowcase--k7 .khwshowcase__header p,
.khwshowcase--k9 .khwshowcase__header h2,
.khwshowcase--k9 .khwshowcase__header p {
  color: #fff;
}

.khwshowcase--advanced .khwshowcase__header p,
.khwshowcase--k1 .khwshowcase__header p,
.khwshowcase--k2 .khwshowcase__header p,
.khwshowcase--k4 .khwshowcase__header p,
.khwshowcase--k6 .khwshowcase__header p,
.khwshowcase--k7 .khwshowcase__header p,
.khwshowcase--k9 .khwshowcase__header p {
  opacity: 0.78;
}

.khwshowcase__header {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-end;
  margin-bottom: 18px;
}

.khwshowcase__header h2 {
  margin: 0 0 6px;
  color: var(--khwshowcase-brand);
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.15;
  letter-spacing: 0;
}

.khwshowcase__header p {
  max-width: 760px;
  margin: 0;
  color: var(--khwshowcase-muted);
  font-size: 16px;
  line-height: 1.55;
}

.khwshowcase__controls {
  display: flex;
  gap: 8px;
  flex: 0 0 auto;
}

.khwshowcase__arrow {
  width: 38px;
  height: 38px;
  border: 1px solid var(--khwshowcase-border);
  border-radius: 6px;
  background: var(--khwshowcase-bg);
  color: var(--khwshowcase-brand);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.khwshowcase__arrow:hover,
.khwshowcase__arrow:focus,
.khwshowcase__button:hover,
.khwshowcase__button:focus,
.khwshowcase__card-link:focus {
  outline: 3px solid var(--khwshowcase-accent);
  outline-offset: 2px;
}

.khwshowcase__viewport {
  overflow: hidden;
}

.khwshowcase__items {
  display: grid;
  gap: 14px;
}

.khwshowcase--carousel .khwshowcase__viewport {
  position: relative;
}

.khwshowcase--carousel .khwshowcase__items {
  display: flex;
  will-change: transform;
  transition: transform 720ms cubic-bezier(0.22, 1, 0.36, 1);
  padding: 2px 2px 12px;
}

.khwshowcase--parallax {
  position: relative;
  isolation: isolate;
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  margin: 0 0 36px;
  margin-inline: 0;
  background: var(--khwshowcase-parallax-bg, #0d1116);
  color: var(--khwshowcase-parallax-text, #fff);
  overflow: visible;
  --khwshowcase-parallax-y: 0px;
}

.khwshowcase--parallax.khwshowcase--full {
  padding: 0;
}

.khwshowcase--parallax .khwshowcase__inner {
  width: 100%;
}

.khwshowcase--parallax .khwshowcase__header {
  position: absolute;
  z-index: 5;
  left: min(48px, 5vw);
  right: min(48px, 5vw);
  top: clamp(38px, 5vh, 64px);
  margin: 0;
}

.khwshowcase--parallax .khwshowcase__header h2,
.khwshowcase--parallax .khwshowcase__header p {
  color: var(--khwshowcase-parallax-text, #fff);
  text-shadow: 0 2px 24px rgba(0,0,0,0.34);
}

.khwshowcase--parallax .khwshowcase__header p {
  color: var(--khwshowcase-parallax-muted, rgba(255,255,255,0.78));
}

.khwshowcase--parallax .khwshowcase__controls {
  align-self: flex-start;
}

.khwshowcase--parallax .khwshowcase__arrow {
  border-color: var(--khwshowcase-parallax-button-border, rgba(255,255,255,0.32));
  background: rgba(13,17,22,0.58);
  color: var(--khwshowcase-parallax-button-text, #fff);
  backdrop-filter: blur(8px);
}

.khwshowcase--parallax .khwshowcase__viewport {
  position: relative;
  z-index: 1;
  height: 100vh;
  height: 100svh;
  min-height: 680px;
  width: 100%;
  overflow: hidden;
  clip-path: inset(0);
}

.khwshowcase--parallax .khwshowcase__items {
  display: flex;
  height: 100%;
  width: 100%;
  gap: 0;
  padding: 0;
  will-change: transform;
  transition: transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
  backface-visibility: hidden;
}

.khwshowcase--parallax .khwshowcase__card {
  position: relative;
  flex: 0 0 100%;
  min-width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  background:
    linear-gradient(90deg, var(--khwshowcase-parallax-overlay-strong, rgba(8,12,18,0.82)), var(--khwshowcase-parallax-overlay-mid, rgba(8,12,18,0.38)) 48%, var(--khwshowcase-parallax-overlay-soft, rgba(8,12,18,0.24))),
    var(--khwshowcase-bg-image, linear-gradient(135deg,#17324d,#0d1116));
  background-position: center calc(50% + var(--khwshowcase-parallax-y));
  background-repeat: no-repeat;
  background-size: cover;
  color: var(--khwshowcase-parallax-text, #fff);
}

.khwshowcase--parallax .khwshowcase__card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, var(--khwshowcase-parallax-overlay-strong, rgba(8,12,18,0.82)), var(--khwshowcase-parallax-overlay-mid, rgba(8,12,18,0.38)) 48%, var(--khwshowcase-parallax-overlay-soft, rgba(8,12,18,0.24)));
  pointer-events: none;
}

.khwshowcase--parallax.khwshowcase--k3 .khwshowcase__card,
.khwshowcase--parallax.khwshowcase--k5 .khwshowcase__card,
.khwshowcase--parallax.khwshowcase--k8 .khwshowcase__card,
.khwshowcase--parallax.khwshowcase--k10 .khwshowcase__card {
  background:
    linear-gradient(90deg, rgba(247,250,252,0.92), rgba(247,250,252,0.58) 46%, rgba(247,250,252,0.2)),
    var(--khwshowcase-bg-image, linear-gradient(135deg,#f7fafc,#d9eaf7,#17324d));
}

.khwshowcase--parallax.khwshowcase--k4 .khwshowcase__card {
  background:
    linear-gradient(90deg, rgba(16,24,32,0.88), rgba(16,24,32,0.18) 48%, rgba(16,24,32,0.64)),
    var(--khwshowcase-bg-image, linear-gradient(135deg,#101820,#17324d,#d9eaf7));
}

.khwshowcase--parallax.khwshowcase--k7 .khwshowcase__card {
  background:
    linear-gradient(90deg, rgba(9,32,51,0.86), rgba(18,61,90,0.34) 48%, rgba(9,32,51,0.22)),
    var(--khwshowcase-bg-image, linear-gradient(135deg,#092033,#123d5a,#b7d7ea));
}

.khwshowcase--parallax.khwshowcase--k9 .khwshowcase__card {
  background:
    linear-gradient(90deg, rgba(0,0,0,0.92), rgba(0,0,0,0.18) 50%, rgba(0,0,0,0.76)),
    var(--khwshowcase-bg-image, linear-gradient(135deg,#050607,#1d1d1d,#ffffff));
}

.khwshowcase--parallax .khwshowcase__card {
  background-position: center calc(50% + var(--khwshowcase-parallax-y));
  background-repeat: no-repeat;
  background-size: cover;
}

.khwshowcase-block.alignfull > .khwshowcase--parallax .khwshowcase__card,
.wp-block-khalegi-works-showcase.alignfull > .khwshowcase--parallax .khwshowcase__card {
  flex-basis: 100%;
}

.khwshowcase--parallax.khwshowcase--vertical .khwshowcase__items {
  flex-direction: column;
}

.khwshowcase--parallax.khwshowcase--vertical .khwshowcase__card {
  flex: 0 0 100%;
  min-height: 100%;
}

.khwshowcase--parallax .khwshowcase__media {
  display: block;
  position: absolute;
  inset: -16px;
  z-index: 0;
  width: auto;
  height: auto;
  aspect-ratio: auto;
  margin: 0;
}

.khwshowcase--parallax .khwshowcase__media img,
.khwshowcase--parallax .khwshowcase__media video,
.khwshowcase--parallax .khwshowcase__media span {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: var(--khwshowcase-image-fit, cover);
  object-position: var(--khwshowcase-image-position-x, 50%) var(--khwshowcase-image-position-y, 50%);
  transform: translate3d(0, var(--khwshowcase-parallax-y), 0) scale(var(--khwshowcase-image-scale, 1));
  transform-origin: center;
}

.khwshowcase--parallax .khwshowcase__card-link {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  min-height: 100%;
  padding: min(18vh, 160px) min(7vw, 92px);
}

.khwshowcase--parallax .khwshowcase__body {
  position: relative;
  z-index: 2;
  max-width: 760px;
  padding: 0;
  gap: 14px;
}

.khwshowcase--parallax.khwshowcase--text-desktop-top-left .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-top-center .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-top-right .khwshowcase__card-link {
  align-items: flex-start;
}

.khwshowcase--parallax.khwshowcase--text-desktop-center-left .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-center .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-center-right .khwshowcase__card-link {
  align-items: center;
}

.khwshowcase--parallax.khwshowcase--text-desktop-bottom-left .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-bottom-center .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-bottom-right .khwshowcase__card-link {
  align-items: flex-end;
}

.khwshowcase--parallax.khwshowcase--text-desktop-top-left .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-center-left .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-bottom-left .khwshowcase__card-link {
  justify-content: flex-start;
}

.khwshowcase--parallax.khwshowcase--text-desktop-top-center .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-center .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-bottom-center .khwshowcase__card-link {
  justify-content: center;
}

.khwshowcase--parallax.khwshowcase--text-desktop-top-right .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-center-right .khwshowcase__card-link,
.khwshowcase--parallax.khwshowcase--text-desktop-bottom-right .khwshowcase__card-link {
  justify-content: flex-end;
}

.khwshowcase--parallax.khwshowcase--text-desktop-top-center .khwshowcase__body,
.khwshowcase--parallax.khwshowcase--text-desktop-center .khwshowcase__body,
.khwshowcase--parallax.khwshowcase--text-desktop-bottom-center .khwshowcase__body {
  text-align: center;
}

.khwshowcase--parallax.khwshowcase--text-desktop-top-right .khwshowcase__body,
.khwshowcase--parallax.khwshowcase--text-desktop-center-right .khwshowcase__body,
.khwshowcase--parallax.khwshowcase--text-desktop-bottom-right .khwshowcase__body {
  text-align: right;
}

.khwshowcase--parallax .khwshowcase__body time,
.khwshowcase--parallax .khwshowcase__body p {
  color: var(--khwshowcase-parallax-muted, rgba(255,255,255,0.78));
}

.khwshowcase--parallax .khwshowcase__body h3 {
  color: var(--khwshowcase-parallax-text, #fff);
  font-size: clamp(36px, 7vw, 76px);
  line-height: 1.02;
  text-wrap: balance;
  text-shadow: 0 3px 28px rgba(0,0,0,0.4);
}

.khwshowcase--parallax .khwshowcase__body p {
  font-size: clamp(16px, 2vw, 21px);
  line-height: 1.45;
}

.khwshowcase--parallax .khwshowcase__read-more {
  display: inline-flex;
  width: fit-content;
  min-height: 42px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--khwshowcase-parallax-button-border, rgba(255,255,255,0.72));
  border-radius: 6px;
  padding: 9px 14px;
  color: var(--khwshowcase-parallax-button-text, #fff);
  background: var(--khwshowcase-parallax-button-bg, rgba(255,255,255,0.08));
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.khwshowcase--parallax .khwshowcase__read-more::after {
  content: "→";
  transform: translateX(0);
  transition: transform 180ms ease;
}

.khwshowcase--parallax .khwshowcase__card-link:hover .khwshowcase__read-more::after,
.khwshowcase--parallax .khwshowcase__card-link:focus-visible .khwshowcase__read-more::after {
  transform: translateX(4px);
}

.khwshowcase--parallax .khwshowcase__cta {
  position: absolute;
  right: min(48px, 5vw);
  bottom: 28px;
  z-index: 20;
  max-width: min(720px, calc(100% - 40px));
  border-color: rgba(255,255,255,0.24);
  background: rgba(13,17,22,0.68);
  color: #fff;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  overflow: visible;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}

.khwshowcase--parallax .khwshowcase__cta h3,
.khwshowcase--parallax .khwshowcase__cta p {
  color: inherit;
}

.khwshowcase--parallax .khwshowcase__cta h3 {
  color: var(--khwshowcase-cta-heading, #fff);
}

.khwshowcase--parallax .khwshowcase__cta p {
  color: var(--khwshowcase-cta-text, rgba(255,255,255,0.82));
}

@media (min-width: 641px) {
  .khwshowcase--hide-header-desktop .khwshowcase__header > div:first-child,
  .khwshowcase--hide-text-desktop .khwshowcase__body {
    display: none;
  }

  .khwshowcase--hide-header-desktop .khwshowcase__header {
    justify-content: flex-end;
  }
}

.khwshowcase--carousel.khwshowcase--vertical .khwshowcase__viewport {
  height: min(620px, 78vh);
}

.khwshowcase--carousel.khwshowcase--vertical .khwshowcase__items {
  flex-direction: column;
  padding-bottom: 2px;
}

.khwshowcase--grid .khwshowcase__items {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.khwshowcase--list .khwshowcase__items {
  grid-template-columns: 1fr;
}

.khwshowcase__card {
  min-width: 0;
  border: 1px solid var(--khwshowcase-border);
  border-radius: 8px;
  background: var(--khwshowcase-bg);
  overflow: hidden;
}

.khwshowcase--carousel .khwshowcase__card {
  flex: 0 0 min(360px, 84vw);
}

.khwshowcase--carousel.khwshowcase--vertical .khwshowcase__card {
  flex-basis: auto;
}

.khwshowcase--advanced.khwshowcase--carousel .khwshowcase__card,
.khwshowcase--k1.khwshowcase--carousel .khwshowcase__card,
.khwshowcase--k2.khwshowcase--carousel .khwshowcase__card,
.khwshowcase--k4.khwshowcase--carousel .khwshowcase__card,
.khwshowcase--k6.khwshowcase--carousel .khwshowcase__card,
.khwshowcase--k7.khwshowcase--carousel .khwshowcase__card,
.khwshowcase--k9.khwshowcase--carousel .khwshowcase__card {
  flex-basis: min(420px, 86%);
}

.khwshowcase--advanced .khwshowcase__card,
.khwshowcase--k1 .khwshowcase__card,
.khwshowcase--k2 .khwshowcase__card,
.khwshowcase--k4 .khwshowcase__card,
.khwshowcase--k6 .khwshowcase__card,
.khwshowcase--k7 .khwshowcase__card,
.khwshowcase--k9 .khwshowcase__card {
  border-color: rgba(255,255,255,0.14);
  background: #1d1d1d;
  color: #fff;
}

.khwshowcase--k2 .khwshowcase__card {
  background: #10283e;
}

.khwshowcase--k4 .khwshowcase__card {
  background: linear-gradient(135deg,#162330,#0d1116);
}

.khwshowcase--k6 .khwshowcase__card {
  background: #211c18;
}

.khwshowcase--k7 .khwshowcase__card {
  background: #123d5a;
}

.khwshowcase--k9 .khwshowcase__card {
  background: #080808;
}

.khwshowcase--k3 .khwshowcase__card,
.khwshowcase--k5 .khwshowcase__card,
.khwshowcase--k8 .khwshowcase__card,
.khwshowcase--k10 .khwshowcase__card {
  border-color: rgba(23,50,77,0.16);
  background: #fff;
}

.khwshowcase--advanced .khwshowcase__media,
.khwshowcase--k1 .khwshowcase__media,
.khwshowcase--k2 .khwshowcase__media,
.khwshowcase--k4 .khwshowcase__media,
.khwshowcase--k6 .khwshowcase__media,
.khwshowcase--k7 .khwshowcase__media,
.khwshowcase--k9 .khwshowcase__media {
  background: #242424;
}

.khwshowcase--advanced .khwshowcase__body,
.khwshowcase--k1 .khwshowcase__body,
.khwshowcase--k2 .khwshowcase__body,
.khwshowcase--k4 .khwshowcase__body,
.khwshowcase--k6 .khwshowcase__body,
.khwshowcase--k7 .khwshowcase__body,
.khwshowcase--k9 .khwshowcase__body {
  min-height: 210px;
  padding: 24px;
}

.khwshowcase--advanced .khwshowcase__body time,
.khwshowcase--advanced .khwshowcase__body p,
.khwshowcase--k1 .khwshowcase__body time,
.khwshowcase--k1 .khwshowcase__body p,
.khwshowcase--k2 .khwshowcase__body time,
.khwshowcase--k2 .khwshowcase__body p,
.khwshowcase--k4 .khwshowcase__body time,
.khwshowcase--k4 .khwshowcase__body p,
.khwshowcase--k6 .khwshowcase__body time,
.khwshowcase--k6 .khwshowcase__body p,
.khwshowcase--k7 .khwshowcase__body time,
.khwshowcase--k7 .khwshowcase__body p,
.khwshowcase--k9 .khwshowcase__body time,
.khwshowcase--k9 .khwshowcase__body p {
  color: rgba(255,255,255,0.72);
}

.khwshowcase--advanced .khwshowcase__body h3,
.khwshowcase--advanced .khwshowcase__read-more,
.khwshowcase--k1 .khwshowcase__body h3,
.khwshowcase--k1 .khwshowcase__read-more,
.khwshowcase--k2 .khwshowcase__body h3,
.khwshowcase--k2 .khwshowcase__read-more,
.khwshowcase--k4 .khwshowcase__body h3,
.khwshowcase--k4 .khwshowcase__read-more,
.khwshowcase--k6 .khwshowcase__body h3,
.khwshowcase--k6 .khwshowcase__read-more,
.khwshowcase--k7 .khwshowcase__body h3,
.khwshowcase--k7 .khwshowcase__read-more,
.khwshowcase--k9 .khwshowcase__body h3,
.khwshowcase--k9 .khwshowcase__read-more {
  color: #fff;
}

.khwshowcase--advanced .khwshowcase__arrow,
.khwshowcase--k1 .khwshowcase__arrow,
.khwshowcase--k2 .khwshowcase__arrow,
.khwshowcase--k4 .khwshowcase__arrow,
.khwshowcase--k6 .khwshowcase__arrow,
.khwshowcase--k7 .khwshowcase__arrow,
.khwshowcase--k9 .khwshowcase__arrow {
  border-color: rgba(255,255,255,0.22);
  background: #1d1d1d;
  color: #fff;
}

.khwshowcase--k3 .khwshowcase__arrow,
.khwshowcase--k5 .khwshowcase__arrow,
.khwshowcase--k8 .khwshowcase__arrow,
.khwshowcase--k10 .khwshowcase__arrow {
  border-color: rgba(23,50,77,0.24);
  background: #fff;
  color: #17324d;
}

.khwshowcase__card-link {
  display: grid;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

.khwshowcase__media {
  aspect-ratio: 16 / 9;
  margin: 0;
  overflow: hidden;
  background: #eef3f7;
}

.khwshowcase__media img,
.khwshowcase__media video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: var(--khwshowcase-image-fit, cover);
  object-position: var(--khwshowcase-image-position-x, 50%) var(--khwshowcase-image-position-y, 50%);
  transform: scale(var(--khwshowcase-image-scale, 1));
  transform-origin: center;
}

.khwshowcase__audio {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 0 22px 22px;
}

.khwshowcase__audio-toggle,
.khwshowcase__audio-mute {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  border: 1px solid rgba(23, 50, 77, 0.22);
  border-radius: 999px;
  color: var(--khwshowcase-text, #17324d);
  background: rgba(255, 255, 255, 0.86);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  padding: 8px 12px;
}

.khwshowcase__audio-toggle[aria-pressed="true"] {
  color: #fff;
  border-color: var(--khwshowcase-brand, #17324d);
  background: var(--khwshowcase-brand, #17324d);
}

.khwshowcase__audio-status {
  font-size: 0.78rem;
  opacity: 0.82;
}

.khwshowcase__audio-toggle:focus-visible,
.khwshowcase__audio-mute:focus-visible {
  outline: 3px solid var(--khwshowcase-accent, #d9eaf7);
  outline-offset: 3px;
}

.khwshowcase--parallax .khwshowcase__audio {
  position: absolute;
  z-index: 4;
  left: clamp(18px, 5vw, 72px);
  bottom: clamp(18px, 4vw, 42px);
  padding: 0;
}

.khwshowcase--parallax .khwshowcase__audio-toggle,
.khwshowcase--parallax .khwshowcase__audio-mute {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.44);
  background: rgba(8, 18, 26, 0.46);
  backdrop-filter: blur(10px);
}

.khwshowcase--parallax .khwshowcase__audio-toggle[aria-pressed="true"] {
  color: var(--khwshowcase-parallax-button-text, #fff);
  border-color: var(--khwshowcase-parallax-button-border, rgba(255,255,255,0.72));
  background: var(--khwshowcase-parallax-button-bg, rgba(255,255,255,0.12));
}

.khwshowcase__media--fallback span,
.khwshowcase__media span {
  display: block;
  width: 100%;
  height: 100%;
}

.khwshowcase-editor-preview {
  margin-top: 0;
  margin-bottom: 0;
}

.khwshowcase-editor-preview.khwshowcase--full,
.khwshowcase-editor-preview.khwshowcase--parallax {
  left: auto;
  right: auto;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.khwshowcase-editor-preview.khwshowcase--parallax {
  min-height: 560px;
}

.khwshowcase-editor-preview.khwshowcase--parallax .khwshowcase__viewport {
  height: 560px;
  min-height: 560px;
}

.khwshowcase-editor-preview.khwshowcase--parallax .khwshowcase__card {
  flex-basis: 100%;
  min-height: 560px;
}

.khwshowcase-editor-preview .khwshowcase__media span {
  display: block;
  width: 100%;
  height: 100%;
}

.khwshowcase-editor-version {
  position: absolute;
  z-index: 20;
  top: 10px;
  right: 10px;
  padding: 4px 8px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.88);
  color: #17324d;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  pointer-events: none;
}

.khwshowcase-block-panel-heading {
  margin: 14px 0 0;
  padding: 9px 12px;
  border-top: 1px solid #dcdcde;
  border-bottom: 1px solid #dcdcde;
  background: #f6f7f7;
  color: #17324d;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;
}

.khwshowcase-block-panel-heading--styles {
  margin-top: 18px;
}

.khwshowcase-block-subheading {
  margin: 18px 0 10px;
  padding-top: 12px;
  border-top: 1px solid #dcdcde;
  color: #17324d;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.khwshowcase__body {
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 16px;
}

.khwshowcase__body time {
  color: var(--khwshowcase-muted);
  font-size: 13px;
}

.khwshowcase__body h3 {
  margin: 0;
  color: var(--khwshowcase-brand);
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: 0;
}

.khwshowcase__body p {
  margin: 0;
  color: var(--khwshowcase-muted);
  font-size: 14px;
  line-height: 1.5;
}

.khwshowcase__read-more {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  border-bottom: 1px solid currentColor;
  padding-bottom: 3px;
  color: var(--khwshowcase-brand);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  transition: gap 180ms ease, opacity 180ms ease;
}

.khwshowcase__read-more::after {
  content: "→";
  transform: translateX(0);
  transition: transform 180ms ease;
}

.khwshowcase__card-link:hover .khwshowcase__read-more,
.khwshowcase__card-link:focus-visible .khwshowcase__read-more {
  gap: 12px;
  opacity: 0.88;
}

.khwshowcase__card-link:hover .khwshowcase__read-more::after,
.khwshowcase__card-link:focus-visible .khwshowcase__read-more::after {
  transform: translateX(3px);
}

.khwshowcase__empty {
  margin: 0;
  color: var(--khwshowcase-muted);
}

.khwshowcase__filters {
  display: grid;
  grid-template-columns: minmax(280px, 520px) minmax(0, 1fr);
  gap: 16px clamp(22px, 4vw, 54px);
  align-items: center;
  margin: clamp(28px, 4vw, 52px) 0 0;
  padding-bottom: 4px;
  overflow: visible;
}

.khwshowcase--parallax .khwshowcase__filters {
  position: relative;
  z-index: 8;
  width: min(1480px, calc(100% - 32px));
  margin: 22px auto 0;
  padding-bottom: 18px;
}

.khwshowcase__search {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}

.khwshowcase__search-wrap {
  display: grid;
  gap: 0;
  min-width: 0;
  border: 1px solid rgba(23,50,77,0.14);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(248,250,252,0.92));
  padding: 0 7px 7px;
  box-shadow: 0 12px 30px rgba(10, 20, 32, 0.1);
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.khwshowcase__search-wrap:focus-within {
  border-color: var(--khwshowcase-brand);
  box-shadow: 0 0 0 3px rgba(23,50,77,0.12), 0 12px 32px rgba(10, 20, 32, 0.12);
}

.khwshowcase__search input {
  width: 100%;
  min-height: 42px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--khwshowcase-brand);
  font: inherit;
  padding: 11px 62px 8px 8px;
  outline: none;
}

.khwshowcase__search-clear {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--khwshowcase-muted);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 8px;
}

.khwshowcase__search-clear:hover,
.khwshowcase__search-clear:focus-visible {
  background: rgba(23,50,77,0.08);
  color: var(--khwshowcase-brand);
}

.khwshowcase__search input:focus {
  box-shadow: none;
}

.khwshowcase__scope {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  align-items: center;
  justify-self: center;
  width: min(390px, 100%);
  min-height: 34px;
  border: 1px solid rgba(23,50,77,0.1);
  border-radius: 10px;
  background: rgba(23,50,77,0.06);
  color: var(--khwshowcase-muted);
  font-size: 12px;
  font-weight: 800;
  overflow: visible;
  padding: 4px;
}

.khwshowcase__scope::before {
  content: none;
}

.khwshowcase__scope > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.khwshowcase__scope button {
  position: relative;
  z-index: 1;
  display: inline-flex;
  min-width: 0;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--khwshowcase-brand);
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.15;
  padding: 6px 7px;
  text-align: center;
  white-space: nowrap;
  transition: background 160ms ease, color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.khwshowcase__scope button:hover,
.khwshowcase__scope button:focus-visible {
  color: var(--khwshowcase-brand);
  background: rgba(23,50,77,0.08);
}

.khwshowcase__scope button.is-active {
  background: var(--khwshowcase-brand);
  color: #fff;
  box-shadow: 0 6px 16px rgba(23,50,77,0.18);
}

.khwshowcase__scope button:hover {
  transform: translateY(-1px);
}

.khwshowcase__result-summary {
  margin: -2px 0 0;
  color: var(--khwshowcase-brand);
  font-size: 14px;
  font-weight: 800;
}

.khwshowcase__filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding-top: 4px;
}

.khwshowcase__search-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  align-items: center;
}

.khwshowcase__sort {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  color: var(--khwshowcase-muted);
  font-size: 13px;
  font-weight: 700;
}

.khwshowcase__sort > span {
  margin-right: 4px;
}

.khwshowcase__sort button {
  min-height: 34px;
  border: 1px solid rgba(23,50,77,0.18);
  border-radius: 999px;
  background: rgba(255,255,255,0.82);
  color: var(--khwshowcase-brand);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 7px 11px;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.khwshowcase__sort button:hover,
.khwshowcase__sort button:focus-visible,
.khwshowcase__sort button.is-active {
  border-color: var(--khwshowcase-brand);
  background: var(--khwshowcase-brand);
  color: #fff;
}

.khwshowcase__sort button:hover {
  transform: translateY(-1px);
}

.khwshowcase__type-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.khwshowcase__type-filters label {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  color: var(--khwshowcase-muted);
  font-size: 13px;
  font-weight: 700;
}

.khwshowcase__type-filters input {
  accent-color: var(--khwshowcase-brand);
}

.khwshowcase__filter-chip {
  display: inline-flex;
  gap: 6px;
  align-items: baseline;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--khwshowcase-brand);
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  padding: 7px 11px;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.khwshowcase__filter-chip small {
  color: currentColor;
  font-size: 0.62em;
  font-weight: 850;
  opacity: 0.64;
}

.khwshowcase__filter-chip--w1 {
  font-size: 12px;
  opacity: 0.78;
}

.khwshowcase__filter-chip--w2 {
  font-size: 13px;
  opacity: 0.86;
}

.khwshowcase__filter-chip--w3 {
  font-size: 14px;
}

.khwshowcase__filter-chip--w4 {
  font-size: 16px;
  padding: 8px 13px;
}

.khwshowcase__filter-chip--w5 {
  font-size: 19px;
  padding: 9px 16px;
  font-weight: 850;
}

.khwshowcase__filter-chip--j1 {
  transform: translateY(-5px) rotate(-1.2deg);
}

.khwshowcase__filter-chip--j2 {
  transform: translateY(3px) rotate(0.8deg);
}

.khwshowcase__filter-chip--j3 {
  transform: translateY(-1px) rotate(1.1deg);
}

.khwshowcase__filter-chip--j4 {
  transform: translateY(6px) rotate(-0.7deg);
}

.khwshowcase__filter-chip--j5 {
  transform: translateY(-3px) rotate(0.4deg);
}

.khwshowcase__filter-chip:hover,
.khwshowcase__filter-chip:focus-visible,
.khwshowcase__filter-chip.is-active {
  border-color: var(--khwshowcase-brand);
  background: rgba(23,50,77,0.08);
  color: var(--khwshowcase-brand);
}

.khwshowcase__filter-chip.is-active {
  background: var(--khwshowcase-brand);
  color: #fff;
}

.khwshowcase__filter-chip:focus-visible {
  outline: 2px solid rgba(23,50,77,0.22);
  outline-offset: 2px;
}

.khwshowcase__filter-chip:hover {
  transform: translateY(-2px) scale(1.03);
}

.khwshowcase__filter-empty {
  margin: 0 0 16px;
  color: var(--khwshowcase-muted);
  font-size: 14px;
}

.khwshowcase__search-panel[hidden] {
  display: none !important;
}

.khwshowcase__search-panel {
  position: fixed;
  inset: 0;
  z-index: 99990;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(14px, 3vw, 34px);
  background: rgba(9, 14, 20, 0.58);
  backdrop-filter: blur(8px);
  grid-column: 1 / -1;
}

.khwshowcase__search-panel-shell {
  width: min(1180px, 100%);
  max-height: min(82vh, 820px);
  overflow: auto;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 10px;
  background: #fff;
  color: #111827;
  box-shadow: 0 30px 90px rgba(0,0,0,0.28);
}

.khwshowcase__search-panel-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  gap: 18px;
  align-items: flex-start;
  justify-content: space-between;
  border-bottom: 1px solid rgba(17, 24, 39, 0.08);
  background: rgba(255,255,255,0.96);
  padding: 22px 24px 16px;
  backdrop-filter: blur(12px);
}

.khwshowcase__search-kicker {
  margin: 0 0 6px;
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.khwshowcase__search-panel-head h3 {
  margin: 0;
  color: #111827;
  font-size: clamp(22px, 2.3vw, 34px);
  line-height: 1.1;
}

.khwshowcase__panel-search {
  display: block;
  width: min(560px, 100%);
  margin-top: 14px;
}

.khwshowcase__panel-search input {
  width: 100%;
  min-height: 46px;
  border: 1px solid rgba(17, 24, 39, 0.16);
  border-radius: 7px;
  background: #fff;
  color: #111827;
  font: inherit;
  font-size: 15px;
  padding: 12px 14px;
  outline: none;
}

.khwshowcase__panel-search input:focus {
  border-color: #111827;
  box-shadow: 0 0 0 3px rgba(17, 24, 39, 0.1);
}

.khwshowcase__scope--panel {
  margin-top: 9px;
  justify-self: start;
  border-color: rgba(17, 24, 39, 0.16);
  color: #475569;
  background: #eef2f7;
}

.khwshowcase__scope--panel::before {
  content: none;
}

.khwshowcase__scope--panel button {
  color: #111827;
}

.khwshowcase__scope--panel button.is-active {
  background: #111827;
  color: #fff;
  box-shadow: 0 6px 16px rgba(17, 24, 39, 0.18);
}

.khwshowcase__scope--panel button:not(.is-active):hover,
.khwshowcase__scope--panel button:not(.is-active):focus-visible {
  background: rgba(17, 24, 39, 0.08);
  color: #111827;
}

.khwshowcase__search-close {
  min-height: 36px;
  border: 1px solid rgba(17, 24, 39, 0.14);
  border-radius: 999px;
  background: #fff;
  color: #111827;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  padding: 8px 13px;
}

.khwshowcase__search-close:hover,
.khwshowcase__search-close:focus-visible {
  border-color: #111827;
  background: #111827;
  color: #fff;
}

.khwshowcase__search-panel-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(17, 24, 39, 0.08);
  padding: 14px 24px;
}

.khwshowcase__panel-topics {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid rgba(17, 24, 39, 0.08);
  background: #fbfcfd;
  padding: 16px 24px 18px;
}

.khwshowcase__search-panel .khwshowcase__result-summary {
  margin-top: 8px;
  color: #334155;
}

.khwshowcase__search-panel .khwshowcase__sort {
  color: #64748b;
}

.khwshowcase__search-panel .khwshowcase__sort button {
  border-color: rgba(17, 24, 39, 0.14);
  background: #f8fafc;
  color: #111827;
}

.khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase__search-panel .khwshowcase__sort button.is-active {
  border-color: #111827;
  background: #111827;
  color: #fff;
}

.khwshowcase__search-panel .khwshowcase__type-filters label {
  color: #111827 !important;
  opacity: 1;
}

.khwshowcase__search-panel .khwshowcase__type-filters input {
  accent-color: #111827;
}

.khwshowcase__search-panel .khwshowcase__filter-chip {
  border-color: transparent;
  background: transparent;
  color: #111827;
}

.khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible {
  border-color: rgba(17, 24, 39, 0.22);
  background: rgba(17, 24, 39, 0.06);
  color: #111827;
}

.khwshowcase__search-panel .khwshowcase__filter-chip.is-active {
  border-color: #111827;
  background: #111827;
  color: #fff;
}

.khwshowcase__search-results {
  display: grid;
  gap: 0;
  padding: 6px 24px 22px;
}

.khwshowcase__search-result {
  border-bottom: 1px solid rgba(17, 24, 39, 0.08);
}

.khwshowcase__search-result:last-child {
  border-bottom: 0;
}

.khwshowcase__search-result-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 128px;
  gap: 24px;
  align-items: center;
  padding: 22px 0;
  color: inherit;
  text-decoration: none;
}

.khwshowcase__search-result-link:hover h3,
.khwshowcase__search-result-link:focus-visible h3 {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.khwshowcase__search-result-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-bottom: 8px;
  color: #64748b;
  font-size: 12px;
  font-weight: 750;
}

.khwshowcase__search-result-meta span:first-child {
  border: 1px solid rgba(17, 24, 39, 0.12);
  border-radius: 999px;
  color: #111827;
  padding: 3px 8px;
  text-transform: uppercase;
}

.khwshowcase__search-result h3 {
  margin: 0 0 8px;
  color: #111827;
  font-size: clamp(21px, 2vw, 28px);
  line-height: 1.16;
}

.khwshowcase__search-snippets {
  display: grid;
  gap: 10px;
  max-width: 820px;
}

.khwshowcase__search-snippets p {
  margin: 0;
  border-left: 3px solid rgba(17, 24, 39, 0.12);
  border-radius: 0 8px 8px 0;
  background: #f8fafc;
  color: #334155;
  font-size: 15px;
  line-height: 1.7;
  padding: 10px 13px;
}

.khwshowcase__search-result-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.khwshowcase__search-result-terms span {
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
  padding: 4px 8px;
}

.khwshowcase__search-result-media {
  width: 128px;
  aspect-ratio: 1 / 0.78;
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
  background: #f1f5f9;
}

.khwshowcase__search-result-media img,
.khwshowcase__search-result-media span {
  display: block;
  width: 100%;
  height: 100%;
}

.khwshowcase__search-result-media img {
  object-fit: cover;
}

.khwshowcase__mark {
  border-radius: 3px;
  background: #fff176;
  color: #111827;
  padding: 1px 4px;
  font-weight: 850;
  white-space: normal;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.khwshowcase__result-type {
  width: fit-content;
  border: 1px solid rgba(23,50,77,0.18);
  border-radius: 999px;
  color: var(--khwshowcase-muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  padding: 4px 8px;
  text-transform: uppercase;
}

.khwshowcase--parallax .khwshowcase__result-type,
.khwshowcase--k1 .khwshowcase__result-type,
.khwshowcase--k2 .khwshowcase__result-type,
.khwshowcase--k4 .khwshowcase__result-type,
.khwshowcase--k6 .khwshowcase__result-type,
.khwshowcase--k7 .khwshowcase__result-type,
.khwshowcase--k9 .khwshowcase__result-type {
  border-color: rgba(255,255,255,0.24);
  color: rgba(255,255,255,0.72);
}

.khwshowcase--searching .khwshowcase__items {
  opacity: 0.58;
}

.khwshowcase--parallax .khwshowcase__filters,
.khwshowcase--k1 .khwshowcase__filters,
.khwshowcase--k2 .khwshowcase__filters,
.khwshowcase--k4 .khwshowcase__filters,
.khwshowcase--k6 .khwshowcase__filters,
.khwshowcase--k7 .khwshowcase__filters,
.khwshowcase--k9 .khwshowcase__filters {
  color: #fff;
}

.khwshowcase--parallax .khwshowcase__search input,
.khwshowcase--k1 .khwshowcase__search input,
.khwshowcase--k2 .khwshowcase__search input,
.khwshowcase--k4 .khwshowcase__search input,
.khwshowcase--k6 .khwshowcase__search input,
.khwshowcase--k7 .khwshowcase__search input,
.khwshowcase--k9 .khwshowcase__search input {
  border-color: rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.1);
  color: #fff;
}

.khwshowcase--parallax .khwshowcase__search input::placeholder,
.khwshowcase--k1 .khwshowcase__search input::placeholder,
.khwshowcase--k2 .khwshowcase__search input::placeholder,
.khwshowcase--k4 .khwshowcase__search input::placeholder,
.khwshowcase--k6 .khwshowcase__search input::placeholder,
.khwshowcase--k7 .khwshowcase__search input::placeholder,
.khwshowcase--k9 .khwshowcase__search input::placeholder {
  color: rgba(255,255,255,0.68);
}

.khwshowcase--parallax .khwshowcase__result-summary,
.khwshowcase--parallax .khwshowcase__search-clear,
.khwshowcase--k1 .khwshowcase__result-summary,
.khwshowcase--k1 .khwshowcase__search-clear,
.khwshowcase--k2 .khwshowcase__result-summary,
.khwshowcase--k2 .khwshowcase__search-clear,
.khwshowcase--k4 .khwshowcase__result-summary,
.khwshowcase--k4 .khwshowcase__search-clear,
.khwshowcase--k6 .khwshowcase__result-summary,
.khwshowcase--k6 .khwshowcase__search-clear,
.khwshowcase--k7 .khwshowcase__result-summary,
.khwshowcase--k7 .khwshowcase__search-clear,
.khwshowcase--k9 .khwshowcase__result-summary,
.khwshowcase--k9 .khwshowcase__search-clear {
  color: rgba(255,255,255,0.82);
}

.khwshowcase--parallax .khwshowcase__search-clear:hover,
.khwshowcase--parallax .khwshowcase__search-clear:focus-visible,
.khwshowcase--k1 .khwshowcase__search-clear:hover,
.khwshowcase--k1 .khwshowcase__search-clear:focus-visible,
.khwshowcase--k2 .khwshowcase__search-clear:hover,
.khwshowcase--k2 .khwshowcase__search-clear:focus-visible,
.khwshowcase--k4 .khwshowcase__search-clear:hover,
.khwshowcase--k4 .khwshowcase__search-clear:focus-visible,
.khwshowcase--k6 .khwshowcase__search-clear:hover,
.khwshowcase--k6 .khwshowcase__search-clear:focus-visible,
.khwshowcase--k7 .khwshowcase__search-clear:hover,
.khwshowcase--k7 .khwshowcase__search-clear:focus-visible,
.khwshowcase--k9 .khwshowcase__search-clear:hover,
.khwshowcase--k9 .khwshowcase__search-clear:focus-visible {
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.khwshowcase--parallax .khwshowcase__sort,
.khwshowcase--parallax .khwshowcase__scope,
.khwshowcase--parallax .khwshowcase__type-filters label,
.khwshowcase--k1 .khwshowcase__sort,
.khwshowcase--k1 .khwshowcase__scope,
.khwshowcase--k1 .khwshowcase__type-filters label,
.khwshowcase--k2 .khwshowcase__sort,
.khwshowcase--k2 .khwshowcase__scope,
.khwshowcase--k2 .khwshowcase__type-filters label,
.khwshowcase--k4 .khwshowcase__sort,
.khwshowcase--k4 .khwshowcase__scope,
.khwshowcase--k4 .khwshowcase__type-filters label,
.khwshowcase--k6 .khwshowcase__sort,
.khwshowcase--k6 .khwshowcase__scope,
.khwshowcase--k6 .khwshowcase__type-filters label,
.khwshowcase--k7 .khwshowcase__sort,
.khwshowcase--k7 .khwshowcase__scope,
.khwshowcase--k7 .khwshowcase__type-filters label,
.khwshowcase--k9 .khwshowcase__sort,
.khwshowcase--k9 .khwshowcase__scope,
.khwshowcase--k9 .khwshowcase__type-filters label {
  color: rgba(255,255,255,0.78);
}

.khwshowcase--parallax .khwshowcase__sort button,
.khwshowcase--parallax .khwshowcase__scope button,
.khwshowcase--k1 .khwshowcase__sort button,
.khwshowcase--k1 .khwshowcase__scope button,
.khwshowcase--k2 .khwshowcase__sort button,
.khwshowcase--k2 .khwshowcase__scope button,
.khwshowcase--k4 .khwshowcase__sort button,
.khwshowcase--k4 .khwshowcase__scope button,
.khwshowcase--k6 .khwshowcase__sort button,
.khwshowcase--k6 .khwshowcase__scope button,
.khwshowcase--k7 .khwshowcase__sort button,
.khwshowcase--k7 .khwshowcase__scope button,
.khwshowcase--k9 .khwshowcase__sort button {
  border-color: rgba(255,255,255,0.24);
  background: rgba(255,255,255,0.08);
  color: #fff;
}

.khwshowcase--parallax .khwshowcase__sort button:hover,
.khwshowcase--parallax .khwshowcase__sort button:focus-visible,
.khwshowcase--parallax .khwshowcase__sort button.is-active,
.khwshowcase--parallax .khwshowcase__scope button:hover,
.khwshowcase--parallax .khwshowcase__scope button:focus-visible,
.khwshowcase--parallax .khwshowcase__scope button.is-active,
.khwshowcase--k1 .khwshowcase__sort button:hover,
.khwshowcase--k1 .khwshowcase__sort button:focus-visible,
.khwshowcase--k1 .khwshowcase__sort button.is-active,
.khwshowcase--k1 .khwshowcase__scope button:hover,
.khwshowcase--k1 .khwshowcase__scope button:focus-visible,
.khwshowcase--k1 .khwshowcase__scope button.is-active,
.khwshowcase--k2 .khwshowcase__sort button:hover,
.khwshowcase--k2 .khwshowcase__sort button:focus-visible,
.khwshowcase--k2 .khwshowcase__sort button.is-active,
.khwshowcase--k2 .khwshowcase__scope button:hover,
.khwshowcase--k2 .khwshowcase__scope button:focus-visible,
.khwshowcase--k2 .khwshowcase__scope button.is-active,
.khwshowcase--k4 .khwshowcase__sort button:hover,
.khwshowcase--k4 .khwshowcase__sort button:focus-visible,
.khwshowcase--k4 .khwshowcase__sort button.is-active,
.khwshowcase--k4 .khwshowcase__scope button:hover,
.khwshowcase--k4 .khwshowcase__scope button:focus-visible,
.khwshowcase--k4 .khwshowcase__scope button.is-active,
.khwshowcase--k6 .khwshowcase__sort button:hover,
.khwshowcase--k6 .khwshowcase__sort button:focus-visible,
.khwshowcase--k6 .khwshowcase__sort button.is-active,
.khwshowcase--k6 .khwshowcase__scope button:hover,
.khwshowcase--k6 .khwshowcase__scope button:focus-visible,
.khwshowcase--k6 .khwshowcase__scope button.is-active,
.khwshowcase--k7 .khwshowcase__sort button:hover,
.khwshowcase--k7 .khwshowcase__sort button:focus-visible,
.khwshowcase--k7 .khwshowcase__sort button.is-active,
.khwshowcase--k7 .khwshowcase__scope button:hover,
.khwshowcase--k7 .khwshowcase__scope button:focus-visible,
.khwshowcase--k7 .khwshowcase__scope button.is-active,
.khwshowcase--k9 .khwshowcase__sort button:hover,
.khwshowcase--k9 .khwshowcase__sort button:focus-visible,
.khwshowcase--k9 .khwshowcase__sort button.is-active,
.khwshowcase--k9 .khwshowcase__scope button:hover,
.khwshowcase--k9 .khwshowcase__scope button:focus-visible,
.khwshowcase--k9 .khwshowcase__scope button.is-active {
  border-color: rgba(255,255,255,0.82);
  background: #fff;
  color: #17324d;
}

.khwshowcase--parallax .khwshowcase__search input,
.khwshowcase--k1 .khwshowcase__search input,
.khwshowcase--k2 .khwshowcase__search input,
.khwshowcase--k4 .khwshowcase__search input,
.khwshowcase--k6 .khwshowcase__search input,
.khwshowcase--k7 .khwshowcase__search input,
.khwshowcase--k9 .khwshowcase__search input {
  border-color: transparent;
  background: transparent;
}

.khwshowcase--parallax .khwshowcase__search-wrap,
.khwshowcase--k1 .khwshowcase__search-wrap,
.khwshowcase--k2 .khwshowcase__search-wrap,
.khwshowcase--k4 .khwshowcase__search-wrap,
.khwshowcase--k6 .khwshowcase__search-wrap,
.khwshowcase--k7 .khwshowcase__search-wrap,
.khwshowcase--k9 .khwshowcase__search-wrap {
  border-color: rgba(255,255,255,0.24);
  background: linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.08));
  box-shadow: 0 10px 28px rgba(0,0,0,0.18);
}

.khwshowcase--parallax .khwshowcase__scope,
.khwshowcase--k1 .khwshowcase__scope,
.khwshowcase--k2 .khwshowcase__scope,
.khwshowcase--k4 .khwshowcase__scope,
.khwshowcase--k6 .khwshowcase__scope,
.khwshowcase--k7 .khwshowcase__scope,
.khwshowcase--k9 .khwshowcase__scope {
  border-color: rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.09);
}

.khwshowcase--parallax .khwshowcase__scope::before,
.khwshowcase--k1 .khwshowcase__scope::before,
.khwshowcase--k2 .khwshowcase__scope::before,
.khwshowcase--k4 .khwshowcase__scope::before,
.khwshowcase--k6 .khwshowcase__scope::before,
.khwshowcase--k7 .khwshowcase__scope::before,
.khwshowcase--k9 .khwshowcase__scope::before {
  content: none;
}

.khwshowcase--parallax .khwshowcase__scope button,
.khwshowcase--k1 .khwshowcase__scope button,
.khwshowcase--k2 .khwshowcase__scope button,
.khwshowcase--k4 .khwshowcase__scope button,
.khwshowcase--k6 .khwshowcase__scope button,
.khwshowcase--k7 .khwshowcase__scope button,
.khwshowcase--k9 .khwshowcase__scope button {
  border-color: transparent;
  background: transparent;
}

.khwshowcase--parallax .khwshowcase__scope button,
.khwshowcase--k1 .khwshowcase__scope button,
.khwshowcase--k2 .khwshowcase__scope button,
.khwshowcase--k4 .khwshowcase__scope button,
.khwshowcase--k6 .khwshowcase__scope button,
.khwshowcase--k7 .khwshowcase__scope button,
.khwshowcase--k9 .khwshowcase__scope button {
  color: rgba(255,255,255,0.86);
}

.khwshowcase--parallax .khwshowcase__scope button:not(.is-active):hover,
.khwshowcase--parallax .khwshowcase__scope button:not(.is-active):focus-visible,
.khwshowcase--k1 .khwshowcase__scope button:not(.is-active):hover,
.khwshowcase--k1 .khwshowcase__scope button:not(.is-active):focus-visible,
.khwshowcase--k2 .khwshowcase__scope button:not(.is-active):hover,
.khwshowcase--k2 .khwshowcase__scope button:not(.is-active):focus-visible,
.khwshowcase--k4 .khwshowcase__scope button:not(.is-active):hover,
.khwshowcase--k4 .khwshowcase__scope button:not(.is-active):focus-visible,
.khwshowcase--k6 .khwshowcase__scope button:not(.is-active):hover,
.khwshowcase--k6 .khwshowcase__scope button:not(.is-active):focus-visible,
.khwshowcase--k7 .khwshowcase__scope button:not(.is-active):hover,
.khwshowcase--k7 .khwshowcase__scope button:not(.is-active):focus-visible,
.khwshowcase--k9 .khwshowcase__scope button:not(.is-active):hover,
.khwshowcase--k9 .khwshowcase__scope button:not(.is-active):focus-visible {
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.khwshowcase--parallax .khwshowcase__scope button.is-active,
.khwshowcase--k1 .khwshowcase__scope button.is-active,
.khwshowcase--k2 .khwshowcase__scope button.is-active,
.khwshowcase--k4 .khwshowcase__scope button.is-active,
.khwshowcase--k6 .khwshowcase__scope button.is-active,
.khwshowcase--k7 .khwshowcase__scope button.is-active,
.khwshowcase--k9 .khwshowcase__scope button.is-active {
  background: #fff;
  color: #17324d;
  box-shadow: 0 8px 18px rgba(0,0,0,0.2);
}

.khwshowcase--parallax .khwshowcase__filter-chip,
.khwshowcase--k1 .khwshowcase__filter-chip,
.khwshowcase--k2 .khwshowcase__filter-chip,
.khwshowcase--k4 .khwshowcase__filter-chip,
.khwshowcase--k6 .khwshowcase__filter-chip,
.khwshowcase--k7 .khwshowcase__filter-chip,
.khwshowcase--k9 .khwshowcase__filter-chip {
  border-color: transparent;
  background: transparent;
  color: #fff;
}

.khwshowcase--parallax .khwshowcase__filter-chip:hover,
.khwshowcase--parallax .khwshowcase__filter-chip:focus-visible,
.khwshowcase--parallax .khwshowcase__filter-chip.is-active,
.khwshowcase--k1 .khwshowcase__filter-chip:hover,
.khwshowcase--k1 .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k1 .khwshowcase__filter-chip.is-active,
.khwshowcase--k2 .khwshowcase__filter-chip:hover,
.khwshowcase--k2 .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k2 .khwshowcase__filter-chip.is-active,
.khwshowcase--k4 .khwshowcase__filter-chip:hover,
.khwshowcase--k4 .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k4 .khwshowcase__filter-chip.is-active,
.khwshowcase--k6 .khwshowcase__filter-chip:hover,
.khwshowcase--k6 .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k6 .khwshowcase__filter-chip.is-active,
.khwshowcase--k7 .khwshowcase__filter-chip:hover,
.khwshowcase--k7 .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k7 .khwshowcase__filter-chip.is-active,
.khwshowcase--k9 .khwshowcase__filter-chip:hover,
.khwshowcase--k9 .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k9 .khwshowcase__filter-chip.is-active {
  border-color: rgba(255,255,255,0.82);
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.khwshowcase--parallax .khwshowcase__filter-chip.is-active,
.khwshowcase--k1 .khwshowcase__filter-chip.is-active,
.khwshowcase--k2 .khwshowcase__filter-chip.is-active,
.khwshowcase--k4 .khwshowcase__filter-chip.is-active,
.khwshowcase--k6 .khwshowcase__filter-chip.is-active,
.khwshowcase--k7 .khwshowcase__filter-chip.is-active,
.khwshowcase--k9 .khwshowcase__filter-chip.is-active {
  background: #fff;
  color: #17324d;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__sort,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__sort,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__sort,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__sort,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__sort,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__sort,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__sort,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__sort {
  color: #64748b;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__sort button,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__sort button,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__sort button,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__sort button,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__sort button,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__sort button,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__sort button,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__sort button {
  border-color: rgba(17, 24, 39, 0.14);
  background: #f8fafc;
  color: #111827;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase .khwshowcase__search-panel .khwshowcase__sort button.is-active,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__sort button.is-active,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__sort button.is-active,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__sort button.is-active,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__sort button.is-active,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__sort button.is-active,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__sort button.is-active,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__sort button:hover,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__sort button:focus-visible,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__sort button.is-active {
  border-color: #111827;
  background: #111827;
  color: #fff;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__type-filters label,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__type-filters label,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__type-filters label,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__type-filters label,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__type-filters label,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__type-filters label,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__type-filters label,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__type-filters label {
  color: #111827;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__filter-chip,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__filter-chip,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__filter-chip,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__filter-chip,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__filter-chip,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__filter-chip,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__filter-chip,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__filter-chip {
  border-color: transparent;
  background: transparent;
  color: #111827;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__filter-chip:hover,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__filter-chip:focus-visible {
  border-color: rgba(17, 24, 39, 0.22);
  background: rgba(17, 24, 39, 0.06);
  color: #111827;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__filter-chip.is-active,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__filter-chip.is-active,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__filter-chip.is-active,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__filter-chip.is-active,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__filter-chip.is-active,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__filter-chip.is-active,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__filter-chip.is-active,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__filter-chip.is-active {
  border-color: #111827;
  background: #111827;
  color: #fff;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__scope,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__scope,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__scope,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__scope,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__scope,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__scope,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__scope,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__scope {
  border-color: rgba(17, 24, 39, 0.16);
  background: #eef2f7;
  color: #475569;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__scope::before,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__scope::before,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__scope::before,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__scope::before,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__scope::before,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__scope::before,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__scope::before,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__scope::before {
  background: #111827;
  box-shadow: 0 8px 18px rgba(17, 24, 39, 0.22);
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__scope button,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__scope button,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__scope button,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__scope button,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__scope button,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__scope button,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__scope button,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__scope button {
  color: #111827;
}

.khwshowcase .khwshowcase__search-panel .khwshowcase__scope button.is-active,
.khwshowcase--parallax .khwshowcase__search-panel .khwshowcase__scope button.is-active,
.khwshowcase--k1 .khwshowcase__search-panel .khwshowcase__scope button.is-active,
.khwshowcase--k2 .khwshowcase__search-panel .khwshowcase__scope button.is-active,
.khwshowcase--k4 .khwshowcase__search-panel .khwshowcase__scope button.is-active,
.khwshowcase--k6 .khwshowcase__search-panel .khwshowcase__scope button.is-active,
.khwshowcase--k7 .khwshowcase__search-panel .khwshowcase__scope button.is-active,
.khwshowcase--k9 .khwshowcase__search-panel .khwshowcase__scope button.is-active {
  background: #111827;
  color: #fff;
  box-shadow: 0 6px 16px rgba(17, 24, 39, 0.18);
}

.khwshowcase__cta {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(176px, 210px);
  gap: 18px;
  align-items: center;
  margin-top: 18px;
  border: 1px solid var(--khwshowcase-cta-border, var(--khwshowcase-border));
  border-radius: 8px;
  background: var(--khwshowcase-cta-bg, #f7fafc);
  padding: 18px;
}

.khwshowcase__cta > div:first-child {
  box-sizing: border-box;
  min-width: 0;
}

.khwshowcase__cta h3 {
  overflow-wrap: anywhere;
  margin: 0 0 6px;
  color: var(--khwshowcase-cta-heading, var(--khwshowcase-brand));
  font-size: 20px;
  line-height: 1.25;
}

.khwshowcase__cta p {
  overflow-wrap: anywhere;
  margin: 0;
  color: var(--khwshowcase-cta-text, var(--khwshowcase-muted));
  font-size: 15px;
  line-height: 1.5;
}

.khwshowcase__cta-actions {
  box-sizing: border-box;
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  max-width: 210px;
  min-width: 0;
  justify-self: end;
}

.khwshowcase__button {
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--khwshowcase-cta-secondary-border, var(--khwshowcase-brand));
  border-radius: 6px;
  padding: 9px 13px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  color: var(--khwshowcase-cta-secondary-text, var(--khwshowcase-brand));
  background: var(--khwshowcase-cta-secondary-bg, transparent);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
}

.khwshowcase__button--primary {
  border-color: var(--khwshowcase-cta-primary-border, var(--khwshowcase-brand));
  background: var(--khwshowcase-cta-primary-bg, var(--khwshowcase-brand));
  color: var(--khwshowcase-cta-primary-text, #fff);
}

.khwshowcase__button--secondary {
  border-color: var(--khwshowcase-cta-secondary-border, var(--khwshowcase-brand));
  background: var(--khwshowcase-cta-secondary-bg, transparent);
  color: var(--khwshowcase-cta-secondary-text, var(--khwshowcase-brand));
}

@media (max-width: 900px) {
  .khwshowcase--grid .khwshowcase__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .khwshowcase__filters {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .khwshowcase__search {
    max-width: 560px;
  }

  .khwshowcase__filter-chips {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .khwshowcase__search-panel-shell {
    max-height: 88vh;
  }

  .khwshowcase__search-result-link {
    grid-template-columns: minmax(0, 1fr) 104px;
    gap: 16px;
  }

  .khwshowcase__search-result-media {
    width: 104px;
  }

  .khwshowcase__cta {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .khwshowcase__cta-actions {
    justify-self: start;
    max-width: min(100%, 300px);
  }
}

@media (max-width: 640px) {
  .khwshowcase {
    margin: 28px 0;
  }

  .khwshowcase__search {
    width: 100%;
    max-width: 100%;
  }

  .khwshowcase__search-panel {
    align-items: stretch;
    padding: 10px;
  }

  .khwshowcase__search-panel-shell {
    max-height: calc(100vh - 20px);
    border-radius: 8px;
  }

  .khwshowcase__search-panel-head {
    padding: 16px 16px 12px;
  }

  .khwshowcase__search-panel-head h3 {
    font-size: 22px;
  }

  .khwshowcase__search-panel-tools {
    align-items: flex-start;
    flex-direction: column;
    padding: 12px 16px;
  }

  .khwshowcase__sort {
    flex-wrap: wrap;
  }

  .khwshowcase__search-results {
    padding: 2px 16px 16px;
  }

  .khwshowcase__search-result-link {
    grid-template-columns: minmax(0, 1fr);
    padding: 18px 0;
  }

  .khwshowcase__search-result-media {
    order: -1;
    width: 100%;
    max-height: 160px;
    aspect-ratio: 16 / 7;
  }

  .khwshowcase--hide-header-mobile .khwshowcase__header > div:first-child,
  .khwshowcase--hide-text-mobile .khwshowcase__body {
    display: none;
  }

  .khwshowcase--hide-header-mobile .khwshowcase__header {
    align-items: flex-end;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-top-left .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-top-center .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-top-right .khwshowcase__card-link {
    align-items: flex-start;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-center-left .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-center .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-center-right .khwshowcase__card-link {
    align-items: center;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-left .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-center .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-right .khwshowcase__card-link {
    align-items: flex-end;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-top-left .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-center-left .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-left .khwshowcase__card-link {
    justify-content: flex-start;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-top-center .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-center .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-center .khwshowcase__card-link {
    justify-content: center;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-top-right .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-center-right .khwshowcase__card-link,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-right .khwshowcase__card-link {
    justify-content: flex-end;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-top-left .khwshowcase__body,
  .khwshowcase--parallax.khwshowcase--text-mobile-center-left .khwshowcase__body,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-left .khwshowcase__body {
    text-align: left;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-top-center .khwshowcase__body,
  .khwshowcase--parallax.khwshowcase--text-mobile-center .khwshowcase__body,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-center .khwshowcase__body {
    text-align: center;
  }

  .khwshowcase--parallax.khwshowcase--text-mobile-top-right .khwshowcase__body,
  .khwshowcase--parallax.khwshowcase--text-mobile-center-right .khwshowcase__body,
  .khwshowcase--parallax.khwshowcase--text-mobile-bottom-right .khwshowcase__body {
    text-align: right;
  }

  .khwshowcase__inner,
  .khwshowcase--wide .khwshowcase__inner,
  .khwshowcase--full .khwshowcase__inner {
    width: min(100% - 20px, 100%);
  }

  .khwshowcase__header {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .khwshowcase__header h2 {
    font-size: 24px;
  }

  .khwshowcase__header p {
    font-size: 14px;
  }

  .khwshowcase--grid .khwshowcase__items,
  .khwshowcase--list .khwshowcase__items {
    grid-template-columns: 1fr;
  }

  .khwshowcase--carousel .khwshowcase__card {
    flex-basis: 86%;
  }

  .khwshowcase--carousel.khwshowcase--vertical .khwshowcase__viewport {
    height: min(560px, 76vh);
  }

  .khwshowcase--parallax {
    min-height: 100svh;
    min-height: 100dvh;
  }

  .khwshowcase--parallax .khwshowcase__viewport {
    height: 100svh;
    height: 100dvh;
    min-height: 100svh;
    min-height: 100dvh;
    clip-path: none;
    overflow: hidden;
  }

  .khwshowcase--parallax.khwshowcase--vertical .khwshowcase__card {
    flex-basis: 100%;
    min-height: 100%;
  }

  .khwshowcase--parallax .khwshowcase__header {
    left: max(16px, env(safe-area-inset-left));
    right: max(16px, env(safe-area-inset-right));
    top: max(16px, env(safe-area-inset-top));
  }

  .khwshowcase--parallax .khwshowcase__card-link {
    padding-top: max(88px, calc(env(safe-area-inset-top) + 72px));
    padding-right: max(20px, env(safe-area-inset-right));
    padding-bottom: max(196px, calc(env(safe-area-inset-bottom) + 172px));
    padding-left: max(20px, env(safe-area-inset-left));
  }

  .khwshowcase--parallax .khwshowcase__media {
    inset: 0;
  }

  .khwshowcase--parallax .khwshowcase__media img,
  .khwshowcase--parallax .khwshowcase__media video,
  .khwshowcase--parallax .khwshowcase__media span {
    transform: scale(var(--khwshowcase-image-scale, 1));
  }

  .khwshowcase--parallax .khwshowcase__cta {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    max-width: none;
    width: auto;
    margin: -150px 16px 24px;
    background: rgba(13,17,22,0.92);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: none;
    backface-visibility: visible;
    will-change: auto;
  }

  .khwshowcase--parallax .khwshowcase__read-more,
  .khwshowcase--parallax .khwshowcase__arrow,
  .khwshowcase--parallax .khwshowcase__button {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: none;
    backface-visibility: visible;
    will-change: auto;
  }

  .khwshowcase--parallax .khwshowcase__button {
    background-clip: padding-box;
  }

  .khwshowcase__body {
    padding: 14px;
  }

  .khwshowcase__cta {
    padding: 14px;
  }

  .khwshowcase__cta-actions {
    justify-self: center;
    width: min(100%, 280px);
    max-width: 280px;
  }

  .khwshowcase__button {
    width: 100%;
    max-width: 100%;
  }
}

.editor-styles-wrapper .khwshowcase--full,
.editor-styles-wrapper .khwshowcase--parallax,
.block-editor-block-list__block .khwshowcase--full,
.block-editor-block-list__block .khwshowcase--parallax {
  left: auto;
  right: auto;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.editor-styles-wrapper .khwshowcase--parallax,
.block-editor-block-list__block .khwshowcase--parallax {
  min-height: 560px;
}

.editor-styles-wrapper .khwshowcase--parallax .khwshowcase__viewport,
.block-editor-block-list__block .khwshowcase--parallax .khwshowcase__viewport {
  height: 560px;
  min-height: 560px;
}

.editor-styles-wrapper .khwshowcase--parallax.khwshowcase--vertical .khwshowcase__card,
.block-editor-block-list__block .khwshowcase--parallax.khwshowcase--vertical .khwshowcase__card {
  flex-basis: 100%;
  min-height: 100%;
}

/* 1.0.4: a single width contract shared by blocks, shortcodes and the editor. */
.khwshowcase, .khwshowcase *, .khwshowcase *::before, .khwshowcase *::after { box-sizing: border-box; }
.khwshowcase { min-width: 0; container-type: inline-size; }
.khwshowcase-block[data-khwshowcase-width] { min-width: 0; width: 100%; margin-inline: auto; }
.khwshowcase-block[data-khwshowcase-width="contained"] { max-width: var(--khwshowcase-content-size, var(--wp--style--global--content-size, 70rem)); }
.khwshowcase-block[data-khwshowcase-width="wide"] { max-width: var(--khwshowcase-wide-size, var(--wp--style--global--wide-size, 85rem)); }
.khwshowcase-block[data-khwshowcase-width="full"] { max-width: none; }
.khwshowcase-block > .khwshowcase { width: 100%; max-width: 100%; margin-inline: 0; left: auto; right: auto; }
.khwshowcase__inner { width: min(var(--khwshowcase-content-size, 70rem), calc(100% - var(--khwshowcase-gutter, 1.5rem) * 2)); min-width: 0; }
.khwshowcase--wide .khwshowcase__inner,
.khwshowcase--full .khwshowcase__inner,
.khwshowcase.khwshowcase--full:not(.khwshowcase--parallax) .khwshowcase__inner {
  width: min(var(--khwshowcase-wide-size, 85rem), calc(100% - var(--khwshowcase-gutter, 1.5rem) * 2));
}
.khwshowcase.khwshowcase--parallax .khwshowcase__inner { width: 100%; max-width: 100%; }
.khwshowcase--parallax .khwshowcase__header {
  width: min(var(--khwshowcase-wide-size, 85rem), calc(100% - var(--khwshowcase-gutter, 1.5rem) * 2));
  left: 0; right: 0; margin-inline: auto;
}
.khwshowcase--parallax .khwshowcase__card-link {
  padding-inline: max(var(--khwshowcase-gutter, 1.5rem), calc((100% - var(--khwshowcase-wide-size, 85rem)) / 2));
}
.khwshowcase :where(.khwshowcase__viewport, .khwshowcase__header, .khwshowcase__body, .khwshowcase__cta, .khwshowcase__filters) { min-width: 0; }
.khwshowcase :where(h2, h3, p, a) { overflow-wrap: break-word; }
@container (max-width: 48rem) {
  .khwshowcase--grid .khwshowcase__items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .khwshowcase--list .khwshowcase__card { grid-template-columns: minmax(0, 1fr); }
  .khwshowcase__filters { grid-template-columns: minmax(0, 1fr); }
}
@container (max-width: 34rem) {
  .khwshowcase--grid .khwshowcase__items { grid-template-columns: minmax(0, 1fr); }
  .khwshowcase__header { flex-wrap: wrap; }
}
.khwshowcase--contained { width: min(100%, var(--khwshowcase-content-size, 70rem)); margin-inline: auto; }
.khwshowcase--wide { width: min(100%, var(--khwshowcase-wide-size, 85rem)); margin-inline: auto; }

/* 1.0.5: typography, CTA hover/layout, navigation design and 4K controls. */
.khwshowcase .khwshowcase__header > div:first-child {
  width: 100%;
  min-width: 0;
}

.khwshowcase .khwshowcase__header h2 {
  font-family: var(--khwshowcase-heading-font, inherit);
  font-size: clamp(18px, 3vw, var(--khwshowcase-heading-size, 34px));
  text-align: var(--khwshowcase-heading-align, left);
}

.khwshowcase .khwshowcase__header p {
  margin-left: var(--khwshowcase-intro-margin-left, 0);
  margin-right: var(--khwshowcase-intro-margin-right, 0);
  font-family: var(--khwshowcase-intro-font, inherit);
  font-size: clamp(12px, 1.5vw, var(--khwshowcase-intro-size, 16px));
  text-align: var(--khwshowcase-intro-align, left);
}

.khwshowcase:not(.khwshowcase--parallax) .khwshowcase__body {
  text-align: var(--khwshowcase-card-text-align, left);
}

.khwshowcase .khwshowcase__body h3 {
  font-family: var(--khwshowcase-card-title-font, inherit);
}

.khwshowcase:not(.khwshowcase--parallax) .khwshowcase__body h3 {
  font-size: var(--khwshowcase-card-title-size, 18px);
}

.khwshowcase .khwshowcase__body p {
  font-family: var(--khwshowcase-body-font, inherit);
}

.khwshowcase:not(.khwshowcase--parallax) .khwshowcase__body p {
  font-size: var(--khwshowcase-body-size, 14px);
}

.khwshowcase.khwshowcase--parallax .khwshowcase__body h3 {
  font-size: clamp(24px, 7vw, var(--khwshowcase-parallax-title-size, 76px));
}

.khwshowcase.khwshowcase--parallax .khwshowcase__body p {
  font-size: clamp(12px, 2vw, var(--khwshowcase-parallax-body-size, 21px));
}

.khwshowcase .khwshowcase__body time,
.khwshowcase .khwshowcase__result-type,
.khwshowcase .khwshowcase__result-count,
.khwshowcase .khwshowcase__search-result-meta {
  font-family: var(--khwshowcase-meta-font, inherit);
  font-size: var(--khwshowcase-meta-size, 13px);
  text-align: var(--khwshowcase-meta-align, left);
}

.khwshowcase .khwshowcase__body time {
  display: block;
  width: 100%;
}

.khwshowcase .khwshowcase__read-more {
  font-family: var(--khwshowcase-read-more-font, inherit);
  font-size: var(--khwshowcase-read-more-size, 14px);
}

.khwshowcase:not(.khwshowcase--parallax) .khwshowcase__body[style],
.khwshowcase:not(.khwshowcase--parallax) .khwshowcase__body {
  justify-items: var(--khwshowcase-card-justify, start);
}

/* CTA: color variables now own the actual surface in every layout, including parallax. */
.khwshowcase .khwshowcase__cta,
.khwshowcase.khwshowcase--parallax .khwshowcase__cta {
  width: min(var(--khwshowcase-cta-width, 100%), 100%);
  border-color: var(--khwshowcase-cta-border, var(--khwshowcase-border));
  background: var(--khwshowcase-cta-bg, #f7fafc);
  transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.khwshowcase .khwshowcase__cta:hover,
.khwshowcase .khwshowcase__cta:focus-within {
  border-color: var(--khwshowcase-cta-hover-border, var(--khwshowcase-cta-border, var(--khwshowcase-border)));
  background: var(--khwshowcase-cta-hover-bg, var(--khwshowcase-cta-bg, #f7fafc));
}

.khwshowcase .khwshowcase__cta > div:first-child {
  text-align: var(--khwshowcase-cta-text-align, left);
}

.khwshowcase .khwshowcase__cta h3 {
  font-family: var(--khwshowcase-cta-heading-font, inherit);
  font-size: var(--khwshowcase-cta-heading-size, 20px);
}

.khwshowcase .khwshowcase__cta p {
  font-family: var(--khwshowcase-cta-text-font, inherit);
  font-size: var(--khwshowcase-cta-text-size, 15px);
}

.khwshowcase .khwshowcase__cta-actions {
  justify-self: var(--khwshowcase-cta-actions-align, end);
}

.khwshowcase .khwshowcase__button {
  font-family: var(--khwshowcase-cta-button-font, inherit);
  font-size: var(--khwshowcase-cta-button-size, 14px);
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.khwshowcase .khwshowcase__button--primary:hover,
.khwshowcase .khwshowcase__button--primary:focus-visible {
  color: var(--khwshowcase-cta-primary-hover-text, var(--khwshowcase-cta-primary-text, #fff));
  background: var(--khwshowcase-cta-primary-hover-bg, var(--khwshowcase-cta-primary-bg, var(--khwshowcase-brand)));
  border-color: var(--khwshowcase-cta-primary-hover-border, var(--khwshowcase-cta-primary-border, var(--khwshowcase-brand)));
}

.khwshowcase .khwshowcase__button--secondary:hover,
.khwshowcase .khwshowcase__button--secondary:focus-visible {
  color: var(--khwshowcase-cta-secondary-hover-text, var(--khwshowcase-cta-secondary-text, var(--khwshowcase-brand)));
  background: var(--khwshowcase-cta-secondary-hover-bg, var(--khwshowcase-cta-secondary-bg, transparent));
  border-color: var(--khwshowcase-cta-secondary-hover-border, var(--khwshowcase-cta-secondary-border, var(--khwshowcase-brand)));
}

/* 1.0.8: CTA edge treatments. Border preserves legacy behavior; none removes the frame;
   vignette renders the surface on a feathered pseudo-layer so the box fades seamlessly into its backdrop. */
.khwshowcase .khwshowcase__cta {
  isolation: isolate;
}

.khwshowcase:not(.khwshowcase--parallax) .khwshowcase__cta {
  position: relative;
}

.khwshowcase .khwshowcase__cta > * {
  position: relative;
  z-index: 1;
}

.khwshowcase--cta-edge-none .khwshowcase__cta,
.khwshowcase--cta-edge-none .khwshowcase__cta:hover,
.khwshowcase--cta-edge-none .khwshowcase__cta:focus-within {
  border-width: 0;
  border-color: transparent;
}

.khwshowcase--cta-edge-vignette .khwshowcase__cta,
.khwshowcase--cta-edge-vignette .khwshowcase__cta:hover,
.khwshowcase--cta-edge-vignette .khwshowcase__cta:focus-within {
  border-width: 0;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.khwshowcase--cta-edge-vignette .khwshowcase__cta::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: calc(-1 * var(--khwshowcase-cta-vignette-feather, 28px));
  border-radius: calc(12px + var(--khwshowcase-cta-vignette-feather, 28px));
  background: var(--khwshowcase-cta-bg, rgba(247,250,252,0.94));
  pointer-events: none;
  opacity: 1;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, #000 54%, rgba(0,0,0,0.98) 62%, rgba(0,0,0,0.9) 70%, rgba(0,0,0,0.66) 80%, rgba(0,0,0,0.32) 90%, transparent 100%);
  mask-image: radial-gradient(ellipse at center, #000 0%, #000 54%, rgba(0,0,0,0.98) 62%, rgba(0,0,0,0.9) 70%, rgba(0,0,0,0.66) 80%, rgba(0,0,0,0.32) 90%, transparent 100%);
  transition: background-color 180ms ease, opacity 180ms ease;
}

.khwshowcase--cta-edge-vignette .khwshowcase__cta:hover::before,
.khwshowcase--cta-edge-vignette .khwshowcase__cta:focus-within::before {
  background: var(--khwshowcase-cta-hover-bg, var(--khwshowcase-cta-bg, rgba(247,250,252,0.94)));
}

.khwshowcase--parallax.khwshowcase--cta-edge-vignette .khwshowcase__cta {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.khwshowcase--parallax.khwshowcase--cta-edge-vignette .khwshowcase__cta::before {
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

/* CTA horizontal placement for grid/list/carousel. */
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-top-left .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-center-left .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-bottom-left .khwshowcase__cta {
  margin-left: 0;
  margin-right: auto;
}

.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-top-center .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-center .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-bottom-center .khwshowcase__cta {
  margin-left: auto;
  margin-right: auto;
}

.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-top-right .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-center-right .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-bottom-right .khwshowcase__cta {
  margin-left: auto;
  margin-right: 0;
}

/* Desktop/tablet CTA supports a 3x3 preset grid plus normalized free positioning. */
@media (min-width: 641px) {
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-top-left .khwshowcase__cta {
    top: 28px;
    right: auto;
    bottom: auto;
    left: min(48px, 5vw);
    transform: none;
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-top-center .khwshowcase__cta {
    top: 28px;
    right: auto;
    bottom: auto;
    left: 50%;
    transform: translateX(-50%);
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-top-right .khwshowcase__cta {
    top: 28px;
    right: min(48px, 5vw);
    bottom: auto;
    left: auto;
    transform: none;
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-center-left .khwshowcase__cta {
    top: 50%;
    right: auto;
    bottom: auto;
    left: min(48px, 5vw);
    transform: translateY(-50%);
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-center .khwshowcase__cta {
    top: 50%;
    right: auto;
    bottom: auto;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-center-right .khwshowcase__cta {
    top: 50%;
    right: min(48px, 5vw);
    bottom: auto;
    left: auto;
    transform: translateY(-50%);
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-bottom-left .khwshowcase__cta {
    top: auto;
    right: auto;
    bottom: 28px;
    left: min(48px, 5vw);
    transform: none;
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-bottom-center .khwshowcase__cta {
    top: auto;
    right: auto;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%);
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-bottom-right .khwshowcase__cta {
    top: auto;
    right: min(48px, 5vw);
    bottom: 28px;
    left: auto;
    transform: none;
  }
}

/* Free CTA positioning uses normalized percentages and is intentionally disabled on narrow mobile screens. */
.khwshowcase.khwshowcase--cta-free {
  position: relative;
}

@media (min-width: 641px) {
  .khwshowcase.khwshowcase--cta-free .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-free .khwshowcase__cta {
    position: absolute;
    top: var(--khwshowcase-cta-free-y, 58%);
    right: auto;
    bottom: auto;
    left: var(--khwshowcase-cta-free-x, 50%);
    z-index: 25;
    margin: 0;
    max-width: calc(100% - 32px);
    transform: translate(-50%, -50%);
  }

  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-free .khwshowcase__cta {
    max-width: min(720px, calc(100% - 32px));
  }
}

.khwshowcase-editor-preview .khwshowcase__cta-drag-handle {
  position: absolute;
  top: -14px;
  left: 50%;
  z-index: 30;
  min-height: 28px;
  transform: translateX(-50%);
  border: 1px solid rgba(23, 50, 77, 0.35);
  border-radius: 999px;
  padding: 4px 10px;
  background: #ffffff;
  color: #17324d;
  font: 600 12px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  cursor: grab;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
  touch-action: none;
  user-select: none;
}

.khwshowcase-editor-preview .khwshowcase__cta-drag-handle:active {
  cursor: grabbing;
}

/* Navigation defaults inherit the selected visual preset unless custom colors are supplied. */
.khwshowcase--advanced,
.khwshowcase--k1,
.khwshowcase--k2,
.khwshowcase--k4,
.khwshowcase--k6,
.khwshowcase--k7,
.khwshowcase--k9 {
  --khwshowcase-arrow-bg-default: #1d1d1d;
  --khwshowcase-arrow-text-default: #ffffff;
  --khwshowcase-arrow-border-default: rgba(255,255,255,0.22);
}

.khwshowcase--k3,
.khwshowcase--k5,
.khwshowcase--k8,
.khwshowcase--k10 {
  --khwshowcase-arrow-bg-default: #ffffff;
  --khwshowcase-arrow-text-default: #17324d;
  --khwshowcase-arrow-border-default: rgba(23,50,77,0.24);
}

.khwshowcase .khwshowcase__arrow {
  display: inline-flex;
  width: var(--khwshowcase-arrow-size, 38px);
  height: var(--khwshowcase-arrow-size, 38px);
  align-items: center;
  justify-content: center;
  border-width: var(--khwshowcase-arrow-border-width, 1px);
  border-style: solid;
  border-color: var(--khwshowcase-arrow-border, var(--khwshowcase-arrow-border-default, var(--khwshowcase-border)));
  border-radius: var(--khwshowcase-arrow-radius, 6px);
  background: var(--khwshowcase-arrow-bg, var(--khwshowcase-arrow-bg-default, var(--khwshowcase-bg)));
  color: var(--khwshowcase-arrow-text, var(--khwshowcase-arrow-text-default, var(--khwshowcase-brand)));
  font-size: var(--khwshowcase-arrow-glyph-size, 24px);
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.khwshowcase .khwshowcase__arrow > span {
  display: block;
  line-height: 1;
  transform: translateY(-0.02em);
}

.khwshowcase .khwshowcase__arrow:hover,
.khwshowcase .khwshowcase__arrow:focus-visible {
  border-color: var(--khwshowcase-arrow-hover-border, var(--khwshowcase-arrow-border, var(--khwshowcase-arrow-border-default, var(--khwshowcase-border))));
  background: var(--khwshowcase-arrow-hover-bg, var(--khwshowcase-arrow-bg, var(--khwshowcase-arrow-bg-default, var(--khwshowcase-bg))));
  color: var(--khwshowcase-arrow-hover-text, var(--khwshowcase-arrow-text, var(--khwshowcase-arrow-text-default, var(--khwshowcase-brand))));
  transform: translateY(-1px);
}

.khwshowcase--arrow-circle .khwshowcase__arrow {
  border-radius: 50%;
}

.khwshowcase--arrow-square .khwshowcase__arrow {
  border-radius: 0;
}

.khwshowcase--arrow-pill .khwshowcase__arrow {
  width: var(--khwshowcase-arrow-pill-width, 52.4px);
  border-radius: 999px;
}

.khwshowcase--arrow-minimal .khwshowcase__arrow {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.khwshowcase--arrow-minimal .khwshowcase__arrow:hover,
.khwshowcase--arrow-minimal .khwshowcase__arrow:focus-visible {
  border-color: var(--khwshowcase-arrow-hover-border, transparent);
  background: var(--khwshowcase-arrow-hover-bg, rgba(127,127,127,0.12));
}

.khwshowcase--arrow-glass .khwshowcase__arrow {
  background: var(--khwshowcase-arrow-bg, rgba(255,255,255,0.12));
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.14);
}

/* 4K/ultrawide controls. 2560px is used as the explicit large-canvas breakpoint. */
@media (min-width: 2560px) {
  .khwshowcase--4k-on .khwshowcase__inner,
  .khwshowcase--4k-on.khwshowcase--wide .khwshowcase__inner,
  .khwshowcase--4k-on.khwshowcase--full:not(.khwshowcase--parallax) .khwshowcase__inner {
    width: min(var(--khwshowcase-4k-content-width, 1920px), calc(100% - (var(--khwshowcase-4k-gutter, 96px) * 2)));
  }

  .khwshowcase--4k-on.khwshowcase--parallax .khwshowcase__header {
    width: min(var(--khwshowcase-4k-content-width, 1920px), calc(100% - (var(--khwshowcase-4k-gutter, 96px) * 2)));
  }

  .khwshowcase--4k-on.khwshowcase--parallax .khwshowcase__card-link {
    padding-inline: max(var(--khwshowcase-4k-gutter, 96px), calc((100% - var(--khwshowcase-4k-content-width, 1920px)) / 2));
  }

  .khwshowcase--4k-on .khwshowcase__header h2 {
    font-size: var(--khwshowcase-heading-size-4k, var(--khwshowcase-heading-size, 34px));
  }

  .khwshowcase--4k-on .khwshowcase__header p {
    font-size: var(--khwshowcase-intro-size-4k, var(--khwshowcase-intro-size, 16px));
  }

  .khwshowcase--4k-on:not(.khwshowcase--parallax) .khwshowcase__body h3 {
    font-size: var(--khwshowcase-card-title-size-4k, var(--khwshowcase-card-title-size, 18px));
  }

  .khwshowcase--4k-on:not(.khwshowcase--parallax) .khwshowcase__body p {
    font-size: var(--khwshowcase-body-size-4k, var(--khwshowcase-body-size, 14px));
  }

  .khwshowcase--4k-on.khwshowcase--parallax .khwshowcase__body {
    max-width: var(--khwshowcase-4k-text-width, 1100px);
  }

  .khwshowcase--4k-on.khwshowcase--parallax .khwshowcase__body h3 {
    font-size: var(--khwshowcase-parallax-title-size-4k, var(--khwshowcase-parallax-title-size, 76px));
  }

  .khwshowcase--4k-on.khwshowcase--parallax .khwshowcase__body p {
    font-size: var(--khwshowcase-parallax-body-size-4k, var(--khwshowcase-parallax-body-size, 21px));
  }

  .khwshowcase--4k-on .khwshowcase__body time,
  .khwshowcase--4k-on .khwshowcase__result-type,
  .khwshowcase--4k-on .khwshowcase__result-count,
  .khwshowcase--4k-on .khwshowcase__search-result-meta {
    font-size: var(--khwshowcase-meta-size-4k, var(--khwshowcase-meta-size, 13px));
  }

  .khwshowcase--4k-on .khwshowcase__read-more {
    font-size: var(--khwshowcase-read-more-size-4k, var(--khwshowcase-read-more-size, 14px));
  }

  .khwshowcase--4k-on .khwshowcase__cta h3 {
    font-size: var(--khwshowcase-cta-heading-size-4k, var(--khwshowcase-cta-heading-size, 20px));
  }

  .khwshowcase--4k-on .khwshowcase__cta p {
    font-size: var(--khwshowcase-cta-text-size-4k, var(--khwshowcase-cta-text-size, 15px));
  }

  .khwshowcase--4k-on .khwshowcase__button {
    font-size: var(--khwshowcase-cta-button-size-4k, var(--khwshowcase-cta-button-size, 14px));
  }

  .khwshowcase--4k-on.khwshowcase--parallax .khwshowcase__cta {
    max-width: min(var(--khwshowcase-4k-cta-width, 960px), calc(100% - (var(--khwshowcase-4k-gutter, 96px) * 2)));
  }

  .khwshowcase--4k-on .khwshowcase__arrow {
    width: var(--khwshowcase-arrow-size-4k, var(--khwshowcase-arrow-size, 38px));
    height: var(--khwshowcase-arrow-size-4k, var(--khwshowcase-arrow-size, 38px));
    font-size: var(--khwshowcase-arrow-glyph-size-4k, var(--khwshowcase-arrow-glyph-size, 24px));
  }

  .khwshowcase--4k-on.khwshowcase--arrow-pill .khwshowcase__arrow {
    width: var(--khwshowcase-arrow-pill-width-4k, var(--khwshowcase-arrow-pill-width, 52.4px));
  }
}

.khwshowcase .khwshowcase__read-more {
  justify-self: var(--khwshowcase-read-more-align-self, start);
}

@media (max-width: 640px) {
  .khwshowcase.khwshowcase--cta-free .khwshowcase__cta {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    transform: none;
    margin-left: auto;
    margin-right: auto;
  }

  .khwshowcase.khwshowcase--parallax .khwshowcase__cta {
    width: min(var(--khwshowcase-cta-width, 100%), calc(100% - 32px));
  }
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-top-left .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-center-left .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-bottom-left .khwshowcase__cta {
    margin-left: 16px;
    margin-right: auto;
  }
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-top-center .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-center .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-bottom-center .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-free .khwshowcase__cta {
    margin-left: auto;
    margin-right: auto;
  }
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-top-right .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-center-right .khwshowcase__cta,
  .khwshowcase.khwshowcase--parallax.khwshowcase--cta-bottom-right .khwshowcase__cta {
    margin-left: auto;
    margin-right: 16px;
  }
}

/* In flow layouts, middle presets are rendered after the viewport and before filters. */
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-center-left .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-center .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-center-right .khwshowcase__cta {
  margin-top: 18px;
  margin-bottom: 18px;
}

/* In non-parallax layouts, top CTA positions place the box between the header and content. */
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-top-left .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-top-center .khwshowcase__cta,
.khwshowcase:not(.khwshowcase--parallax).khwshowcase--cta-top-right .khwshowcase__cta {
  margin-top: 12px;
  margin-bottom: 18px;
}

/* Apply the content typography controls to search-result content as well. */
.khwshowcase .khwshowcase__search-result h3,
.khwshowcase .khwshowcase__search-panel-head h3 {
  font-family: var(--khwshowcase-card-title-font, inherit);
}

.khwshowcase .khwshowcase__search-snippets p {
  font-family: var(--khwshowcase-body-font, inherit);
  font-size: var(--khwshowcase-body-size, 14px);
}

@media (min-width: 2560px) {
  .khwshowcase--4k-on .khwshowcase__search-result h3,
  .khwshowcase--4k-on .khwshowcase__search-panel-head h3 {
    font-size: var(--khwshowcase-card-title-size-4k, var(--khwshowcase-card-title-size, 18px));
  }

  .khwshowcase--4k-on .khwshowcase__search-snippets p {
    font-size: var(--khwshowcase-body-size-4k, var(--khwshowcase-body-size, 14px));
  }
}


/* 1.0.7: adjustable CTA surface opacity and compact mobile CTA layout. */
@media (max-width: 640px) {
  .khwshowcase--cta-mobile-minimal .khwshowcase__cta {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--khwshowcase-cta-mobile-gap, 8px);
    align-items: start;
    padding: var(--khwshowcase-cta-mobile-padding, 11.5px);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
  }

  .khwshowcase--cta-mobile-minimal.khwshowcase--cta-edge-vignette .khwshowcase__cta {
    background: transparent;
    box-shadow: none;
  }

  .khwshowcase--cta-mobile-minimal .khwshowcase__cta h3 {
    margin-bottom: 3px;
    font-size: var(--khwshowcase-cta-heading-size-mobile, 16.4px);
    line-height: 1.18;
  }

  .khwshowcase--cta-mobile-minimal .khwshowcase__cta p {
    margin: 0;
    font-size: var(--khwshowcase-cta-text-size-mobile, 12.3px);
    line-height: 1.34;
  }

  .khwshowcase--cta-mobile-minimal .khwshowcase__cta-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    justify-self: stretch;
    width: 100%;
    max-width: none;
  }

  .khwshowcase--cta-mobile-minimal .khwshowcase__button {
    width: 100%;
    min-height: 34px;
    max-width: none;
    padding: 7px 9px;
    font-size: var(--khwshowcase-cta-button-size-mobile, 11.5px);
    line-height: 1.15;
    text-align: center;
  }

  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal .khwshowcase__card-link {
    padding-bottom: max(148px, calc(env(safe-area-inset-bottom) + 128px));
  }

  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal .khwshowcase__cta {
    margin-top: -96px;
    margin-bottom: 12px;
    max-width: calc(100% - 24px);
  }

  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal.khwshowcase--cta-top-left .khwshowcase__cta,
  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal.khwshowcase--cta-center-left .khwshowcase__cta,
  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal.khwshowcase--cta-bottom-left .khwshowcase__cta {
    margin-left: 12px;
  }

  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal.khwshowcase--cta-top-right .khwshowcase__cta,
  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal.khwshowcase--cta-center-right .khwshowcase__cta,
  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal.khwshowcase--cta-bottom-right .khwshowcase__cta {
    margin-right: 12px;
  }

  /* Free positioning remains safely in-flow on mobile, but uses the compact visual treatment. */
  .khwshowcase--cta-mobile-minimal.khwshowcase--cta-free .khwshowcase__cta {
    max-width: calc(100% - 24px);
  }

  .khwshowcase--cta-edge-vignette .khwshowcase__cta::before {
    inset: calc(-1 * min(var(--khwshowcase-cta-vignette-feather, 28px), 20px));
    border-radius: calc(12px + min(var(--khwshowcase-cta-vignette-feather, 28px), 20px));
  }
}

/* Short mobile viewports (landscape/small devices) keep the parallax equal to the live viewport while reducing reserved chrome. */
@media (max-width: 640px) and (max-height: 560px) {
  .khwshowcase--parallax .khwshowcase__header {
    top: max(10px, env(safe-area-inset-top));
  }

  .khwshowcase--parallax .khwshowcase__card-link {
    padding-top: max(64px, calc(env(safe-area-inset-top) + 52px));
    padding-bottom: max(118px, calc(env(safe-area-inset-bottom) + 96px));
  }

  .khwshowcase--parallax.khwshowcase--cta-mobile-minimal .khwshowcase__card-link {
    padding-bottom: max(104px, calc(env(safe-area-inset-bottom) + 84px));
  }
}