:root,
[data-bs-theme="light"] {
    --dzw-blue: #0068a8;
    --dzw-blue-bright: #2a9ee0;
    --dzw-blue-dark: #004d7c;
    --dzw-charcoal: #151719;
    --dzw-clay: #b9532f;
    --dzw-favorite: #c28a35;
    --dzw-favorite-dark: #8d5b20;
    --dzw-paper: #ffffff;
    --dzw-soft: #f5f7f9;
    --dzw-blue-soft: #edf7fc;
    --dzw-line: #dce3e8;
    --dzw-radius: .5rem;
    --dzw-element-radius: calc(var(--dzw-radius) + .15rem);
    --dzw-shadow-sm: 0 .5rem 1.25rem rgba(21, 23, 25, .08);
    --dzw-shadow-md: 0 1rem 2.5rem rgba(21, 23, 25, .12);
    --dzw-section-y: clamp(3rem, 6vw, 6rem);
    --dzw-site-header-height: 4.75rem;
    --bs-body-color: var(--dzw-charcoal);
    --bs-body-bg: var(--dzw-paper);
    --bs-body-font-family: "Manrope", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-primary: var(--dzw-blue);
    --bs-primary-rgb: 0, 104, 168;
    --bs-secondary-color: #5d6872;
    --bs-border-radius: var(--dzw-radius);
    --bs-border-color: var(--dzw-line);
    --bs-link-color: var(--dzw-blue-dark);
    --bs-link-hover-color: var(--dzw-blue-dark);
    --bs-focus-ring-color: rgba(0, 104, 168, .25);
}

.turbo-progress-bar {
    background-color: var(--dzw-blue-bright);
    height: 2px;
}

body {
    min-height: 100vh;
    font-family: var(--bs-body-font-family);
    font-feature-settings: "cv11";
    overflow-x: hidden;
    text-rendering: optimizeLegibility;
}

a:not(.btn):not(.nav-link):not(.navbar-brand):not(.dzw-catalogue-card):not(.dzw-catalogue-relation-card):not(.dzw-catalogue-locked-link) {
    color: var(--dzw-blue-dark);
    text-decoration: none;
    transition: color .2s ease, opacity .2s ease;
}

a:not(.btn):not(.nav-link):not(.navbar-brand):not(.dzw-catalogue-card):not(.dzw-catalogue-relation-card):not(.dzw-catalogue-locked-link):hover,
a:not(.btn):not(.nav-link):not(.navbar-brand):not(.dzw-catalogue-card):not(.dzw-catalogue-relation-card):not(.dzw-catalogue-locked-link):focus {
    color: var(--dzw-blue-dark);
    opacity: .82;
    text-decoration: none;
}

.dzw-page {
    background:
        linear-gradient(180deg, rgba(245, 247, 249, .72), rgba(255, 255, 255, 0) 18rem),
        var(--dzw-paper);
}

.alert,
.toast {
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
}

.dzw-section {
    padding-block: var(--dzw-section-y);
}

.dzw-section > .container > .row {
    margin-inline: 0;
}

.dzw-section-muted {
    background: var(--dzw-soft);
}

.dzw-section-kicker {
    color: var(--dzw-blue-dark);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.dzw-section-title {
    color: var(--dzw-charcoal);
    font-weight: 700;
}

.dzw-section-lead {
    color: var(--bs-secondary-color);
    font-size: clamp(1rem, 1vw + .78rem, 1.1875rem);
}

.dzw-hero {
    background:
        linear-gradient(135deg, rgba(0, 104, 168, .12), rgba(185, 83, 47, .06) 45%, rgba(255, 255, 255, 0) 78%),
        var(--dzw-paper);
}

.dzw-hero-carousel {
    box-shadow: 0 1.25rem 3rem rgba(21, 23, 25, .14);
}

.dzw-hero-carousel .carousel-item {
    aspect-ratio: 16 / 11;
}

.dzw-hero-carousel img {
    height: 100%;
    object-fit: cover;
}

.dzw-site-header {
    background: rgba(255, 255, 255, .72);
    border-bottom: 1px solid rgba(255, 255, 255, .62);
    backdrop-filter: blur(12px);
    box-shadow: 0 .75rem 2rem rgba(21, 23, 25, .04);
    position: relative;
    z-index: 1100;
}

body.dzw-mobile-nav-open {
    overflow: hidden;
}

.dzw-navbar-brand {
    display: inline-flex;
    line-height: 1;
    padding-block: .35rem;
}

.dzw-navbar-brand img {
    display: block;
    height: 2.05rem;
    width: auto;
}

.dzw-navbar-toggle {
    background: rgba(255, 255, 255, .36);
    border: 0;
    border-radius: var(--dzw-element-radius);
    padding: .55rem;
    transition: background-color .2s ease, opacity .2s ease;
}

.dzw-navbar-toggle .navbar-toggler-icon {
    background-image: linear-gradient(var(--dzw-blue-dark), var(--dzw-blue-dark));
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 2px;
    height: 1rem;
    position: relative;
    transition: background-size .18s ease;
    width: 1.35rem;
}

.dzw-navbar-toggle .navbar-toggler-icon::before,
.dzw-navbar-toggle .navbar-toggler-icon::after {
    background: var(--dzw-blue-dark);
    border-radius: 999px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    transform-origin: center;
    transition: top .18s ease, transform .18s ease;
    width: 100%;
}

.dzw-navbar-toggle .navbar-toggler-icon::before {
    top: .08rem;
}

.dzw-navbar-toggle .navbar-toggler-icon::after {
    top: .82rem;
}

.dzw-navbar-toggle[aria-expanded="true"] .navbar-toggler-icon {
    background-size: 0 2px;
}

.dzw-navbar-toggle[aria-expanded="true"] .navbar-toggler-icon::before,
.dzw-navbar-toggle[aria-expanded="true"] .navbar-toggler-icon::after {
    top: .5rem;
}

.dzw-navbar-toggle[aria-expanded="true"] .navbar-toggler-icon::before {
    transform: rotate(45deg);
}

.dzw-navbar-toggle[aria-expanded="true"] .navbar-toggler-icon::after {
    transform: rotate(-45deg);
}

.dzw-navbar-toggle:hover {
    background: rgba(255, 255, 255, .72);
}

.dzw-navbar-toggle:focus,
.dzw-navbar-toggle:active {
    box-shadow: none;
    outline: 0;
}

.dzw-navbar-toggle:focus-visible {
    outline: 2px solid rgba(0, 104, 168, .34);
    outline-offset: .25rem;
}

.dzw-brand-mark {
    align-items: center;
    background: var(--dzw-blue);
    border-radius: .35rem;
    color: #fff;
    display: inline-flex;
    font-size: .875rem;
    font-weight: 700;
    height: 2.25rem;
    justify-content: center;
    width: 2.25rem;
}

.dzw-nav-link {
    color: var(--dzw-charcoal);
    font-weight: 600;
    transition: color .2s ease, opacity .2s ease;
}

.dzw-nav-link:hover,
.dzw-nav-link:focus {
    color: var(--dzw-blue);
}

.dzw-nav-actions {
    align-items: center;
    display: inline-flex;
    flex-wrap: nowrap;
    gap: .55rem;
}

.dzw-nav-actions > * {
    flex: 0 0 auto;
}

.dzw-account-dropdown-toggle {
    align-items: center;
    display: inline-flex;
    gap: .45rem;
    justify-content: center;
}

.dzw-account-dropdown-menu {
    border: 1px solid rgba(220, 227, 232, .9);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-md);
    min-width: 13rem;
    padding: .45rem;
}

.dzw-account-dropdown-menu .dropdown-item {
    align-items: center;
    border-radius: calc(var(--dzw-element-radius) - .25rem);
    color: var(--dzw-charcoal);
    display: flex;
    font-weight: 750;
    gap: .65rem;
    padding: .65rem .75rem;
    width: 100%;
}

.dzw-account-dropdown-menu .dropdown-item:hover,
.dzw-account-dropdown-menu .dropdown-item:focus {
    background: rgba(0, 104, 168, .08);
    color: var(--dzw-blue-dark);
}

.dzw-account-dropdown-menu .dropdown-item i {
    color: var(--dzw-blue-dark);
}

.btn {
    --bs-btn-padding-x: 1.15rem;
    --bs-btn-padding-y: .72rem;
    --bs-btn-font-weight: 700;
    border-radius: var(--dzw-element-radius);
    isolation: isolate;
}

.btn-sm {
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: .58rem;
}

.btn-primary {
    --bs-btn-bg: rgba(0, 104, 168, .7);
    --bs-btn-border-color: rgba(0, 104, 168, .82);
    --bs-btn-hover-bg: #004f82;
    --bs-btn-hover-border-color: #00456f;
    --bs-btn-active-bg: #004f82;
    --bs-btn-active-border-color: #00456f;
    --bs-btn-disabled-bg: #004f82;
    --bs-btn-disabled-border-color: #00456f;
    --bs-btn-disabled-color: #fff;
    --bs-btn-box-shadow: var(--dzw-shadow-sm);
    backdrop-filter: blur(14px);
    background-color: var(--bs-btn-bg);
    background-image: none;
    box-shadow: var(--dzw-shadow-sm);
    transition: background-color .2s ease, box-shadow .2s ease, opacity .2s ease, transform .2s ease;
}

.btn-outline-primary {
    --bs-btn-color: var(--dzw-blue);
    --bs-btn-bg: rgba(255, 255, 255, .7);
    --bs-btn-border-color: rgba(0, 104, 168, .24);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: rgba(0, 104, 168, .92);
    --bs-btn-hover-border-color: rgba(0, 104, 168, .95);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: rgba(0, 104, 168, .92);
    --bs-btn-active-border-color: rgba(0, 104, 168, .95);
    backdrop-filter: blur(14px);
    background-color: var(--bs-btn-bg);
    background-image: none;
    box-shadow: var(--dzw-shadow-sm);
    transition: background-color .2s ease, box-shadow .2s ease, opacity .2s ease, transform .2s ease;
}

.btn:hover,
.btn:focus {
    box-shadow: var(--dzw-shadow-md);
    transform: translateY(-1px);
}

.dzw-btn-accent {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--dzw-clay);
    --bs-btn-border-color: var(--dzw-clay);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #9f4527;
    --bs-btn-hover-border-color: #9f4527;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #89391f;
    --bs-btn-active-border-color: #89391f;
}

