/* Eigenständige Merchandising Bildwelt in Nachtblau, Sand und Naturtönen. */
.merchandising-page {
  --merch-midnight: #14283b;
  --merch-midnight-soft: #294155;
  --merch-sand: #e9ddcb;
  --merch-sand-soft: #f7f3ed;
  --merch-stone: #71808a;
  --merch-line: #d8d5cf;
}

.merchandising-page .employee-gallery-section {
  width: 100%;
  background: linear-gradient(180deg, #fff 0%, #fff 44%, #f8f6f2 100%);
}

.merchandising-page .employee-gallery-head > div:first-child > .eyebrow,
.merchandising-page .employee-gallery-card > div:last-child > span {
  color: var(--merch-stone);
}

.merchandising-page .employee-gallery-head h1 {
  color: var(--merch-midnight);
}

.merchandising-page .employee-logo-note {
  border-left-color: var(--merch-midnight-soft);
  background: #f3f1ed;
}

.merchandising-page .employee-gallery-card {
  border-color: var(--merch-line);
  background: #fff;
  box-shadow: 0 0 0 rgba(20, 40, 59, 0);
  transition: border-color .28s ease, box-shadow .28s ease, transform .28s ease;
}

.merchandising-page .employee-gallery-card:hover,
.merchandising-page .employee-gallery-card:focus-within,
.merchandising-page .employee-gallery-card.is-active {
  border-color: rgba(20, 40, 59, .38);
  box-shadow: 0 18px 42px rgba(20, 40, 59, .12);
}

.merchandising-page .employee-gallery-card > div:last-child {
  background: linear-gradient(145deg, #fff 0%, #f5f2ec 100%);
}

.merchandising-page .employee-gallery-card h3 {
  color: var(--merch-midnight);
}

.merchandising-page .employee-gallery-card p {
  color: #626b72;
}

.merchandising-page .gallery-image-benefits {
  background: linear-gradient(145deg, #e7edf1 0 62%, rgba(188, 36, 47, .14) 62% 64%, #faf7f1 64% 100%);
}

.merchandising-page .gallery-image-custom,
.merchandising-page .employee-flip-back {
  background: linear-gradient(145deg, #e6ebee 0 63%, rgba(188, 36, 47, .14) 63% 65%, #faf7f1 65% 100%);
}

.merchandising-page .employee-custom-visual strong::before {
  background: var(--merch-midnight);
}

.merchandising-page .benefits-shop-bar {
  background: var(--merch-midnight);
}

.merchandising-page .employee-branding-caption {
  background: var(--merch-midnight);
}

/* Nur die Bereiche der Veredelung wechseln. Motiv, Licht und Hintergrund bleiben stabil. */
.employee-photo-preview.merch-image-01 {
  --unprinted-photo: url('../merchandising/bilder-ohne-logo/01-premium-hoodie.webp');
  --printed-photo: url('../merchandising/bilder-mit-logo/01-premium-hoodie.webp');
  --print-regions: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221254%22%20height%3D%221254%22%20viewBox%3D%220%200%201254%201254%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22s%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%224%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Crect%20x%3D%22690%22%20y%3D%22445%22%20width%3D%22215%22%20height%3D%22120%22%20rx%3D%2224%22%20fill%3D%22white%22%20filter%3D%22url(%23s)%22%2F%3E%3C%2Fsvg%3E");
}

.employee-photo-preview.merch-image-02 {
  --unprinted-photo: url('../merchandising/bilder-ohne-logo/02-corporate-pullover.webp');
  --printed-photo: url('../merchandising/bilder-mit-logo/02-corporate-pullover.webp');
  --print-regions: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221254%22%20height%3D%221254%22%20viewBox%3D%220%200%201254%201254%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22s%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%224%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Crect%20x%3D%22425%22%20y%3D%22480%22%20width%3D%22430%22%20height%3D%22195%22%20rx%3D%2230%22%20fill%3D%22white%22%20filter%3D%22url(%23s)%22%2F%3E%3C%2Fsvg%3E");
}

.employee-photo-preview.merch-image-03 {
  --unprinted-photo: url('../merchandising/bilder-ohne-logo/03-merchandise-muetze.webp');
  --printed-photo: url('../merchandising/bilder-mit-logo/03-merchandise-muetze.webp');
  --print-regions: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221254%22%20height%3D%221254%22%20viewBox%3D%220%200%201254%201254%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22s%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%224%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Crect%20x%3D%22520%22%20y%3D%22735%22%20width%3D%22230%22%20height%3D%22170%22%20rx%3D%2222%22%20fill%3D%22white%22%20filter%3D%22url(%23s)%22%2F%3E%3C%2Fsvg%3E");
}

.employee-photo-preview.merch-image-05 {
  --unprinted-photo: url('../merchandising/bilder-ohne-logo/05-marken-sneaker.webp');
  --printed-photo: url('../merchandising/bilder-mit-logo/05-marken-sneaker.webp');
  --print-regions: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221254%22%20height%3D%221254%22%20viewBox%3D%220%200%201254%201254%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22s%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%224%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Crect%20x%3D%22395%22%20y%3D%22600%22%20width%3D%22365%22%20height%3D%22205%22%20rx%3D%2234%22%20fill%3D%22white%22%20filter%3D%22url(%23s)%22%2F%3E%3C%2Fsvg%3E");
}

.employee-photo-preview.merch-image-07 {
  --unprinted-photo: url('../merchandising/bilder-ohne-logo/07-premium-overshirt.webp');
  --printed-photo: url('../merchandising/bilder-mit-logo/07-premium-overshirt.webp');
  --print-regions: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221254%22%20height%3D%221254%22%20viewBox%3D%220%200%201254%201254%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22s%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%224%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Crect%20x%3D%22665%22%20y%3D%22325%22%20width%3D%22195%22%20height%3D%22135%22%20rx%3D%2222%22%20fill%3D%22white%22%20filter%3D%22url(%23s)%22%2F%3E%3C%2Fsvg%3E");
}

.employee-photo-preview.merch-image-08 {
  --unprinted-photo: url('../merchandising/bilder-ohne-logo/08-corporate-weekender.webp');
  --printed-photo: url('../merchandising/bilder-mit-logo/08-corporate-weekender.webp');
  --print-regions: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221254%22%20height%3D%221254%22%20viewBox%3D%220%200%201254%201254%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22s%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeGaussianBlur%20stdDeviation%3D%224%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Crect%20x%3D%22405%22%20y%3D%22660%22%20width%3D%22615%22%20height%3D%22255%22%20rx%3D%2240%22%20fill%3D%22white%22%20filter%3D%22url(%23s)%22%2F%3E%3C%2Fsvg%3E");
}

/* Die Shopkarte 04 bleibt auf allen Leistungsseiten gestalterisch identisch. */
.merchandising-page .employee-benefits-card {
  border-color: #ded5ca;
  background: #f8f3ec;
}

.merchandising-page .employee-benefits-card > div:last-child {
  background: linear-gradient(145deg, #fbf8f3, #f4eee6);
}

.merchandising-page .employee-benefits-card .gallery-image-benefits,
.merchandising-page .employee-benefits-card .employee-flip-back {
  background: linear-gradient(145deg, #f1eee8 0 63%, rgba(41, 67, 60, .18) 63% 65%, #fff 65% 100%);
}

.merchandising-page .employee-benefits-card .benefits-shop-bar {
  background: transparent;
}

@media (max-width: 720px) {
  .merchandising-page .employee-gallery-card:hover,
  .merchandising-page .employee-gallery-card:focus-within,
  .merchandising-page .employee-gallery-card.is-active {
    transform: none;
  }
}