:root {
 --template: "campaign 2026 Q4 SDV v3";
 --body-stops: #f1faff, #f1faff, #fff, #eaf2ff;
 --zx-snavbar: 1100;
 --zx-base: 100;
 --zx-keyselection: calc(var(--zx-base) + 100);
 --zx-keyselection-link: calc(var(--zx-keyselection) + 10);
 --zx-portfolio: 110;
 --zx-btn-close: calc(var(--zx-portfolio) + 20);
 --zx-product-section: 15;
 --zx-product-card: 10;
 --zx-img-wrapper: 120;
 --zx-page-top: calc(var(--zx-base) + 60);
 --zx-sfooter: calc(var(--zx-base) + 50);
 --snavbar-height: 7rem;
 --filterbar-height: 5rem;
 --headerbar-height: 0;
 --scroll-padding-top: 2rem;
 --shadow-soft: 0 4px 8px #0000001a;
 --transition: all .5s ease;
 --gap-05: .5rem;
 --gap-10: 1rem;
 --gap-15: 1.5rem;
 --gap-20: 2rem;
 --gap-30: 3rem;
 --gap-40: 4rem;
 --gap-50: 5rem;
 --gap-70: 7rem;
 --radius-base: 6px;
 --radius-card: 8px;
 --radius-big: 16px;
 --icon-check-size: 24px;
 --img-width: 8rem;
}
@media (width > 768px) {
 :root {
   --img-width: 10rem;
 }
}
:root {
 --font-weight-thin: 100;
 --font-weight-xlight: 200;
 --font-weight-light: 300;
 --font-weight-base: 400;
 --font-weight-med: 500;
 --font-weight-semi: 600;
 --font-weight-bold: 700;
 --font-weight-xbold: 800;
 --font-weight-black: 900;
 --font-weight-xblack: 950;
 --font-size-h1: 4rem;
 --font-size-h2: 2.6rem;
 --font-size-h3: 2.4rem;
 --font-size-h4: 2.2rem;
 --font-size-h5: 1.6rem;
 --font-size-h6: 1.4rem;
 --font-size-xl: 2rem;
 --font-size-lg: 1.8rem;
 --font-size-base: 1.6rem;
 --font-size-sm: 1.4rem;
 --font-size-xs: 1.2rem;
 --font-delta-overline: .7em;
 --line-height-hx: 1.4;
}
@media (width > 768px) {
 :root {
   --font-size-h2: 3rem;
   --font-size-h3: 2.6rem;
   --font-size-h5: 1.8rem;
   --font-size-h6: 1.5rem;
   --font-size-base: 1.8rem;
   --font-size-sm: 1.5rem;
   --font-size-xs: 1.3rem;
 }
}
:root {
 --tdk-color-accent: #1132ff;
 --header-bg: var(--tdk-color-white-40);
 --snavbar-bg: #e9f0f2;
 --snavbar-shadow: 0 1px 3px #00000026;
 --menu-bg: #f4f6f7;
 --menu-heading: var(--tdk-color-gray-97);
 --menu-text: var(--tdk-color-black-60);
 --menu-link: var(--tdk-color-blue);
 --color-primary: #0b66ef;
 --color-heading: #081624;
 --color-text-secondary: #3b4e5f;
 --color-border: #b9ccd8;
 --color-card-bg: #f0f1f5;
 --color-card-bg-hover: #e2e3e8;
 --color-overlay-bg: #8ba0c133;
 --tdk-color-border: #d1d8dc;
 --tdk-color-input-bg: #fafafa;
 --color-overlay: #081624ab;
 --shadow-card: 0 2px 5px #0003;
 --text-shadow-title: 0 2px 4px #000000ab;
 --text-shadow-meta: 0 1px 4px #00000087;
 --color-card-bg-compact: #e3eef28f;
 --tdk-color-error-bg: #ffc;
 --tdk-color-error-bg2: #fed;
}
*, :before, :after {
 box-sizing: border-box;
}
html {
 scroll-behavior: smooth;
 scroll-padding-top: var(--scroll-padding-top);
 overflow-x: clip !important;
}
html:has(#sticky-navbar) {
 --headerbar-height: var(--snavbar-height);
 --scroll-padding-top: var(--headerbar-height);
}
body {
 background: linear-gradient(to bottom, var(--body-stops));
 overflow-x: clip !important;
}
body .content-frame > .container {
 scroll-snap-type: block;
 scroll-snap-align: center;
 padding-inline: 1.5rem !important;
}
body .content-frame > .container > div > .content {
 flex-direction: column;
 display: flex;
}
body .content-frame > .container > div > .content > * {
 padding-block: var(--gap-40);
}
@media (width > 768px) {
 body .content-frame > .container > div > .content > * {
   padding-block: var(--gap-50);
 }
}
body .content-frame > .container > div > .content > div:first-child:has(h1) {
 display: none;
}
body .content-frame > .container > div > .content > hr {
 border-color: #6f9fcf;
 margin-block: unset !important;
}
body:has(.content > div:last-of-type.breakout) .content-frame .container .content, body:has(.content > div:last-of-type.breakout) .content > div:last-of-type.breakout, body:has(.content > div:last-of-type.breakout) footer {
 margin-block: unset !important;
}
.content-frame .container > .row {
 display: block !important;
}
.elementlist.compact > div > * {
 margin-bottom: unset !important;
}
.anker:not(.anchor-navigation-header a) {
 scroll-margin-top: unset !important;
}
.hidden {
 display: none !important;
}
.collapsed {
 max-height: 0 !important;
}
@media (width <= 768px) {
 .text-centered-sm * {
   text-align: center;
 }
}
@media (width > 768px) {
 .width-80-xl {
   width: 80%;
   margin-inline: auto;
 }
}
body {
 font-size: var(--font-size-base) !important;
 font-weight: var(--font-weight-base) !important;
}
h1, h2, h3, h4, h5, h6 {
 line-height: var(--line-height-hx) !important;
}
h1 > span, h2 > span, h3 > span, h4 > span, h5 > span, h6 > span {
 font-size: var(--font-delta-overline);
 margin-bottom: .5em;
 display: block;
}
h3, h4, h5, h6 {
 font-weight: var(--font-weight-bold) !important;
}
h1 {
 font-weight: var(--font-weight-light) !important;
}
h2 {
 font-weight: var(--font-weight-med) !important;
}
.content-frame > .container > div > .content > div > .textfragment h2 {
 font-size: var(--font-size-h3);
}
h5 {
 font-size: var(--font-size-h5) !important;
}
p {
 font-size: var(--font-size-base) !important;
 font-weight: var(--font-weight-base) !important;
 letter-spacing: .36px !important;
 line-height: normal !important;
}
.richtext ul li {
 font-size: var(--font-size-base) !important;
}
.split-title h2 span, .split-title h3 span {
 font-size: var(--font-delta-overline);
 display: block;
}
.headlines-l1-centered .content-frame > .container > div > .content > div > .textfragment > div > div > h2 {
 text-align: center;
}
.headlines-l1-bigger .content-frame > .container > div > .content > div > .textfragment > div > div > h2 {
 font-size: 6vw;
}
@media (width > 768px) {
 .headlines-l1-bigger .content-frame > .container > div > .content > div > .textfragment > div > div > h2 {
   font-size: 1.4vw;
 }
}
.headline-centered > .textfragment > div > div > h2 {
 text-align: center;
}
.headline-bigger > .textfragment > div > div > h2 {
 font-size: 6vw;
}
@media (width > 768px) {
 .headline-bigger > .textfragment > div > div > h2 {
   font-size: 1.4vw;
 }
}
.headline-italic > .textfragment > div > div > h2 {
 font-style: italic;
}
.checkmark-list ul {
 flex-direction: column;
 display: flex;
 gap: var(--gap-20) !important;
 margin-block: 4rem 2rem !important;
}
@media (width > 768px) {
 .checkmark-list ul {
   flex-direction: row;
   justify-content: center;
   gap: var(--gap-50) !important;
 }
}
.checkmark-list ul li {
 align-items: center;
 gap: var(--gap-15);
 display: flex;
 margin-bottom: unset !important;
 padding-left: unset !important;
 font-size: var(--font-size-lg) !important;
}
.checkmark-list ul li:before {
 content: "";
 flex: 0 0 var(--icon-check-size);
 width: var(--icon-check-size);
 height: var(--icon-check-size);
 background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M23.0645 10.9328V11.9554C23.0631 14.3523 22.287 16.6846 20.8518 18.6044C19.4166 20.5242 17.3993 21.9287 15.1007 22.6083C12.8022 23.2879 10.3455 23.2063 8.09705 22.3756C5.84865 21.5449 3.92899 20.0097 2.62438 17.9989C1.31978 15.9881 0.700124 13.6094 0.857835 11.2177C1.01555 8.82593 1.94217 6.54924 3.49952 4.72715C5.05687 2.90505 7.16149 1.63519 9.4995 1.10695C11.8375 0.578705 14.2837 0.820383 16.4731 1.79594M8.61451 10.8439L11.9491 14.1785L23.0645 3.06309' stroke='currentColor' stroke-width='1.66731' stroke-linecap='round' stroke-linejoin='round'/></svg>");
 position: unset !important;
 color: inherit !important;
 background-color: unset !important;
}
.hero .content-frame {
 padding-inline: 0 !important;
}
.hero .content-frame > .container h1 {
 display: none;
}
.hero .stage-area {
 --stage-max-width: 100vw;
 --stage-font-size: 1rem;
 width: var(--stage-max-width);
 background-color: var(--tdk-color-grey-10);
 margin: 0 0 10vw;
 position: relative;
 padding-inline: 0 !important;
 display: block !important;
}
@media (width < 576px) {
 .hero .stage-area {
   --stage-width: 100vw;
   --stage-height: 100vw;
   min-height: var(--stage-height);
 }
}
@media (width >= 576px) {
 .hero .stage-area {
   --stage-font-size: calc(var(--stage-max-width) * .01);
   aspect-ratio: 5 / 2;
   margin-inline: auto;
   margin-bottom: calc(var(--stage-max-width) * .05);
   overflow: hidden;
 }
}
@media (width >= 2500px) {
 .hero .stage-area {
   --stage-max-width: 2500px;
   max-width: var(--stage-max-width);
 }
}
.hero .stage-area > div {
 --stage-pad: calc(100vw / 16);
 --stage-cols-x: calc((var(--stage-width) - var(--stage-pad) * 2) / 4);
 --stage-cols-y: calc((var(--stage-height) - var(--stage-pad) * 2) / 4);
 grid-template-columns: repeat(4, var(--stage-cols-x));
 grid-template-rows: repeat(4, var(--stage-cols-y)) auto;
 grid-gap: 0px;
 display: grid;
 position: relative;
 padding: var(--stage-pad) !important;
}
@media (width >= 576px) {
 .hero .stage-area > div {
   grid-template-rows: repeat(4, 1fr);
   grid-template-columns: repeat(4, 1fr);
   position: absolute;
   inset: 0;
   padding: calc(var(--stage-area-height) / 16) !important;
 }
}
.hero .stage-area > div:before, .hero .stage-area > div:after {
 content: "";
 pointer-events: none;
 z-index: 13;
 clip-path: polygon(0 0, 100% 50%, 0 100%);
 background: var(--tdk-gradient-blue);
 aspect-ratio: 1 / 2;
 height: 25vw;
 position: absolute;
 left: 50%;
 translate: 100%;
}
@media (width >= 576px) {
 .hero .stage-area > div:before, .hero .stage-area > div:after {
   height: calc(var(--stage-area-height) / 4);
 }
}
.hero .stage-area > div:before {
 transform-origin: 0 0;
 rotate: 90deg;
 grid-area: 1 / 1 / span 1 / -1 !important;
}
@media (width >= 576px) {
 .hero .stage-area > div:before {
   grid-area: 1 / 1 / 2 / 2 !important;
 }
}
.hero .stage-area > div:after {
 transform-origin: 0 100%;
 bottom: 0;
 rotate: -90deg;
 grid-area: 4 / 1 / span 1 / -1 !important;
}
@media (width >= 576px) {
 .hero .stage-area > div:after {
   grid-area: 4 / 1 / 5 / 2 !important;
 }
}
.hero .stage-area > div > .textfragment {
 z-index: 15;
 padding-top: 25vw;
 position: relative;
 grid-area: 6 / 1 / -1 / -1 !important;
}
@media (width >= 576px) {
 .hero .stage-area > div > .textfragment {
   align-self: center;
   padding-top: 0;
   padding-left: 6.25%;
   grid-area: 2 / 1 / span 2 / span 2 !important;
 }
}
.hero .stage-area > div > .textfragment .richtext > * {
 text-align: left;
 margin-bottom: calc(var(--stage-max-width) * .04);
 line-height: 1.2;
}
@media (width >= 576px) {
 .hero .stage-area > div > .textfragment .richtext > * {
   margin-bottom: calc(var(--stage-max-width) * .02);
 }
}
.hero .stage-area > div > .textfragment .richtext > :last-child {
 margin-bottom: 0;
}
.hero .stage-area > div > .textfragment h1 {
 font-size: calc(var(--stage-font-size) * 3.2);
}
.hero .stage-area > div > .textfragment h2 {
 font-size: calc(var(--stage-font-size) * 2.8);
}
.hero .stage-area > div > .textfragment h3 {
 font-size: calc(var(--stage-font-size) * 1.8);
 line-height: 1.4 !important;
}
@media (width >= 576px) {
 .hero .stage-area > div > .textfragment h3 {
   max-width: 90%;
 }
}
.hero .stage-area > div > .textfragment h5 {
 font-size: calc(var(--stage-font-size) * 1.6);
}
.hero .stage-area > div > .textfragment p {
 font-size: calc(var(--stage-font-size) * 1.7);
 line-height: 1.4 !important;
}
@media (width >= 576px) {
 .hero .stage-area > div > .textfragment p {
   font-size: calc(var(--stage-font-size) * 1.3);
   max-width: 80%;
 }
}
@media (width < 576px) {
 .hero .stage-area > div > .textfragment .image-wrapper {
   display: none;
 }
}
@media (width >= 576px) {
 .hero .stage-area > div > .textfragment .image-wrapper {
   top: calc(var(--stage-max-width) * .05);
   left: calc(var(--stage-max-width) * .7);
   width: calc(var(--stage-max-width) * .2);
   aspect-ratio: 1;
   box-shadow: var(--tdk-shadow-base);
   padding: calc(var(--stage-max-width) * .015);
   background: #eeed;
   border-radius: 100%;
   position: absolute;
 }
 .hero .stage-area > div > .textfragment .image-wrapper img {
   aspect-ratio: 1;
   object-fit: cover;
 }
}
.hero .stage-area > div > .elementlist {
 margin: 0 !important;
}
.hero .stage-area > div > .elementlist .textfragment, .hero .stage-area > div > .elementlist > div {
 display: none;
}
@media (width < 576px) {
 .hero .stage-area > div > .elementlist > div:first-child {
   display: block;
 }
}
@media (width >= 576px) {
 .hero .stage-area > div > .elementlist > div:nth-child(2) {
   display: block;
 }
}
.hero .stage-area > div > .elementlist > div:first-child, .hero .stage-area > div > .elementlist > div:nth-child(2) {
 pointer-events: none;
 z-index: 0;
 padding: 0;
 position: absolute;
 inset: 0;
 overflow: clip;
}
@media (width >= 576px) {
 .hero .stage-area > div > .elementlist > div:first-child .image-wrapper, .hero .stage-area > div > .elementlist > div:nth-child(2) .image-wrapper {
   height: 50vw !important;
   max-height: 100% !important;
 }
}
.hero .stage-area > div > .elementlist > div:first-child .image-wrapper img, .hero .stage-area > div > .elementlist > div:nth-child(2) .image-wrapper img {
 object-fit: cover;
 width: 100%;
 height: 100%;
}
.hero .stage-area > div > .elementlist > div:first-child .image-wrapper img:after, .hero .stage-area > div > .elementlist > div:nth-child(2) .image-wrapper img:after {
 display: none !important;
}
.hero .stage-area > div > .elementlist > div:first-child .video-wrapper, .hero .stage-area > div > .elementlist > div:nth-child(2) .video-wrapper {
 --ar-hrz: 16;
 --ar-vrt: 9;
 position: absolute;
 inset: 0;
}
@media (width < 576px) {
 .hero .stage-area > div > .elementlist > div:first-child .video-wrapper, .hero .stage-area > div > .elementlist > div:nth-child(2) .video-wrapper {
   aspect-ratio: 1;
 }
}
@media (width >= 576px) {
 .hero .stage-area > div > .elementlist > div:first-child .video-wrapper, .hero .stage-area > div > .elementlist > div:nth-child(2) .video-wrapper {
   aspect-ratio: 5 / 2;
 }
}
.hero .stage-area > div > .elementlist > div:first-child .video-wrapper .poster-frame, .hero .stage-area > div > .elementlist > div:nth-child(2) .video-wrapper .poster-frame {
 z-index: 0;
 opacity: .3;
 background-position: center;
 background-repeat: no-repeat;
 position: absolute;
 inset: 0;
 background-size: cover !important;
}
.hero .stage-area > div > .elementlist > div:first-child .video-wrapper iframe, .hero .stage-area > div > .elementlist > div:nth-child(2) .video-wrapper iframe {
 z-index: 2;
 width: calc(100% / var(--ar-vrt) * var(--ar-hrz));
 background-color: #0000;
 border: 0;
 height: 100%;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
}
@media (width >= 576px) {
 .hero .stage-area > div > .elementlist > div:first-child .video-wrapper iframe, .hero .stage-area > div > .elementlist > div:nth-child(2) .video-wrapper iframe {
   width: var(--stage-max-width);
   height: calc(var(--stage-max-width) / var(--ar-hrz) * var(--ar-vrt));
 }
}
@media (width < 576px) {
 .hero.size-large .stage-area {
   --stage-height: 175vw !important;
 }
}
@media (width >= 576px) {
 .hero.size-large .stage-area {
   --stage-font-size: calc(var(--stage-max-width) * .012);
   height: calc(var(--stage-max-width) / 2);
 }
 .hero.size-large .stage-area > div > .textfragment .image-wrapper {
   top: calc(var(--stage-max-width) * .2);
 }
}
.hero.size-large .stage-area > div > .elementlist {
 margin: 0 !important;
}
.hero.size-large .stage-area > div > .elementlist > div {
 overflow: unset;
}
.hero.size-large .stage-area > div > .elementlist > div .image-wrapper, .hero.size-large .stage-area > div > .elementlist > div .video-wrapper {
 aspect-ratio: 3 / 4 !important;
 aspect-ratio: var(--stage-width)/var(--stage-height) !important;
}
@media (width >= 576px) {
 .hero.size-large .stage-area > div > .elementlist > div .image-wrapper, .hero.size-large .stage-area > div > .elementlist > div .video-wrapper {
   aspect-ratio: 2 !important;
 }
 .hero.size-large.triangles-horizontal .stage-area > div:before, .hero.size-large.triangles-horizontal .stage-area > div:after {
   height: calc(var(--stage-area-height) / 4);
 }
}
.hero.bg-color.blue .stage-area {
 background-color: #029;
}
.hero.bg-color.grey .stage-area {
 background-color: #dee2e7;
}
.hero.bg-gradient .stage-area > div > .elementlist:before {
 content: "";
 pointer-events: none;
 z-index: 10;
 position: absolute;
 inset: 0;
}
.hero.bg-gradient.triangles-right .stage-area > div > .elementlist:before {
 scale: -1 1;
}
@media (width >= 576px) {
 .hero.bg-gradient.white-xl .stage-area > div > .elementlist:before {
   background-image: linear-gradient(90deg, #ffffffe6 0% 25%, #fffc 39%, #ffffffb3 48%, #fff9 56%, #ffffff80 63%, #fff6 69%, #ffffff4d 75%, #fff3 81%, #ffffff1a 89%, #fff0 100%);
 }
 .hero.bg-gradient.grey-xl .stage-area > div > .elementlist:before {
   background-image: linear-gradient(90deg, #dee3e7 0% 25%, #dee3e7e3 39%, #dee3e7c7 48%, #dee3e7ab 56%, #dee3e78f 63%, #dee3e770 69%, #dee3e754 75%, #dee3e738 81%, #dee3e71c 89%, #dee3e700 100%);
 }
 .hero.bg-gradient.dark-xl .stage-area > div > .elementlist:before {
   background-image: linear-gradient(to right in hsl longer hue, #000000b3, 66%, #0000 100%);
 }
 .hero.bg-centered .stage-area > div > .elementlist > div:has(.image-wrapper), .hero.bg-centered .stage-area > div > .elementlist > div:has(.video-wrapper) {
   margin-left: calc(var(--stage-max-width) * .2);
 }
}
.hero.triangle-color.gradient-green .stage-area > div:before, .hero.triangle-color.gradient-green .stage-area > div:after {
 background: var(--tdk-gradient-green);
}
.hero.triangle-color.purple .stage-area > div:before, .hero.triangle-color.purple .stage-area > div:after {
 background: var(--tdk-gradient-purple);
}
.hero.triangle-color.white .stage-area > div:before, .hero.triangle-color.white .stage-area > div:after {
 background: var(--tdk-color-white) !important;
}
@media (width < 576px) {
 .hero.triangle-color.white .stage-area > div-sm .stage-area > div:before, .hero.triangle-color.white .stage-area > div-sm .stage-area > div:after {
   background: var(--tdk-color-white) !important;
 }
}
@media (width >= 576px) {
 .hero.triangles-small-xl .stage-area > div:before, .hero.triangles-small-xl .stage-area > div:after {
   height: calc(var(--stage-area-height) / 8) !important;
 }
}
.hero.triangle-position.bottom-center .stage-area > div:before {
 left: 100%;
 translate: 100%;
 grid-area: 3 / 2 / span 1 / span 1 !important;
}
.hero.triangle-position.bottom-center .stage-area > div:after {
 display: none !important;
}
.hero.triangle-position.bottom-center .stage-area > div > .textfragment {
 grid-area: 4 / 1 / -1 / -1 !important;
}
@media (width < 576px) {
 .hero.triangle-position.bottom-center-sm .stage-area > div:before {
   height: 17vw;
   left: 100%;
   translate: 100% 100%;
   grid-area: 3 / 2 / span 1 / span 1 !important;
 }
 .hero.triangle-position.bottom-center-sm .stage-area > div:after {
   display: none;
 }
 .hero.triangle-position.bottom-center-sm .stage-area > div > .textfragment {
   grid-area: 3 / 1 / -1 / -1 !important;
 }
}
@media (width >= 576px) {
 .hero.triangle-position.bottom-center-xl .stage-area > div:before {
   left: 100%;
   translate: 100% 170%;
   height: calc(var(--stage-area-height) / 10) !important;
   grid-area: 3 / 2 / span 1 / span 1 !important;
 }
 .hero.triangle-position.bottom-center-xl .stage-area > div:after {
   display: none;
 }
 .hero.triangle-position.bottom-center-xl .stage-area > div > .textfragment {
   grid-area: 4 / 1 / -1 / -1 !important;
   padding-left: 0 !important;
 }
 .hero.triangle-position.bottom-center-xl .stage-area > div > .textfragment p {
   max-width: unset !important;
   font-size: calc(var(--font-size-base) * 1.2) !important;
 }
 .hero.triangle-position.bottom-left-xl .stage-area > div:before, .hero.triangle-position.bottom-left-xl .stage-area > div:after {
   left: 100%;
   translate: 100%;
 }
 .hero.triangle-position.bottom-left-xl .stage-area > div:before {
   grid-area: 1 / 3 / span 1 / span 1 !important;
 }
 .hero.triangle-position.bottom-left-xl .stage-area > div:after {
   grid-area: 4 / 3 / span 1 / span 1 !important;
 }
 .hero.triangle-position.bottom-left-xl .stage-area > div > .textfragment {
   align-self: center;
   padding-left: 33%;
   grid-area: 2 / 3 / span 2 / span 1 !important;
 }
 .hero.triangle-position.bottom-right-xl .stage-area > div:before {
   left: 0;
   translate: 0 38%;
   grid-area: 3 / 2 / span 1 / span 1 !important;
   rotate: none !important;
 }
 .hero.triangle-position.bottom-right-xl .stage-area > div:after {
   display: none;
 }
 .hero.triangle-position.bottom-right-xl .stage-area > div > .textfragment {
   align-self: center;
   padding-left: 15%;
   grid-area: 3 / 2 / span 2 / span 3 !important;
 }
 .hero.triangle-position.right .stage-area > div:before, .hero.triangle-position.right .stage-area > div:after {
   left: 100%;
   translate: 100%;
 }
 .hero.triangle-position.right .stage-area > div:before {
   grid-area: 1 / 3 / span 1 / span 1 !important;
 }
 .hero.triangle-position.right .stage-area > div:after {
   grid-area: 4 / 3 / span 1 / span 1 !important;
 }
 .hero.triangle-position.right .stage-area > div > .textfragment {
   align-self: center;
   padding-left: 33%;
   grid-area: 2 / 3 / span 2 / span 1 !important;
 }
}
.hero.triangle-position.horizontal .stage-area > div:before, .hero.triangle-position.horizontal .stage-area > div:after {
 left: unset;
 height: 25vw;
 top: 50%;
 translate: 0 -50%;
 rotate: none;
}
@media (width >= 576px) {
 .hero.triangle-position.horizontal .stage-area > div:before, .hero.triangle-position.horizontal .stage-area > div:after {
   height: calc(var(--stage-area-height) / 4);
 }
}
.hero.triangle-position.horizontal .stage-area > div:before {
 left: 0;
 grid-area: 3 / 1 / -1 / span 1 !important;
}
@media (width >= 576px) {
 .hero.triangle-position.horizontal .stage-area > div:before {
   grid-area: 2 / 1 / span 2 / span 1 !important;
 }
}
.hero.triangle-position.horizontal .stage-area > div:after {
 right: 0;
 bottom: unset;
 transform-origin: center;
 rotate: 180deg;
 grid-area: 3 / 4 / -1 / -1 !important;
}
@media (width >= 576px) {
 .hero.triangle-position.horizontal .stage-area > div:after {
   grid-area: 2 / 4 / span 2 / -1 !important;
 }
}
.hero.triangle-position.horizontal .stage-area > div > .textfragment {
 place-self: center;
 padding: 0;
 grid-area: 1 / 1 / span 2 / -1 !important;
}
@media (width >= 576px) {
 .hero.triangle-position.horizontal .stage-area > div > .textfragment {
   grid-area: 1 / 1 / span 1 / -1 !important;
 }
}
.hero.triangles-hidden .stage-area > div:before, .hero.triangles-hidden .stage-area > div:after {
 display: none !important;
}
@media (width < 576px) {
 .hero.triangles-hidden .stage-area > div-sm .stage-area > div:before, .hero.triangles-hidden .stage-area > div-sm .stage-area > div:after {
   display: none !important;
 }
}
@media (width >= 576px) {
 .hero.triangles-hidden .stage-area > div-xl:before, .hero.triangles-hidden .stage-area > div-xl:after {
   display: none !important;
 }
}
.hero.header-text.hide-italic span.italic {
 display: none;
}
@media (width < 576px) {
 .hero.header-text.hide-italic-sm span.italic {
   display: none;
 }
}
@media (width >= 576px) {
 .hero.header-text.hide-italic-xl span.italic {
   display: none;
 }
}
.hero.header-text.white .stage-area > div > .textfragment * {
 color: var(--tdk-color-white);
}
.hero.text-hidden .stage-area > div > .textfragment {
 display: none !important;
}
.hero.text-centered .stage-area > div > .textfragment {
 justify-content: center;
 align-items: center;
 display: flex;
}
.hero.text-centered .stage-area > div > .textfragment .richtext > * {
 text-align: center;
}
@media (width < 576px) {
 .hero.text-centered-sm .stage-area > div > .textfragment {
   justify-content: center;
   align-items: center;
   display: flex;
 }
 .hero.text-centered-sm .stage-area > div > .textfragment .richtext > * {
   text-align: center;
 }
}
.hero .stage-area > div > .elementlist > div > .image-wrapper:after, .hero .stage-area > div > .elementlist > div > .video-wrapper:after {
 content: "";
 z-index: -1;
 width: calc(var(--stage-font-size) * 11);
 aspect-ratio: 1;
 border: calc(var(--stage-font-size) * .25) solid var(--tdk-color-blue-30);
 border-left-color: var(--tdk-color-blue);
 border-radius: 50%;
 animation: 1s linear infinite rotate;
 display: block;
 position: absolute;
 top: 50%;
 left: 50%;
 translate: -50% -50%;
}
@keyframes rotate {
 0% {
   transform: rotate(0);
 }
 100% {
   transform: rotate(360deg);
 }
}
@media (width < 576px) {
 .hero .fixed-anchor {
   z-index: 20;
   height: auto;
   position: fixed;
   border-radius: 0 !important;
   inset: auto 0 0 !important;
 }
}
.teaser.teaser-standard {
 --button-text-color: var(--tdk-color-white);
 --button-border-color: transparent;
 --button-bg-color: var(--tdk-color-blue-main);
 border-radius: var(--radius-card);
 box-shadow: var(--shadow-card);
 transition: var(--transition);
 align-items: center;
 overflow: clip;
 background: linear-gradient(to bottom, color-mix(in srgb, var(--color-card-bg) 50%, var(--tdk-color-white)) 0%, var(--color-card-bg) 100%) !important;
}
.teaser.teaser-standard:hover {
 background: linear-gradient(to bottom, color-mix(in srgb, var(--color-card-bg-hover) 50%, var(--tdk-color-white)) 0%, var(--color-card-bg-hover) 100%) !important;
}
.teaser.teaser-standard > * {
 color: var(--tdk-color-blue);
 max-width: unset !important;
}
.teaser.teaser-standard .image-wrapper {
 width: 100% !important;
 margin: unset !important;
}
@media (width > 768px) {
 .teaser.teaser-standard .teaser-meta {
   padding: unset !important;
 }
}
.teaser.teaser-standard .teaser-more {
 margin-top: 1rem !important;
}
.teaser.teaser-standard .teaser-more:before {
 transition: var(--transition);
 display: inline-block;
}
.teaser.teaser-standard .teaser-more .material-icons {
 display: none;
}
.teaser.teaser-standard:hover .teaser-more.btn {
 color: var(--button-text-color) !important;
 background-color: var(--button-bg-color) !important;
 border-color: var(--button-border-color) !important;
}
.teaser.teaser-standard:hover .teaser-more.btn:before {
 background-color: var(--button-text-color) !important;
}
.hide-more .teaser-more {
 display: none !important;
}
.image-wrapper:not(:has(img[src$="png"])) {
 z-index: var(--zx-img-wrapper);
 background: #e5e5e5;
 position: relative;
 overflow: hidden;
}
.image-wrapper:not(:has(img[src$="png"])):after {
 content: "";
 z-index: calc(var(--zx-img-wrapper) + 1);
 background: linear-gradient(105deg, #0000 25%, #ffffff80 55%, #0000 70%);
 animation: 1.5s infinite shimmer;
 position: absolute;
 inset: 0;
 transform: translateX(-100%);
}
.image-wrapper:not(:has(img[src$="png"])) img {
 z-index: calc(var(--zx-img-wrapper) + 2);
 position: relative;
}
@keyframes shimmer {
 to {
   transform: translateX(100%);
 }
}
.stage-area {
 background: linear-gradient(#6f9fcf 0%, #e2e8f2 50%, #d5e2ea 100%);
 display: block !important;
}
@media (width > 768px) {
 .stage-area {
   background: linear-gradient(#fcfcfa 0%, #f4f4f9 50%, #d1e5ee 100%);
 }
}
.stage-area > div > .elementlist {
 display: contents;
}
.stage-area > div > .elementlist:after {
 content: "";
 width: calc(var(--stage-font-size) * 11);
 aspect-ratio: 1;
 border: calc(var(--stage-font-size) * .25) solid var(--tdk-color-blue-30);
 border-left-color: var(--tdk-color-blue);
 border-radius: 50%;
 animation: 1s linear infinite rotate;
 translate: -50% -50%;
 z-index: 0 !important;
 grid-area: 2 / 3 !important;
 display: block !important;
}
.stage-area > div > .elementlist > * {
 z-index: 1 !important;
}
.stage-area > div > .elementlist > div > div.image-wrapper:after {
 display: none !important;
}
body:has(#sticky-navbar):not(.mobile-flyout-is-open) {
 padding-top: unset !important;
}
body:has(#sticky-navbar):not(.mobile-flyout-is-open) header {
 position: relative !important;
}
#sticky-navbar {
 opacity: 0;
 z-index: var(--zx-snavbar);
 height: var(--snavbar-height);
 box-shadow: var(--snavbar-shadow);
 justify-content: space-between;
 align-items: center;
 transition: all .3s ease-in-out;
 display: flex;
 position: fixed;
 inset: 0 0 auto;
 translate: 0 -100%;
 background-color: var(--header-bg) !important;
 margin-top: 0 !important;
 padding: 0 2rem !important;
}
@media (width > 768px) {
 #sticky-navbar {
   box-shadow: var(--snavbar-shadow), var(--shadow-card);
   justify-content: space-around;
   padding: 0 1.5rem !important;
 }
}
@supports (backdrop-filter: initial) {
 #sticky-navbar {
   backdrop-filter: saturate(180%) blur(20px);
 }
}
#sticky-navbar.is-visible {
 opacity: 1;
 translate: 0;
}
#sticky-navbar .textfragment, #sticky-navbar .row, #sticky-navbar .col-12 {
 display: contents;
}
#sticky-navbar h2 {
 cursor: pointer;
 color: var(--tdk-color-black);
 justify-content: flex-start;
 align-items: center;
 gap: var(--gap-10);
 display: inline-flex;
 margin: unset !important;
 font-size: 2rem !important;
 font-weight: 400 !important;
}
@media (width > 768px) {
 #sticky-navbar h2 {
   font-size: 2.6rem !important;
 }
}
#sticky-navbar h2:before {
 content: "";
 background: url("data:image/svg+xml,<svg width='24' height='21.0574' viewBox='0 0 24 21.0574' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M4.39216 21.0574H19.6082L11.9995 16.6058L4.39216 21.0574ZM16.393 8.89964L24 13.3495L16.393 0V8.89964ZM7.60697 0L0 13.3495L7.60697 8.89964V0ZM16.393 0H7.60697L11.9995 4.44982L16.393 0ZM7.60697 8.89964H16.393L11.9995 4.44982L7.60697 8.89964ZM18.0001 14.9787L16.393 8.89964L11.9995 16.6058L18.0001 14.9787ZM19.6082 21.0574L24 13.3495L18.0001 14.9787L19.6082 21.0574ZM5.99921 14.9787L11.9995 16.6058L7.60697 8.89964L5.99921 14.9787ZM0 13.3495L4.39216 21.0574L5.99921 14.9787L0 13.3495Z' fill='%230046AD'/></svg>") center / contain no-repeat;
 flex: 0 0 24px;
 width: 24px;
 height: 21.06px;
}
#sticky-navbar .contents {
 visibility: hidden;
 inset: var(--snavbar-height) 0 auto;
 background: var(--menu-bg);
 max-height: 0;
 transition: all .5s, max-height .3s ease-out;
 display: flex;
 position: absolute;
 overflow: clip;
 box-shadow: 0 2px 5px #00000026;
}
@media (width <= 768px) {
 #sticky-navbar .contents {
   gap: var(--gap-med);
   flex-direction: column;
   padding: 0;
 }
}
@media (width > 768px) {
 #sticky-navbar .contents {
   justify-content: flex-end;
   align-items: center;
   gap: var(--gap-big);
   flex-wrap: nowrap;
 }
}
#sticky-navbar .contents h3, #sticky-navbar .contents h4 {
 font-size: var(--font-size-lg);
 letter-spacing: .36px;
 margin: 0;
 line-height: 2.5rem !important;
}
#sticky-navbar .contents h3 {
 color: var(--menu-heading);
 text-transform: uppercase;
 font-size: 1.54rem;
}
#sticky-navbar .contents h4 {
 color: var(--menu-text);
}
#sticky-navbar .contents .cta {
 background-color: var(--menu-bg);
 box-shadow: var(--snavbar-shadow);
 padding: 1rem 2rem;
 display: flex;
 position: absolute;
 inset: auto 0 0;
}
#sticky-navbar .contents .cta .btn-primary {
 width: 100%;
 margin: unset !important;
}
#sticky-navbar .menu {
 gap: var(--gap-10);
 flex-direction: column;
 min-height: 0;
 margin-bottom: 7.1rem;
 padding-block: 1rem;
 padding-inline: 2rem;
 display: flex;
 overflow-y: auto;
}
#sticky-navbar .menu ul {
 flex-direction: column;
 margin: 0;
 padding: 0;
 list-style: none;
 display: flex;
}
#sticky-navbar .menu ul li {
 margin: 0;
 padding: 0;
}
#sticky-navbar .menu ul a {
 font-size: var(--font-size-lg);
 letter-spacing: .36px;
 color: var(--menu-link);
 text-decoration: none;
}
#sticky-navbar .menu ul a:hover {
 text-decoration: underline;
}
#sticky-navbar .menu ul li > a {
 padding-block: .8rem;
 font-weight: 400;
 line-height: 2.5rem;
 display: block;
}
#sticky-navbar section {
 gap: var(--gap-10);
 flex-direction: column;
 padding-block: 1rem;
 display: flex;
}
#sticky-navbar section + section {
 padding-block: 0;
}
#sticky-navbar .application-cluster {
 border-bottom: 1px solid var(--tdk-color-black-20);
 gap: var(--gap-10);
 flex-direction: column;
 padding-bottom: 2rem;
 display: flex;
}
#sticky-navbar .application-cluster > ul {
 gap: var(--gap-10);
}
#sticky-navbar .application {
 gap: var(--gap-10);
 flex-direction: column;
 display: flex;
}
#sticky-navbar .application li > a {
 padding-left: 1rem;
}
#sticky-navbar button.menu-toggle {
 cursor: pointer;
 appearance: none;
 outline: unset;
 min-width: 2.4rem;
 min-height: 2.4rem;
 color: var(--tdk-color-black);
 justify-content: center;
 align-items: center;
 gap: var(--gap-10);
 background: none;
 border: none;
 flex-shrink: 0;
 padding: 0;
 display: inline-flex;
}
@media (width > 768px) {
 #sticky-navbar button.menu-toggle {
   gap: var(--gap-20);
 }
}
#sticky-navbar button.menu-toggle .label {
 font-size: var(--font-size-lg);
 letter-spacing: .36px;
 white-space: nowrap;
 font-weight: 400;
 line-height: 2.5rem;
 display: none;
}
@media (width > 768px) {
 #sticky-navbar button.menu-toggle .label {
   display: revert;
 }
}
#sticky-navbar button.menu-toggle:after {
 content: "";
 background: url("data:image/svg+xml,<svg width='19.0607' height='10.591' viewBox='0 0 19.0607 10.591' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0.53033 0.53033L9.53033 9.53033L18.5303 0.53033' stroke='currentColor' stroke-width='1.5'/></svg>") center / contain no-repeat;
 flex: none;
 width: 19.06px;
 height: 10.59px;
 margin: -.53px -.53px -1.06px;
 transition: transform .2s;
}
@media (width > 768px) {
 #sticky-navbar.simple .menu-toggle .label {
   display: none;
 }
}
@media (width > 992px) {
 #sticky-navbar.simple .contents {
   visibility: visible;
   display: contents;
 }
 #sticky-navbar.simple .menu {
   display: contents;
 }
 #sticky-navbar.simple .menu > ul {
   display: none;
 }
 #sticky-navbar.simple .application-cluster {
   border-bottom: 0;
   padding-bottom: 0;
 }
 #sticky-navbar.simple .application-cluster > ul {
   white-space: nowrap;
   gap: var(--gap-30);
   flex-direction: row;
 }
 #sticky-navbar.simple .cta {
   box-shadow: none;
   background: none;
   padding: 0;
   position: static;
 }
 #sticky-navbar.simple .cta .btn-primary {
   width: auto;
   min-height: 3rem;
   box-shadow: var(--snavbar-shadow);
   padding: 0 1.5rem;
   font-size: 1.1rem;
 }
 #sticky-navbar.simple .menu-toggle {
   display: none;
 }
}
@media (width > 768px) {
 #sticky-navbar.expandable .contents {
   height: auto;
   box-shadow: var(--shadow-card);
   left: auto;
   right: 15vh;
 }
 #sticky-navbar.expandable .menu {
   flex-direction: row;
   align-items: flex-start;
   margin-bottom: 0;
 }
 #sticky-navbar.expandable section {
   flex: 1 0 0;
   min-width: 1px;
   padding-block: 1rem;
 }
 #sticky-navbar.expandable .cta {
   display: none;
 }
}
#sticky-navbar.is-expanded .contents {
 visibility: visible;
 max-height: calc(100dvh - var(--snavbar-height));
}
#sticky-navbar.is-expanded button.menu-toggle:after {
 transform: scaleY(-1);
}
.key-selection {
 --trans-dur: .5s;
 --trans-eas: ease;
 --link-height: 5.2rem;
 --collapse-height: 100vw;
 z-index: var(--zx-keyselection);
 justify-content: space-between;
 gap: var(--gap-30);
 width: 100vw;
 height: calc(100vh - var(--snavbar-height));
 background: linear-gradient(135deg, #cfd1d4 0%, #aab4bf 50%, #b8b9bc 100%);
 flex-direction: column;
 display: flex;
 position: relative;
 left: 50%;
 right: 50%;
 overflow: clip;
 margin-inline: -50vw !important;
}
@media (width > 768px) {
 .key-selection {
   align-items: flex-start;
 }
}
.key-selection > div > div > div > * {
 padding-block: 3rem;
 padding-inline: 1.5rem;
}
@media (width > 768px) {
 .key-selection > div > div > div > * {
   padding-inline: 2rem;
 }
}
.key-selection .row:not(.elementlist), .key-selection .col-12 {
 display: contents;
}
.key-selection > .textfragment {
 z-index: calc(var(--zx-keyselection) + 5);
 position: relative;
}
.key-selection > .textfragment h2 {
 background-color: var(--tdk-color-white-30);
 transition: opacity var(--trans-dur) var(--trans-eas);
}
@media (width <= 768px) {
 .key-selection > .textfragment h2 {
   font-size: 1.9rem !important;
 }
}
@media (width > 768px) {
 .key-selection > .textfragment h2 {
   font-size: 1.5rem;
 }
}
.key-selection > .textfragment .teaser-text {
 transition: opacity var(--trans-dur) var(--trans-eas);
 font-size: 1.25rem;
 font-weight: 700;
 line-height: 1.4;
}
@media (width > 768px) {
 .key-selection > .textfragment .teaser-text {
   font-size: 1.5rem;
 }
}
.key-selection:has(.open) > .textfragment h2, .key-selection:has(.open) > .textfragment .teaser-text.richtext, .key-selection:has(.open) > .textfragment p {
 opacity: 0;
}
@media (width > 768px) {
 .key-selection:has(.open) > .textfragment h2, .key-selection:has(.open) > .textfragment .teaser-text.richtext, .key-selection:has(.open) > .textfragment p {
   opacity: 1;
 }
}
.key-selection:not(.extended) > .elementlist {
 display: contents;
}
@media (width > 768px) {
 .key-selection:not(.extended) > .elementlist > div:first-child .elementlist > div:first-child {
   display: none;
 }
}
@media (width <= 768px) {
 .key-selection:not(.extended) > .elementlist > div:first-child .elementlist > div:last-child {
   display: none;
 }
}
.key-selection:not(.extended) > .elementlist > div:first-child .elementlist .image-wrapper {
 z-index: calc(var(--zx-keyselection) + 1);
 justify-content: center;
 align-items: center;
 display: flex;
 position: absolute;
 inset: 0;
}
.key-selection:not(.extended) > .elementlist > div:first-child .elementlist .image-wrapper img {
 object-fit: cover;
 max-width: 100%;
 height: 100%;
 display: block;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div {
 display: contents;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist {
 z-index: calc(var(--zx-keyselection) + 1);
 gap: var(--gap-15);
 flex-direction: column;
 margin: 0 auto;
 display: flex;
 position: relative;
}
@media (width > 768px) {
 .key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist {
   width: 40%;
   max-width: 30rem;
   margin: 0;
 }
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist > div {
 width: 100%;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser {
 justify-content: flex-start;
 gap: var(--gap-10);
 border-radius: 6px;
 flex-wrap: nowrap;
 align-items: center;
 display: flex;
 box-shadow: 0 2px 10px #0000000d;
 margin: unset !important;
 color: var(--color-black) !important;
 background: var(--tdk-color-white) !important;
 padding: 1rem !important;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser * {
 color: inherit !important;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser .image-column {
 display: block;
 flex-basis: 3.2rem !important;
 max-width: 3.2rem !important;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser .image-column .image-wrapper img {
 border-radius: 4px;
 width: 100%;
 height: auto;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser .text-column .teaser-meta {
 padding: unset !important;
 flex: auto !important;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser .text-column .teaser-meta .teaser-title {
 margin: 0;
 font-size: 1.6rem;
 font-weight: 600;
 line-height: 1.4;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser:after {
 content: "";
 background: #f2f2f2 url("data:image/svg+xml,<svg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M6.62291 0.625244L6.62291 12.6206M0.625216 6.62294L6.62291 12.6206L12.6206 6.62294' stroke='currentColor' stroke-width='1.25048' stroke-linecap='round' stroke-linejoin='round'/></svg>") center no-repeat;
 border-radius: 50%;
 flex-basis: 3.2rem;
 justify-content: center;
 align-items: center;
 width: 3.2rem;
 height: 3.2rem;
 display: flex;
}
.key-selection:not(.extended) > .elementlist > div:last-child > div .elementlist .teaser .teaser-more {
 display: none !important;
}
@media (width > 768px) {
 .key-selection.extended {
   display: block;
 }
}
.key-selection.extended > .elementlist {
 display: contents;
}
.key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 {
 pointer-events: none;
 position: absolute;
 inset: 0;
 z-index: calc(var(--zx-keyselection) + 1) !important;
}
.key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 > .elementlist {
 display: contents;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 > .elementlist > div > div > .elementlist > div:first-child {
   display: none;
 }
}
@media (width <= 768px) {
 .key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 > .elementlist > div > div > .elementlist > div:last-child {
   display: none;
 }
}
.key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 > .elementlist > div > div > .elementlist .image-wrapper {
 z-index: calc(var(--zx-keyselection) + 1);
 justify-content: center;
 align-items: center;
 display: flex;
 position: absolute;
 inset: 0;
}
.key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 > .elementlist > div > div > .elementlist .image-wrapper img {
 object-fit: cover;
 max-width: 100%;
 height: 100%;
 display: block;
}
.key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 > .elementlist > div:not(:first-child) .image-wrapper {
 opacity: 0;
 transition: opacity var(--trans-dur) var(--trans-eas);
 z-index: calc(var(--zx-keyselection) + 2) !important;
}
.key-selection.extended > .elementlist > div:first-child:has(.bg-images2) .bg-images2 > .elementlist > div > div.active .image-wrapper {
 opacity: 1;
 z-index: calc(var(--zx-keyselection) + 3) !important;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links {
 width: 200vw;
 transition: margin var(--trans-dur) var(--trans-eas);
 margin-left: 0;
 position: relative;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links {
   width: 40%;
   max-width: 40rem;
   margin: 0;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links:has(.open) {
 margin-left: -100vw;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links:has(.open) {
   margin-left: 0;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links > .elementlist {
 flex-direction: column;
 max-width: 100vw;
 display: flex;
 margin-block: unset !important;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links > .elementlist {
   max-width: none;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-wrapper {
 margin-bottom: 2.5rem;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-wrapper > .textfragment h2 {
 z-index: calc(var(--zx-keyselection) + 1);
 font-size: 1.6rem;
 font-weight: 700;
 position: relative;
 margin: unset !important;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-wrapper > .textfragment h2 {
   font-size: 1.8rem;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-wrapper > .elementlist {
 gap: var(--gap-10);
 flex-direction: column;
 display: flex;
 margin-block: 1.5rem 0 !important;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area {
   transition: max-height var(--trans-dur) var(--trans-eas);
   overflow: clip;
   max-height: var(--link-height) !important;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment {
 justify-content: space-between;
 gap: var(--gap-20);
 cursor: pointer;
 border-radius: 6px;
 flex-wrap: nowrap;
 align-items: center;
 display: flex;
 position: relative;
 box-shadow: 0 2px 10px #0000000d;
 z-index: calc(var(--zx-keyselection-link) + 1) !important;
 margin: unset !important;
 color: var(--color-black) !important;
 background: var(--tdk-color-white) !important;
 flex: 1 !important;
 padding: 1rem !important;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment * {
 color: inherit !important;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment {
   justify-content: flex-start;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment:after {
 content: "";
 background: #f2f2f2 url("data:image/svg+xml,<svg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0.75 6.58333H12.4167M6.58333 12.4167L12.4167 6.58333L6.58333 0.75' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") center no-repeat;
 border-radius: 50%;
 flex: 0 0 32px;
 justify-content: center;
 align-items: center;
 width: 32px;
 height: 32px;
 display: flex;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment:after {
   background-image: url("data:image/svg+xml,<svg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0.75 6.75H12.75M6.75 0.75V12.75' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment h2 {
 flex: auto;
 margin: 0;
 font-size: 1.7rem;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment h2 {
   font-size: 1.9rem;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment .image-wrapper {
 order: -1;
 display: block;
 max-width: 4rem !important;
 margin: unset !important;
 flex: 0 0 4rem !important;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .textfragment .image-wrapper img {
 border-radius: 4px;
 width: 100%;
 height: auto;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist {
 z-index: var(--zx-keyselection-link);
 opacity: 0;
 pointer-events: none;
 width: 100vw;
 transition: opacity var(--trans-dur) var(--trans-eas);
 flex-direction: column;
 padding-inline: 1.5rem;
 display: flex;
 position: absolute;
 bottom: 3rem;
 left: 100vw;
 row-gap: var(--gap-10) !important;
 margin: unset !important;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist {
   pointer-events: auto;
   width: auto;
   padding-inline: 0;
   position: relative;
   bottom: auto;
   left: auto;
   row-gap: 0 !important;
 }
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist > div:has(.teaser) .teaser {
   position: relative;
   z-index: calc(var(--zx-keyselection-link) - 2) !important;
   margin-top: -1rem !important;
   padding-top: 2rem !important;
 }
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist > div:has(.teaser) + div:has(.teaser) .teaser {
   z-index: calc(var(--zx-keyselection-link) - 4) !important;
 }
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist > div:has(.teaser) + div:has(.teaser) + div:has(.teaser) .teaser {
   z-index: calc(var(--zx-keyselection-link) - 6) !important;
 }
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist > div:has(.teaser) + div:has(.teaser) + div:has(.teaser) + div:has(.teaser) .teaser {
   z-index: calc(var(--zx-keyselection-link) - 8) !important;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist .button-back {
 opacity: 1;
 box-sizing: content-box;
 cursor: pointer;
 pointer-events: all;
 background-color: #84848466;
 border: 1px solid #ffffff4d;
 border-radius: 100px;
 align-self: flex-start;
 width: 38px;
 height: 38px;
 transition: opacity .5s ease-in-out;
 display: flex;
 overflow: hidden;
 box-shadow: 0 2px 5px #00000026, inset 0 1px #ffffff80, inset 0 -1px #ffffff1a, inset 0 0 5px #fff9;
 color: var(--tdk-color-black) !important;
 padding: 0 !important;
}
@supports (backdrop-filter: initial) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist .button-back {
   backdrop-filter: saturate(180%) blur(20px);
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist .button-back:before {
 content: "";
 background: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M11.9999 17.9978L11.9999 6.00241M6.00217 12.0001L11.9999 6.00241L17.9976 12.0001' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") center no-repeat;
 flex: 0 0 38px;
 justify-content: center;
 align-items: center;
 width: 38px;
 height: 38px;
 display: flex;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist .button-back {
   display: none;
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist .button-back:before {
 rotate: -90deg;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area > .elementlist .button-back > .textfragment {
 display: none;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area.open {
   max-height: calc(var(--link-height) + var(--collapse-height)) !important;
 }
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area.open > .textfragment:after {
   background-image: url("data:image/svg+xml,<svg width='14' height='2' viewBox='0 0 14 2' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0.756836 0.756958H12.5315' stroke='currentColor' stroke-width='1.51389' stroke-linecap='round' stroke-linejoin='round'/></svg>");
 }
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area.open > .elementlist {
 opacity: 1;
 pointer-events: all;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area.open .bg-images .image-wrapper, .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area.open .links-2 {
 opacity: 1;
}
.key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area.open .links-2 {
 left: 100vw;
}
@media (width > 768px) {
 .key-selection.extended > .elementlist > div:last-child:has(.links) .links .link-area.open .links-2 {
   left: auto;
 }
}
.key-selection.extended > .elementlist .teaser {
 justify-content: flex-start;
 gap: var(--gap-10);
 border-radius: 6px;
 flex-wrap: nowrap;
 align-items: center;
 display: flex;
 box-shadow: 0 2px 10px #0000000d;
 margin: unset !important;
 color: var(--color-black) !important;
 background: var(--tdk-color-white) !important;
 padding: 1rem !important;
}
.key-selection.extended > .elementlist .teaser * {
 color: inherit !important;
}
.key-selection.extended > .elementlist .teaser .image-column {
 display: block;
 flex-basis: 3.2rem !important;
 max-width: 3.2rem !important;
}
.key-selection.extended > .elementlist .teaser .image-column .image-wrapper img {
 border-radius: 4px;
 width: 100%;
 height: auto;
}
.key-selection.extended > .elementlist .teaser .text-column .teaser-meta {
 padding: unset !important;
 flex: auto !important;
}
.key-selection.extended > .elementlist .teaser .text-column .teaser-meta .teaser-title {
 margin: 0;
 font-size: 1.6rem;
 font-weight: 600;
 line-height: 1.4;
}
.key-selection.extended > .elementlist .teaser:after {
 content: "";
 background: #f2f2f2 url("data:image/svg+xml,<svg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M6.62291 0.625244L6.62291 12.6206M0.625216 6.62294L6.62291 12.6206L12.6206 6.62294' stroke='currentColor' stroke-width='1.25048' stroke-linecap='round' stroke-linejoin='round'/></svg>") center no-repeat;
 border-radius: 50%;
 flex-basis: 3.2rem;
 justify-content: center;
 align-items: center;
 width: 3.2rem;
 height: 3.2rem;
 display: flex;
}
.key-selection.extended > .elementlist .teaser .teaser-more {
 display: none !important;
}
.key-selection.extended > .elementlist.extended .teaser:not(:has(.image-column)) {
 padding-left: 1.5rem !important;
}
.key-selection.extended > .elementlist + hr {
 display: none !important;
}
:root {
 --portfolio-card-height: 24rem;
 --pic-ratio: 1;
}
body:has(.key-selection) .portfolio {
 --portfolio-card-height: 12rem;
}
.portfolio {
 width: 100%;
 max-width: 1200px;
 margin-inline: auto;
}
.portfolio .col-12, .portfolio .row:not(.elementlist) {
 display: contents;
}
.portfolio > .elementlist {
 flex-direction: column;
 place-items: stretch stretch;
 display: flex;
}
.portfolio .portfolio-area {
 transition: var(--transition);
 position: relative;
 margin: 0 !important;
}
.portfolio .portfolio-area.pic-ratio-16-9 {
 --pic-ratio: calc(16 / 9);
}
.portfolio .portfolio-area.pic-ratio-3-2 {
 --pic-ratio: calc(3 / 2);
}
.portfolio .portfolio-area * {
 transition: var(--transition);
}
.portfolio .portfolio-area > .elementlist {
 margin: 0 !important;
}
@media (width <= 768px) {
 .portfolio .portfolio-area > .elementlist {
   gap: 0 !important;
 }
}
@media (width > 768px) {
 .portfolio .portfolio-area > .elementlist {
   gap: var(--gap-50);
   flex-flow: row;
   display: flex;
 }
 .portfolio .portfolio-area > .elementlist > :first-child {
   flex: 0 1 calc(15% * var(--pic-ratio));
   display: block !important;
 }
}
.portfolio .portfolio-area > .elementlist > :last-child .portfolio-details {
 z-index: var(--zx-portfolio);
 justify-content: center;
 gap: var(--gap-15);
 flex-direction: column;
 width: 100%;
 padding-block: 2rem;
 display: flex;
 position: relative;
 margin: unset !important;
}
@media (width > 768px) {
 .portfolio .portfolio-area > .elementlist > :last-child .portfolio-details {
   flex: 1;
 }
}
.portfolio .portfolio-area > .elementlist > :last-child .portfolio-details > .textfragment h2 {
 margin: 0;
 font-size: 2.2rem;
}
@media (width > 768px) {
 .portfolio .portfolio-area > .elementlist > :last-child .portfolio-details > .textfragment h2 {
   font-size: 2.6rem;
 }
 .portfolio .portfolio-area > .elementlist > :last-child .portfolio-details > .textfragment h5 {
   margin: 0;
 }
}
.portfolio .portfolio-area.portfolio-collapsed {
 background: linear-gradient(to top, var(--color-card-bg) 0%, var(--tdk-color-white) 100%);
 border-radius: var(--radius-big);
 box-shadow: var(--shadow-card);
 cursor: pointer;
 flex-basis: 100%;
 overflow: clip;
 display: none !important;
}
.portfolio .portfolio-area.portfolio-collapsed * {
 color: var(--tdk-color-blue);
}
.portfolio .portfolio-area.portfolio-collapsed:before {
 content: "";
 z-index: var(--zx-product-section);
 cursor: pointer;
 position: absolute;
 inset: 0;
}
.portfolio .portfolio-area.portfolio-collapsed:after {
 content: "+";
 z-index: calc(var(--zx-product-section) - 1);
 color: #333;
 background-color: #ffffffe6;
 border-radius: 50%;
 justify-content: center;
 align-items: center;
 width: 3.6rem;
 height: 3.6rem;
 font-size: 2rem;
 display: flex;
 position: absolute;
 top: 2rem;
 right: 2rem;
 box-shadow: 0 2px 5px #0000001a;
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-collapsed:after {
   background-color: #f0f0f0;
   top: 50%;
   right: 3rem;
   transform: translateY(-50%);
 }
}
.portfolio .portfolio-area.portfolio-collapsed > .elementlist {
 height: var(--portfolio-card-height);
}
.portfolio .portfolio-area.portfolio-collapsed > .elementlist > :first-child:before {
 content: "";
 z-index: var(--zx-portfolio);
 background: linear-gradient(to top, #fff 0%, #fffc 50%, #fff0 100%);
 position: absolute;
 inset: 0;
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :first-child:before {
   content: none;
 }
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :first-child div:not(.image-wrapper) {
   display: contents;
 }
}
.portfolio .portfolio-area.portfolio-collapsed > .elementlist > :first-child .image-wrapper {
 aspect-ratio: var(--pic-ratio);
 height: 100% !important;
 margin: 0 !important;
}
@media (width <= 768px) {
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :first-child .image-wrapper {
   z-index: 0;
   position: absolute;
   inset: 0;
 }
}
.portfolio .portfolio-area.portfolio-collapsed > .elementlist > :first-child .image-wrapper img {
 object-fit: cover;
 width: 100%;
 height: 100%;
}
.portfolio .portfolio-area.portfolio-collapsed > .elementlist > :first-child .elementlist {
 display: none !important;
}
.portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details {
 justify-content: flex-end;
 gap: var(--gap-10);
}
@media (width <= 768px) {
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details {
   padding: 2rem;
 }
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details {
   justify-content: center;
   gap: var(--gap-15);
   padding-right: 8rem;
 }
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details .textfragment {
   display: contents;
 }
}
@media (width <= 768px) {
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details .textfragment .teaser-text {
   display: none !important;
 }
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details .textfragment .teaser-text {
   display: contents;
 }
 .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details .textfragment .teaser-text p, .portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details .textfragment .teaser-text ul {
   display: none !important;
 }
}
.portfolio .portfolio-area.portfolio-collapsed > .elementlist > :last-child .portfolio-details .elementlist {
 display: none !important;
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :first-child {
   top: calc(var(--snavbar-height) + 2rem);
   flex: 0 40%;
   align-self: flex-start;
   position: sticky;
 }
}
@media (width > 992px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :first-child {
   --main-box: 960px;
   --left-col: .3;
   --image-width: calc(((100vw - var(--main-box)) / 2) + (var(--main-box) * var(--left-col)) - 10rem);
   height: calc(var(--image-width) / var(--pic-ratio) + 5rem);
 }
}
@media (width > 1200px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :first-child {
   --main-box: 1200px;
   --left-col: .4;
 }
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :first-child div {
 display: contents;
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :first-child .image-wrapper {
 aspect-ratio: var(--pic-ratio);
 width: calc(100% + 4rem);
 margin-inline: -2rem;
 display: block !important;
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :first-child .image-wrapper {
   width: auto;
   margin-inline: 0;
 }
}
@media (width > 992px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :first-child .image-wrapper {
   width: var(--image-width);
   position: absolute;
   right: 0;
 }
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details {
 width: 100%;
 gap: var(--gap-50) !important;
 padding-inline: unset !important;
}
@media (width > 1200px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details {
   padding-block: 5rem;
 }
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .textfragment {
 gap: var(--gap-15);
 flex-direction: column;
 width: 100%;
 display: flex;
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .textfragment {
   gap: var(--gap-20);
 }
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .textfragment h2 {
 font-size: 2.6rem !important;
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .textfragment .teaser-text .richtext {
 gap: var(--gap-20);
 flex-direction: column;
 display: flex;
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .textfragment .teaser-text .richtext * {
 margin: unset !important;
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .textfragment ul {
 gap: var(--gap-05);
 flex-direction: column;
 display: flex;
 margin: unset !important;
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .elementlist {
 gap: var(--gap-30);
 flex-direction: column;
 width: 100%;
 display: flex;
 margin: unset !important;
}
@media (width > 992px) {
 .portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .elementlist {
   gap: var(--gap-50);
 }
}
.portfolio .portfolio-area.portfolio-open > .elementlist > :last-child .portfolio-details > .elementlist > * {
 width: 100%;
}
.portfolio .portfolio-area.portfolio-open:has(.product-filters) .product-cluster {
 scroll-margin-top: 5rem !important;
}
@media (width > 768px) {
 .portfolio .portfolio-area.portfolio-open:has(.product-filters) .product-cluster {
   scroll-margin-top: 7rem !important;
 }
}
.portfolio:has(:not(.portfolio-open)) {
 transition: max-height .5s ease-in-out;
 position: relative;
 overflow-y: clip;
 max-height: 0 !important;
 padding-block: 0 !important;
}
.portfolio:has(:not(.portfolio-open)) .portfolio-area {
 opacity: 0;
 transition: opacity .5s ease-in-out;
 display: none !important;
}
.portfolio .button-close {
 z-index: var(--zx-btn-close);
 opacity: 0;
 box-sizing: content-box;
 cursor: pointer;
 pointer-events: all;
 background-color: #84848466;
 border: 1px solid #ffffff4d;
 border-radius: 100px;
 width: 38px;
 height: 38px;
 transition: opacity .5s ease-in-out;
 display: flex;
 position: fixed;
 top: 8.5rem;
 right: 1.5rem;
 overflow: hidden;
 box-shadow: 0 2px 5px #00000026, inset 0 1px #ffffff80, inset 0 -1px #ffffff1a, inset 0 0 5px #fff9;
 color: var(--tdk-color-black) !important;
 padding: 0 !important;
}
@supports (backdrop-filter: initial) {
 .portfolio .button-close {
   backdrop-filter: saturate(180%) blur(20px);
 }
}
.portfolio .button-close:before {
 content: "";
 background: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M17.4668 5.47119C17.7597 5.1783 18.2344 5.17831 18.5273 5.47119C18.8202 5.76408 18.8202 6.23885 18.5273 6.53174L13.0586 11.9995L18.5273 17.4683C18.8202 17.7611 18.8202 18.2359 18.5273 18.5288C18.2345 18.8217 17.7597 18.8217 17.4668 18.5288L12 13.062L6.53223 18.5288C6.23938 18.8217 5.76458 18.8216 5.47168 18.5288C5.17916 18.2359 5.17891 17.761 5.47168 17.4683L10.9385 11.9995L5.47168 6.53174C5.17889 6.23894 5.17907 5.7641 5.47168 5.47119C5.76458 5.17844 6.23938 5.17835 6.53223 5.47119L12 10.938L17.4668 5.47119Z' fill='currentColor'/></svg>") center no-repeat;
 flex: 0 0 38px;
 justify-content: center;
 align-items: center;
 width: 38px;
 height: 38px;
 display: flex;
}
.portfolio .button-close > .textfragment {
 display: none;
}
.portfolio:has(.portfolio-open) {
 max-height: 1000vh !important;
}
.portfolio:has(.portfolio-open) #inner > .elementlist > div > div > .textfragment {
 display: none !important;
}
.portfolio:has(.portfolio-open) .portfolio-area.portfolio-open {
 opacity: 1;
 display: block !important;
}
.portfolio:has(.portfolio-open) .button-close {
 opacity: 1;
 pointer-events: auto;
}
#portfolio_sdv .portfolio-area.portfolio-collapsed, #portfolio_sdv .portfolio-area.portfolio-collapsed > .elementlist > :first-child .image-wrapper {
 max-height: 250px;
}
@media (width > 992px) {
 #portfolio_sdv .portfolio-area.portfolio-open > .elementlist > :first-child {
   --main-box: 960px;
   --left-col: .3;
   --image-width: calc(((100vw - var(--main-box)) / 2) + (var(--main-box) * var(--left-col)) - 10rem);
   height: calc(var(--image-width) + 5rem);
 }
}
.portfolio .product-filters {
 --margin: 2rem;
 top: var(--snavbar-height);
 z-index: calc(var(--zx-product-card) + 10);
 justify-content: flex-end;
 align-self: flex-start;
 align-items: center;
 gap: var(--gap-10);
 width: calc(100% + var(--margin) * 2);
 padding: 1rem var(--margin);
 background-color: var(--header-bg);
 border-bottom: 1px solid #ccc;
 flex-wrap: nowrap;
 display: flex;
 position: sticky;
 margin: 0 calc(var(--margin) * -1) !important;
}
@supports (backdrop-filter: initial) {
 .portfolio .product-filters {
   backdrop-filter: blur(30px);
 }
}
@media (width > 768px) {
 .portfolio .product-filters {
   top: calc(var(--snavbar-height) + 2rem);
   border-radius: var(--radius-card);
   box-shadow: var(--shadow-card);
   border-bottom: 0;
 }
}
.portfolio .product-filters:before {
 content: "Filter Products:";
 flex: 1;
 justify-self: flex-start;
 font-size: 1.4rem !important;
}
@media (width > 768px) {
 .portfolio .product-filters:before {
   font-size: 1.6rem !important;
 }
}
.portfolio .product-filters a.filter {
 color: var(--color-blue);
 background-color: var(--tdk-color-white);
 border: 1.5px solid var(--color-blue);
 border-radius: var(--radius-base);
 cursor: pointer;
 padding: .6rem .8rem;
 line-height: 1;
 text-decoration: none;
 font-size: 1.4rem !important;
}
@media (width > 768px) {
 .portfolio .product-filters a.filter {
   font-size: 1.6rem !important;
 }
}
.portfolio .product-filters a.filter.active-filter {
 color: var(--tdk-color-white);
 background-color: var(--color-blue);
}
.portfolio .benefits * {
 margin: unset !important;
}
.portfolio .benefits > .elementlist {
 flex-direction: column;
 width: 100%;
 display: flex;
 gap: var(--gap-20) !important;
}
.portfolio .benefits > .elementlist .benefit {
 align-items: flex-start;
 gap: var(--gap-15);
 border-radius: 6.669px;
 width: 100%;
 display: flex;
 position: relative;
}
.portfolio .benefits > .elementlist .benefit:before {
 content: "";
 flex: 0 0 var(--icon-check-size);
 width: var(--icon-check-size);
 height: var(--icon-check-size);
 background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M23.0645 10.9328V11.9554C23.0631 14.3523 22.287 16.6846 20.8518 18.6044C19.4166 20.5242 17.3993 21.9287 15.1007 22.6083C12.8022 23.2879 10.3455 23.2063 8.09705 22.3756C5.84865 21.5449 3.92899 20.0097 2.62438 17.9989C1.31978 15.9881 0.700124 13.6094 0.857835 11.2177C1.01555 8.82593 1.94217 6.54924 3.49952 4.72715C5.05687 2.90505 7.16149 1.63519 9.4995 1.10695C11.8375 0.578705 14.2837 0.820383 16.4731 1.79594M8.61451 10.8439L11.9491 14.1785L23.0645 3.06309' stroke='currentColor' stroke-width='1.66731' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
.portfolio .benefits > .elementlist .benefit .textfragment {
 gap: var(--gap-05);
 flex-direction: column;
 flex: 1 1 0;
 min-width: 0;
 display: flex;
}
.portfolio .benefits > .elementlist .benefit .textfragment h2 {
 font-size: var(--font-size-h5) !important;
}
.portfolio .benefits > .elementlist .benefit .teaser-text .richtext p {
 font-size: var(--font-size-base);
 letter-spacing: .3px;
 font-weight: 400;
}
.portfolio .product-cluster {
 gap: var(--gap-30);
 flex-direction: column;
 width: 100%;
 max-height: 2000px;
 transition: max-height .5s ease-in-out;
 display: flex;
 padding-top: 2rem !important;
}
.portfolio .product-cluster > .textfragment {
 gap: var(--gap-20);
 flex-direction: column;
 width: 100%;
 display: flex;
}
.portfolio .product-cluster > .textfragment h2 {
 margin: unset !important;
 font-size: 2.2rem !important;
}
.portfolio .product-cluster > .textfragment h5 {
 margin-bottom: var(--gap-20) !important;
}
.portfolio .product-cluster > .textfragment .teaser-text .richtext {
 display: contents;
}
.portfolio .product-cluster > .elementlist {
 --margin-extra: 5px;
 width: calc(100% + 2 * var(--margin-extra));
 flex-direction: column;
 transition: max-height .5s ease-in-out;
 display: flex;
 gap: var(--gap-20) !important;
 margin-inline: calc(var(--margin-extra) * -1) !important;
 margin-block: unset !important;
 padding: var(--margin-extra) !important;
}
.portfolio .product-cluster > .elementlist:has( > :nth-child(4)):not(.is-expanded) {
 --fade-color: #f8fafc;
 cursor: pointer;
 flex-wrap: nowrap;
 max-height: 280px;
 position: relative;
 overflow: hidden;
}
.portfolio .product-cluster > .elementlist:has( > :nth-child(4)):not(.is-expanded):before {
 content: "";
 z-index: calc(var(--zx-product-card) + 5);
 background: linear-gradient(to bottom, transparent 0%, var(--fade-color) 85%);
 height: 130px;
 position: absolute;
 inset: auto -5px -5px;
}
.portfolio .product-cluster > .elementlist:has( > :nth-child(4)):not(.is-expanded):after {
 content: "+ Expand section";
 z-index: calc(var(--zx-product-card) + 6);
 text-align: center;
 color: var(--tdk-color-white);
 background-color: var(--color-blue);
 border-radius: var(--radius-base);
 box-shadow: var(--shadow-card);
 padding: .8rem 1.2rem;
 font-size: 1.4rem;
 line-height: 1;
 display: inline-block;
 position: absolute;
 bottom: 10px;
 left: 50%;
 translate: -50%;
}
.portfolio .product-cluster > .elementlist:has( > :nth-child(4)):not(.is-expanded):hover:after {
 background-color: var(--tdk-color-blue);
}
.portfolio .product-cluster > .elementlist > div:has(.series) .series {
 z-index: calc(var(--zx-product-card) - 2) !important;
}
.portfolio .product-cluster > .elementlist > div:has(.series) + div:has(.series) .series {
 z-index: calc(var(--zx-product-card) - 4) !important;
}
.portfolio .product-cluster > .elementlist > div:has(.series) + div:has(.series) + div:has(.series) .series {
 z-index: calc(var(--zx-product-card) - 6) !important;
}
.portfolio .product-cluster > .elementlist > div:has(.series) + div:has(.series) + div:has(.series) + div:has(.series) .series {
 z-index: calc(var(--zx-product-card) - 8) !important;
}
.portfolio .product-card {
 z-index: var(--zx-product-card);
 width: 100%;
 transition: max-height .5s;
 position: relative;
 margin: unset !important;
 flex: 1 0 auto !important;
}
.portfolio .product-card a {
 grid-template-columns: var(--img-width) auto;
 gap: var(--gap-20);
 grid-template-rows: auto;
 height: auto !important;
 margin: unset !important;
 padding: var(--gap-10) !important;
 display: grid !important;
}
@media (width > 768px) {
 .portfolio .product-card a {
   gap: var(--gap-30);
   padding: var(--gap-15) !important;
 }
}
.portfolio .product-card a > * {
 display: contents;
}
.portfolio .product-card a * {
 color: var(--tdk-color-blue);
 font-size: 1.5rem !important;
}
.portfolio .product-card a .image-wrapper {
 grid-area: 1 / 1;
 justify-content: center;
 align-items: center;
 display: flex;
 overflow: hidden;
}
.portfolio .product-card a .teaser-meta {
 grid-area: 1 / 2;
 align-self: center;
 padding: unset !important;
}
.portfolio .product-card a .teaser-meta h3 {
 font-size: 2rem;
 font-weight: 700;
 margin: unset !important;
}
.portfolio .product-card a .teaser-meta .teaser-text {
 padding: unset;
 display: block !important;
}
@media (width <= 768px) {
 .portfolio .product-card a .teaser-more {
   text-align: left;
   white-space: normal;
   white-space-collapse: unset;
   display: inline-block;
   position: relative;
   padding: unset !important;
   background: unset !important;
   border: unset !important;
   padding-left: 1.2em !important;
 }
 .portfolio .product-card a .teaser-more:before {
   position: absolute;
   top: .17em;
   left: 0;
 }
 .portfolio .product-card a .teaser-more span {
   display: inline;
 }
 .portfolio .product-card a:hover .teaser-more {
   background-color: #0000;
   color: var(--tdk-color-blue) !important;
   border-color: #0000 !important;
 }
}
.portfolio .product-card.active-card a {
 box-shadow: var(--shadow-card), 0 0 5px var(--color-blue);
}
.portfolio .product-card:not(.series).flag:after {
 text-transform: uppercase;
 color: var(--color-blue);
 padding: 2px 6px;
 font-size: 12px;
 font-weight: bold;
 position: absolute;
 top: 0;
 right: 0;
}
.portfolio .product-card:not(.series).flag.psu:after {
 content: "psu";
}
.portfolio .product-card:not(.series).flag.sst:after {
 content: "sst";
}
.portfolio .product-card:not(.series).flag.psu.sst:after {
 content: "psu + sst";
}
.portfolio .product-card:not(.series).flag.ups:after {
 content: "ups";
}
.portfolio .product-card:not(.series).flag.psu.ups:after {
 content: "psu + ups";
}
.portfolio .product-card:not(.series).flag.sst.ups:after {
 content: "sst + ups";
}
.portfolio .product-card:not(.series).flag.computing:after {
 content: "comp";
}
.portfolio .product-card:not(.series).flag.optical:after {
 content: "opt";
}
.portfolio .product-card:not(.series).flag.computing.optical:after {
 content: "comp + opt";
}
.portfolio .product-card:not(.series).flag .teaser-meta {
 padding-top: var(--gap-05) !important;
}
.portfolio .product-card.series {
 margin-top: -3.5rem !important;
}
.portfolio .product-card.series a {
 padding-top: var(--gap-20) !important;
}
@media (width > 768px) {
 .portfolio .product-card.series a {
   padding-top: var(--gap-30) !important;
 }
}
.portfolio .product-card.series a .teaser-meta {
 padding-top: var(--gap-05) !important;
}
.portfolio .product-card.series a .teaser-meta h3, .portfolio .product-card.series a .teaser-meta .teaser-text {
 display: none !important;
}
.portfolio .product-card.series a .teaser-meta .teaser-more {
 margin: unset !important;
}
.portfolio2 {
 width: 100%;
 max-width: 1200px;
 margin-inline: auto;
}
.portfolio2 .col-12, .portfolio2 .row:not(.elementlist) {
 display: contents;
}
.portfolio2 > .elementlist {
 flex-direction: column;
 place-items: stretch stretch;
 display: flex;
}
.portfolio2 > .elementlist > div > div > .textfragment {
 font-variant: all-small-caps;
}
.portfolio2 #col-2 > .elementlist {
 display: flex;
}
@media (width > 768px) {
 .portfolio2 #col-2 > .elementlist {
   flex-wrap: nowrap;
 }
 .portfolio2 #col-2 > .elementlist > * {
   flex: 50%;
 }
}
.portfolio2 .portfolio2-area {
 flex: 100%;
}
.portfolio2 .portfolio2-area > .elementlist {
 flex-direction: column;
 display: flex;
}
@media (width > 768px) {
 .portfolio2 .portfolio2-area > .elementlist {
   flex-flow: row;
 }
}
.portfolio2 .portfolio2-area > .elementlist * {
 flex: 0 auto;
}
.portfolio2 .portfolio2-area > .elementlist .teaser {
 background: linear-gradient(to top, var(--color-card-bg) 0%, var(--tdk-color-white) 100%);
 border-radius: var(--radius-big);
 height: 10rem;
 box-shadow: var(--shadow-card);
 flex: 100%;
 justify-content: flex-start;
 position: relative;
 overflow: clip;
}
@media (width <= 768px) {
 .portfolio2 .portfolio2-area > .elementlist .teaser {
   flex-wrap: nowrap;
 }
}
@media (width > 768px) {
 .portfolio2 .portfolio2-area > .elementlist .teaser {
   flex-direction: column;
   flex: 50%;
   place-content: flex-start flex-end;
   height: 16rem !important;
 }
 .portfolio2 .portfolio2-area > .elementlist .teaser:after {
   content: "+";
   z-index: calc(var(--zx-product-section) - 1);
   color: #333;
   background-color: #ffffffe6;
   border-radius: 50%;
   justify-content: center;
   align-items: center;
   width: 3.6rem;
   height: 3.6rem;
   font-size: 2rem;
   display: flex;
   position: absolute;
   top: 2rem;
   right: 2rem;
   box-shadow: 0 2px 5px #0000001a;
 }
}
.portfolio2 .portfolio2-area > .elementlist .teaser > * {
 color: var(--tdk-color-blue);
}
@media (width <= 768px) {
 .portfolio2 .portfolio2-area > .elementlist .teaser .image-wrapper {
   flex: 0 0 10rem;
 }
}
@media (width > 768px) {
 .portfolio2 .portfolio2-area > .elementlist .teaser .image-column:before {
   content: "";
   z-index: var(--zx-product-section);
   background: linear-gradient(to top, #fff 0%, #fffc 50%, #fff0 100%);
   position: absolute;
   inset: 0;
 }
 .portfolio2 .portfolio2-area > .elementlist .teaser .image-column .image-wrapper {
   z-index: 0;
   position: absolute;
   inset: 0;
   height: 100% !important;
   margin: 0 !important;
 }
 .portfolio2 .portfolio2-area > .elementlist .teaser .image-column .image-wrapper img {
   object-fit: cover;
   width: 100%;
   height: 100%;
 }
}
.portfolio2 .portfolio2-area > .elementlist .teaser .text-column {
 justify-content: flex-end;
 gap: var(--gap-10);
 padding: 2rem;
}
.portfolio2 .portfolio2-area > .elementlist .teaser .text-column .teaser-meta {
 z-index: calc(var(--zx-product-section) + 10);
 position: relative;
 padding-inline: 1rem !important;
}
.portfolio2 .portfolio2-area > .elementlist .teaser .text-column .teaser-meta h3 {
 margin: 0;
 font-weight: var(--font-weight-med) !important;
}
@media (width <= 768px) {
 .portfolio2 .portfolio2-area > .elementlist .teaser .text-column .teaser-meta h3 {
   font-size: 2rem;
 }
}
@media (width > 768px) {
 .portfolio2 .portfolio2-area > .elementlist .teaser .text-column .teaser-meta h3 {
   padding-bottom: 1.5rem;
 }
}
.portfolio2 .portfolio2-area > .elementlist .teaser .text-column .teaser-more {
 display: none !important;
}
#application-guide div, #application-guide a.teaser {
 margin-bottom: unset;
}
@media (width > 768px) {
 #application-guide a.teaser {
   --gutter: var(--gap-30);
   gap: var(--gutter);
 }
 #application-guide a.teaser > :first-child {
   --colsize: calc(3 * var(--colfract) - var(--gutter)) !important;
 }
 #application-guide a.teaser > :last-child {
   --colsize: calc(9 * var(--colfract) - var(--gutter)) !important;
 }
}
#why-tdk .row:not(.elementlist), #why-tdk .col-12, .soft-proof .row:not(.elementlist), .soft-proof .col-12 {
 display: contents;
 padding-inline: unset !important;
 margin-inline: unset !important;
}
#why-tdk .inner, .soft-proof .inner {
 gap: var(--gap-30);
 flex-direction: column;
 display: flex;
}
@media (width > 768px) {
 #why-tdk .inner, .soft-proof .inner {
   gap: var(--gap-50);
 }
}
#why-tdk .inner h2, #why-tdk .inner p, #why-tdk .inner ul, .soft-proof .inner h2, .soft-proof .inner p, .soft-proof .inner ul {
 margin: 0;
 padding: 0;
}
#why-tdk .inner ul, .soft-proof .inner ul {
 list-style: none;
}
#why-tdk .inner .textfragment, #why-tdk .inner .textfragment h2, .soft-proof .inner .textfragment, .soft-proof .inner .textfragment h2 {
 flex-direction: column;
 display: flex;
}
#why-tdk .inner > .textfragment, .soft-proof .inner > .textfragment {
 gap: var(--gap-15);
}
@media (width > 768px) {
 #why-tdk .inner > .textfragment, .soft-proof .inner > .textfragment {
   gap: var(--gap-20);
 }
}
#why-tdk .inner > .textfragment h2, .soft-proof .inner > .textfragment h2 {
 gap: var(--gap-15);
 font-size: var(--font-size-h3);
}
@media (width > 768px) {
 #why-tdk .inner > .textfragment h2, .soft-proof .inner > .textfragment h2 {
   gap: var(--gap-20);
   line-height: 1.2;
 }
}
#why-tdk .inner > .textfragment h2 span, .soft-proof .inner > .textfragment h2 span {
 font-size: var(--font-size-h5);
 color: var(--tdk-color-blue-main);
 text-transform: uppercase;
 display: block;
}
#why-tdk .inner > .textfragment h2:after, .soft-proof .inner > .textfragment h2:after {
 content: "";
 background: var(--tdk-color-blue-main);
 border-radius: 2px;
 width: 48px;
 height: 3px;
}
@media (width > 768px) {
 #why-tdk .inner > .textfragment h2:after, .soft-proof .inner > .textfragment h2:after {
   width: 80px;
   height: 4px;
 }
}
#why-tdk .inner > .textfragment .teaser-text, .soft-proof .inner > .textfragment .teaser-text {
 font-size: var(--font-size-base);
 color: var(--tdk-color-black);
}
#why-tdk .inner > .elementlist, .soft-proof .inner > .elementlist {
 gap: var(--gap-30);
 flex-direction: column;
 display: flex;
 margin-top: unset !important;
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist, .soft-proof .inner > .elementlist {
   gap: var(--gap-50);
 }
}
#why-tdk .inner > .elementlist > .col-12, .soft-proof .inner > .elementlist > .col-12 {
 flex: none;
 width: 100%;
 max-width: 100%;
}
#why-tdk .inner > .elementlist > .col-12 > div > .elementlist, .soft-proof .inner > .elementlist > .col-12 > div > .elementlist {
 flex-direction: column;
 display: flex;
}
#why-tdk .inner > .elementlist > .col-12 > div > .elementlist > .col-12, .soft-proof .inner > .elementlist > .col-12 > div > .elementlist > .col-12 {
 flex: none;
 width: 100%;
 max-width: 100%;
 display: flex;
}
#why-tdk .inner > .elementlist > .col-12 > div > .elementlist > .col-12 > .textfragment, .soft-proof .inner > .elementlist > .col-12 > div > .elementlist > .col-12 > .textfragment {
 flex: auto;
 min-width: 0;
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist {
 gap: var(--gap-20);
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist {
   gap: var(--gap-30);
   flex-direction: row;
 }
 #why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 {
   flex: 1 1 0;
   width: auto;
 }
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment {
 gap: var(--gap-05);
 background: #fff;
 border: 1px solid #e5e8eb;
 border-radius: 12px;
 padding: 20px;
 box-shadow: 0 2px 5px #0003;
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment {
   gap: var(--gap-10);
   border-radius: 16px;
   padding: 32px;
 }
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment:before, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment:before {
 content: "";
 box-sizing: content-box;
 background-color: #e9f0f2;
 background-position: center;
 background-repeat: no-repeat;
 background-size: 28px 28px;
 background-origin: content-box;
 border-radius: 100px;
 align-self: flex-start;
 width: 28px;
 height: 28px;
 margin-bottom: 8px;
 padding: 8px;
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment:before, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment:before {
   margin-bottom: 12px;
   padding: 16px;
 }
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2 {
 gap: var(--gap-05);
 font-size: var(--font-size-h4);
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2 {
   gap: var(--gap-10);
 }
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2 span, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2 span {
 text-transform: uppercase;
 color: var(--tdk-color-blue-main);
 font-weight: 700;
 display: block;
 font-size: var(--font-size-h6) !important;
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2 span, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment h2 span {
   text-transform: none;
 }
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment .teaser-text, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12 > .textfragment .teaser-text {
 font-size: var(--font-size-sm);
 color: #59595a;
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12:first-child > .textfragment:before, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12:first-child > .textfragment:before {
 background-image: url("data:image/svg+xml,<svg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M14.0013 17.4991V23.3324C14.0013 23.3324 17.5363 22.6907 18.668 20.9991C19.928 19.1091 18.668 15.1657 18.668 15.1657M14.0013 17.4991C15.6308 16.8789 17.1941 16.0972 18.668 15.1657M14.0013 17.4991L10.5013 13.9994M10.5013 13.9994C11.1221 12.3887 11.9039 10.8448 12.8346 9.39102C14.194 7.2175 16.0869 5.42791 18.3331 4.19246C20.5794 2.95701 23.1044 2.31679 25.668 2.33269C25.668 5.50602 24.758 11.0824 18.668 15.1657M10.5013 13.9994L4.66797 13.9986C4.66797 13.9986 5.30964 10.4636 7.0013 9.33193C8.8913 8.07193 12.8346 9.39102 12.8346 9.39102M5.2513 19.2494C3.5013 20.7194 2.91797 25.0828 2.91797 25.0828C2.91797 25.0828 7.2813 24.4994 8.7513 22.7494C9.57964 21.7694 9.56797 20.2644 8.6463 19.3544C8.19283 18.9216 7.59548 18.6715 6.9689 18.6521C6.34232 18.6328 5.73066 18.8455 5.2513 19.2494Z' stroke='%23000' stroke-width='2' stroke-linecap='round'/></svg>");
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12:nth-child(2) > .textfragment:before, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12:nth-child(2) > .textfragment:before {
 background-image: url("data:image/svg+xml,<svg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M18.4852 5.42532C18.2844 5.37288 18.1013 5.26784 17.9546 5.12103L15.9911 3.15739C15.7296 2.89584 15.4191 2.68836 15.0774 2.54681C14.7357 2.40525 14.3695 2.3324 13.9996 2.3324C13.6298 2.3324 13.2635 2.40525 12.9218 2.54681C12.5801 2.68836 12.2697 2.89584 12.0081 3.15739L10.0446 5.11987C9.89785 5.26653 9.79282 5.44969 9.74038 5.65048C9.68795 5.85126 9.69001 6.0624 9.74636 6.26212C9.80271 6.46184 9.91129 6.64292 10.0609 6.78669C10.2106 6.93045 10.3958 7.03171 10.5976 7.08001C11.1018 7.20095 11.5646 7.45411 11.9384 7.81341C12.3122 8.1727 12.5835 8.62515 12.7243 9.12416C12.8651 9.62317 12.8704 10.1507 12.7396 10.6524C12.6088 11.1541 12.3466 11.6119 11.98 11.9786C11.6135 12.3453 11.1558 12.6077 10.6542 12.7387C10.1525 12.8697 9.62505 12.8646 9.12603 12.7239C8.62702 12.5832 8.17451 12.3121 7.81512 11.9384C7.45572 11.5647 7.20243 11.1019 7.08133 10.5978C7.03303 10.3959 6.93178 10.2107 6.78803 10.061C6.64427 9.91135 6.46321 9.80276 6.2635 9.74641C6.0638 9.69006 5.85268 9.68799 5.65191 9.74043C5.45114 9.79287 5.26799 9.89791 5.12133 10.0447L3.15784 12.0084C2.89631 12.2699 2.68884 12.5804 2.5473 12.9221C2.40576 13.2639 2.33291 13.6301 2.33291 14C2.33291 14.3699 2.40576 14.7361 2.5473 15.0779C2.68884 15.4196 2.89631 15.7301 3.15784 15.9916L5.12133 17.9541C5.26813 18.1008 5.37316 18.2839 5.4256 18.4847C5.47803 18.6855 5.47597 18.8966 5.41962 19.0964C5.36328 19.2961 5.25469 19.4772 5.10505 19.6209C4.95541 19.7647 4.77014 19.866 4.56834 19.9143C4.06418 20.0352 3.60137 20.2884 3.22757 20.6477C2.85377 21.007 2.58249 21.4594 2.44168 21.9584C2.30086 22.4574 2.29559 22.9849 2.42641 23.4867C2.55723 23.9884 2.81941 24.4462 3.18596 24.8129C3.5525 25.1796 4.01016 25.4419 4.5118 25.5729C5.01344 25.7039 5.54093 25.6988 6.03995 25.5581C6.53896 25.4175 6.99147 25.1463 7.35086 24.7726C7.71026 24.3989 7.96355 23.9362 8.08466 23.432C8.13295 23.2302 8.2342 23.0449 8.37795 22.8953C8.52171 22.7456 8.70277 22.637 8.90248 22.5807C9.10219 22.5243 9.31331 22.5222 9.51407 22.5747C9.71484 22.6271 9.89799 22.7322 10.0446 22.879L12.0081 24.8426C12.2697 25.1042 12.5801 25.3116 12.9218 25.4532C13.2635 25.5947 13.6298 25.6676 13.9996 25.6676C14.3695 25.6676 14.7357 25.5947 15.0774 25.4532C15.4191 25.3116 15.7296 25.1042 15.9911 24.8426L17.9546 22.8801C18.1014 22.7335 18.2064 22.5503 18.2589 22.3495C18.3113 22.1487 18.3093 21.9376 18.2529 21.7379C18.1966 21.5382 18.088 21.3571 17.9383 21.2133C17.7887 21.0695 17.6034 20.9683 17.4016 20.92C16.8975 20.799 16.4347 20.5459 16.0609 20.1866C15.6871 19.8273 15.4158 19.3748 15.275 18.8758C15.1341 18.3768 15.1289 17.8493 15.2597 17.3476C15.3905 16.8459 15.6527 16.3881 16.0192 16.0214C16.3858 15.6547 16.8434 15.3923 17.3451 15.2613C17.8467 15.1303 18.3742 15.1354 18.8732 15.2761C19.3722 15.4168 19.8248 15.6879 20.1841 16.0616C20.5435 16.4353 20.7968 16.8981 20.9179 17.4022C20.9662 17.6041 21.0675 17.7893 21.2112 17.939C21.355 18.0886 21.5361 18.1972 21.7358 18.2536C21.9355 18.3099 22.1466 18.312 22.3474 18.2596C22.5481 18.2071 22.7313 18.1021 22.8779 17.9553L24.8414 15.9916C25.103 15.7301 25.3104 15.4196 25.452 15.0779C25.5935 14.7361 25.6664 14.3699 25.6664 14C25.6664 13.6301 25.5935 13.2639 25.452 12.9221C25.3104 12.5804 25.103 12.2699 24.8414 12.0084L22.8779 10.0459C22.7311 9.89922 22.6261 9.71606 22.5737 9.51527C22.5212 9.31449 22.5233 9.10335 22.5796 8.90363C22.636 8.70391 22.7446 8.52283 22.8942 8.37906C23.0439 8.2353 23.2291 8.13404 23.4309 8.08574C23.9351 7.9648 24.3979 7.71164 24.7717 7.35234C25.1455 6.99304 25.4168 6.5406 25.5576 6.04159C25.6984 5.54258 25.7037 5.01505 25.5729 4.51333C25.442 4.01161 25.1799 3.55383 24.8133 3.18714C24.4468 2.82044 23.9891 2.55809 23.4875 2.42709C22.9858 2.29609 22.4583 2.30119 21.9593 2.44185C21.4603 2.58252 21.0078 2.85366 20.6484 3.22737C20.289 3.60108 20.0357 4.06384 19.9146 4.56799C19.8663 4.76981 19.7651 4.9551 19.6213 5.10475C19.4776 5.2544 19.2965 5.36299 19.0968 5.41934C18.8971 5.47569 18.686 5.47776 18.4852 5.42532Z' stroke='%23000' stroke-width='2' stroke-linecap='round'/></svg>");
}
#why-tdk .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12:nth-child(3) > .textfragment:before, .soft-proof .inner > .elementlist > .col-12:first-child > div > .elementlist > .col-12:nth-child(3) > .textfragment:before {
 background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5l4.5 4.5L19 7.5'/></svg>");
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist {
 gap: var(--gap-30);
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist {
   gap: var(--gap-50);
   background: #ffffff4d;
   flex-direction: row;
 }
 #why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 {
   flex: 1 1 0;
   width: auto;
 }
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment {
 gap: var(--gap-15);
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment {
   gap: var(--gap-20);
 }
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2 {
 gap: var(--gap-10);
 font-size: var(--font-size-h4);
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2 {
   gap: var(--gap-20);
 }
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2 span, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2 span {
 text-transform: uppercase;
 color: #656565;
 font-weight: 700;
 display: block;
 font-size: var(--font-size-h6) !important;
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2 span, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment h2 span {
   text-transform: none;
 }
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text {
 font-size: var(--font-size-base);
 color: #59595a;
 line-height: 1.5;
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul {
 gap: var(--gap-10);
 flex-direction: column;
 display: flex;
}
@media (width > 768px) {
 #why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul {
   gap: var(--gap-15);
 }
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul li, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul li {
 align-items: center;
 gap: var(--gap-10);
 padding: 0;
 display: flex;
}
#why-tdk .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul li:before, .soft-proof .inner > .elementlist > .col-12:nth-child(2) > div > .elementlist > .col-12 > .textfragment .teaser-text ul li:before {
 content: "";
 background-color: var(--tdk-color-blue-main);
 mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5l4.5 4.5L19 7.5'/></svg>");
 mask-position: center;
 mask-size: 24px 24px;
 mask-repeat: no-repeat;
 flex: 0 0 24px;
 width: 24px;
 height: 24px;
 position: static;
 -webkit-mask-size: 28px 28px;
}
#media .row:not(.elementlist), #media .col-12 {
 display: contents;
 padding-inline: unset !important;
 margin-inline: unset !important;
}
#media .inner {
 flex: auto;
}
#media .inner > .elementlist {
 flex-direction: column;
 gap: 3rem;
 display: flex;
 margin-inline: auto !important;
}
@media (width > 992px) {
 #media .inner > .elementlist {
   gap: 5rem;
 }
}
#media .inner > .elementlist > .col-12 {
 flex: none;
 max-width: 100%;
 padding: 0;
}
#media .inner .elementlist .elementlist {
 min-width: 0;
 margin: 0;
}
#media .inner > .elementlist > .col-12:first-child {
 flex-direction: column;
 gap: 32px;
 display: flex;
}
@media (width > 992px) {
 #media .inner > .elementlist > .col-12:first-child {
   flex-direction: row;
   align-items: flex-start;
   gap: 64px;
 }
}
#media .inner > .elementlist > .col-12:first-child > div {
 display: contents;
}
@media (width > 992px) {
 #media .inner > .elementlist > .col-12:first-child .textfragment {
   flex: 476 1 0;
   min-width: 0;
 }
}
#media .inner > .elementlist > .col-12:first-child .elementlist {
 display: block;
}
@media (width > 992px) {
 #media .inner > .elementlist > .col-12:first-child .elementlist {
   flex: 740 1 0;
 }
}
#media .inner > .elementlist > .col-12:last-child .elementlist {
 gap: 20px;
 min-height: 290px;
 display: grid;
}
@media (width > 768px) {
 #media .inner > .elementlist > .col-12:last-child .elementlist {
   grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}
@media (width > 992px) {
 #media .inner > .elementlist > .col-12:last-child .elementlist {
   gap: 24px;
 }
}
#media .inner .textfragment {
 flex-direction: column;
 gap: 12px;
 display: flex;
}
@media (width > 992px) {
 #media .inner .textfragment {
   gap: 24px;
 }
}
#media .inner .textfragment h2 {
 letter-spacing: -.36px;
 color: var(--color-heading);
 margin: 0;
 font-size: 36px;
 font-weight: 700 !important;
 line-height: normal !important;
}
@media (width > 992px) {
 #media .inner .textfragment h2 {
   letter-spacing: -.56px;
   font-size: 56px;
 }
}
#media .inner .textfragment h2 span {
 letter-spacing: .39px;
 color: var(--tdk-color-blue-main);
 text-transform: uppercase;
 margin-bottom: 12px;
 font-size: 13px;
}
@media (width > 992px) {
 #media .inner .textfragment h2 span {
   letter-spacing: normal;
   text-transform: none;
   margin-bottom: 24px;
   font-size: 18px;
   line-height: 1.4;
 }
}
#media .inner .textfragment p {
 color: var(--color-text-secondary);
 margin: 0;
 letter-spacing: .3px !important;
 font-size: 15px !important;
}
@media (width > 992px) {
 #media .inner .textfragment p {
   letter-spacing: normal !important;
   font-size: 16px !important;
   line-height: 1.6 !important;
 }
}
#media .inner .teaser {
 width: 100%;
 color: inherit;
 border: 1.5px solid var(--color-border);
 box-shadow: none;
 border-radius: 16px;
 flex-direction: column;
 align-items: stretch;
 margin: 0;
 text-decoration: none;
 display: flex;
 position: relative;
 overflow: hidden;
 background: none !important;
}
#media .inner .teaser .image-column {
 flex: none;
 width: 100%;
 padding: 0;
 position: relative;
 overflow: hidden;
}
#media .inner .teaser .image-column:before {
 content: "";
 z-index: 2;
 background: var(--color-overlay) url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M5.57691 4.66512C5.41533 4.94432 5.3303 5.26119 5.3304 5.58376V18.4162C5.3303 18.7388 5.41533 19.0557 5.57691 19.3349C5.73848 19.6141 5.97087 19.8457 6.25062 20.0064C6.53036 20.1671 6.84756 20.2511 7.17018 20.25C7.4928 20.2489 7.80942 20.1627 8.08807 20.0001L19.0894 13.5839C19.3667 13.4224 19.5967 13.1909 19.7565 12.9127C19.9163 12.6344 20.0003 12.3191 20 11.9983C19.9997 11.6774 19.9152 11.3623 19.7549 11.0843C19.5947 10.8063 19.3642 10.5753 19.0867 10.4143L8.08807 3.99986C7.80942 3.83729 7.4928 3.75111 7.17018 3.75001C6.84756 3.74892 6.53036 3.83295 6.25062 3.99362C5.97087 4.1543 5.73848 4.38593 5.57691 4.66512Z' fill='white' stroke='white' stroke-width='2' stroke-linecap='round'/></svg>") center no-repeat;
 border: 1.5px solid var(--tdk-color-white);
 border-radius: 50%;
 width: 64px;
 height: 64px;
 position: absolute;
 top: 40%;
 left: 50%;
 transform: translate(-50%, -50%);
}
#media .inner .teaser .image-column .image-wrapper {
 z-index: 0;
 position: absolute;
 inset: 0;
 height: 100% !important;
}
#media .inner .teaser .image-column .image-wrapper img {
 object-fit: cover;
 width: 100%;
 height: 100%;
 display: block;
}
#media .inner .teaser .text-column {
 flex: none;
 width: 100%;
 padding-block: 10px !important;
 padding-inline: 15px !important;
 display: block !important;
}
#media .inner .teaser .teaser-meta {
 flex-direction: column;
 gap: 8px;
 display: flex;
 padding: 0 !important;
}
#media .inner .teaser .teaser-meta .teaser-title {
 color: var(--color-heading);
 margin: 0;
 font-size: 13px;
}
#media .inner .teaser .teaser-meta .teaser-text {
 margin: 0;
 padding: 0;
 display: block !important;
}
#media .inner .teaser .teaser-meta .teaser-text p {
 color: var(--color-text-secondary);
 margin: 0;
 letter-spacing: normal !important;
 font-size: 11px !important;
 font-weight: 500 !important;
}
#media .inner .teaser .teaser-more {
 display: none;
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard {
 height: 350px;
}
@media (width > 768px) {
 #media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard {
   height: 420px;
 }
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard:before {
 content: "Featured";
 z-index: 4;
 color: var(--tdk-color-white);
 text-transform: uppercase;
 background-color: var(--color-primary);
 border-radius: 100px;
 padding: 6px 16px;
 font-size: 12px;
 font-weight: 700;
 line-height: normal;
 position: absolute;
 top: 28px;
 right: 28px;
}
@media (width > 768px) {
 #media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard:before {
   left: 28px;
   right: auto;
 }
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .image-column {
 z-index: 3;
 aspect-ratio: auto;
 position: absolute;
 inset: 0;
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .text-column {
 z-index: 4;
 position: absolute;
 inset: auto 0 0;
 padding-inline: 15px !important;
 padding-bottom: 15px !important;
}
@media (width > 576px) {
 #media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .text-column {
   padding-inline: 20px !important;
   padding-bottom: 20px !important;
 }
}
@media (width > 992px) {
 #media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .text-column {
   padding-inline: 30px !important;
 }
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .text-column .teaser-meta {
 gap: 12px;
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .text-column .teaser-meta .teaser-title {
 color: var(--tdk-color-white);
 text-shadow: var(--text-shadow-title);
 font-size: 24px;
 line-height: 1.3 !important;
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .text-column .teaser-meta p {
 color: var(--tdk-color-white);
 text-shadow: var(--text-shadow-meta);
 font-size: 14px !important;
}
#media .inner > .elementlist > .col-12:first-child .teaser.teaser-standard .image-column:before {
 top: 50% !important;
}
#media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard {
 box-shadow: var(--shadow-card);
 border-width: 1px;
 border-radius: 12px;
 background: var(--color-card-bg-compact) !important;
}
#media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .image-column {
 aspect-ratio: 16 / 9;
 display: block;
}
@media (width > 1200px) {
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard {
   aspect-ratio: 628 / 350;
   box-shadow: none;
   border-width: 1.5px;
   border-radius: 16px;
   background: none !important;
 }
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .image-column {
   z-index: 3;
   aspect-ratio: auto;
   position: absolute;
   inset: 0;
 }
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .text-column {
   z-index: 4;
   position: absolute;
   inset: auto 0 0;
   padding-inline: 15px !important;
   padding-bottom: 15px !important;
 }
}
@media (width > 1200px) and (width > 576px) {
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .text-column {
   padding-inline: 20px !important;
   padding-bottom: 20px !important;
 }
}
@media (width > 1200px) and (width > 992px) {
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .text-column {
   padding-inline: 30px !important;
 }
}
@media (width > 1200px) {
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .text-column .teaser-meta {
   gap: 12px;
 }
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .text-column .teaser-meta .teaser-title {
   color: var(--tdk-color-white);
   text-shadow: var(--text-shadow-title);
   font-size: 24px;
   line-height: 1.3 !important;
 }
 #media .inner > .elementlist > .col-12:last-child .teaser.teaser-standard .text-column .teaser-meta p {
   color: var(--tdk-color-white);
   text-shadow: var(--text-shadow-meta);
   font-size: 14px !important;
 }
}
body:has(.modal .video-wrapper) .modal-backdrop {
 z-index: calc(var(--zx-snavbar) + 1);
}
.modal:has(.video-wrapper) {
 --modal-outer: 10px;
 --modal-inner: 10px;
 --modal-inner-bottom: 10px;
 --arw: 16;
 --arh: 9;
 --video-ratio: calc(var(--arw) / var(--arh));
}
.modal:has(.video-wrapper):has(.video-wrapper.ar4-5) {
 --arw: 4;
 --arh: 5;
}
.modal:has(.video-wrapper):has(.video-wrapper.ar1-1), .modal:has(.video-wrapper):has(.video-wrapper.ar1) {
 --arw: 1;
 --arh: 1;
}
.modal:has(.video-wrapper) {
 z-index: calc(var(--zx-snavbar) + 2);
 padding: var(--modal-outer) !important;
}
@media (width > 768px) {
 .modal:has(.video-wrapper) {
   --modal-outer: 30px;
   --modal-inner: 20px;
   --modal-inner-bottom: 20px;
 }
}
.modal:has(.video-wrapper) .modal-dialog {
 max-width: 100%;
 min-height: 100%;
 margin: 0 auto;
 width: calc((100dvh - 2 * var(--modal-outer) - 44px - var(--modal-inner-bottom)) * var(--video-ratio) + 2 * var(--modal-inner)) !important;
 min-width: 0 !important;
}
.modal:has(.video-wrapper) .modal-content {
 padding: 10px var(--modal-inner) var(--modal-inner-bottom);
 background: var(--tdk-color-white);
 box-shadow: var(--shadow-card);
 border: 0;
 border-radius: 0;
 flex-direction: column;
 gap: 10px;
 display: flex;
}
.modal:has(.video-wrapper) .modal-content .modal-header {
 border: 0;
 justify-content: flex-end;
 padding: 0;
}
.modal:has(.video-wrapper) .modal-content .modal-header .close {
 background: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M7.87521 16.1248L16.1248 7.87521M7.87521 7.87521L16.1248 16.1248' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") center no-repeat;
 width: 24px;
 height: 24px;
 margin: 0;
 padding: 0;
}
.modal:has(.video-wrapper) .modal-content .modal-header .close i {
 display: none;
}
.modal:has(.video-wrapper) .modal-content .modal-body {
 max-height: 100%;
 padding: 0;
 overflow: visible;
}
.modal:has(.video-wrapper) .video-wrapper {
 aspect-ratio: var(--arw)/var(--arh);
 position: relative;
 overflow: hidden;
}
.modal:has(.video-wrapper) .video-wrapper iframe {
 border: 0;
 width: 100%;
 height: 100%;
 position: absolute;
 inset: 0;
}
#contact {
 --radius-input: 6px;
 --radius-icon: 3px;
 --radius-card-mobile: 10px;
 --radius-card-desktop: 16px;
 --gap-section-mobile: var(--gap-30);
 --gap-section-desktop: var(--gap-50);
}
#contact > .elementlist {
 margin-inline: auto !important;
}
#contact > .elementlist .inner {
 gap: var(--gap-section-mobile);
 flex-direction: column;
 display: flex;
}
@media (width > 768px) {
 #contact > .elementlist .inner {
   align-items: center;
   gap: var(--gap-50);
   margin: unset;
   grid-template-rows: auto 1fr;
   grid-template-columns: 340px 1fr;
   padding-block: 6rem;
   display: grid;
 }
 #contact > .elementlist .inner > .textfragment {
   grid-area: 1 / 1;
   align-self: start;
 }
}
#contact > .elementlist .inner > .textfragment h2 {
 letter-spacing: -1px;
 font-size: var(--font-size-h2) !important;
}
@media (width > 768px) {
 #contact > .elementlist .inner > .textfragment h2 {
   letter-spacing: -1.5px;
 }
}
#contact > .elementlist .inner > .textfragment h2 span {
 font-size: var(--font-size-h5);
 letter-spacing: .48px;
 text-transform: uppercase;
 color: var(--tdk-color-blue-main);
 margin-bottom: 16px;
 font-weight: 700;
 display: block;
}
@media (width > 768px) {
 #contact > .elementlist .inner > .textfragment h2 span {
   letter-spacing: .56px;
 }
}
#contact > .elementlist .inner > .textfragment .teaser-text .richtext p {
 font-size: var(--font-size-base);
 color: var(--tdk-color-black-secondary);
 margin: 0;
}
#contact > .elementlist .inner > .elementlist {
 gap: var(--gap-section-mobile);
 flex-direction: column;
 display: flex;
 margin-top: unset !important;
}
@media (width > 768px) {
 #contact > .elementlist .inner > .elementlist {
   display: contents;
 }
 #contact > .elementlist .inner > .elementlist > div:first-child {
   grid-area: 2 / 1;
   align-self: start;
 }
}
#contact > .elementlist .inner > .elementlist > div:first-child .image-wrapper {
 width: 100%;
 overflow: hidden;
}
#contact > .elementlist .inner > .elementlist > div:first-child .image-wrapper img {
 object-fit: cover;
 width: 100%;
 height: 100%;
 display: block;
}
#contact > .elementlist .inner > .elementlist > div:first-child .teaser-text .richtext {
 gap: var(--gap-10);
 flex-direction: column;
 margin-top: 12px;
 display: flex;
}
#contact > .elementlist .inner > .elementlist > div:first-child .teaser-text .richtext h3 {
 font-size: var(--font-size-h3);
 letter-spacing: -.2px;
 color: var(--tdk-color-black);
 margin: 0;
 font-weight: 600;
 line-height: 1.3;
}
#contact > .elementlist .inner > .elementlist > div:first-child .teaser-text .richtext p {
 color: var(--tdk-color-black-secondary);
 margin: 1rem 0 0;
}
#contact > .elementlist .inner > .elementlist > div:first-child .teaser-text .richtext p a[href^="https://www.linkedin.com"] {
 align-items: center;
 gap: var(--gap-10);
 font-size: var(--font-size-sm);
 font-weight: var(--font-weight-med);
 color: var(--tdk-color-linkedin);
 background: none;
 border: none;
 padding: 0;
 text-decoration: none;
 display: inline-flex;
}
#contact > .elementlist .inner > .elementlist > div:first-child .teaser-text .richtext p a[href^="https://www.linkedin.com"]:before {
 content: "";
 background: url("data:image/svg+xml,<svg height='72' viewBox='0 0 72 72' width='72' xmlns='http://www.w3.org/2000/svg'><g fill='none' fill-rule='evenodd'><path d='M8,72 L64,72 C68.418278,72 72,68.418278 72,64 L72,8 C72,3.581722 68.418278,-8.11624501e-16 64,0 L8,0 C3.581722,8.11624501e-16 -5.41083001e-16,3.581722 0,8 L0,64 C5.41083001e-16,68.418278 3.581722,72 8,72 Z' fill='%232867b2'/><path d='M62,62 L51.315625,62 L51.315625,43.8021149 C51.315625,38.8127542 49.4197917,36.0245323 45.4707031,36.0245323 C41.1746094,36.0245323 38.9300781,38.9261103 38.9300781,43.8021149 L38.9300781,62 L28.6333333,62 L28.6333333,27.3333333 L38.9300781,27.3333333 L38.9300781,32.0029283 C38.9300781,32.0029283 42.0260417,26.2742151 49.3825521,26.2742151 C56.7356771,26.2742151 62,30.7644705 62,40.051212 L62,62 Z M16.349349,22.7940133 C12.8420573,22.7940133 10,19.9296567 10,16.3970067 C10,12.8643566 12.8420573,10 16.349349,10 C19.8566406,10 22.6970052,12.8643566 22.6970052,16.3970067 C22.6970052,19.9296567 19.8566406,22.7940133 16.349349,22.7940133 Z M11.0325521,62 L21.769401,62 L21.769401,27.3333333 L11.0325521,27.3333333 L11.0325521,62 Z' fill='%23fff'/></g></svg>") center / contain no-repeat;
 flex-shrink: 0;
 width: 18px;
 height: 18px;
}
@media (width > 768px) {
 #contact > .elementlist .inner > .elementlist > div:nth-child(2) {
   grid-area: 1 / 2 / span 2;
 }
}
#contact > .elementlist .inner #contactForm {
 gap: var(--gap-20);
 background: var(--tdk-color-white);
 border-radius: var(--radius-card-mobile);
 box-shadow: var(--shadow-card);
 flex-direction: column;
 padding: 20px;
 display: flex;
}
@media (width > 768px) {
 #contact > .elementlist .inner #contactForm {
   border-radius: var(--radius-card-desktop);
   width: 100%;
   max-width: 704px;
   margin-left: auto;
   padding: 40px;
 }
}
#contact > .elementlist .inner #contactForm .textfragment .teaser-text .richtext p {
 font-size: var(--font-size-base);
 letter-spacing: .36px;
 margin: 0;
}
#contact > .elementlist .inner #contactForm form .form-fields {
 gap: var(--gap-15);
 flex-direction: column;
 display: flex;
}
@media (width > 768px) {
 #contact > .elementlist .inner #contactForm form .form-fields {
   grid-template-columns: 1fr 1fr;
   display: grid;
 }
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element {
 gap: var(--gap-05);
 flex-direction: column;
 width: 100%;
 margin: 0;
 display: flex;
}
@media (width > 768px) {
 #contact > .elementlist .inner #contactForm form .form-fields .form-element {
   grid-column: 1 / -1;
 }
 #contact > .elementlist .inner #contactForm form .form-fields .form-element.single-col:first-of-type {
   grid-column: 1;
 }
 #contact > .elementlist .inner #contactForm form .form-fields .form-element.single-col:nth-of-type(2) {
   grid-column: 2;
 }
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element label {
 font-size: var(--font-size-xs);
 color: var(--tdk-color-black-secondary);
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element .form-input, #contact > .elementlist .inner #contactForm form .form-fields .form-element .form-area, #contact > .elementlist .inner #contactForm form .form-fields .form-element .form-select {
 width: 100%;
 font-size: var(--font-size-sm);
 color: var(--tdk-color-black-secondary);
 background-color: var(--color-input-bg);
 border: 1px solid var(--color-border);
 border-radius: var(--radius-input);
 padding: 0 16px;
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element .form-input::placeholder, #contact > .elementlist .inner #contactForm form .form-fields .form-element .form-area::placeholder, #contact > .elementlist .inner #contactForm form .form-fields .form-element .form-select::placeholder {
 color: var(--tdk-color-black-secondary);
 opacity: .6;
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element .form-input:focus, #contact > .elementlist .inner #contactForm form .form-fields .form-element .form-area:focus, #contact > .elementlist .inner #contactForm form .form-fields .form-element .form-select:focus {
 border-color: var(--tdk-color-blue-main);
 outline: none;
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element .form-input {
 height: 44px;
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element .form-area {
 height: 10rem;
 padding: 12px 16px;
}
#contact > .elementlist .inner #contactForm form .form-fields .form-element .form-select {
 min-height: 44px;
}
#contact > .elementlist .inner #contactForm form .form-consent {
 margin-block: var(--gap-20);
}
#contact > .elementlist .inner #contactForm form .form-consent h6, #contact > .elementlist .inner #contactForm form .form-consent small {
 font-size: var(--font-size-xs);
 color: var(--tdk-color-black-secondary);
 display: inline-block;
}
#contact > .elementlist .inner #contactForm form .form-row {
 margin: unset !important;
}
@media (width <= 768px) {
 #contact > .elementlist .inner #contactForm form > div:last-of-type {
   display: block;
 }
}
#contact > .elementlist .inner #contactForm form > div:last-of-type .form-group {
 display: block;
 padding: unset !important;
 margin: unset !important;
}
@media (width <= 768px) {
 #contact > .elementlist .inner #contactForm form > div:last-of-type input[type="submit"] {
   width: 100%;
   display: block;
   margin: unset !important;
 }
 #contact > .elementlist .inner #contactForm form > div:last-of-type input[type="reset"] {
   display: none !important;
 }
}
#contact .custom-select.is-invalid, #contact .form-control.is-invalid, #contact .was-validated .custom-select:invalid, #contact .was-validated .form-control:invalid {
 border-color: var(--tdk-color-red) !important;
}
.page-top {
 opacity: 0;
 box-sizing: content-box;
 cursor: pointer;
 pointer-events: all;
 background-color: #84848466;
 border: 1px solid #ffffff4d;
 border-radius: 100px;
 width: 38px;
 height: 38px;
 transition: opacity .5s ease-in-out;
 display: flex;
 overflow: hidden;
 box-shadow: 0 2px 5px #00000026, inset 0 1px #ffffff80, inset 0 -1px #ffffff1a, inset 0 0 5px #fff9;
 z-index: var(--zx-page-top) !important;
 color: var(--tdk-color-black) !important;
 padding: 0 !important;
}
@supports (backdrop-filter: initial) {
 .page-top {
   backdrop-filter: saturate(180%) blur(20px);
 }
}
.page-top:before {
 content: "";
 background: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M11.9999 17.9978L11.9999 6.00241M6.00217 12.0001L11.9999 6.00241L17.9976 12.0001' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") center no-repeat;
 flex: 0 0 38px;
 justify-content: center;
 align-items: center;
 width: 38px;
 height: 38px;
 display: flex;
}
#sticky-footer {
 inset: auto 0 env(safe-area-inset-bottom);
 z-index: var(--zx-sfooter);
 opacity: 0;
 pointer-events: none;
 border-top: 1.5px solid #6664;
 padding: 1.5rem;
 transition: all .3s ease-in-out;
 position: fixed;
 transform: translateY(100%);
 box-shadow: 0 2px 5px #00000026;
 background-color: #fafafc99 !important;
}
@media (width > 768px) {
 #sticky-footer {
   text-align: center;
   box-shadow: none;
   border-top: 0;
   padding-bottom: 3rem;
   background-color: #0000 !important;
 }
}
#sticky-footer.is-visible {
 opacity: 1;
 transform: translateY(0);
}
#sticky-footer > * {
 pointer-events: all;
}
@media (width > 768px) {
 #sticky-footer > * {
   margin-inline: auto;
 }
}
#sticky-footer .btn {
 display: inline-flex;
 margin-block: unset !important;
}
@media (width > 768px) {
 #sticky-footer .btn {
   box-shadow: 0 3px 9px #000000a6;
   margin-inline: auto !important;
 }
}
.hide-socialshare .socialshare {
 display: none;
}
/*# sourceMappingURL=TEG_Frontend.e0737a92.css.map */