.dzw-feature-card {
    background: var(--dzw-paper);
    border: 1px solid rgba(220, 227, 232, .72);
    border-radius: var(--dzw-element-radius);
    height: 100%;
    padding: 1.5rem;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dzw-feature-card:hover,
.dzw-feature-card:focus-within {
    border-color: rgba(0, 104, 168, .16);
    box-shadow: var(--dzw-shadow-md);
    transform: translateY(-4px) scale(1.01);
}

.dzw-feature-icon {
    align-items: center;
    background: rgba(0, 104, 168, .1);
    border-radius: .35rem;
    color: var(--dzw-blue);
    display: inline-flex;
    height: 2.5rem;
    justify-content: center;
    width: 2.5rem;
}

.dzw-filter-chip {
    background: rgba(0, 104, 168, .08);
    border-radius: 999px;
    color: var(--dzw-blue-dark);
    display: inline-flex;
    font-size: .8125rem;
    font-weight: 700;
    line-height: 1;
    padding: .55rem .8rem;
}

.dzw-media-frame {
    background: var(--dzw-soft);
    border: 1px solid var(--dzw-line);
    border-radius: var(--dzw-element-radius);
    overflow: hidden;
}

.dzw-media-frame > img,
.dzw-media-frame > picture,
.dzw-media-frame > video {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.dzw-media-frame-contain {
    background: #fff;
}

.dzw-media-frame-contain > img {
    object-fit: contain;
    padding: clamp(.75rem, 2vw, 1.25rem);
}

.dzw-logo-wall {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
}

.dzw-logo-marquee {
    margin-inline: auto;
    max-width: 52rem;
    overflow: hidden;
    padding: 1.25rem .5rem;
    position: relative;
}

.dzw-logo-marquee::before,
.dzw-logo-marquee::after {
    content: "";
    inset-block: 0;
    pointer-events: none;
    position: absolute;
    width: clamp(3rem, 16%, 8rem);
    z-index: 2;
}

.dzw-logo-marquee::before {
    background: linear-gradient(90deg, var(--dzw-soft), rgba(245, 247, 249, 0));
    left: 0;
}

.dzw-logo-marquee::after {
    background: linear-gradient(270deg, var(--dzw-soft), rgba(245, 247, 249, 0));
    right: 0;
}

.dzw-logo-marquee-track {
    animation: dzw-logo-marquee 28s linear infinite;
    display: flex;
    flex-wrap: nowrap;
    gap: 1rem;
    width: max-content;
    will-change: transform;
}

.dzw-logo-marquee:hover .dzw-logo-marquee-track {
    animation-play-state: paused;
}

.dzw-logo-wall-item {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .62);
    border-radius: var(--dzw-element-radius);
    color: var(--bs-secondary-color);
    flex: 0 0 10rem;
    display: flex;
    min-height: 4.5rem;
    justify-content: center;
    padding: 1rem;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dzw-logo-wall-item:hover {
    border-color: rgba(0, 104, 168, .16);
    box-shadow: var(--dzw-shadow-sm);
    transform: translateY(-3px) scale(1.02);
}

.dzw-logo-wall-item img {
    max-height: 3.25rem;
    max-width: 100%;
    object-fit: contain;
}

.dzw-search-panel {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .72);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    padding: clamp(1rem, 2vw, 2rem);
}

.dzw-static-hero {
    background:
        linear-gradient(135deg, rgba(0, 104, 168, .1), rgba(185, 83, 47, .05) 52%, rgba(255, 255, 255, 0)),
        var(--dzw-paper);
    overflow: hidden;
    padding-block: clamp(3rem, 5vw, 5rem);
    position: relative;
}

.dzw-static-hero::after {
    background-image: url("data:image/svg+xml,%3Csvg width='1400' height='700' viewBox='0 0 1400 700' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 700L700 0L1400 700' stroke='%23151719' stroke-width='18' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    bottom: 0;
    content: "";
    left: 0;
    opacity: .025;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 20%;
}

.dzw-static-hero > .container {
    position: relative;
    z-index: 1;
}

.dzw-static-body {
    padding-block-start: clamp(2.25rem, 4vw, 4rem);
}

.dzw-static-copy {
    color: #45515c;
    font-size: 1.075rem;
    line-height: 1.8;
    max-width: 58rem;
}

.dzw-static-copy > :last-child {
    margin-bottom: 0;
}

.dzw-static-intro-grid {
    align-items: center;
    display: grid;
    gap: clamp(2rem, 5vw, 4.5rem);
    grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr);
}

.dzw-brick-section {
    padding-block: clamp(1.25rem, 3.5vw, 3rem);
}

.dzw-brick-comparison-grid,
.dzw-brick-card-grid,
.dzw-brick-color-grid {
    display: grid;
    gap: 1rem;
}

.dzw-brick-comparison-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dzw-brick-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr));
}

.dzw-brick-color-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
}

.dzw-brick-comparison-card,
.dzw-brick-image-card,
.dzw-brick-color-link {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
}

.dzw-brick-comparison-card,
.dzw-brick-image-card {
    display: grid;
    gap: 1.25rem;
    padding: clamp(1.2rem, 2.5vw, 1.75rem);
}

.dzw-brick-comparison-card {
    grid-template-rows: 1fr auto;
}

.dzw-brick-card-copy {
    color: #45515c;
    line-height: 1.65;
}

.dzw-brick-card-copy h3,
.dzw-brick-image-card h3 {
    color: var(--dzw-charcoal);
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: .75rem;
}

.dzw-brick-card-copy ul {
    margin: 1rem 0 0;
    padding-left: 1.15rem;
}

.dzw-brick-card-copy li + li {
    margin-top: .45rem;
}

.dzw-brick-color-link {
    align-items: center;
    color: var(--dzw-charcoal);
    display: flex;
    gap: .85rem;
    font-weight: 800;
    padding: .85rem 1rem;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dzw-brick-color-link:hover,
.dzw-brick-color-link:focus-visible {
    border-color: rgba(0, 104, 168, .2);
    box-shadow: var(--dzw-shadow-md);
    color: var(--dzw-blue-dark);
    transform: translateY(-1px);
}

.dzw-brick-color-swatch {
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 50%;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .12);
    flex: 0 0 auto;
    height: 2.1rem;
    width: 2.1rem;
}

.dzw-brick-image-card {
    align-content: space-between;
}

.dzw-brick-image-card p {
    color: #45515c;
    line-height: 1.6;
    margin-bottom: 0;
}

.dzw-brick-image-card figure {
    align-items: center;
    background: rgba(246, 248, 250, .78);
    border-radius: var(--dzw-element-radius);
    display: flex;
    justify-content: center;
    margin: 0;
    min-height: 11rem;
    padding: 1rem;
}

.dzw-brick-image-card img {
    display: block;
    max-height: 9rem;
    max-width: 100%;
    object-fit: contain;
}

.dzw-brick-shape-card figure {
    min-height: 9rem;
}

.dzw-brick-shape-card img {
    max-height: 7.5rem;
}

.dzw-story-flow {
    display: grid;
    gap: clamp(2.5rem, 5vw, 4.5rem);
}

.dzw-story-section {
    align-items: center;
    display: grid;
    gap: clamp(1.5rem, 4vw, 3rem);
    padding-block: clamp(1.25rem, 3.5vw, 3rem);
}

.dzw-story-section-with-image {
    grid-template-columns: minmax(0, .72fr) minmax(0, 1fr);
}

.dzw-story-image-right {
    grid-template-columns: minmax(0, 1fr) minmax(0, .72fr);
}

.dzw-story-image-bottom,
.dzw-story-image-top {
    grid-template-columns: 1fr;
}

.dzw-story-copy {
    color: #45515c;
    font-size: 1.0625rem;
    line-height: 1.78;
}

.dzw-story-copy h2 {
    color: var(--dzw-charcoal);
    font-size: clamp(1.65rem, 1.5vw + 1.2rem, 2.35rem);
    font-weight: 700;
    line-height: 1.16;
    margin-bottom: 1rem;
}

.dzw-story-copy > :last-child {
    margin-bottom: 0;
}

.dzw-story-image {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .72);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    overflow: hidden;
}

.dzw-story-image img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.dzw-story-image-portrait {
    align-self: stretch;
    max-height: 26rem;
}

.dzw-story-image-portrait img {
    object-position: center top;
}

.dzw-story-image-bottom .dzw-story-image img,
.dzw-story-image-top .dzw-story-image img {
    object-fit: contain;
}

.dzw-story-facts {
    display: grid;
    gap: .75rem;
    list-style: none;
    margin: 1.5rem 0 0;
    padding: 0;
}

.dzw-story-facts li {
    align-items: flex-start;
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .9);
    border-left: .25rem solid rgba(0, 104, 168, .55);
    border-radius: .35rem;
    color: #37424c;
    display: flex;
    font-weight: 650;
    gap: .65rem;
    padding: .9rem 1rem;
}

.dzw-video-card {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .72);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    padding: clamp(1.25rem, 2vw, 1.75rem);
}

.dzw-legal-content {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .72);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    color: #2f3a43;
    display: grid;
    font-size: .98rem;
    gap: .85rem;
    line-height: 1.72;
    padding: clamp(1.35rem, 3vw, 2.25rem);
}

.dzw-legal-content h2,
.dzw-legal-content h3 {
    color: var(--dzw-charcoal);
    letter-spacing: 0;
    line-height: 1.25;
    margin: 1.55rem 0 0;
}

.dzw-legal-content h2 {
    border-top: 1px solid rgba(220, 227, 232, .85);
    font-size: clamp(1.25rem, 2.1vw, 1.55rem);
    padding-top: 1.35rem;
}

.dzw-legal-content h2:first-child {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
}

.dzw-legal-content h3 {
    font-size: 1.05rem;
}

.dzw-legal-content p,
.dzw-legal-content ul {
    margin: 0;
}

.dzw-legal-content ul {
    padding-left: 1.25rem;
}

.dzw-legal-content li + li {
    margin-top: .35rem;
}

.dzw-legal-content a {
    overflow-wrap: anywhere;
}

.dzw-error-page {
    align-items: center;
    background: linear-gradient(180deg, #eef5f9 0%, #ffffff 72%);
    display: flex;
    min-height: calc(100vh - 9rem);
    padding-block: clamp(3rem, 8vw, 6rem);
}

.dzw-error-layout {
    align-items: center;
    display: grid;
    gap: clamp(2rem, 5vw, 4rem);
    grid-template-columns: minmax(0, .85fr) minmax(18rem, 1fr);
}

.dzw-error-copy {
    display: grid;
    gap: 1.15rem;
    max-width: 36rem;
}

.dzw-error-copy h1 {
    color: var(--dzw-charcoal);
    font-size: clamp(2.25rem, 5vw, 4.5rem);
    font-weight: 850;
    letter-spacing: 0;
    line-height: .98;
    margin: 0;
}

.dzw-error-copy p {
    color: #35414a;
    font-size: clamp(1rem, 1.35vw, 1.15rem);
    line-height: 1.7;
    margin: 0;
}

.dzw-error-figure {
    margin: 0;
}

.dzw-error-figure img {
    display: block;
    height: auto;
    max-height: min(56vh, 34rem);
    object-fit: contain;
    width: 100%;
}

.dzw-video-section {
    display: grid;
    gap: clamp(1.5rem, 4vw, 2.5rem);
}

.dzw-manufacturer-section {
    padding-block: clamp(1rem, 3vw, 2.5rem);
}

.dzw-manufacturer-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
}

.dzw-manufacturer-card {
    align-items: stretch;
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    color: var(--dzw-charcoal);
    display: grid;
    gap: 1rem;
    grid-template-rows: 8rem auto;
    min-height: 13rem;
    padding: 1.25rem;
    text-align: center;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dzw-manufacturer-card:hover,
.dzw-manufacturer-card:focus-visible {
    border-color: rgba(0, 104, 168, .2);
    box-shadow: var(--dzw-shadow-md);
    color: var(--dzw-blue-dark);
    transform: translateY(-1px);
}

.dzw-manufacturer-logo {
    align-items: center;
    display: flex;
    justify-content: center;
}

.dzw-manufacturer-logo img {
    display: block;
    max-height: 5.25rem;
    max-width: 100%;
    object-fit: contain;
}

.dzw-manufacturer-name {
    align-self: start;
    font-size: .98rem;
    font-weight: 800;
    line-height: 1.35;
}

.dzw-video-intro {
    border-bottom: 1px solid rgba(220, 227, 232, .9);
    padding-bottom: 1.5rem;
}

.dzw-video-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(24rem, 100%), 1fr));
}

.dzw-video-card {
    display: grid;
    gap: 1.25rem;
}

.dzw-video-card h3 {
    color: var(--dzw-charcoal);
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: .45rem;
}

.dzw-video-card p {
    color: #45515c;
    line-height: 1.65;
    margin-bottom: 0;
}

.dzw-video-card iframe,
.dzw-video-consent {
    border: 0;
    border-radius: var(--dzw-element-radius);
}

.dzw-video-consent {
    overflow: hidden;
}

.dzw-video-placeholder {
    align-items: center;
    background: linear-gradient(135deg, rgba(0, 104, 168, .1), rgba(236, 240, 243, .95));
    border: 1px solid rgba(0, 104, 168, .16);
    color: var(--dzw-charcoal);
    display: flex;
    flex-direction: column;
    gap: .75rem;
    justify-content: center;
    padding: 1.5rem;
    text-align: center;
}

.dzw-video-placeholder p {
    color: #45515c;
    font-size: .95rem;
    line-height: 1.5;
    max-width: 20rem;
}

.dzw-video-placeholder-icon {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(0, 104, 168, .18);
    border-radius: 999px;
    color: var(--dzw-blue);
    display: inline-flex;
    font-size: 1.65rem;
    height: 3rem;
    justify-content: center;
    width: 3rem;
}

.dzw-static-accordion {
    display: grid;
    gap: .75rem;
}

.dzw-static-accordion .accordion-item {
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(220, 227, 232, .9);
    border-radius: 0;
}

.dzw-static-accordion .accordion-button {
    background: transparent;
    box-shadow: none;
    color: var(--dzw-charcoal);
    font-weight: 700;
    gap: 1rem;
    padding: 1.25rem 0;
}

.dzw-static-accordion .accordion-button:not(.collapsed) {
    background: transparent;
    box-shadow: none;
    color: var(--dzw-charcoal);
}

