.case-container { box-sizing: border-box; width: min(87.5rem, calc(100% - 4.5rem)); margin: 0 auto; }
.global-cases { background: #f2f2f2; }
.case-banner { position: relative; padding-top: 3.75rem; }
.case-banner__headline { position: absolute; z-index: 10; top: 50%; left: 22.5rem; color: #e3e3e3; transform: translateY(-50%); animation: case-headline-in 2s linear 1; }
.case-banner__headline h1 { margin: 0 0 2.6875rem; color: #e3e3e3; font-size: 3rem; font-weight: 300; }
.case-banner__headline p { max-width: 23.6875rem; margin: 0; color: #e3e3e3; font-size: 1rem; font-weight: 300; line-height: 1.32625rem; }
@keyframes case-headline-in { from { opacity: 0; top: 0; } to { opacity: 1; top: 50%; } }
.case-banner__carousel, .case-banner__track { position: relative; width: 100%; height: 31.25rem; overflow: hidden; }
.case-banner__slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility .5s ease; }
.case-banner__slide.is-active { opacity: 1; visibility: visible; }
.case-banner__slide picture { display: block; height: 100%; }
.case-banner__slide img { width: 100%; height: 31.25rem; display: block; object-fit: cover; }
.case-banner__fallback { background: linear-gradient(120deg, #30383e, #111820); }
.case-banner__arrow { position: absolute; z-index: 12; top: 50%; width: 4rem; height: 4rem; padding: 0; display: grid; place-items: center; color: #fff; background: transparent; border: 1px dashed rgb(255 255 255 / 70%); border-radius: 50%; transform: translateY(-50%); cursor: pointer; }
.case-banner__arrow span { font: 300 3.125rem/1 Arial; transform: translateY(-.125rem); }
.case-banner__arrow--prev { left: 5.5rem; }
.case-banner__arrow--next { right: 5.5rem; }
.case-banner__arrow:hover, .case-banner__arrow:focus-visible { color: #e3540b; background: #fff; border-style: solid; }
.case-banner__pagination { position: absolute; z-index: 10; right: 0; bottom: 1.25rem; left: 0; display: flex; justify-content: center; gap: 1.5rem; }
.case-banner__pagination button { width: 3.75rem; height: .25rem; padding: 0; display: block; background: #707070; border: 0; border-radius: .3125rem; cursor: pointer; }
.case-banner__pagination button.is-active { background: #e3540b; }

.case-filters { box-sizing: border-box; width: min(87.5rem, calc(100% - 4.5rem)); margin: 0 auto; padding: 2.5rem 0 1.875rem; }
.case-filter-row { min-width: 0; }
.case-filter-options { min-width: 0; display: flex; align-items: center; justify-content: center; gap: clamp(1.5rem, 3.75vw, 5rem); overflow-x: auto; scrollbar-width: none; }
.case-filter-options::-webkit-scrollbar { display: none; }
.case-filter-option { position: relative; flex: 0 0 auto; padding: 0 0 .75rem; color: #555; background: transparent; border: 0; cursor: pointer; font-size: 1rem; white-space: nowrap; transition: color .2s ease; }
.case-filter-option:hover, .case-filter-option:focus-visible, .case-filter-option.active { color: #e3540b; }
.case-filter-option.active::after { position: absolute; right: 0; bottom: 0; left: 0; width: 1.5rem; height: .125rem; margin: auto; content: ""; background: #e3540b; }
.case-list-section { padding: 1.25rem 0 5rem; }
.case-list-area { min-width: 0; scroll-margin-top: 6.25rem; }
.case-section-title { margin: 0 0 2.25rem; color: #333; font-size: 2rem; font-weight: 400; text-align: center; }
.case-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.875rem; }
.case-card { position: relative; min-width: 0; overflow: hidden; background: #fff; border-radius: .25rem; box-shadow: 0 .125rem .75rem rgb(0 0 0 / 6%); cursor: pointer; transition: all .35s ease; }
.case-card[hidden] { display: none; }
.case-card > a { height: 100%; display: block; }
.case-card:hover { box-shadow: 0 .5rem 1.875rem rgb(0 0 0 / 12%); transform: translateY(-.25rem); }
.case-card__image { width: 100%; overflow: hidden; aspect-ratio: 16 / 9; }
.case-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.case-card:hover .case-card__image img { transform: scale(1.05); }
.case-card__placeholder { width: 100%; height: 100%; display: block; background: linear-gradient(135deg, #d8dadd, #aeb4b8); }
.case-card__body { padding: 1rem; }
.case-card__title { margin: 0 0 .625rem; overflow: hidden; display: -webkit-box; color: #1a1a1a; font-size: .9375rem; font-weight: 600; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.case-card__date { color: #aaa; font-size: .75rem; }
.case-card__arrow { position: absolute; right: 1rem; bottom: 1rem; width: 1.75rem; height: 1.75rem; display: flex; align-items: center; justify-content: center; color: #e3540b; border: .125rem solid rgb(227 84 11 / 40%); border-radius: 50%; opacity: 0; transform: translate(-.5rem, .5rem); transition: all .35s ease; }
.case-card:hover .case-card__arrow { opacity: 1; transform: translate(0); }
.case-no-data { padding: 5rem 0; text-align: center; }
.case-no-data p { color: #999; font-size: 1.125rem; }
.case-pagination { margin-top: 3.75rem; }
.case-pagination:empty { display: none; }
.case-pagination__divider { width: 100%; height: .0625rem; display: block; background: rgb(0 0 0 / 10%); }
.case-pagination__pages { padding-top: 1.5rem; display: flex; align-items: center; justify-content: center; gap: 1.25rem; }
.case-pagination__pages button { padding: 0; color: #666; background: transparent; border: 0; cursor: pointer; font-size: 1rem; transition: color .25s ease; }
.case-pagination__pages button:hover, .case-pagination__pages button.active { color: #e3540b; }
.case-pagination__pages button.active { font-weight: 600; }

.case-detail { overflow: hidden; background: #f2f2f2; }
.case-detail__banner { position: relative; padding-top: 3.75rem; }
.case-detail__headline { position: absolute; z-index: 2; top: 50%; left: 22.5rem; color: #e3e3e3; transform: translateY(-50%); animation: case-headline-in 2s linear 1; }
.case-detail__headline p { margin: 0 0 2.6875rem; color: #e3e3e3; font-size: 3rem; font-weight: 300; }
.case-detail__banner-picture picture { display: block; }
.case-detail__banner-picture img { width: 100%; height: auto; display: block; }
.case-detail-container { box-sizing: content-box; max-width: 75rem; margin: 0 auto; padding: 2.5rem 1.25rem; }
.case-article { padding: 2.5rem; background: #fff; border-radius: .125rem; box-shadow: 0 .0625rem .1875rem rgb(0 0 0 / 10%); }
.case-article__title { margin: 0 0 1.25rem; color: #707070; font-size: 2rem; font-weight: 300; line-height: 1.4; }
.case-article__meta { margin-bottom: 1.875rem; padding-bottom: 1.875rem; border-bottom: .0625rem solid #eee; }
.case-article__meta time { margin-right: 1.25rem; color: #707070; font-size: .875rem; }
.case-article__meta span { padding: .125rem .5rem; color: #707070; background: #f5f5f5; border-radius: .125rem; font-size: .875rem; }
.case-article__body { color: #707070; font-size: 1rem; line-height: 1.8; }
.case-article__body p { margin: 0; }
.case-article__body h1, .case-article__body h2, .case-article__body h3,
.case-article__body h4, .case-article__body h5, .case-article__body h6 { margin: 0; line-height: normal; }
.case-article__body .rich-text > *:first-child { margin-top: 0; }
.case-article__body a { text-decoration: underline; }
.case-article__figure { margin: 1.25rem 0; }
.case-article__figure img, .case-article__body .rich-text img { max-width: 100%; height: auto; margin: 1.25rem auto; display: block; }
.case-article__video video { width: 100%; max-height: 80vh; margin: 1.25rem auto; display: block; background: #000; }
.case-article__figure figcaption, .case-article__video figcaption { margin-top: -.75rem; color: #999; font-size: .875rem; text-align: center; }
.case-article__gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.case-article__figure figcaption { margin-top: .5rem; color: #999; font-size: .8125rem; text-align: center; }
.case-contact-cta { position: relative; width: 100%; }
.case-contact-cta img { width: 100%; display: block; }
.case-contact-cta a { position: absolute; z-index: 10; bottom: 5vw; left: 50%; padding: .875rem 2.5rem; display: inline-block; color: #fff; background: linear-gradient(135deg, #ff6b35, #f7931e); border-radius: 3.125rem; box-shadow: 0 .25rem .9375rem rgb(255 107 53 / 40%); font-size: 1.125rem; font-weight: 600; white-space: nowrap; transform: translateX(-50%); transition: all .3s ease; animation: case-cta-bounce 1.5s ease-in-out infinite; }
.case-contact-cta a:hover { background: linear-gradient(135deg, #e55a2b, #e08515); box-shadow: 0 .375rem 1.5625rem rgb(255 107 53 / 60%); transform: translateX(-50%) scale(1.05); animation: none; }
@keyframes case-cta-bounce { 0%, 20%, 50%, 80%, 100% { transform: translateX(-50%) translateY(0); } 40% { transform: translateX(-50%) translateY(-.75rem); } 60% { transform: translateX(-50%) translateY(-.375rem); } }
.case-toast { position: fixed; z-index: 1000; bottom: -6.25rem; left: 50%; padding: .75rem 1.5rem; color: #fff; background: rgb(0 0 0 / 80%); border-radius: .25rem; transform: translateX(-50%); transition: bottom .3s; }
.case-toast.show { bottom: 1.25rem; }

@media (max-width: 1024px) {
  .case-banner__headline, .case-detail__headline { left: 5rem; transform: translateY(0); }
  .case-banner__headline h1, .case-detail__headline p { margin-bottom: 1.25rem; }
  .case-filter-options { justify-content: flex-start; gap: 2.25rem; }
  .case-section-title { margin-bottom: 1.75rem; font-size: 1.625rem; }
  .case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
}
@media (max-width: 767px) {
  .case-banner, .case-detail__banner { padding-top: 3.125rem; }
  .case-banner__carousel, .case-banner__track, .case-banner__slide img { height: 16.25rem; }
  .case-banner__arrow { width: 2.5rem; height: 2.5rem; }
  .case-banner__arrow span { font-size: 2rem; }
  .case-banner__arrow--prev { left: 1.25rem; }
  .case-banner__arrow--next { right: 1.25rem; }
  .case-banner__pagination { bottom: .75rem; gap: .75rem; }
  .case-banner__pagination button { width: 1.875rem; height: .1875rem; }
  .case-banner__headline { top: auto; right: 1.875rem; bottom: 2.5rem; left: 1.875rem; transform: none; }
  .case-banner__headline h1 { margin-bottom: .75rem; font-size: 1.75rem; font-weight: 500; line-height: 1.3; }
  .case-banner__headline p { max-width: 100%; font-size: .8125rem; line-height: 1.25rem; }
  .case-container, .case-filters { width: calc(100% - 2rem); }
  .case-filters { padding: 1.8rem 0 1.25rem; }
  .case-filter-options { gap: 2.25rem; }
  .case-filter-option { font-size: .875rem; }
  .case-list-section { padding-top: .75rem; padding-bottom: 3.5rem; }
  .case-section-title { margin-bottom: 1.25rem; font-size: 1.375rem; }
  .case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .875rem; }
  .case-card { border-radius: .375rem; }
  .case-card:hover { box-shadow: 0 .25rem 1rem rgb(0 0 0 / 10%); transform: none; }
  .case-card__body { padding: .75rem; }
  .case-card__title { margin-bottom: .375rem; font-size: .8125rem; -webkit-line-clamp: 1; line-clamp: 1; }
  .case-card__date { font-size: .6875rem; }
  .case-card__arrow { right: .75rem; bottom: .75rem; width: 1.5rem; height: 1.5rem; opacity: 1; transform: none; }
  .case-pagination { margin-top: 2.25rem; }
  .case-pagination__pages { padding-top: 1.125rem; gap: .875rem; }
  .case-pagination__pages button { font-size: .9375rem; }
  .case-detail__headline { top: auto; bottom: 3.125rem; left: 4rem; }
  .case-detail__headline p { font-size: 1.875rem; font-weight: 500; }
  .case-article__figure img { height: auto !important; }
  .case-detail-container, .case-article { padding: 1.25rem; }
  .case-article__title { font-size: 1.5rem; }
  .case-article__meta { margin-bottom: 1.25rem; padding-bottom: 1.25rem; }
  .case-contact-cta a { bottom: 1.25rem; padding: .625rem 1.75rem; font-size: .9375rem; }
}
@media (max-width: 520px) {
  .case-banner, .case-detail__banner { padding-top: 2.5rem; }
  .case-banner__carousel, .case-banner__track, .case-banner__slide img { height: 13.75rem; }
  .case-banner__arrow { display: none; }
  .case-banner__headline { right: 1.25rem; bottom: 1.875rem; left: 1.25rem; }
  .case-banner__headline h1 { margin-bottom: .5rem; font-size: 1.5rem; }
  .case-banner__headline p { font-size: .75rem; line-height: 1.125rem; }
  .case-filter-options { gap: 1.75rem; }
  .case-filter-option { font-size: .8125rem; }
  .case-section-title { margin-bottom: 1rem; font-size: 1.25rem; }
  .case-grid { grid-template-columns: 1fr; gap: .875rem; }
  .case-card__body { padding: .875rem; }
  .case-card__title { font-size: .875rem; -webkit-line-clamp: 2; line-clamp: 2; }
  .case-card__date { font-size: .75rem; }
  .case-pagination { margin-top: 1.75rem; }
  .case-pagination__pages { gap: .75rem; }
  .case-pagination__pages button { font-size: .875rem; }
  .case-detail-container, .case-article { padding: .9375rem; }
  .case-article__title { font-size: 1.25rem; }
  .case-article__body { font-size: .875rem; }
  .case-article__gallery { grid-template-columns: 1fr; gap: .875rem; }
  .case-article__body * { max-width: 100% !important; box-sizing: border-box; }
}

@media (prefers-reduced-motion: reduce) {
  .case-banner__headline, .case-detail__headline, .case-contact-cta a { animation: none; }
}
.case-project-facts{border-top:1px solid #dedede;margin-top:48px;padding-top:36px}.case-project-facts h2{font-size:28px;margin:0 0 24px}.case-project-facts dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0}.case-project-facts dl>div{border-bottom:1px solid #e7e7e7;display:grid;grid-template-columns:120px 1fr;padding:16px 0}.case-project-facts dt{color:#777}.case-project-facts dd{line-height:1.7;margin:0}@media(max-width:767px){.case-project-facts dl{grid-template-columns:1fr}.case-project-facts dl>div{grid-template-columns:92px 1fr}}
.case-project-facts__products a{color:inherit;text-decoration:underline;text-underline-offset:3px}.case-project-facts__products a:hover{color:#e30b17}

/* Detail pages start 30px below the fixed header; the detail hero is intentionally omitted. */
.case-detail { padding-top: 4rem; }
.case-detail-container { margin-top: 30px; padding-top: 0; }
@media (min-width: 768px) and (max-width: 1024px) {
  .case-detail { padding-top: 6.25rem; }
}
@media (max-width: 767px) {
  .case-detail { padding-top: 3.75rem; }
  .case-detail-container { padding-top: 0; }
}
@media (max-width: 450px) {
  .case-detail { padding-top: 3.125rem; }
}

/* Keep case filters directly below the responsive fixed site header. */
.case-filters {
  position: sticky;
  z-index: 100;
  top: max(4vw, calc(3.75rem + 2px));
  background: #f2f2f2;
}
@media (max-width: 767px) {
  .case-filters { top: 6.25rem; }
}
@media (max-width: 520px) {
  .case-filters { top: 3.75rem; }
}