:root{--ribbonHeight: 3.75rem;--triangleWidth: 2.75rem;--priceab-bg-color: #1c75bc;--priceab-color: #fff}@media (max-width: 768px){:root{--ribbonHeight: 3.25rem;--triangleWidth: 2.25rem}}#konfigurator3D{padding-bottom:5rem}#konfigurator3D p{margin:0}#konfigurator3D .category-cards{display:grid;margin:0 auto;width:100%;grid-template-columns:repeat(4,1fr);gap:1rem}@media (max-width: 1400px){#konfigurator3D .category-cards{grid-template-columns:repeat(3,1fr)}}@media (max-width: 768px){#konfigurator3D .category-cards{grid-template-columns:repeat(2,1fr)}}@media (max-width: 576px){#konfigurator3D .category-cards{grid-template-columns:100%}}#konfigurator3D .category-cards .category-card{width:100%;display:block;aspect-ratio:4/3;max-height:500px;overflow:hidden;position:relative;border-radius:8px;container-type:inline-size;container-name:categoryCard;box-shadow:0 4px 15px #0000001a;transition:box-shadow .25s ease-in-out,filter .3s ease-in-out}#konfigurator3D .category-cards .category-card:hover{box-shadow:0 10px 30px #00000026}@media (max-width: 576px){#konfigurator3D .category-cards .category-card{aspect-ratio:16/10}}#konfigurator3D .category-cards .category-card:after{position:absolute;content:"";top:0;left:0;height:100%;width:100%;background:linear-gradient(0deg,#00000080,#00000040 10%,#0000 40%)}#konfigurator3D .category-cards .category-card .category-card-name-wrapper{position:absolute;bottom:1rem;left:0%;z-index:1;height:var(--ribbonHeight);width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}#konfigurator3D .category-cards .category-card .category-card-name-wrapper .card-ribbon{position:absolute;height:var(--ribbonHeight);left:0;width:calc(100% - var(--triangleWidth));background-color:#4338ca;transition:transform .3s ease-in-out;transform:translate(calc(-100% - var(--triangleWidth)))}#konfigurator3D .category-cards .category-card .category-card-name-wrapper .card-ribbon:after{content:"";position:absolute;border-style:solid;left:100%;border-width:var(--ribbonHeight) var(--triangleWidth) 0 0;border-color:#4338ca transparent transparent transparent}@media (max-width: 576px){#konfigurator3D .category-cards .category-card .category-card-name-wrapper .card-ribbon{display:none}}#konfigurator3D .category-cards .category-card .category-card-name-wrapper .category-card-text{font-size:.75rem;font-weight:500;line-height:1.5;color:#fff;transition:opacity .1s ease-in-out;opacity:0;z-index:1}@media (max-width: 576px){#konfigurator3D .category-cards .category-card .category-card-name-wrapper .category-card-text{display:none}}#konfigurator3D .category-cards .category-card .category-card-name-wrapper .category-card-name{font-size:1.25rem;font-weight:600;line-height:1.375;color:#fff;text-shadow:0px 4px 4px rgba(0,0,0,.25);text-align:start;width:fit-content;z-index:1;text-align:center}@container categoryCard (max-width:310px){#konfigurator3D .category-cards .category-card .category-card-name-wrapper .category-card-name{font-size:1.125rem}}#konfigurator3D .category-cards .category-card .blurred-img{width:100%;height:100%}#konfigurator3D .category-cards .category-card img{width:100%;height:100%;display:block;transition:transform .3s ease-in-out;object-position:center}#konfigurator3D .category-cards .category-card:hover img{transform:scale(1.05)}#konfigurator3D .category-cards .category-card:hover .category-card-name-wrapper .card-ribbon{transform:translate(0)}#konfigurator3D .category-cards .category-card:hover .category-card-name-wrapper .category-card-text{transition:opacity .2s ease-in-out .1s;opacity:1}:root{--progress-bar-konfigurator-active: #4f46e5;--progress-bar-konfigurator-inactive: #d4d4d4;--barHeight: 1rem;--priceab-bg-color: #1c75bc;--priceab-color: #fff}@media (max-width: 992px){:root{--barHeight: .75rem}}@media (max-width: 576px){:root{--barHeight: .5rem}}@media (max-width: 450px){:root{--barHeight: .375rem}}.progress-bar-konfigurator{padding:3rem 0}@media (max-width: 768px){.progress-bar-konfigurator{padding:3.5rem 0 2.5rem}}@media (max-width: 450px){.progress-bar-konfigurator{padding:3rem 0 2rem}}@media (max-width: 350px){.progress-bar-konfigurator{padding:2.5rem 0 1.5rem}}.progress-bar-konfigurator .steps-wrapper{display:grid;grid-template-columns:repeat(var(--stepsCount),1fr);column-gap:calc(var(--barHeight) * 2)}@media (max-width: 1200px){.progress-bar-konfigurator .steps-wrapper{width:90%}}.progress-bar-konfigurator .steps-wrapper .step-wrapper{display:flex;flex-direction:column;row-gap:.25rem}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step-text-content{display:flex;align-items:center;justify-content:center}@media (max-width: 768px){.progress-bar-konfigurator .steps-wrapper .step-wrapper .step-text-content{display:none}}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step-text-content .step-icon{height:3.5rem;width:3.5rem}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step-text-content .step-icon svg{height:100%;width:auto}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step-text-content .step-text{font-size:1rem;font-weight:500}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step{background-color:var(--progress-bar-konfigurator-inactive);width:100%;height:var(--barHeight);position:relative}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step:after,.progress-bar-konfigurator .steps-wrapper .step-wrapper .step:before{position:absolute;content:"";border-style:solid;display:none}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step:before{right:100%;border-width:0 0 var(--barHeight) var(--barHeight);border-color:transparent transparent var(--progress-bar-konfigurator-inactive) transparent}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step:after{left:100%;border-width:var(--barHeight) var(--barHeight) 0 0;border-color:var(--progress-bar-konfigurator-inactive) transparent transparent transparent}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step.active{background-color:var(--progress-bar-konfigurator-active)}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step.active:after{border-color:var(--progress-bar-konfigurator-active) transparent transparent transparent}.progress-bar-konfigurator .steps-wrapper .step-wrapper .step.active:before{border-color:transparent transparent var(--progress-bar-konfigurator-active) transparent}.progress-bar-konfigurator .steps-wrapper .step-wrapper:not(:first-child) .step:before{display:block}.progress-bar-konfigurator .steps-wrapper .step-wrapper:not(:last-child) .step:after{display:block}.progress-bar-konfigurator .step-info{display:none;margin-top:.75rem}@media (max-width: 768px){.progress-bar-konfigurator .step-info{display:block}}.progress-bar-konfigurator .step-info p{text-align:center}