.dzw-static-accordion .accordion-button:focus {
    box-shadow: none;
}

.dzw-static-accordion .accordion-button:focus-visible {
    outline: 2px solid rgba(0, 104, 168, .24);
    outline-offset: .2rem;
}

.dzw-static-accordion .accordion-body {
    padding: 0 0 1.75rem;
}

.dzw-faq-answer {
    color: #45515c;
    font-size: 1.02rem;
    line-height: 1.78;
}

.dzw-faq-answer > :last-child {
    margin-bottom: 0;
}

.dzw-faq-answer ul {
    margin-block: 1rem 1.25rem;
    padding-left: 1.2rem;
}

.dzw-faq-answer li + li {
    margin-top: .4rem;
}

.dzw-faq-image-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
    margin-top: 1.5rem;
}

.dzw-faq-image {
    margin: 0;
}

.dzw-faq-image img {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .72);
    border-radius: var(--dzw-element-radius);
    display: block;
    height: 100%;
    max-height: 18rem;
    object-fit: contain;
    padding: .5rem;
    width: 100%;
}

.dzw-faq-image figcaption {
    color: var(--bs-secondary-color);
    font-size: .875rem;
    margin-top: .55rem;
}

.dzw-roof-block {
    padding-block: clamp(1.25rem, 3.5vw, 3rem);
}

.dzw-roof-form-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr));
}

.dzw-roof-form-card {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 6rem minmax(0, 1fr);
    height: 100%;
    padding: clamp(1rem, 2vw, 1.35rem);
}

.dzw-roof-form-media {
    align-items: center;
    align-self: start;
    aspect-ratio: 1;
    background: var(--dzw-soft);
    border-radius: .35rem;
    display: flex;
    justify-content: center;
    padding: .75rem;
}

.dzw-roof-form-media img {
    display: block;
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
}

.dzw-roof-form-card h3 {
    color: var(--dzw-charcoal);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: .25rem;
}

.dzw-roof-form-card p {
    color: #45515c;
    line-height: 1.62;
    margin-bottom: 0;
}

.dzw-roof-form-details {
    color: #45515c;
    line-height: 1.62;
}

.dzw-roof-form-details p {
    margin-top: .35rem;
}

.dzw-roof-form-details summary {
    align-items: baseline;
    color: #555;
    cursor: pointer;
    display: flex;
    font-weight: 700;
    gap: .35rem;
    list-style: none;
    margin-top: .35rem;
    min-width: 0;
}

.dzw-roof-form-details summary::-webkit-details-marker {
    display: none;
}

.dzw-roof-form-teaser {
    color: #45515c;
    display: block;
    flex: 1 1 auto;
    font-weight: 400;
    mask-image: linear-gradient(90deg, #000 0%, #000 62%, transparent 100%);
    min-width: 0;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
}

.dzw-roof-form-more,
.dzw-roof-form-less {
    flex: 0 0 auto;
}

.dzw-roof-form-less {
    display: none;
}

.dzw-roof-form-details[open] summary {
    margin-bottom: .35rem;
}

.dzw-roof-form-details[open] .dzw-roof-form-teaser,
.dzw-roof-form-details[open] .dzw-roof-form-more {
    display: none;
}

.dzw-roof-form-details[open] .dzw-roof-form-less {
    display: inline;
}

.dzw-roof-source {
    color: var(--bs-secondary-color) !important;
    font-size: .82rem;
    margin-bottom: .65rem !important;
}

.dzw-roof-pitch-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(10rem, 100%), 1fr));
}

.dzw-roof-pitch-card {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    margin: 0;
    padding: 1rem;
    text-align: center;
}

.dzw-roof-pitch-card img {
    display: block;
    height: 7rem;
    margin-inline: auto;
    object-fit: contain;
    width: 100%;
}

.dzw-roof-pitch-card figcaption {
    color: var(--dzw-charcoal);
    font-weight: 700;
    margin-top: .85rem;
}

.dzw-roof-table-wrap {
    border: 1px solid rgba(220, 227, 232, .9);
    border-radius: var(--dzw-element-radius);
    overflow-x: auto;
}

.dzw-roof-table {
    border-collapse: collapse;
    font-size: .98rem;
    min-width: 42rem;
    width: 100%;
}

.dzw-roof-table th {
    background: #fff;
    border-bottom: 2px solid rgba(0, 77, 124, .55);
    color: var(--dzw-charcoal);
    font-weight: 700;
    padding: .75rem 1rem;
    text-align: right;
}

.dzw-roof-table td {
    color: #37424c;
    padding: .55rem 1rem;
    text-align: right;
}

.dzw-roof-table th:nth-child(2n),
.dzw-roof-table td:nth-child(2n) {
    border-right: 1px solid rgba(0, 77, 124, .28);
}

.dzw-roof-table th:last-child,
.dzw-roof-table td:last-child {
    border-right: 0;
}

.dzw-roof-table tbody tr:nth-child(odd) td {
    background: rgba(0, 104, 168, .06);
}

.dzw-catalogue-hero {
    padding-block: clamp(2.75rem, 5vw, 4.5rem);
}

.dzw-body-scroll-lock {
    overflow: hidden;
}

.dzw-catalogue-panel,
.dzw-catalogue-card,
.dzw-catalogue-filter-side {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
}

.dzw-catalogue-panel {
    padding: clamp(1.15rem, 2.4vw, 1.75rem);
}

.dzw-catalogue-shell {
    display: grid;
    gap: clamp(1rem, 2vw, 1.75rem);
    grid-template-columns: minmax(0, 18rem) minmax(0, 1fr);
    padding-block: clamp(1.25rem, 3vw, 2.5rem);
    padding-inline: clamp(1rem, 3vw, 2.5rem);
    align-items: start;
}

.dzw-catalogue-filter-trigger {
    display: none;
}

.dzw-catalogue-filter-side {
    align-self: start;
    border-color: rgba(220, 227, 232, .52);
    display: flex;
    flex-direction: column;
    box-shadow: 0 .45rem 1rem rgba(21, 23, 25, .032);
    max-height: calc(100vh - var(--dzw-site-header-height) - 2rem);
    overflow: hidden;
    padding: 0;
    position: sticky;
    top: 1rem;
    z-index: 60;
}

.dzw-catalogue-filter-side::after {
    display: none;
}

.dzw-catalogue-filter-side-head {
    align-items: center;
    background: #fff;
    border-bottom: 0;
    display: flex;
    flex-shrink: 0;
    justify-content: space-between;
    padding: clamp(.85rem, 1.4vw, 1.1rem) clamp(1rem, 1.8vw, 1.4rem);
}

.dzw-catalogue-filter-head-actions {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
    margin-left: auto;
    min-height: 2.5rem;
}

.dzw-catalogue-filter-close,
.dzw-catalogue-filter-reset-icon {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: .35rem;
    color: var(--dzw-charcoal);
    cursor: pointer;
    display: none;
    font-size: 1.35rem;
    height: 2.5rem;
    justify-content: center;
    line-height: 1;
    padding: 0;
    transition: background-color .2s ease;
    width: 2.5rem;
}

.dzw-catalogue-filter-reset-icon {
    color: var(--dzw-blue-dark);
    display: inline-flex;
    font-size: 1.1rem;
    text-decoration: none;
}

.dzw-catalogue-filter-close:hover,
.dzw-catalogue-filter-close:focus-visible,
.dzw-catalogue-filter-reset-icon:hover,
.dzw-catalogue-filter-reset-icon:focus-visible {
    background: rgba(0, 104, 168, .08);
}

.dzw-catalogue-filter-form {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}

.dzw-catalogue-filter-scroll {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: .85rem;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: clamp(1rem, 1.8vw, 1.4rem);
}

.dzw-catalogue-filter-section {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.dzw-catalogue-filter-divider {
    border-top: 1px solid rgba(220, 227, 232, .78);
    margin-block: .5rem;
}

.dzw-catalogue-filter-advanced {
    border-top: 1px solid rgba(220, 227, 232, .78);
    padding-top: .85rem;
}

.dzw-catalogue-filter-advanced > summary {
    align-items: center;
    color: var(--dzw-blue-dark);
    cursor: pointer;
    display: flex;
    font-weight: 800;
    gap: .5rem;
    justify-content: space-between;
    list-style: none;
    padding-block: .25rem;
}

.dzw-catalogue-filter-advanced > summary::-webkit-details-marker {
    display: none;
}

.dzw-catalogue-filter-advanced-icon {
    transition: transform .2s ease;
}

.dzw-catalogue-filter-advanced[open] .dzw-catalogue-filter-advanced-icon {
    transform: rotate(180deg);
}

.dzw-catalogue-filter-advanced-body {
    display: flex;
    flex-direction: column;
    gap: .85rem;
    padding-top: .85rem;
}

.dzw-catalogue-filter-grouplabel {
    color: var(--dzw-blue-dark);
    font-size: .85rem;
    font-weight: 800;
    margin-bottom: .35rem;
}

.dzw-catalogue-filter-icon {
    color: var(--dzw-blue);
    display: inline-block;
    margin-right: .45rem;
    width: 1em;
}

.dzw-catalogue-filter-numbers {
    display: grid;
    gap: .65rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dzw-catalogue-filter-numbers > div {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.dzw-catalogue-filter-numbers .form-label {
    align-items: flex-start;
    column-gap: .45rem;
    display: grid;
    grid-template-columns: 1em minmax(0, 1fr);
    line-height: 1.25;
    min-height: 2.5rem;
}

.dzw-catalogue-filter-numbers .form-label .dzw-catalogue-filter-icon {
    margin-right: 0;
}

.dzw-catalogue-filter-footer {
    background: #fff;
    border-top: 0;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: .65rem;
    padding: clamp(.85rem, 1.4vw, 1.1rem) clamp(1rem, 1.8vw, 1.4rem);
}

.dzw-catalogue-filter-form[data-catalogue-filter-form-ready="true"]:not(.has-pending-manual-inputs) .dzw-catalogue-filter-footer {
    display: none;
}

.dzw-catalogue-filter-footer .btn {
    justify-content: center;
}

.dzw-catalogue-filter-backdrop {
    display: none;
}

.dzw-catalogue-results-frame {
    display: block;
    min-width: 0;
}

.dzw-catalogue-checkbox {
    align-items: center;
    display: inline-flex;
    gap: .65rem;
    font-weight: 750;
    line-height: 1.35;
}

.dzw-catalogue-checkbox input {
    accent-color: var(--dzw-blue);
    border: 1px solid var(--dzw-line);
    flex-shrink: 0;
    height: 1.15rem;
    width: 1.15rem;
}

.dzw-catalogue-results {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    position: relative;
}

.dzw-sticky-sentinel {
    display: block;
    height: 1px;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 1px;
}

.dzw-catalogue-results-header {
    align-items: end;
    background: transparent;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.5rem;
    justify-content: space-between;
    margin-left: -1.65rem;
    margin-right: -1rem;
    padding: 1rem 1rem 1.15rem 1.65rem;
    position: sticky;
    top: 0;
    z-index: 40;
}

.dzw-catalogue-results-header::before {
    background: transparent;
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    transition: background-color .18s ease;
    z-index: -1;
}

.dzw-catalogue-results-header::after {
    border-bottom: 1px solid rgba(220, 227, 232, .46);
    bottom: 0;
    box-shadow: 0 .25rem .65rem rgba(21, 23, 25, .032);
    content: "";
    height: 1px;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    transition: opacity .18s ease;
}

.dzw-catalogue-results-header.is-stuck {
    -webkit-backdrop-filter: blur(18px) saturate(1.08);
    backdrop-filter: blur(18px) saturate(1.08);
    background: rgba(255, 255, 255, .68);
}

.dzw-catalogue-results-header.is-stuck::before {
    background: rgba(255, 255, 255, .68);
}

.dzw-catalogue-results-header.is-stuck::after {
    opacity: 1;
}

.dzw-catalogue-sort {
    align-items: center;
    display: inline-flex;
    gap: .5rem;
}

.dzw-catalogue-sort .form-select {
    min-width: 12rem;
}

.dzw-catalogue-result-grid {
    align-items: stretch;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(min(26rem, 100%), 1fr));
}

@media (min-width: 992px) {
    .dzw-catalogue-results {
        margin-left: calc(-1 * clamp(1rem, 2vw, 1.75rem));
        padding-left: clamp(1rem, 2vw, 1.75rem);
    }

    .dzw-catalogue-results::before {
        background: rgba(220, 227, 232, .58);
        bottom: 0;
        content: "";
        pointer-events: none;
        position: absolute;
        left: 0;
        top: 5.35rem;
        width: 1px;
    }

    .dzw-catalogue-filter-side {
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        max-height: calc(100vh - var(--dzw-site-header-height) - 2rem);
        overflow: visible;
        position: sticky;
    }

    .dzw-catalogue-filter-side::after {
        display: none;
    }

    .dzw-catalogue-filter-side-head,
    .dzw-catalogue-filter-footer {
        background: transparent;
    }

    .dzw-catalogue-filter-form {
        max-height: calc(100vh - var(--dzw-site-header-height) - 2rem - 3.8rem);
        overflow: visible;
    }

    .dzw-catalogue-filter-scroll {
        overflow-y: auto;
        padding-right: calc(clamp(1rem, 1.8vw, 1.4rem) + .25rem);
    }

    .dzw-catalogue-results-header {
        margin-left: calc(-1 * clamp(1rem, 2vw, 1.75rem));
        margin-right: calc(-1 * clamp(1rem, 3vw, 2.5rem));
        padding-left: calc(clamp(1rem, 2vw, 1.75rem) + 1.65rem);
        padding-right: calc(clamp(1rem, 3vw, 2.5rem) + 1rem);
    }
}

@media (min-width: 1200px) and (max-width: 1699.98px) {
    .dzw-catalogue-result-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1700px) {
    .dzw-catalogue-result-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.dzw-catalogue-often-searched {
    display: grid;
    gap: 1rem;
    padding-bottom: .65rem;
}

.dzw-catalogue-often-searched-head {
    align-items: end;
    display: flex;
    justify-content: space-between;
}

.dzw-catalogue-more-heading {
    padding-top: .75rem;
}

.dzw-catalogue-card-wrap {
    display: flex;
    min-height: 0;
    position: relative;
}

.dzw-catalogue-results-frame[busy] .dzw-catalogue-card-wrap,
.dzw-catalogue-results-frame[aria-busy="true"] .dzw-catalogue-card-wrap {
    pointer-events: none;
}

.dzw-catalogue-results-frame[busy] .dzw-catalogue-card-wrap::after,
.dzw-catalogue-results-frame[aria-busy="true"] .dzw-catalogue-card-wrap::after {
    background: rgba(255, 255, 255, .68);
    border-radius: var(--dzw-element-radius);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 20;
}

.dzw-catalogue-card {
    color: inherit;
    display: grid;
    grid-template-columns: minmax(8.5rem, .42fr) minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    width: 100%;
}

.dzw-catalogue-card-wrap:hover .dzw-catalogue-card,
.dzw-catalogue-card:hover,
.dzw-catalogue-card:focus-visible {
    border-color: rgba(0, 104, 168, .22);
    box-shadow: var(--dzw-shadow-md);
    color: inherit;
    transform: translateY(-4px) scale(1.01);
}

.dzw-catalogue-card:focus-visible {
    outline: 2px solid var(--dzw-blue);
    outline-offset: 2px;
}

.dzw-favorite-button {
    align-items: center;
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(93, 104, 114, .34);
    border-radius: 999px;
    color: #6f7983;
    display: inline-flex;
    filter: none;
    font-size: 1.35rem;
    height: 2.25rem;
    justify-content: center;
    padding: 0;
    transition: color .18s ease, filter .18s ease, opacity .18s ease, transform .18s ease;
    width: 2.25rem;
    z-index: 4;
}

.dzw-favorite-button:hover,
.dzw-favorite-button:focus-visible {
    background: #fff;
    border-color: rgba(0, 104, 168, .28);
    color: var(--dzw-charcoal);
    filter: drop-shadow(0 .35rem .38rem rgba(21, 23, 25, .34)) drop-shadow(0 0 .22rem rgba(255, 255, 255, .94));
    transform: translateY(-1px);
}

.dzw-favorite-button:focus-visible {
    outline: 2px solid var(--dzw-blue);
    outline-offset: 2px;
}

.dzw-favorite-button.is-favorite {
    background: #fff9ed;
    border-color: rgba(194, 138, 53, .55);
    color: var(--dzw-favorite);
}

.dzw-favorite-button.is-favorite:hover,
.dzw-favorite-button.is-favorite:focus-visible {
    color: var(--dzw-favorite-dark);
}

.dzw-favorite-button.is-busy {
    opacity: .72;
}

.dzw-favorite-button--card {
    left: .75rem;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: .75rem;
}

.dzw-catalogue-card-wrap:hover .dzw-favorite-button--card,
.dzw-catalogue-card-wrap:focus-within .dzw-favorite-button--card,
.dzw-favorite-button--card.is-favorite {
    opacity: 1;
    pointer-events: auto;
}

.dzw-catalogue-detail-favorite {
    align-items: center;
    display: flex;
    margin-bottom: .85rem;
}

.dzw-favorite-button--detail {
    font-size: 1.45rem;
    height: 2.45rem;
    width: 2.45rem;
}

.dzw-catalogue-card-chips {
    --chip-fade-left: 0;
    --chip-fade-right: 1;
    --chip-marquee-duration: 6s;
    container-type: inline-size;
    margin-bottom: .6rem;
    mask-image: linear-gradient(to right,
        rgba(0, 0, 0, calc(1 - var(--chip-fade-left))) 0,
        #000 1rem,
        #000 calc(100% - 1rem),
        rgba(0, 0, 0, calc(1 - var(--chip-fade-right))) 100%);
    -webkit-mask-image: linear-gradient(to right,
        rgba(0, 0, 0, calc(1 - var(--chip-fade-left))) 0,
        #000 1rem,
        #000 calc(100% - 1rem),
        rgba(0, 0, 0, calc(1 - var(--chip-fade-right))) 100%);
    overflow: hidden;
    width: 100%;
}

.dzw-catalogue-card-chips-track {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: .4rem;
    transform: translateX(0);
    width: max-content;
    will-change: transform;
}

.dzw-catalogue-card-chips-track > .dzw-filter-chip {
    flex-shrink: 0;
    white-space: nowrap;
}

.dzw-catalogue-card-wrap:hover .dzw-catalogue-card-chips,
.dzw-catalogue-card:hover .dzw-catalogue-card-chips,
.dzw-catalogue-card:focus-visible .dzw-catalogue-card-chips {
    animation: dzw-chip-fades var(--chip-marquee-duration) linear 0s 1 forwards;
}

.dzw-catalogue-card-wrap:hover .dzw-catalogue-card-chips-track,
.dzw-catalogue-card:hover .dzw-catalogue-card-chips-track,
.dzw-catalogue-card:focus-visible .dzw-catalogue-card-chips-track {
    animation: dzw-chip-marquee var(--chip-marquee-duration) linear 0s 1 forwards;
}

@keyframes dzw-chip-marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(min(0px, calc(100cqw - 100%))); }
}

@keyframes dzw-chip-fades {
    0% { --chip-fade-left: 0; --chip-fade-right: 1; }
    1% { --chip-fade-left: 1; --chip-fade-right: 1; }
    99% { --chip-fade-left: 1; --chip-fade-right: 1; }
    100% { --chip-fade-left: 1; --chip-fade-right: 0; }
}

.dzw-catalogue-card-title {
    align-items: center;
    color: var(--dzw-charcoal);
    display: flex;
    flex-wrap: wrap;
    font-size: 1.1rem;
    font-weight: 800;
    gap: .45rem;
    margin-bottom: .25rem;
}

.dzw-catalogue-card-title-text {
    min-width: 0;
}

.dzw-catalogue-status-flag {
    align-items: center;
    background: #f3f4f6;
    border: 1px solid rgba(93, 104, 114, .28);
    border-radius: 999px;
    color: #4c5560;
    display: inline-flex;
    font-size: .9rem;
    font-weight: 850;
    gap: .4rem;
    line-height: 1;
    padding: .58rem .82rem;
    width: fit-content;
}

.dzw-catalogue-status-flag i {
    color: #6a737d;
    font-size: 1rem;
}

.dzw-catalogue-status-flag--compact {
    font-size: .78rem;
    margin-bottom: .45rem;
    padding: .45rem .65rem;
}

.dzw-flag {
    border-radius: .15rem;
    box-shadow: 0 0 0 1px rgba(21, 23, 25, .12);
    display: inline-block;
    flex-shrink: 0;
    object-fit: cover;
}

.dzw-flag-sm {
    height: .9rem;
    width: 1.3rem;
}

.dzw-flag-md {
    height: 1.1rem;
    width: 1.6rem;
}

.dzw-catalogue-card-sub {
    color: var(--bs-secondary-color);
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: .75rem;
}

.dzw-catalogue-mini-label {
    color: var(--bs-secondary-color);
    display: block;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .04em;
    margin-bottom: .15rem;
}

.dzw-catalogue-mini-value {
    color: var(--dzw-charcoal);
    display: block;
    font-weight: 750;
}

.dzw-catalogue-card-media,
.dzw-catalogue-detail-media,
.dzw-catalogue-variant-media {
    align-items: center;
    background: rgba(246, 248, 250, .86);
    display: flex;
    justify-content: center;
}

.dzw-catalogue-card-media {
    height: 100%;
    min-height: 0;
    overflow: hidden;
    position: relative;
}

.dzw-catalogue-detail-media,
.dzw-catalogue-variant-media,
.dzw-catalogue-relation-card-media {
    position: relative;
}

.dzw-catalogue-card-media img {
    bottom: 1rem;
    display: block;
    height: 100%;
    left: 1rem;
    margin: auto;
    max-height: calc(100% - 2rem);
    max-width: calc(100% - 2rem);
    object-fit: contain;
    position: absolute;
    right: 1rem;
    top: 1rem;
    transition: opacity .26s ease;
    width: 100%;
}

.dzw-catalogue-card-media img.is-crossfade-out {
    opacity: 0;
}

.dzw-catalogue-variant-media img {
    bottom: .35rem;
    left: .35rem;
    margin: auto;
    max-height: calc(100% - .7rem);
    max-width: calc(100% - .7rem);
    position: absolute;
    right: .35rem;
    top: .35rem;
    transition: opacity .26s ease;
}

.dzw-catalogue-variant-media img.is-crossfade-out {
    opacity: 0;
}

.dzw-catalogue-card-media img.dzw-catalogue-card-media-next {
    opacity: 0;
    pointer-events: none;
    z-index: 1;
}

.dzw-catalogue-variant-media img.dzw-catalogue-card-media-next {
    opacity: 0;
    pointer-events: none;
    z-index: 1;
}

.dzw-catalogue-card-media img.dzw-catalogue-card-media-next.is-crossfade-in {
    opacity: 1;
}

.dzw-catalogue-variant-media img.dzw-catalogue-card-media-next.is-crossfade-in {
    opacity: 1;
}

.dzw-catalogue-detail-media img,
.dzw-catalogue-variant-media img {
    display: block;
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.dzw-catalogue-card-placeholder {
    align-items: center;
    color: rgba(0, 77, 124, .38);
    display: flex;
    font-size: 3rem;
    inset: 1rem;
    justify-content: center;
    position: absolute;
}

.dzw-catalogue-variant-media .dzw-catalogue-card-placeholder {
    inset: .35rem;
}

.dzw-rooftile-placeholder-svg {
    display: block;
    height: 60%;
    max-height: 5rem;
    min-width: 2.5rem;
    width: auto;
}

.dzw-catalogue-variant-media .dzw-rooftile-placeholder-svg {
    height: 90%;
    max-height: 6.5rem;
}

.dzw-catalogue-card-media .dzw-rooftile-placeholder-svg {
    height: 80%;
    max-height: 8.5rem;
}

.dzw-catalogue-detail-media .dzw-rooftile-placeholder-svg {
    height: 80%;
    max-height: 17rem;
}

.dzw-catalogue-card-body {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    padding: clamp(1rem, 2vw, 1.35rem);
}

.dzw-catalogue-back-link {
    color: var(--dzw-charcoal);
    text-decoration: none;
}

.dzw-catalogue-back-link {
    align-items: center;
    display: inline-flex;
    font-size: 1.05rem;
    font-weight: 700;
    gap: .5rem;
}

.dzw-catalogue-back-link:hover {
    color: var(--dzw-blue-dark);
}

.dzw-catalogue-data-grid {
    display: grid;
    gap: .75rem;
    margin: 0;
}

.dzw-catalogue-mini-data {
    display: grid;
    gap: .5rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 .5rem;
}

.dzw-catalogue-mini-data > span {
    background: rgba(245, 247, 249, .72);
    border-radius: .35rem;
    display: flex;
    flex-direction: column;
    gap: .2rem;
    justify-content: flex-start;
    min-height: 3.4rem;
    padding: .5rem .6rem;
}

.dzw-catalogue-mini-data .dzw-catalogue-mini-value {
    font-size: .9rem;
    line-height: 1.2;
    word-break: break-word;
}

.dzw-catalogue-data-grid div {
    background: rgba(245, 247, 249, .72);
    border-radius: .35rem;
    padding: .75rem;
}

.dzw-catalogue-data-grid dt {
    color: var(--bs-secondary-color);
    font-size: .75rem;
    font-weight: 800;
    margin-bottom: .2rem;
    text-transform: uppercase;
}

.dzw-catalogue-data-grid dd {
    color: var(--dzw-charcoal);
    font-weight: 750;
    margin-bottom: 0;
}

.dzw-catalogue-measurement-list {
    display: grid;
    gap: .18rem;
}

.dzw-catalogue-warning,
.dzw-catalogue-state-warning {
    color: #9f4527;
    display: inline-flex;
    font-weight: 800;
    gap: .35rem;
    margin-top: .25rem;
}

.dzw-catalogue-empty {
    align-items: center;
    background: transparent;
    border: 0;
    box-shadow: none;
    color: var(--bs-secondary-color);
    display: flex;
    flex-direction: column;
    gap: .65rem;
    justify-content: center;
    min-height: clamp(14rem, 28vw, 20rem);
    padding: clamp(2.75rem, 7vw, 4.75rem) 1rem;
    text-align: center;
}

.dzw-catalogue-empty i {
    color: rgba(0, 77, 124, .48);
    font-size: clamp(2.25rem, 5vw, 3.25rem);
    line-height: 1;
}

.dzw-catalogue-empty h2 {
    color: var(--dzw-charcoal);
    margin: 0;
}

.dzw-catalogue-empty p {
    max-width: 32rem;
}

.dzw-catalogue-pagination {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: center;
    margin-top: 1.5rem;
}

.dzw-catalogue-pagination-pages {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.dzw-catalogue-pagination-step,
.dzw-catalogue-pagination-page,
.dzw-catalogue-pagination-current {
    align-items: center;
    border: 1px solid transparent;
    border-radius: .35rem;
    color: var(--dzw-charcoal);
    display: inline-flex;
    font-weight: 700;
    gap: .35rem;
    justify-content: center;
    min-height: 2.25rem;
    min-width: 2.25rem;
    padding-inline: .75rem;
    text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.dzw-catalogue-pagination-step {
    color: var(--bs-secondary-color);
}

.dzw-catalogue-pagination-step:hover,
.dzw-catalogue-pagination-page:hover {
    background: rgba(0, 104, 168, .08);
    color: var(--dzw-blue-dark);
}

.dzw-catalogue-pagination-step.is-disabled {
    color: rgba(33, 38, 49, .35);
    cursor: not-allowed;
    pointer-events: none;
}

.dzw-catalogue-pagination-current {
    background: #fff;
    border-color: var(--dzw-charcoal);
    color: var(--dzw-charcoal);
}

.dzw-catalogue-pagination-ellipsis {
    color: rgba(33, 38, 49, .55);
    min-width: 1.75rem;
    text-align: center;
}

.dzw-feedback-prompt {
    inset-block-end: 1rem;
    inset-inline: 1rem;
    pointer-events: none;
    position: fixed;
    transform: translateY(calc(100% + 2rem));
    transition: transform .22s ease;
    z-index: 1090;
}

.dzw-feedback-prompt.is-visible {
    transform: translateY(0);
}

.dzw-feedback-prompt-panel {
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(220, 227, 232, .94);
    border-radius: var(--dzw-element-radius);
    box-shadow: 0 1rem 2.6rem rgba(21, 23, 25, .16);
    margin-inline: auto;
    max-inline-size: 56rem;
    padding: 1rem;
    pointer-events: auto;
}

.dzw-feedback-prompt-close {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 50%;
    color: var(--bs-secondary-color);
    display: inline-flex;
    float: right;
    block-size: 2rem;
    inline-size: 2rem;
    justify-content: center;
    margin-block-start: -.25rem;
    margin-inline-end: -.25rem;
    transition: background-color .2s ease, color .2s ease;
}

.dzw-feedback-prompt-close:hover,
.dzw-feedback-prompt-close:focus-visible {
    background: var(--dzw-blue-soft);
    color: var(--dzw-blue-dark);
}

.dzw-feedback-prompt-body {
    display: grid;
    gap: 1rem;
}

.dzw-feedback-prompt-copy {
    padding-inline-end: 2.25rem;
}

.dzw-feedback-prompt-copy h2 {
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 0;
}

.dzw-feedback-prompt-options {
    display: grid;
    gap: .55rem;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
}

.dzw-feedback-prompt-options--compact {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
}

.dzw-feedback-prompt-option {
    align-items: center;
    background: var(--dzw-soft);
    border: 1px solid var(--dzw-line);
    border-radius: var(--dzw-radius);
    color: var(--dzw-charcoal);
    display: inline-flex;
    font-weight: 700;
    gap: .45rem;
    justify-content: center;
    min-block-size: 2.75rem;
    padding: .55rem .7rem;
    text-align: center;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.dzw-feedback-prompt-option:hover,
.dzw-feedback-prompt-option:focus-visible {
    background: var(--dzw-blue-soft);
    border-color: rgba(0, 104, 168, .45);
    color: var(--dzw-blue-dark);
    transform: translateY(-1px);
}

.dzw-feedback-prompt-option:disabled,
.dzw-feedback-prompt-close:disabled,
.dzw-feedback-prompt-back:disabled {
    cursor: wait;
    opacity: .62;
}

.dzw-feedback-prompt-back {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--dzw-blue-dark);
    display: inline-flex;
    font-weight: 700;
    gap: .35rem;
    justify-self: start;
    padding: 0;
}

.dzw-feedback-prompt-state {
    align-items: center;
    color: var(--dzw-blue-dark);
    display: flex;
    font-weight: 700;
    gap: .65rem;
    min-block-size: 4.25rem;
    padding-inline-end: 2.25rem;
}

.dzw-feedback-prompt-state i {
    color: #26865a;
    font-size: 1.4rem;
}

.dzw-feedback-prompt-state p {
    margin: 0;
}

.dzw-feedback-prompt-state--error {
    color: #9f3412;
    margin-block-start: .75rem;
    min-block-size: auto;
}

.dzw-feedback-prompt-state--error i {
    color: #b9532f;
}

.dzw-catalogue-detail-hero,
.dzw-catalogue-detail-layout {
    display: grid;
    gap: clamp(1.25rem, 3vw, 2rem);
}

.dzw-catalogue-detail-hero {
    align-items: center;
    grid-template-columns: minmax(0, 1fr) minmax(0, .42fr);
}

.dzw-catalogue-detail-media {
    aspect-ratio: 4 / 3;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    justify-self: end;
    max-height: 22rem;
    max-width: 28rem;
    overflow: hidden;
    width: 100%;
}

.dzw-manufacturer-logo-media {
    background: #fff;
    padding: clamp(2rem, 4vw, 3.125rem);
}

.dzw-manufacturer-logo-media img {
    height: auto;
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
    width: auto;
}

.dzw-catalogue-detail-layout {
    align-items: start;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, .36fr);
}

.dzw-manufacturer-facts-panel {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1rem;
}

.dzw-manufacturer-facts-row {
    align-items: start;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1fr) auto;
}

.dzw-manufacturer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: flex-end;
}

.dzw-manufacturer-models-panel {
    display: grid;
    gap: 1rem;
}

.dzw-manufacturer-models-panel--limited {
    box-shadow: none;
}

.dzw-manufacturer-models-heading,
.dzw-manufacturer-search-cta {
    align-items: center;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
}

.dzw-manufacturer-models-heading h2 {
    margin-bottom: .2rem;
}

.dzw-manufacturer-models-heading p {
    color: var(--bs-secondary-color);
    margin: 0;
}

.dzw-manufacturer-preview {
    position: relative;
}

.dzw-manufacturer-models-panel--limited .dzw-manufacturer-preview::after {
    background:
        linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 78%),
        linear-gradient(to bottom, rgba(0, 77, 124, 0), rgba(0, 77, 124, .08));
    border-radius: 0 0 var(--dzw-element-radius) var(--dzw-element-radius);
    bottom: 0;
    content: "";
    height: min(9rem, 34%);
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
}

.dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+6) {
    display: none;
}

.dzw-manufacturer-search-cta {
    background:
        linear-gradient(135deg, rgba(237, 247, 252, .98), rgba(255, 255, 255, .96)),
        #fff;
    border: 1px solid rgba(0, 104, 168, .14);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    padding: clamp(1rem, 2vw, 1.25rem);
}

.dzw-manufacturer-search-cta strong,
.dzw-manufacturer-search-cta span {
    display: block;
}

.dzw-manufacturer-search-cta strong {
    color: var(--dzw-charcoal);
    font-weight: 800;
    margin-bottom: .2rem;
}

.dzw-manufacturer-search-cta span {
    color: var(--bs-secondary-color);
}

.dzw-manufacturer-result-grid {
    grid-template-columns: repeat(auto-fill, minmax(min(34rem, 100%), 1fr));
}

@media (max-width: 1199.98px) {
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(5) .dzw-catalogue-card {
        border-color: rgba(220, 227, 232, .18);
        box-shadow: none;
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(5):hover .dzw-catalogue-card,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(5) .dzw-catalogue-card:hover,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(5) .dzw-catalogue-card:focus-visible {
        border-color: rgba(220, 227, 232, .18);
        box-shadow: none;
        transform: none;
    }
}

@media (min-width: 1200px) and (max-width: 1699.98px) {
    .dzw-manufacturer-result-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+6) {
        display: flex;
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+11) {
        display: none;
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10) .dzw-catalogue-card {
        border-color: rgba(220, 227, 232, .18);
        box-shadow: none;
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10):hover .dzw-catalogue-card,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10) .dzw-catalogue-card:hover,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10) .dzw-catalogue-card:focus-visible {
        border-color: rgba(220, 227, 232, .18);
        box-shadow: none;
        transform: none;
    }
}

@media (min-width: 1700px) {
    .dzw-manufacturer-result-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+6) {
        display: flex;
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+11) {
        display: flex;
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10) .dzw-catalogue-card {
        border-color: rgba(220, 227, 232, .78);
        box-shadow: var(--dzw-shadow-sm);
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10):hover .dzw-catalogue-card,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10) .dzw-catalogue-card:hover,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+9):nth-child(-n+10) .dzw-catalogue-card:focus-visible {
        border-color: rgba(0, 104, 168, .22);
        box-shadow: var(--dzw-shadow-md);
        transform: translateY(-4px) scale(1.01);
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+13):nth-child(-n+15) .dzw-catalogue-card {
        border-color: rgba(220, 227, 232, .18);
        box-shadow: none;
    }

    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+13):nth-child(-n+15):hover .dzw-catalogue-card,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+13):nth-child(-n+15) .dzw-catalogue-card:hover,
    .dzw-manufacturer-models-panel--limited .dzw-manufacturer-result-grid > :nth-child(n+13):nth-child(-n+15) .dzw-catalogue-card:focus-visible {
        border-color: rgba(220, 227, 232, .18);
        box-shadow: none;
        transform: none;
    }
}

@media (max-width: 767.98px) {
    .dzw-manufacturer-facts-row {
        grid-template-columns: 1fr;
    }

    .dzw-manufacturer-actions {
        justify-content: stretch;
    }

    .dzw-manufacturer-actions .btn {
        width: 100%;
    }

    .dzw-manufacturer-models-heading,
    .dzw-manufacturer-search-cta {
        grid-template-columns: 1fr;
    }

    .dzw-manufacturer-models-heading .btn,
    .dzw-manufacturer-search-cta .btn {
        width: 100%;
    }
}

.dzw-catalogue-producer-card {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.dzw-catalogue-producer-card-body {
    align-items: center;
    display: grid;
    gap: 1rem;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    padding: 1rem;
}

.dzw-catalogue-producer-card-body--no-logo {
    grid-template-columns: minmax(0, 1fr);
}

.dzw-catalogue-producer-card-logo {
    display: block;
    height: auto;
    max-height: 4rem;
    object-fit: contain;
    width: 100%;
}

.dzw-catalogue-producer-card-meta {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.dzw-catalogue-producer-card-name {
    color: var(--dzw-charcoal);
    font-weight: 800;
    line-height: 1.2;
}

.dzw-catalogue-producer-card-actions {
    background: rgba(220, 227, 232, .78);
    border-top: 1px solid rgba(220, 227, 232, .78);
    display: grid;
    gap: 1px;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
}

.dzw-catalogue-producer-card-action {
    align-items: center;
    background: #fff;
    color: var(--dzw-blue-dark);
    display: inline-flex;
    font-size: .9rem;
    font-weight: 700;
    gap: .4rem;
    justify-content: center;
    min-width: 0;
    padding: .85rem 1rem;
    text-align: center;
    text-decoration: none;
    transition: background-color .2s ease, color .2s ease;
    white-space: nowrap;
}

.dzw-catalogue-producer-card-action:hover,
.dzw-catalogue-producer-card-action:focus-visible {
    background: rgba(0, 104, 168, .08);
    color: var(--dzw-blue-dark);
}

.dzw-catalogue-producer-card-action.is-disabled {
    color: rgba(33, 38, 49, .45);
    cursor: not-allowed;
}

.dzw-catalogue-producer-card-action.is-disabled:hover,
.dzw-catalogue-producer-card-action.is-disabled:focus-visible {
    background: #fff;
    color: rgba(33, 38, 49, .45);
}

.dzw-catalogue-detail-meta {
    align-items: center;
    color: var(--bs-secondary-color);
    display: inline-flex;
    font-size: .85rem;
    gap: .4rem;
    margin: 0;
}

.dzw-catalogue-detail-main,
.dzw-catalogue-detail-side,
.dzw-catalogue-variant-grid {
    display: grid;
    gap: 1rem;
}

.dzw-catalogue-panel h2,
.dzw-catalogue-modellwechsel h2 {
    color: var(--dzw-charcoal);
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: 1rem;
}

.dzw-catalogue-data-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr));
}

.dzw-catalogue-variant-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr));
}

.dzw-catalogue-variant-card {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: .35rem;
    display: grid;
    gap: .9rem;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    padding: .85rem;
    transition: box-shadow .2s ease, transform .2s ease;
}

.dzw-catalogue-variant-card:hover,
.dzw-catalogue-variant-card:focus-within {
    box-shadow: var(--dzw-shadow-md);
    transform: translateY(-4px) scale(1.01);
}

.dzw-catalogue-variant-card--clickable {
    cursor: zoom-in;
}

.dzw-catalogue-variant-card--clickable:focus-visible {
    box-shadow: 0 0 0 .15rem rgba(0, 104, 168, .24), var(--dzw-shadow-md);
    outline: 2px solid var(--dzw-blue);
    outline-offset: 2px;
}

.dzw-catalogue-variant-media {
    aspect-ratio: 1;
    border-radius: .35rem;
    overflow: hidden;
}

.dzw-catalogue-variant-image-count {
    align-items: center;
    background: rgba(0, 41, 66, .74);
    border-radius: 999px;
    bottom: .5rem;
    color: #fff;
    display: inline-flex;
    font-size: .8rem;
    font-weight: 800;
    gap: .3rem;
    line-height: 1;
    padding: .35rem .55rem;
    position: absolute;
    right: .5rem;
    z-index: 2;
}

.dzw-catalogue-variant-card h3 {
    color: var(--dzw-charcoal);
    font-size: 1rem;
    font-weight: 800;
    margin-bottom: .25rem;
}

.dzw-catalogue-state {
    border-radius: 999px;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 800;
    padding: .4rem .65rem;
}

.dzw-catalogue-state-ok {
    background: rgba(45, 125, 75, .1);
    color: #2d6f45;
}

.dzw-catalogue-state-neutral {
    background: #f3f4f6;
    color: #4c5560;
}

.dzw-catalogue-state-warning {
    background: #fff2cc;
    color: #795300;
}

.dzw-variant-lightbox {
    --bs-modal-bg: transparent;
    --bs-modal-border-width: 0;
    --bs-modal-box-shadow: none;
    background: rgba(10, 13, 16, .78);
    backdrop-filter: blur(3px);
}

.dzw-variant-lightbox .modal-dialog,
.dzw-variant-lightbox .modal-content {
    min-height: 100vh;
}

.dzw-variant-lightbox .modal-content {
    align-items: center;
    background: transparent;
    border: 0;
    display: flex;
    justify-content: center;
    padding: clamp(1rem, 3vw, 2rem);
}

.dzw-variant-lightbox-close,
.dzw-variant-lightbox-nav {
    align-items: center;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    justify-content: center;
    position: absolute;
    transition: background-color .18s ease, transform .18s ease;
    z-index: 2;
}

.dzw-variant-lightbox-close:hover,
.dzw-variant-lightbox-close:focus-visible,
.dzw-variant-lightbox-nav:hover,
.dzw-variant-lightbox-nav:focus-visible {
    background: rgba(255, 255, 255, .22);
    color: #fff;
    outline: 0;
    transform: translateY(-1px);
}

.dzw-variant-lightbox-close {
    font-size: 1.05rem;
    height: 2.75rem;
    right: clamp(1rem, 3vw, 2rem);
    top: clamp(1rem, 3vw, 2rem);
    width: 2.75rem;
}

.dzw-variant-lightbox-nav {
    font-size: 1.75rem;
    height: 3.25rem;
    top: 50%;
    transform: translateY(-50%);
    width: 3.25rem;
}

.dzw-variant-lightbox-nav:hover,
.dzw-variant-lightbox-nav:focus-visible {
    transform: translateY(calc(-50% - 1px));
}

.dzw-variant-lightbox-nav--prev {
    left: clamp(1rem, 3vw, 2rem);
}

.dzw-variant-lightbox-nav--next {
    right: clamp(1rem, 3vw, 2rem);
}

.dzw-variant-lightbox-figure {
    align-items: center;
    cursor: zoom-out;
    display: flex;
    flex-direction: column;
    gap: .85rem;
    justify-content: center;
    margin: 0;
    min-height: 100%;
    width: 100%;
}

.dzw-variant-lightbox-figure img {
    background: #fff;
    border-radius: .35rem;
    box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, .42);
    cursor: default;
    max-height: min(78vh, 54rem);
    max-width: min(86vw, 72rem);
    object-fit: contain;
}

.dzw-variant-lightbox-figure figcaption,
.dzw-variant-lightbox-counter {
    color: rgba(255, 255, 255, .86);
    font-weight: 800;
    text-align: center;
    text-shadow: 0 .15rem .55rem rgba(0, 0, 0, .42);
}

.dzw-variant-lightbox-counter {
    bottom: clamp(1rem, 3vw, 2rem);
    font-size: .85rem;
    position: absolute;
}

.dzw-catalogue-locked {
    align-items: flex-start;
    --dzw-locked-bg: rgb(235, 243, 248);
    background: var(--dzw-locked-bg);
    border: 1px solid rgba(0, 104, 168, .12);
    border-radius: .35rem;
    color: #37424c;
    display: flex;
    gap: .75rem;
    padding: .9rem;
}

.dzw-catalogue-locked-icon {
    color: var(--dzw-blue-dark);
    flex: 0 0 auto;
}

.dzw-catalogue-locked-content {
    flex: 1 1 auto;
    min-width: 0;
}

.dzw-catalogue-locked-content > span {
    color: var(--bs-secondary-color);
    display: block;
    font-size: .9rem;
    margin-top: .1rem;
}

.dzw-catalogue-locked-link {
    cursor: pointer;
    position: relative;
    text-decoration: none;
}

.dzw-catalogue-locked-link:hover,
.dzw-catalogue-locked-link:focus-visible {
    color: #37424c;
}

.dzw-catalogue-locked-link:focus-visible {
    outline: 2px solid rgba(0, 104, 168, .34);
    outline-offset: .2rem;
}

.dzw-catalogue-locked-action {
    align-items: center;
    background: linear-gradient(90deg, rgba(235, 243, 248, 0), var(--dzw-locked-bg) 48%);
    border-radius: 0 .35rem .35rem 0;
    bottom: 0;
    color: var(--dzw-blue-dark);
    display: flex;
    gap: .45rem;
    height: auto;
    justify-content: flex-end;
    font-size: 1.15rem;
    font-weight: 800;
    margin-top: 0;
    opacity: 0;
    padding: 0 .85rem 0 1.5rem;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: opacity .2s ease;
    width: 4.75rem;
}

.dzw-catalogue-locked-action span {
    color: var(--dzw-blue-dark);
    display: inline-flex;
    font-size: .82rem;
    margin-top: 0;
    white-space: nowrap;
}

.dzw-catalogue-locked-action--wide {
    padding-left: 2.4rem;
    width: 11.25rem;
}

.dzw-catalogue-locked-link:hover .dzw-catalogue-locked-action,
.dzw-catalogue-locked-link:focus-visible .dzw-catalogue-locked-action {
    opacity: 1;
}

.dzw-catalogue-modellwechsel {
    padding-top: .5rem;
}

.dzw-catalogue-relation-card {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    color: var(--dzw-charcoal);
    cursor: pointer;
    display: grid;
    gap: .9rem;
    grid-template-columns: 5rem minmax(0, 1fr);
    overflow: hidden;
    padding: .85rem;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.dzw-catalogue-relation-card + .dzw-catalogue-relation-card {
    margin-top: .5rem;
}

.dzw-catalogue-relation-card:hover,
.dzw-catalogue-relation-card:focus-visible {
    border-color: rgba(0, 104, 168, .22);
    box-shadow: var(--dzw-shadow-md);
    color: var(--dzw-charcoal);
    transform: translateY(-4px) scale(1.01);
}

/* Locked summary has no media cell and is not a link: full width, no pointer, no hover motion. */
.dzw-catalogue-relation-card--summary {
    cursor: default;
    grid-template-columns: minmax(0, 1fr);
    transition: none;
}

.dzw-catalogue-relation-card--summary:hover,
.dzw-catalogue-relation-card--summary:focus-visible {
    border-color: rgba(220, 227, 232, .78);
    box-shadow: var(--dzw-shadow-sm);
    transform: none;
}

.dzw-catalogue-relation-card--summary .dzw-catalogue-relation-card-name {
    white-space: normal;
}

/* Current tile inside the model chain: highlighted, not a link. */
.dzw-catalogue-relation-card--current {
    border-color: rgba(0, 104, 168, .38);
    box-shadow: none;
    cursor: default;
    transition: none;
}

.dzw-catalogue-relation-card--current:hover,
.dzw-catalogue-relation-card--current:focus-visible {
    border-color: rgba(0, 104, 168, .38);
    box-shadow: none;
    transform: none;
}

.dzw-catalogue-relation-card-media {
    align-items: center;
    aspect-ratio: 1;
    background: rgba(246, 248, 250, .86);
    border-radius: .35rem;
    display: flex;
    justify-content: center;
    overflow: hidden;
}

.dzw-catalogue-relation-card-media img {
    display: block;
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.dzw-catalogue-relation-card-body {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    justify-content: center;
    min-width: 0;
}

.dzw-catalogue-relation-card-label {
    color: var(--bs-secondary-color);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.dzw-catalogue-relation-card-name {
    color: var(--dzw-charcoal);
    font-size: 1rem;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dzw-catalogue-relation-card-years {
    color: var(--bs-secondary-color);
    font-size: .8rem;
    font-weight: 600;
}

.dzw-catalogue-relation-card-flags {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    margin-top: .15rem;
}

.dzw-catalogue-relation-card-note {
    color: #9f4527;
    font-size: .72rem;
    font-weight: 700;
}

.dzw-catalogue-relation-card-note--ok {
    color: #2a7a3b;
}

.dzw-catalogue-relation-card-note--conditional {
    color: #9a6a12;
}

.dzw-blue-panel {
    background:
        linear-gradient(135deg, rgba(0, 104, 168, .14), rgba(0, 104, 168, .07) 56%, rgba(185, 83, 47, .08)),
        var(--dzw-blue-soft);
    color: var(--dzw-charcoal);
}

.dzw-blue-panel .dzw-section-kicker {
    color: var(--dzw-blue-dark);
}

.dzw-blue-panel blockquote {
    line-height: 1.25;
}

.dzw-quote-avatar {
    border: .25rem solid rgba(255, 255, 255, .72);
    border-radius: 50%;
    box-shadow: var(--dzw-shadow-sm);
    height: 6rem;
    object-fit: cover;
    width: 6rem;
}

.dzw-blue-panel .lead {
    color: var(--bs-secondary-color);
}

.dzw-capability-showcase {
    align-items: center;
    display: grid;
    gap: clamp(2rem, 4vw, 4rem);
    grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr);
}

.dzw-screen-stack {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
}

.dzw-screen-card {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .72);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-md);
    margin: 0;
    overflow: hidden;
    transition: box-shadow .2s ease, transform .2s ease;
}

.dzw-screen-card:hover {
    box-shadow: 0 1.4rem 3rem rgba(21, 23, 25, .16);
    transform: translateY(-4px);
}

.dzw-screen-card img {
    display: block;
    height: 100%;
    object-fit: contain;
    padding: clamp(.75rem, 2vw, 1.25rem);
    width: 100%;
}


.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--dzw-blue);
    box-shadow: 0 0 0 .25rem rgba(0, 104, 168, .18);
}

.form-control.is-invalid,
.form-select.is-invalid,
.form-check-input.is-invalid {
    border-color: #b42318;
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus,
.form-check-input.is-invalid:focus {
    border-color: #b42318;
    box-shadow: 0 0 0 .25rem rgba(180, 35, 24, .14);
}

.dzw-field-error {
    color: #9f1f17;
    display: block;
    font-size: .875rem;
    font-weight: 650;
    margin-top: .4rem;
}

.dzw-auth-panel,
.dzw-account-panel {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
}

.dzw-auth-panel {
    max-width: none;
    padding: clamp(1.25rem, 3vw, 2rem);
    width: 100%;
}

.dzw-auth-panel--compact {
    margin-inline: auto;
    max-width: 25rem;
}

.dzw-auth-grid {
    align-items: start;
    display: grid;
    gap: clamp(1rem, 3vw, 2rem);
    grid-template-columns: minmax(20rem, 25rem) minmax(18rem, 22rem);
    margin-inline: auto;
    max-width: 50rem;
}

.dzw-register-shell {
    margin-inline: auto;
    max-width: 42rem;
}

.dzw-auth-panel-title {
    border-bottom: 1px solid rgba(220, 227, 232, .78);
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
}

.dzw-auth-panel-title h2,
.dzw-auth-aside h2,
.dzw-form-section h3 {
    color: var(--dzw-charcoal);
    font-weight: 800;
}

.dzw-auth-panel-title h2,
.dzw-auth-aside h2 {
    font-size: 1.3rem;
    margin-bottom: .35rem;
}

.dzw-auth-panel-title p,
.dzw-auth-aside p {
    color: var(--bs-secondary-color);
    margin-bottom: 0;
}

.dzw-auth-aside {
    align-self: stretch;
    background:
        linear-gradient(145deg, rgba(237, 247, 252, .88), rgba(255, 255, 255, .96)),
        #fff;
    border: 1px solid rgba(0, 104, 168, .12);
    border-radius: var(--dzw-element-radius);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(1.25rem, 3vw, 2rem);
}

.dzw-auth-checklist {
    display: grid;
    gap: .65rem;
    list-style: none;
    margin: 1.25rem 0 1.5rem;
    padding: 0;
}

.dzw-auth-checklist li {
    align-items: flex-start;
    color: #37424c;
    display: flex;
    gap: .55rem;
    line-height: 1.45;
}

.dzw-auth-checklist li::before {
    color: var(--dzw-blue);
    content: "✓";
    font-weight: 900;
}

.dzw-form-section {
    margin: 0;
}

.dzw-form-section h3 {
    font-size: 1rem;
    margin-bottom: 1rem;
}

.dzw-register-step-input {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.dzw-register-step-nav {
    background: rgba(0, 104, 168, .06);
    border: 1px solid rgba(0, 104, 168, .12);
    border-radius: var(--dzw-element-radius);
    display: grid;
    gap: .25rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1.5rem;
    padding: .25rem;
}

.dzw-register-step-nav span {
    border-radius: calc(var(--dzw-element-radius) - .2rem);
    color: var(--dzw-blue-dark);
    font-size: .9rem;
    font-weight: 800;
    padding: .65rem .75rem;
    text-align: center;
}

#register-step-contact:checked ~ .dzw-register-step-nav span:nth-child(1),
#register-step-address:checked ~ .dzw-register-step-nav span:nth-child(2),
#register-step-security:checked ~ .dzw-register-step-nav span:nth-child(3) {
    background: #fff;
    box-shadow: var(--dzw-shadow-sm);
    color: var(--dzw-charcoal);
}

.dzw-register-panel {
    display: none;
}

#register-step-contact:checked ~ .dzw-register-panels .dzw-register-panel-contact,
#register-step-address:checked ~ .dzw-register-panels .dzw-register-panel-address,
#register-step-security:checked ~ .dzw-register-panels .dzw-register-panel-security {
    display: block;
}

.dzw-register-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: flex-end;
    margin-top: 1.5rem;
}

.dzw-register-actions .btn {
    cursor: pointer;
}

.dzw-auth-switch {
    color: var(--bs-secondary-color);
    font-weight: 650;
    margin: 1.25rem 0 0;
    text-align: center;
}

.dzw-address-autocomplete-field {
    position: relative;
}

.dzw-address-autocomplete-list {
    background-color: var(--dzw-paper, #fff);
    border: 1px solid var(--dzw-line, #dce3e8);
    border-radius: var(--dzw-element-radius, .65rem);
    box-shadow: var(--dzw-shadow-md, 0 1rem 2.5rem rgba(21, 23, 25, .12));
    inset-inline-start: calc(var(--bs-gutter-x, 1.5rem) * .5);
    inset-inline-end: calc(var(--bs-gutter-x, 1.5rem) * .5);
    margin: .25rem 0 0;
    max-height: 18rem;
    overflow-y: auto;
    padding: .35rem;
    position: absolute;
    z-index: 30;
    list-style: none;
}

.dzw-address-autocomplete-option {
    border-radius: var(--dzw-radius, .5rem);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: .1rem;
    padding: .5rem .65rem;
}

.dzw-address-autocomplete-option:hover,
.dzw-address-autocomplete-option.is-active {
    background-color: var(--dzw-blue-soft, #edf7fc);
    color: var(--dzw-blue-dark, #004d7c);
}

.dzw-address-autocomplete-option-primary {
    font-weight: 600;
}

.dzw-address-autocomplete-option-secondary {
    color: var(--bs-secondary-color, #5d6872);
    font-size: .85rem;
}

.dzw-address-autocomplete-hint {
    font-size: .8rem;
    margin-top: .75rem;
}

.dzw-favorite-login-modal {
    align-items: center;
    display: flex;
    inset: 0;
    justify-content: center;
    padding: 1rem;
    position: fixed;
    z-index: 1300;
}

.dzw-favorite-login-backdrop {
    background: rgba(15, 23, 32, .48);
    inset: 0;
    position: absolute;
}

.dzw-favorite-login-panel {
    background: var(--dzw-paper);
    border: 1px solid var(--dzw-line);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-md);
    max-width: 26rem;
    padding: 1.5rem;
    position: relative;
    width: min(100%, 26rem);
}

.dzw-favorite-login-close {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--bs-secondary-color);
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: .75rem;
    top: .75rem;
    width: 2rem;
}

.dzw-favorite-login-icon {
    align-items: center;
    background: #fff9ed;
    border-radius: 999px;
    color: var(--dzw-favorite);
    display: inline-flex;
    height: 2.5rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 2.5rem;
}

.dzw-favorite-login-panel h2 {
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: .55rem;
}

.dzw-favorite-login-panel p {
    color: var(--bs-secondary-color);
    margin-bottom: 1.25rem;
}

.dzw-favorite-login-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
}

.dzw-account-layout {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dzw-account-panel {
    padding: clamp(1.25rem, 3vw, 2rem);
}

.dzw-account-panel-header {
    align-items: center;
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.dzw-account-panel-header h2 {
    color: var(--dzw-charcoal);
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: .15rem;
}

.dzw-account-panel-header p {
    color: var(--bs-secondary-color);
    margin-bottom: 0;
}

.dzw-account-data {
    display: grid;
    gap: .9rem;
    margin-bottom: 0;
}

.dzw-account-data div {
    border-bottom: 1px solid rgba(220, 227, 232, .78);
    display: grid;
    gap: .25rem;
    padding-bottom: .9rem;
}

.dzw-account-data div:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.dzw-account-data dt {
    color: var(--bs-secondary-color);
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
}

.dzw-account-data dd {
    color: var(--dzw-charcoal);
    font-weight: 650;
    margin-bottom: 0;
}

.dzw-account-role-list {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.dzw-account-role-list li {
    background: rgba(0, 104, 168, .08);
    border: 1px solid rgba(0, 104, 168, .12);
    border-radius: 999px;
    color: var(--dzw-blue-dark);
    font-size: .82rem;
    font-weight: 800;
    padding: .45rem .7rem;
}

.dzw-account-access-note {
    color: #45515c;
    line-height: 1.65;
    margin-bottom: 0;
}

.dzw-account-logout {
    display: flex;
    justify-content: center;
    margin-top: clamp(1.25rem, 3vw, 2rem);
}

.dzw-commerce-overview,
.dzw-commerce-product-grid,
.dzw-commerce-checkout-layout,
.dzw-commerce-confirmation {
    display: grid;
    gap: 1rem;
}

.dzw-commerce-overview,
.dzw-commerce-checkout-layout,
.dzw-commerce-confirmation {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dzw-commerce-product-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
}

.dzw-commerce-pricing-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(10.75rem, 100%), 1fr));
}

.dzw-commerce-feature,
.dzw-commerce-product-card,
.dzw-commerce-panel,
.dzw-commerce-empty {
    background: #fff;
    border: 1px solid rgba(220, 227, 232, .78);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
}

.dzw-commerce-feature,
.dzw-commerce-product-card,
.dzw-commerce-panel,
.dzw-commerce-empty {
    padding: clamp(1.25rem, 3vw, 2rem);
}

.dzw-commerce-feature,
.dzw-commerce-product-card {
    display: grid;
    gap: 1.25rem;
}

.dzw-commerce-feature {
    grid-template-rows: auto 1fr auto;
}

.dzw-commerce-feature h2,
.dzw-commerce-product-card h2,
.dzw-commerce-panel h2,
.dzw-commerce-empty h2 {
    color: var(--dzw-charcoal);
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: .65rem;
}

.dzw-commerce-feature p,
.dzw-commerce-product-card p,
.dzw-commerce-panel p,
.dzw-commerce-empty p {
    color: #45515c;
    line-height: 1.65;
}

.dzw-commerce-product-badge {
    background: rgba(0, 104, 168, .08);
    border: 1px solid rgba(0, 104, 168, .12);
    border-radius: 999px;
    color: var(--dzw-blue-dark);
    display: inline-flex;
    font-size: .8rem;
    font-weight: 800;
    margin-bottom: 1rem;
    padding: .45rem .7rem;
}

.dzw-commerce-price {
    color: var(--dzw-charcoal);
    font-size: 1.35rem;
    font-weight: 850;
}

.dzw-commerce-pricing-card {
    border-color: rgba(220, 227, 232, .82);
    border-radius: var(--dzw-element-radius);
    box-shadow: var(--dzw-shadow-sm);
    gap: 1rem;
    grid-template-rows: auto auto auto;
    padding: clamp(1.25rem, 2.5vw, 1.6rem);
}

.dzw-commerce-pricing-card--featured {
    border-color: rgba(0, 104, 168, .42);
    box-shadow: 0 0 0 1px rgba(0, 104, 168, .28), var(--dzw-shadow-sm);
}

.dzw-commerce-pricing-card--selected {
    border-color: rgba(0, 104, 168, .46);
    box-shadow: 0 0 0 2px rgba(0, 104, 168, .18), var(--dzw-shadow-sm);
}

.dzw-commerce-pricing-top {
    border-bottom: 1px solid rgba(220, 227, 232, .82);
    display: grid;
    gap: .35rem;
    grid-template-rows: 1.55rem auto auto auto;
    min-height: 8.75rem;
    padding-bottom: 1rem;
}

.dzw-commerce-pricing-badge-row {
    align-items: start;
    display: flex;
    min-height: 1.55rem;
}

.dzw-commerce-pricing-card h2 {
    color: var(--dzw-charcoal);
    font-size: 1rem;
    font-weight: 800;
    margin-bottom: 0;
}

.dzw-commerce-pricing-card .dzw-commerce-product-badge {
    background: rgba(0, 104, 168, .08);
    border: 1px solid rgba(0, 104, 168, .12);
    color: var(--dzw-blue-dark);
    font-size: .75rem;
    margin-bottom: 0;
    padding: .3rem .65rem;
}

.dzw-commerce-price-tax {
    color: #45515c;
    font-size: .8rem;
    line-height: 1.35;
    margin-bottom: 0;
    max-width: 9rem;
}

.dzw-commerce-pricing-details {
    display: grid;
    gap: .45rem;
}

.dzw-commerce-pricing-details div {
    align-items: baseline;
    display: flex;
    justify-content: space-between;
}

.dzw-commerce-pricing-details span {
    color: #333b43;
}

.dzw-commerce-pricing-details strong {
    color: var(--dzw-charcoal);
    font-size: .85rem;
}

.dzw-commerce-pricing-details p {
    color: #0f5f1b;
    font-size: .8rem;
    line-height: 1.2;
    margin-bottom: 0;
}

.dzw-commerce-card-note {
    color: #5d6872;
    font-size: .82rem;
    line-height: 1.35;
    margin: .65rem 0 0;
}

.dzw-commerce-note {
    align-items: flex-start;
    background: rgba(0, 104, 168, .08);
    border: 1px solid rgba(0, 104, 168, .12);
    border-radius: .35rem;
    color: #37424c;
    display: flex;
    gap: .75rem;
    padding: .9rem;
}

.dzw-commerce-note i {
    color: var(--dzw-blue-dark);
    flex: 0 0 auto;
    margin-top: .15rem;
}

.dzw-commerce-note p {
    margin-bottom: 0;
}

.dzw-commerce-form,
.dzw-commerce-list,
.dzw-commerce-order-lines {
    display: grid;
    gap: .85rem;
}

.dzw-commerce-list {
    color: #45515c;
    margin: 0 0 1.5rem;
    padding-left: 1.2rem;
}

.dzw-commerce-form {
    gap: 1rem;
}

.dzw-research-photo-preview {
    align-items: center;
    background: #f7fafc;
    border: 1px solid rgba(220, 227, 232, .9);
    border-radius: .35rem;
    color: #5d6873;
    display: flex;
    gap: .75rem;
    margin-top: .65rem;
    padding: .6rem;
}

.dzw-research-photo-preview img {
    aspect-ratio: 4 / 3;
    border-radius: .25rem;
    flex: 0 0 5rem;
    height: 3.75rem;
    object-fit: cover;
    width: 5rem;
}

.dzw-research-photo-preview span {
    font-size: .84rem;
    line-height: 1.35;
}

.dzw-research-submitted-photos {
    display: grid;
    gap: .85rem;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    margin-top: 1rem;
}

.dzw-research-submitted-photo {
    background: #f7fafc;
    border: 1px solid rgba(220, 227, 232, .9);
    border-radius: .35rem;
    color: #1d2b36;
    display: grid;
    gap: .45rem;
    padding: .55rem;
    text-decoration: none;
}

.dzw-research-submitted-photo:hover,
.dzw-research-submitted-photo:focus {
    border-color: var(--dzw-blue);
    color: #1d2b36;
    text-decoration: none;
}

.dzw-research-submitted-photo img {
    aspect-ratio: 4 / 3;
    border-radius: .25rem;
    object-fit: cover;
    width: 100%;
}

.dzw-research-submitted-photo span {
    font-size: .84rem;
    font-weight: 700;
}

.dzw-commerce-order-line {
    align-items: center;
    border-bottom: 1px solid rgba(220, 227, 232, .78);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding-bottom: .85rem;
}

.dzw-commerce-order-line:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.dzw-commerce-order-line div {
    display: grid;
    gap: .2rem;
}

.dzw-commerce-order-line span {
    color: var(--bs-secondary-color);
    font-weight: 700;
}

.dzw-site-footer {
    background: var(--dzw-charcoal);
    color: rgba(255, 255, 255, .76);
}

.dzw-site-footer .container {
    padding-block: 3rem 4.75rem;
}

.dzw-footer-copyright {
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, .1);
    color: rgba(255, 255, 255, .58);
    display: flex;
    flex-wrap: wrap;
    font-size: .875rem;
    gap: .75rem 1.25rem;
    justify-content: space-between;
    margin-top: 2.5rem;
    padding-top: 1.5rem;
}

.dzw-footer-logo {
    display: inline-flex;
}

.dzw-footer-logo img {
    display: block;
    height: 2.6rem;
    width: auto;
}

.dzw-site-footer a {
    color: rgba(255, 255, 255, .9) !important;
    text-decoration: none;
}

.dzw-footer-logout-form {
    margin: 0;
}

.dzw-footer-logout-form button {
    background: transparent;
    border: 0;
    color: rgba(255, 255, 255, .9);
    font: inherit;
    padding: 0;
}

.dzw-footer-logout-form button:hover,
.dzw-footer-logout-form button:focus {
    color: #bdeaff;
}

.dzw-site-footer a:not(.btn):not(.nav-link):not(.navbar-brand):hover,
.dzw-site-footer a:not(.btn):not(.nav-link):not(.navbar-brand):focus {
    color: #bdeaff;
    text-decoration: none;
}

@media (max-width: 991.98px) {
    .dzw-mobile-nav {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(237, 247, 252, .97)),
            var(--dzw-paper);
        backdrop-filter: blur(18px);
        bottom: 0;
        height: 100vh;
        height: 100dvh;
        left: 0;
        padding: 6rem 1.5rem 2rem;
        position: fixed;
        right: 0;
        top: 0;
        z-index: 1040;
    }

    .dzw-mobile-nav.collapsing {
        display: flex !important;
        height: 100vh !important;
        height: 100dvh !important;
        transition: none;
    }

    .dzw-mobile-nav.show,
    .dzw-mobile-nav.collapsing {
        display: flex;
        flex-direction: column;
    }

    .dzw-mobile-nav .navbar-nav {
        align-items: center;
        display: flex;
        gap: .8rem;
        height: 100%;
        justify-content: center;
        margin-inline: 0 !important;
        text-align: center;
        width: 100%;
    }

    .dzw-mobile-nav .dzw-nav-actions {
        bottom: 2rem;
        display: grid;
        gap: .75rem;
        left: 1.5rem;
        position: absolute;
        right: 1.5rem;
    }

    .dzw-mobile-nav .dzw-nav-actions .btn {
        justify-content: center;
        min-height: 3.15rem;
        padding-block: .85rem;
        width: 100%;
    }

    .dzw-mobile-nav .dzw-account-dropdown {
        display: flex;
        flex-direction: column-reverse;
        width: 100%;
    }

    .dzw-mobile-nav .dzw-account-dropdown-menu {
        border-radius: var(--dzw-element-radius);
        margin-bottom: .45rem;
        margin-top: 0;
        position: static;
        transform: none;
        width: 100%;
    }

    .dzw-mobile-nav .dzw-nav-link {
        font-size: 1.35rem;
        line-height: 1.2;
    }

    .dzw-mobile-nav .nav-item {
        animation: dzw-nav-item-in .34s ease both;
        animation-delay: var(--dzw-nav-delay, .04s);
        opacity: 0;
    }

    .dzw-navbar-brand {
        position: relative;
        z-index: 1050;
    }

    .dzw-navbar-toggle {
        position: relative;
        z-index: 1050;
    }

    .dzw-capability-showcase {
        grid-template-columns: 1fr;
    }

    .dzw-static-intro-grid,
    .dzw-brick-comparison-grid,
    .dzw-catalogue-detail-hero,
    .dzw-catalogue-detail-layout,
    .dzw-account-layout,
    .dzw-commerce-overview,
    .dzw-commerce-checkout-layout,
    .dzw-commerce-confirmation,
    .dzw-auth-grid,
    .dzw-story-section-with-image,
    .dzw-story-image-right {
        grid-template-columns: 1fr;
    }

    .dzw-catalogue-detail-media {
        justify-self: center;
        margin-inline: auto;
    }

    .dzw-catalogue-detail-side {
        order: -1;
    }

    .dzw-catalogue-variant-media {
        aspect-ratio: auto;
        height: 9rem;
        max-height: 9rem;
    }

    .dzw-roof-form-card {
        grid-template-columns: 1fr;
    }

    .dzw-catalogue-shell {
        grid-template-columns: 1fr;
    }

    .dzw-catalogue-filter-trigger {
        align-items: center;
        background: var(--dzw-blue-dark);
        border: 0;
        border-radius: 999px;
        bottom: 1.25rem;
        box-shadow: 0 .75rem 1.75rem rgba(21, 23, 25, .22);
        color: #fff;
        display: inline-flex;
        font-weight: 800;
        gap: .5rem;
        padding: .85rem 1.25rem;
        position: fixed;
        right: 1.25rem;
        z-index: 1120;
    }

    .dzw-catalogue-filter-trigger-badge {
        background: var(--dzw-clay);
        border-radius: 999px;
        flex-shrink: 0;
        height: .55rem;
        width: .55rem;
    }

    .dzw-catalogue-filter-side {
        background: #fff;
        border: 0;
        border-radius: 0;
        bottom: 0;
        box-shadow: var(--dzw-shadow-md);
        height: 100%;
        left: 0;
        max-height: none;
        overflow: hidden;
        padding: 0;
        position: fixed;
        right: 0;
        top: 0;
        transform: translateX(-100%);
        transition: transform .25s ease;
        z-index: 1200;
    }

    .dzw-catalogue-shell[data-filter-drawer-open="true"] .dzw-catalogue-filter-side {
        transform: translateX(0);
    }

    .dzw-catalogue-filter-close {
        display: inline-flex;
    }

    .dzw-catalogue-filter-backdrop {
        background: rgba(15, 23, 32, .42);
        display: block;
        inset: 0;
        opacity: 0;
        pointer-events: none;
        position: fixed;
        transition: opacity .2s ease;
        z-index: 1150;
    }

    .dzw-catalogue-shell[data-filter-drawer-open="true"] .dzw-catalogue-filter-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    .dzw-catalogue-filter-footer .btn {
        width: 100%;
    }

    .dzw-catalogue-results-header {
        align-items: stretch;
        flex-direction: column;
    }

    .dzw-error-layout {
        grid-template-columns: 1fr;
    }

    .dzw-error-copy {
        max-width: none;
    }

    .dzw-error-figure {
        order: -1;
    }

    .dzw-error-figure img {
        max-height: 18rem;
    }

    .dzw-catalogue-sort {
        flex-wrap: wrap;
    }

}

@media (max-width: 575.98px) {
    .dzw-brick-image-card figure {
        min-height: 8.5rem;
    }

    .dzw-brick-image-card img {
        max-height: 7rem;
    }

    .dzw-roof-form-card {
        gap: 1rem;
        grid-template-columns: 5rem minmax(0, 1fr);
    }

    .dzw-catalogue-card,
    .dzw-catalogue-variant-card {
        grid-template-columns: 1fr;
    }

    .dzw-catalogue-card-media {
        max-height: 14rem;
        min-height: 9rem;
    }

    .dzw-catalogue-card-media img {
        max-height: 14rem;
    }

    .dzw-favorite-button--card {
        opacity: 1;
        pointer-events: auto;
    }

    .dzw-catalogue-mini-data {
        grid-template-columns: 1fr;
    }

    .dzw-roof-form-media {
        justify-self: start;
        max-width: none;
        width: 5rem;
    }

    .dzw-roof-form-card:has(.dzw-roof-form-details[open]) {
        grid-template-columns: 1fr;
    }

    .dzw-roof-form-card:has(.dzw-roof-form-details[open]) .dzw-roof-form-media {
        justify-self: center;
        max-width: 8.5rem;
        width: 42%;
    }

}

@keyframes dzw-nav-item-in {
    from {
        opacity: 0;
        transform: translateY(1rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes dzw-logo-marquee {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(calc(-50% - .5rem));
    }
}

@media (prefers-reduced-motion: reduce) {
    .dzw-logo-marquee-track,
    .dzw-mobile-nav .nav-item {
        animation: none;
    }

    .dzw-mobile-nav .nav-item {
        opacity: 1;
        transform: none;
    }
}