/* -------------------------------------------------- generic ---------- */

*{-webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0;} html{-webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%;} ul, li, a, h1, h2, h3, p{position: relative; display: inline-block;} ul, li, a, img, p, h1, h2, h3{vertical-align: middle;} :focus{outline: none;} a{line-height: 0; text-decoration: none;} 



/* -------------------------------------------------- fonts ---------- */

@font-face{font-family: "Jost"; src: url("Fonts/Jost.woff2") format("woff2 supports variations"), url("Fonts/Jost.woff2") format("woff2-variations"), url("Fonts/Jost.woff") format("woff supports variations"), url("Fonts/Jost.woff") format("woff-variations"), url("Fonts/Jost.ttf") format("truetype supports variations"), url("Fonts/Jost.ttf") format("truetype-variations"); font-weight: 100 900;}

*{font-family: 'Jost', sans-serif;} p{word-break: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; -webkit-hyphenate-limit-before: 4; -webkit-hyphenate-limit-after: 4; -ms-hyphenate-limit-chars: 8 4 4; hyphenate-limit-chars: 8 4 4;} .h0, h1, .h1, h2, .h2{word-break: normal; -webkit-hyphens: manual; -ms-hyphens: manual; -o-hyphens: manual; hyphens: manual;} .h0, h1, .h1, .hb, [class*="link-"] p, .hl, label{font-weight: 700;} h2, .h2{font-weight: 800;} .h3, [class*="link-"] .h3, .h4, [class*="link-"] .h4, input, select, textarea, fieldset, ::placeholder{font-weight: 600;} p, [class*="link-"] .ht{font-weight: 400;} [class*="link-"] .ht{font-weight: 550;} .hu{text-transform: uppercase;} 


/* -------------------------------------------------- font size ---------- */

/*#html-body{--font-space: -0.025; --ht-size: calc(var(--font-size) * pow(var(--font-rise), -1.4) * (1px + 0.1vw / 4)); --hl-size: calc(var(--font-size) * pow(var(--font-rise), -0.7) * (1px + 0.1vw / 4)); --hp-size: calc(var(--font-size) * (1px + 0.1vw / 4)); --h4-size: calc(var(--font-size) * pow(var(--font-rise), 1) * (1px + 0.1vw / 4)); --h3-size: calc(var(--font-size) * pow(var(--font-rise), 2) * (1px + 0.1vw / 2)); --h2-size: calc(var(--font-size) * pow(var(--font-rise), 3) * (1px + 0.1vw)); --h1-size: calc(var(--font-size) * pow(var(--font-rise), 4) * (1px + 0.1vw * 1.5)); --h0-size: calc(var(--font-size) * pow(var(--font-rise), 5) * (1px + 0.1vw * 2));}*/ 

/*til_20260716 #html-body{--font-space: 0.025; --ht-size: calc(var(--font-size) * pow(var(--font-rise), -1.4) * (1px + 0.1vw / 4)); --hl-size: calc(var(--font-size) * pow(var(--font-rise), -0.7) * (1px + 0.1vw / 4)); --hp-size: calc(var(--font-size) * (1px + 0.1vw / 4)); --h4-size: calc(var(--font-size) * pow(var(--font-rise), 1) * (1px + 0.1vw / 4)); --h3-size: calc(var(--font-size) * pow(var(--font-rise), 2) * (1px + 0.1vw / 2)); --h2-size: calc(var(--font-size) * (1px + 0.1vw / 4)); --h1-size: calc(var(--font-size) * pow(var(--font-rise), 3) * (1px + 0.1vw * 1.4)); --h0-size: calc(var(--font-size) * pow(var(--font-rise), 3.7) * (1px + 0.1vw * 1.55));}*/ 

#html-body{--font-space: 0.025; --ht-size: calc(var(--font-size) * pow(var(--font-rise), -1.4) * (1px + 0.1vw / 4)); --hl-size: calc(var(--font-size) * pow(var(--font-rise), -0.7) * (1px + 0.1vw / 4)); --hp-size: calc(var(--font-size) * (1px + 0.1vw / 4)); --h4-size: calc(var(--font-size) * pow(var(--font-rise), 1) * (1px + 0.1vw / 4)); --h3-size: calc(var(--font-size) * pow(var(--font-rise), 2) * (1px + 0.1vw / 2)); --h2-size: calc(var(--font-size) * pow(var(--font-rise), 3) * (1px + 0.1vw)); --h1-size: calc(var(--font-size) * pow(var(--font-rise), 4) * (1px + 0.1vw * 1.5)); --h0-size: calc(var(--font-size) * pow(var(--font-rise), 5) * (1px + 0.1vw * 2));} 

.ht, [class*="link-"] .ht{line-height: calc(var(--ht-size) * 1.5); font-size: var(--ht-size); letter-spacing: calc(var(--ht-size) * var(--font-space) / 2);} .hl, [class*="link-"] p, label{line-height: calc(var(--hl-size) * 1.5); font-size: var(--hl-size); letter-spacing: calc(var(--hl-size) * var(--font-space) * 9);} p, .hp{line-height: calc(var(--hp-size) * 1.5); font-size: var(--hp-size); letter-spacing: calc(var(--hp-size) * var(--font-space) / 4);} h4, .h4, [class*="link-"] .h4, .js-cursor-text{line-height: calc(var(--h4-size) * 1.2); font-size: var(--h4-size); letter-spacing: calc(var(--h4-size) * var(--font-space) / 4);} h3, .h3, [class*="link-"] .h3, input, select, textarea, fieldset, ::placeholder{line-height: calc(var(--h3-size) * 1.3); font-size: var(--h3-size); letter-spacing: calc(var(--h3-size) * var(--font-space) / 3);} h2, .h2, [class*="link-"] .h2{line-height: calc(var(--h2-size) * 1.1); font-size: var(--h2-size); letter-spacing: calc(var(--h2-size) * var(--font-space) / 2);} h1, .h1, [class*="link-"] .h1{line-height: calc(var(--h1-size) * 1.0); font-size: var(--h1-size); letter-spacing: calc(var(--h1-size) * var(--font-space));} .h0, [class*="link-"] .h0{line-height: calc(var(--h0-size) * 0.9); font-size: var(--h0-size); letter-spacing: calc(var(--h0-size) * var(--font-space));} 

[class*="link-"] .ht{line-height: calc(var(--ht-size) * 1.0); text-transform: none; letter-spacing: calc(var(--ht-size) * var(--font-space) * 2);} [class*="link-"] p{line-height: calc(var(--hl-size) * 1.3); display: block;} [class*="link-"] .h4{line-height: calc(var(--h4-size) * 1.2);} [class*="link-"] .h3, .list-tile .h3{line-height: calc(var(--h3-size) * 1.1);} .js-cursor-text{line-height: var(--h4-size); letter-spacing: calc(var(--h4-size) * var(--font-space) * 2);} .navigation-links [class*="link-"] .h1{line-height: calc(var(--h1-size) * 0.9);} 

p .image-inline, .hp .image-inline{width: calc(var(--hp-size) * 1.5);} h4 .image-inline, .h4 .image-inline{width: calc(var(--h4-size) * 1.5);} 



/* -------------------------------------------------- color ---------- */

#body-header.toggle .navigation-brand, #body-main.toggle, #body-footer.toggle{opacity: .08;} .opacity-high{opacity: var(--opacity-high);} .opacity-middle{opacity: var(--opacity-middle);} .opacity-low{opacity: var(--opacity-low);} .opacity-lowest{opacity: var(--opacity-lowest);} .opacity-89{opacity: .89;} 

:root{--color-light: hsl(169,11%,89%)/*#E0E6E5*/; --color-dark: hsl(169,11%,11%)/*#191F1E*/; --color-ci-dark: hsl(169,97%,21%)/*#026956*/; --color-ci-light: hsl(169,97%,79%)/*#96FDEA*/;}
.color-set-light{--color-back: var(--color-light); --color-front: var(--color-dark); --color-ci: var(--color-ci-dark);} .color-set-dark{--color-back: var(--color-dark); --color-front: var(--color-light); --color-ci: var(--color-ci-light);} [class*="color-set-"], .back-back{background-color: var(--color-back);} .back-front, [class*="symbol-"] [class*="shape-"]{background-color: var(--color-front);} h1, h2, p, a, label{color: var(--color-front);} .front-back h1, .front-back h2, .front-back p, .front-back a{color: var(--color-back);} input, textarea, select, ::placeholder{color: hsla(169,97%,79%,.71);} 

.back-dark{background-color: var(--color-dark);} .back-ci{background-color: var(--color-ci);} .front-ci, .front-ci p{color: var(--color-ci);} .back-blur{-webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);} [class*="table-"] td{border-top-color: rgba(249,249,249,0.5);} .filter-greyscale{filter: grayscale(1);} 

[class*="symbol-"] [class*="shape-"]{background-color: var(--color-front);} .link-button{background-color: var(--color-front);} .link-button p{color: var(--color-back);} .front-back [class*="symbol-"] [class*="shape-"]{background-color: var(--color-back);} .front-back .link-button{background-color: var(--color-back);} .front-back .link-button p{color: var(--color-front);} 

.js-cursor-outer, .js-cursor-inner{background-color: hsl(169,29%,50%);} .js-cursor-text{color: hsl(169,29%,50%);}

.symbol-intern .shape-1, .symbol-intern .shape-2{background-color: transparent; border-color: var(--color-front);} 

.symbol-cta [class*="shape-"], .symbol-indicator [class*="shape-"]{background-color: var(--color-ci);} 

.outline-back{outline: solid calc(var(--h0-size) * 0.04 * 2) var(--color-back);} 



/* -------------------------------------------------- hover ---------- */


.link-cta .front-ci{opacity: var(--opacity-ci);} 

/* hover default / invers */

.hover-default [class*="link-"]:hover{opacity: var(--opacity-hover);} 
.hover-invers [class*="link-"]{opacity: var(--opacity-hover);} .hover-invers [class*="link-"]:hover{opacity: 1;} .hover-invers [class*="link-"]:hover p{color: var(--color-front);} 

/* hover ci */

.hover-ci [class*="link-"]:hover{opacity: var(--opacity-ci);} .hover-ci [class*="link-"]:hover p{color: var(--color-ci);} .hover-ci [class*="link-"]:hover [class*="shape-"]{background-color: var(--color-ci);} .hover-ci [class*="link-"]:hover .symbol-intern .shape-1, .hover-ci [class*="link-"]:hover .symbol-intern .shape-2{background-color: transparent; border-color: var(--color-ci);} 










/* -------------------------------------------------- gradient / mask---------- */

[class*="gradient-"]{pointer-events: none;} .gradient-horizontal{background-image: linear-gradient(90deg, var(--color-back) 0%, transparent 10%, transparent 90%, var(--color-back) 100%);} .gradient-vertical{background-image: linear-gradient(0deg, var(--color-back) 0%, transparent 10%, transparent 90%, var(--color-back) 100%);} .gradient-radial{background-image: radial-gradient(transparent 0%, transparent 70%, var(--color-back) 100%);} 

[class*="mask-"]{-webkit-mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center;} .mask-diagonal-hard{-webkit-mask-image: linear-gradient(11deg, rgba(0,0,0,0) 14%, rgba(0,0,0,1) 41%, rgba(0,0,0,1) 74%, rgba(0,0,0,0) 100%);} .mask-diagonal-soft{-webkit-mask-image: linear-gradient(11deg, rgba(0,0,0,.33) 21%, rgba(0,0,0,1) 41%, rgba(0,0,0,1) 61%, rgba(0,0,0,.33) 100%);} .mask-bottom{-webkit-mask-image: linear-gradient(0deg, rgba(0,0,0,0) 2%, rgba(0,0,0,1) 19%, rgba(0,0,0,1) 89%, rgba(0,0,0,0) 98%);}



/* -------------------------------------------------- cursor ---------- */

.js-cursor-outer, .js-cursor-inner, .js-cursor-text{position: fixed; display: block; transform: translate(-50%,-50%); border: none; border-radius: 50%; z-index: 999; pointer-events: none;} .js-cursor-text{transform: translate(-50%,-50%)scale(0); width: 140px; text-align: center; text-transform: uppercase; font-weight: 600; opacity: var(--opacity-middle);} .js-cursor-outer{transition: left .07s ease-out, top .07s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;} .js-cursor-inner{transition: left .19s ease-out, top .19s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;} .js-cursor-text{transition: left .19s ease-out, top .19s ease-out, transform .29s ease-in-out, opacity .29s ease-in-out;} 

.js-cursor-outer{width: var(--cursor-size); height: var(--cursor-size); opacity: 0.09;} .js-cursor-inner{width: 7px; height: 7px; opacity: .71;} .js-cursor-outer.hover, .js-cursor-inner.hover{width: calc(var(--cursor-size) * 2.8); height: calc(var(--cursor-size) * 2.7);} .js-cursor-outer.hover{opacity: 0.14;} .js-cursor-inner.hover{opacity: 0;} .js-cursor-text.hover{transform: translate(-50%,calc(-50% + var(--cursor-size) * 0.5))scale(1);} 

.js-cursor-hover{cursor: pointer;}



/* -------------------------------------------------- pattern ---------- */

/*[class*="pattern-"]{position: absolute; display: block; right: 50%; bottom: 50%; transform: translate(50%,50%); width: 100%; height: 100%;}
.pattern-pixel{background-color: rgba(87,152,152,0.29); background-size: 4px 4px; background-image: linear-gradient(var(--color-back) 0.4px, transparent 0.4px), linear-gradient(to right, var(--color-back) 0.4px, transparent 0.4px); opacity: 0.7;}*/


/* -------------------------------------------------- texture ---------- */

#html-body{position: relative;} [class*="body-texture-"]{position: absolute; display: block; right: 50%; bottom: 50%; transform: translate(50%,50%); width: 100%; height: 100%; background-size: 233px 175px/*466px 349px*/; background-repeat: repeat; pointer-events: none; z-index: 999;}

.body-texture-light{background-image: url("../img/texture-light.png"); opacity: .59;} 
.body-texture-dark{background-image: url("../img/texture-dark.png"); opacity: .79;} 



/* -------------------------------------------------- variables ---------- */

#html-body{--padding-horizontal: 0.02; --padding-vertical: calc(0.64vw + 0.64vh + 6.4px); --padding-link: 4px; --padding-button: calc(10px + 0.25vw); --padding-form: calc(0.2vw + 0.2vh + 2px); --opacity-high: .84; --opacity-middle: .41; --opacity-low: .29; --opacity-lowest: .07; --opacity-hover: .41; --opacity-ci: .71; --cursor-size: calc(4.1 * (10px + 0.5vw)); --size-browser: calc(7 * (40px + 1vw));} 



/* -------------------------------------------------- space ---------- */

[class*="space-"]{position: relative; display: block; width: 100%;} .section-layer-full{width: 100%; max-width: var(--layer-max);} .section-layer-default{width: calc(100% - var(--layer-diff) * 100% + 2 * var(--padding-horizontal) * 100%); max-width: calc((1 - var(--layer-diff)) * var(--layer-max));} .section-layer-thin{width: calc(100% - 2 * var(--layer-diff) * 100% + 2 * var(--padding-horizontal) * 100%); max-width: calc((1 - 2 * var(--layer-diff)) * var(--layer-max));} 

.space-high{height: calc(14 * var(--padding-vertical));} .space-default{height: calc(4 * var(--padding-vertical));} .space-middle{height: calc(2 * var(--padding-vertical));} .space-flat{height: var(--padding-vertical);} .space-mini{height: calc(var(--padding-vertical) / 3);} .padding-side{padding: 0 calc(var(--padding-horizontal) * 100%);} .padding-mini{padding: calc(var(--padding-vertical) / 4) calc(var(--padding-horizontal) * 100%);} .padding-flat{padding: calc(var(--padding-vertical) / 2) calc(var(--padding-horizontal) * 100%);} .padding-default{padding: var(--padding-vertical) calc(var(--padding-horizontal) * 100%);} .padding-wide{padding: calc(2 * var(--padding-vertical)) calc(2 * var(--padding-horizontal) * 100%);} 



/* -------------------------------------------------- global ---------- */

#body-header, #body-main, #body-footer{width: 100%;} #body-header{z-index: 7;} #body-main{z-index: 1;} #body-footer{z-index: 4;} hr{border: none; height: 0;} [class*="-section"]{position: relative; display: block; width: 100%; margin: 0 auto; text-align: center;} [class*="layer-"]{position: relative; display: block; margin: 0 auto;} [class*="grid-"], [class*="inline-"], [class*="squeeze-"]{position: relative; display: inline-block; vertical-align: middle; text-align: left;} 

.grid-100, .inline-100{width: 100%;} .inline-75{width: 75%;} .inline-67{width: 66.67%;} .inline-62{width: 61.8%;} .inline-50{width: 50%;} .inline-38{width: 38.2%;} .inline-33{width: 33.33%;} .inline-25{width: 25%;} .inline-fix{width: calc(var(--h2-size) * 7);} .inline-flex{width: calc(100% - var(--h2-size) * 7);} .grid-0, .inline-0{display: none; visibility: hidden;} .text-left{text-align: left;} .text-center{text-align: center;} .text-right{text-align: right;} .vertical-bottom{vertical-align: bottom;} .vertical-top{vertical-align: top;} .overflow-hidden{overflow: hidden;} .overflow-clip{overflow: clip;} [class*="overlay-"], [class*="indent-"]{position: relative; display: block;} 

.overlay-left, .overlay-right{--overlay-width: calc(-100vw * (var(--layer-diff) * 0.5 + var(--padding-horizontal) * 1)); width: calc(100% - var(--overlay-width));} 
.overlay-left{margin-left: var(--overlay-width);} .overlay-right{margin-right: var(--overlay-width);} 

/*.overlay-vertical{margin: calc(-1 * var(--overlay-factor) * 100%) 0;}*/ .overlay-horizontal{margin: 0 -10%; width: 120%;} 



/* -------------------------------------------------- frames ---------- */

[class*="frame-relative-"], [class*="frame-absolute-"], [class*="frame-fixed-"]{display: block; width: 100%;} [class*="frame-relative-"]{position: relative; display: block; height: auto;} [class*="frame-absolute-"], [class*="frame-fixed-"]{right: 50%; bottom: 50%; transform: translate(50%,50%);} [class*="frame-absolute-"]{position: absolute;} [class*="frame-fixed-"]{position: fixed;} 

.frame-relative-100vh{padding-top: 100vh;} .frame-relative-1to1{padding-top: 100%;} .frame-relative-4to3{padding-top: 75%;} .frame-relative-3to4{padding-top: 133.33%;} .frame-relative-3to2{padding-top: 66.66%;} .frame-relative-2to3{padding-top: 150%;} .frame-relative-16to9{padding-top: 56.25%;} .frame-relative-9to16{padding-top: 177.78%;} .frame-relative-2to1{padding-top: 50%;} .frame-relative-1to2{padding-top: 200%;} .frame-relative-5to2{padding-top: 40%;} .frame-relative-3to1{padding-top: 33.33%;} .frame-absolute-cover, .frame-fixed-cover{height: 100%;} .frame-absolute-auto, .frame-fixed-auto{height: auto;} .frame-absolute-top{bottom: 100%; transform: translate(50%,100%);} .frame-absolute-bottom{bottom: 0%; transform: translate(50%,0%);} .frame-absolute-high{bottom: 90%; transform: translate(50%,90%);} .frame-absolute-low{bottom: 29%; transform: translate(50%,29%);} .frame-absolute-lower{bottom: 10%; transform: translate(50%,10%);} .frame-fixed-right{right: 0; transform: translate(0,50%);} 

.frame-relative-brand-logo{padding-top: 33.33%;} .frame-relative-brand-icon{padding-top: 85%;} .frame-relative-logo{padding-top: 45%;} .frame-relative-project-high{padding-top: calc(17 * (10px + 1vw));} .frame-relative-project-flat{padding-top: calc(7 * (10px + 1vw));} 

.frame-absolute-left{right: auto; left: 0; transform: translate(0,50%);} .frame-absolute-right{right: 0; transform: translate(0,50%);} .frame-absolute-topright{right: 0; bottom: 100%; transform: translate(0,100%); width: auto;} .frame-absolute-bottomleft{right: 100%; bottom: 0; transform: translate(100%,0); width: auto;} .frame-absolute-scroll{height: auto; max-height: 100%; overflow: scroll;}

.frame-absolute-projectlogo{right: 0; bottom: 100%; transform: translate(0,50%); width: calc(18 * (10px + 1vw));} 





/* -------------------------------------------------- images ---------- */

.image-relative, .image-inline, .image-cover, .image-contain, .image-icon{position: relative; display: block;} .image-relative{width: 100%; height: auto;} .image-inline{display: inline-block; height: auto; vertical-align: text-top;} .image-cover, .image-contain{width: 100%; height: 100%;} .image-cover{object-fit: cover; object-position: center center;} .object-cover{object-position: 57% 55%;} .image-contain{object-fit: contain;} .position-50-25{object-position: center 25%;} .image-icon{width: calc(1.5 * var(--padding-vertical)); height: calc(1.5 * var(--padding-vertical));} .image-absolute{position: absolute; display: block; right: 50%; bottom: 50%; transform: translate(50%,50%); width: 100%; height: auto;} 



/* -------------------------------------------------- symbols ---------- */

[class*="symbol-"]{position: relative; display: inline-block; vertical-align: middle;} [class*="symbol-"] [class*="shape-"], [class*="symbol-"] [class*="text-"], [class*="symbol-"] [class*="image-"]{position: absolute; display: block; right: 50%; bottom: 50%; transform: translate(50%,50%); transition-duration: .27s;} 

[class*="symbol-"] .image-default{opacity: 1;} [class*="symbol-"] .image-hover{opacity: 0;} [class*="link-"]:hover [class*="symbol-"] .image-default{opacity: 0;} [class*="link-"]:hover [class*="symbol-"] .image-hover{opacity: 1;} 

.symbol-navigation{display: block; width: 58px; height: 72px;} .symbol-navigation [class*="shape-"]{transform: translate(50%,50%)rotate(0deg); width: 6px; height: 37px;} .symbol-navigation .shape-0{right: 34.5px; bottom: 42px;} .symbol-navigation .shape-1{right: 23.5px; bottom: 48px;} .symbol-navigation [class*="text-"]{bottom: 10px; width: 58px; padding-left: 2px; text-align: center;} .symbol-navigation .text-0{opacity: 1;} .symbol-navigation .text-1{opacity: 0;} 

#body-header.toggle .symbol-navigation [class*="shape-"]{right: 29px; bottom: 44px;} #body-header.toggle .symbol-navigation .shape-0{transform: translate(50%,50%)rotate(-45deg);} #body-header.toggle .symbol-navigation .shape-1{transform: translate(50%,50%)rotate(45deg);} #body-header.toggle .symbol-navigation [class*="text-"]{bottom: 14px;} #body-header.toggle .symbol-navigation .text-0{opacity: 0;} #body-header.toggle .symbol-navigation .text-1{opacity: 1;} 

.symbol-close{display: block; width: 58px; height: 72px;} .symbol-close [class*="shape-"]{right: 29px; bottom: 44px; width: 6px; height: 37px;} .symbol-close .shape-0{transform: translate(50%,50%)rotate(-45deg);} .symbol-close .shape-1{transform: translate(50%,50%)rotate(45deg);} .symbol-close [class*="text-"]{bottom: 14px; width: 58px; padding-left: 2px; text-align: center;} 

.symbol-cta{position: absolute; display: block; right: 50%; bottom: 50%; transform: translate(50%,50%); width: 100%; height: 100%;} .symbol-cta .shape-0, .symbol-cta .shape-1{transform: translate(50%,50%); width: 50%; height: 100%; transition-duration: .27s;} .symbol-cta .shape-0{right: 75%; bottom: 47.5%;} .symbol-cta .shape-1{right: 25%; bottom: 52.5%;} 

.symbol-cta [class*="shape-"]{opacity: 0.18;} [class*="link-"]:hover .symbol-cta [class*="shape-"]{opacity: 0.29;} [class*="link-"]:hover .symbol-cta .shape-0{bottom: 45%;} [class*="link-"]:hover .symbol-cta .shape-1{bottom: 55%;} 

.symbol-intern{position: relative; display: block; width: 58px; height: 58px;} .symbol-intern [class*="shape-"]{bottom: 29px; transition-duration: .17s;} .symbol-intern .shape-0{right: 29px; width: 16px; height: 3px;} .symbol-intern .shape-1, .symbol-intern .shape-2{width: 15px; height: 15px; border-style: solid;} .symbol-intern .shape-1{right: 39px; border-width: 3px 0 3px 3px;} .symbol-intern .shape-2{right: 19px; border-width: 3px 3px 3px 0;}

[class*="link-"]:hover .symbol-intern .shape-1{right: 43px;} [class*="link-"]:hover .symbol-intern .shape-2{right: 15px;} 

.symbol-extern{position: relative; display: block; width: 58px; height: 58px;} .symbol-extern [class*="shape-"]{transition-duration: .17s;} .symbol-extern .shape-0{right: 38px; bottom: 40px; width: 6px; height: 3px;} .symbol-extern .shape-1{right: 40px; bottom: 29px; width: 3px; height: 25px;} .symbol-extern .shape-2{right: 29px; bottom: 18px; width: 25px; height: 3px;} .symbol-extern .shape-3{right: 18px; bottom: 20px; width: 3px; height: 6px;} .symbol-extern .shape-4{right: 23px; bottom: 40px; width: 13px; height: 3px;} .symbol-extern .shape-5{right: 18px; bottom: 35px; width: 3px; height: 13px;} .symbol-extern .shape-6{right: 25px; bottom: 33px; transform: translate(50%,50%)rotate(45deg); width: 3px; height: 20px;} 

[class*="link-"]:hover .symbol-extern .shape-4{right: 18px; bottom: 45px;} [class*="link-"]:hover .symbol-extern .shape-5{right: 13px; bottom: 40px;} [class*="link-"]:hover .symbol-extern .shape-6{right: 20px; bottom: 38px;} 

.symbol-scroll{position: relative; display: block; width: 29px; height: 29px;} .symbol-scroll .shape-0{width: 3px; height: 19px;} 

[class*="link-"]:hover .symbol-scroll .shape-0{width: 7.5px; height: 7.5px;}

.symbol-review{position: relative; display: block; width: 58px; height: 58px;} .symbol-review [class*="shape-"]{transition-duration: .17s;} .symbol-review .shape-0{right: 35px; bottom: 40px; width: 13px; height: 3px;} .symbol-review .shape-1{right: 40px; bottom: 35px; width: 3px; height: 13px;} .symbol-review .shape-2{right: 23px; bottom: 18px; width: 13px; height: 3px;} .symbol-review .shape-3{right: 18px; bottom: 23px; width: 3px; height: 13px;} .symbol-review .image-0{width: 13px; height: auto;} .symbol-review .image-1{right: 51%; width: 20px; height: auto;} 

.link-review{margin-bottom: 7px; padding: 7px 10px 7px 56px; overflow: visible;} .link-review .symbol-review{position: absolute; left: 0; bottom: 50%; transform: translate(0,50%)scale(1.25);} .link-review:hover .symbol-review .shape-0{right: 37px; bottom: 42px;} .link-review:hover .symbol-review .shape-1{right: 42px; bottom: 37px;} .link-review:hover .symbol-review .shape-2{right: 21px; bottom: 16px;} .link-review:hover .symbol-review .shape-3{right: 16px; bottom: 21px;} 

.symbol-h2{position: relative; display: block; height: calc(var(--hp-size) * 1.1); width: calc(var(--hp-size) * 0.8);} .symbol-h2 [class*="text-"]{bottom: 47%; opacity: var(--opacity-low);} .frame-relative-h2{display: inline; padding-left: calc(var(--hp-size) * 1.5);} .frame-relative-h2 .symbol-h2{position: absolute; left: 0; top: 0;} .frame-relative-h2 h2, .frame-relative-h2 p{vertical-align: top;} 

.symbol-dot{position: relative; display: block;} .symbol-dot [class*="shape-"]{width: 25%; height: 25%;}

.symbol-information{display: inline-block; width: calc(2 * var(--padding-vertical)); height: calc(2 * var(--padding-vertical));} .symbol-information [class*="shape-"]{width: 12px; height: 3px;} .symbol-information .shape-0{right: calc(50% + 4px); transform: translate(50%,50%)rotate(37.5deg);} .symbol-information .shape-1{right: calc(50% - 4px); transform: translate(50%,50%)rotate(-37.5deg);} .js-information-item.on .symbol-information .shape-0{transform: translate(50%,50%)rotate(-37.5deg);} .js-information-item.on .symbol-information .shape-1{transform: translate(50%,50%)rotate(37.5deg);} 



/* -------------------------------------------------- list, table, icon ---------- */

[class*="list-"], [class*="list-"] .list-item, [class*="icon-"]{position: relative; display: block;} [class*="list-"] .list-item{list-style: none; vertical-align: middle;} .list-block .list-item{display: block;} 

.list-link{display: block; margin: 0 calc(-4 * var(--padding-link));} .list-link .list-item{display: inline-block; margin: calc(var(--padding-link) / 2) calc(2 * var(--padding-link));} .list-link [class*="link-"] p{padding: var(--padding-link) var(--padding-link);} .list-block .list-item{display: block;} 

.list-symbol .list-item{margin-top: 0/*calc(var(--padding-vertical) / 16)*/; padding-left: calc(var(--hp-size) * 2);} .list-symbol [class*="symbol-"], .list-symbol p{vertical-align: top;} .list-symbol [class*="symbol-"]{position: absolute; left: calc(var(--hp-size) * 0.5); top: 0; width: calc(var(--hp-size) * 1.5); height: calc(var(--hp-size) * 1.5);} 

[class*="table-"]{width: 100%; border-spacing: 8px 0;} [class*="table-"] th, [class*="table-"] td{padding: calc(var(--padding-vertical) / 2) calc(var(--padding-horizontal) * 100%);} [class*="table-"] td{border-top-style: solid; border-top-width: 1.5px; vertical-align: middle;} [class*="table-"] thead{display: none;} [class*="table-"] .row-first td{border: none;} 

.icon-left{padding-left: calc(2 * var(--padding-vertical));} .icon-right{padding-right: calc(2 * var(--padding-vertical));} [class*="icon-"] .image-icon{position: absolute; top: 50%; transform: translate(0,-50%);} .icon-left .image-icon{left: 0;} .icon-right .image-icon{right: 0;} 



/* -------------------------------------------------- links ---------- */

[class*="link-"]{position: relative; display: inline-block;} [class*="link-"] p{text-decoration: none; text-transform: uppercase;} .link-text{display: inherit !important; text-decoration: underline; vertical-align: baseline;} 

.link-default, .link-icon{padding: var(--padding-link) var(--padding-link);} .link-icon .image-contain{transform: scale(1.1);} .link-brand{width: calc(128px + 3.2vw); z-index: 11;} .link-brand .image-absolute{width: 100%;} 

.link-button{padding: var(--padding-button) var(--padding-button);}

.link-block{display: block;} 

.link-share{width: calc(var(--hp-size) * 2.4); height: auto; padding: var(--padding-link) var(--padding-link); overflow: visible;} .link-share .image-relative{width: 100%; transition: transform .29s;} .link-share:hover .image-relative{transform: scale(1.2);} 

.link-block:hover, .link-project:hover{opacity: 1;} 

.link-block:hover .image-cover{opacity: var(--opacity-middle); transform: scale(1.08);} 

.link-project{display: block; margin: calc(var(--padding-vertical) / 3) 0; overflow: hidden;} .link-project .image-cover{opacity: .59; filter: grayscale(1);} .image-cover{transition: transform 1.41s .07s, opacity .41s, filter .29s;} .link-project:hover .image-cover{opacity: 1; transform: rotate(-0.7deg)scale(1.04); filter: grayscale(0);} 

.link-intern{padding: 7px 59px 7px 10px; text-align: right; overflow: visible;} [class*="link-"] .symbol-intern{position: absolute;} .link-extern{margin-bottom: 7px; padding: 7px 56px 7px 10px; text-align: right; overflow: visible;} [class*="link-"] .symbol-extern{position: absolute; right: 0; bottom: 50%; transform: translate(0,50%)scale(1.25);} .link-scroll{padding: 5px 10px 5px 29px; text-align: left; overflow: visible;} .list-link .link-scroll p{padding: 0;} [class*="link-"] .symbol-scroll{position: absolute; bottom: 50%; left: 0; transform: translate(0,50%);}

.link-project [class*="symbol-"]{right: calc(var(--padding-horizontal) * 2.4 * 100% + 50px);} .link-project .symbol-intern{bottom: calc(100% - var(--padding-vertical) * 2); transform: translate(0,100%)rotate(-45deg)scale(1.25);} .link-project .symbol-extern{bottom: 50%; transform: translate(0,50%)scale(1.25);}

.link-block .symbol-intern{right: calc(var(--padding-horizontal) * 1.2 * 100%); bottom: calc(100% - var(--padding-vertical) * 2); transform: translate(0,100%)rotate(-45deg)scale(1.25);} .link-intern .symbol-intern{right: 0; bottom: 50%; transform: translate(0,50%)rotate(-45deg)scale(1.25);} 

.link-cta{width: 100%; overflow: visible; transition-duration: .27s;} .link-cta p{padding-left: 4px;} .inline-ctaicon{width: calc(var(--h3-size) * 2.9);} 

.padding-button{padding: calc(var(--hp-size) * 2.4) calc(var(--hp-size) * 1.7);} 



/* -------------------------------------------------- language ---------- */

.navigation-language .opacity-middle span{padding: 0 var(--padding-link);} 



/* #######################################################################
##################################################### modules ############
####################################################################### */ 



/* -------------------------------------------------- fade in on scroll ---------- */

[class*="js-fadein-"]{overflow-y: visible;} [class*="js-fadein-fast-"]{transition: transform 870ms ease-in-out 87ms, opacity 590ms ease-in-out 59ms;} [class*="js-fadein-slow-"]{transition: transform 1910ms ease-in-out 191ms, opacity 1440ms ease-in-out 144ms;}



/* -------------------------------------------------- media ---------- */

#body-header.media .navigation-brand, #body-header.media .navigation-toggle, #body-main.media .main-section, #body-footer.media{opacity: .08;} 

.js-media-item{opacity: 0; z-index: 11; pointer-events: none;} .js-media-item .frame-absolute-auto{bottom: calc(var(--media-bottom) - 3%); width: 91vw; max-width: 124vh; opacity: 0; transition: opacity .58s ease-out, bottom .87s ease-out;} .js-media-item .frame-absolute-right{right: calc(var(--padding-horizontal) * 1.2 * 100%); bottom: calc(var(--close-bottom) - 8%); width: auto; opacity: 0; transition: opacity .76s .152s ease-out, bottom 1.14s .228s ease-out;} 

#body-main.media .js-media-item{opacity: 1; pointer-events: auto;} #body-main.media .js-media-item .frame-absolute-auto{bottom: var(--media-bottom); opacity: 1;} #body-main.media .js-media-item .frame-absolute-right{bottom: var(--close-bottom); opacity: 1;} 



/* -------------------------------------------------- informations ---------- */

.js-information-item{position: relative; display: block; padding: calc(var(--padding-vertical) / 2) 0;} .information-title{position: relative; display: inline-block; width: 100%; height: auto; padding-right: calc(3 * var(--padding-vertical));} .information-description{max-height: 0; overflow: hidden; opacity: 0;} .information-description p{display: block;} .symbol-information{position: absolute; right: 0; bottom: 50%; transform: translate(0,50%);} 

.js-information-item, .information-description{transition-duration: .71s;} .js-information-item.on .information-description{max-height: 870px; opacity: 1;} 



/* -------------------------------------------------- roll horizontal ---------- */

.horizontal-roll{--roll-item-count: 8; --roll-item-width: 35%; --roll-item-maxwidth: 150px; --roll-item-duration: 4.1s;} 

.horizontal-roll, .horizontal-roll .roll-wrapper{position: relative; display: block;} .horizontal-roll{width: 100%; height: auto; padding: 0; overflow: hidden;} .horizontal-roll .roll-wrapper{transform: translate(0px,0px);} .horizontal-roll .list-item{display: inline-block; height: auto; vertical-align: middle; text-align: left;} .horizontal-roll .horizontal-item{position: relative; display: block;} @-webkit-keyframes animation-roll-horizintal{0%{transform: translate(0px,0px);} 100%{transform: translate(-50%,0px);}} 

.horizontal-roll .roll-wrapper{width: calc(var(--roll-item-count) * var(--roll-item-width) * 2); min-width: calc(var(--roll-item-count) * var(--roll-item-maxwidth) * 2); animation: animation-roll-horizintal calc(var(--roll-item-count) * var(--roll-item-duration)) linear infinite;} .horizontal-roll .list-item{width: calc(100% / (2 * var(--roll-item-count)));} .horizontal-roll .horizontal-item{padding: 0 20%;} 



/* -------------------------------------------------- roll vertical ---------- */

.vertical-roll{--roll-vertical-width: 35%; --roll-vertical-height: 100%; --roll-item-count: 8; --roll-item-duration: 1.1s;} 

.vertical-roll, .vertical-roll .list-item{position: relative; display: block;} .vertical-roll{width: 100%; height: auto; padding: 0; overflow: hidden;} .vertical-roll .roll-wrapper{position: absolute; display: block; top: 0%; transform: translate(0px,0px); width: 100%;} /*.vertical-roll .roll-overflow{position: absolute; display: block; top: 100%; width: 100%; height: auto;}*/ .vertical-roll .list-item{width: 100%; height: auto; text-align: left;} .vertical-roll .vertical-item{position: relative; display: block;} @-webkit-keyframes animation-roll-vertical{0%{transform: translate(0px,0%);} 100%{transform: translate(0px,-50%);}} 

.vertical-roll{width: var(--roll-vertical-width); margin: 0 calc((100% - var(--roll-vertical-width)) / 2); padding-top: calc(var(--roll-vertical-height) * var(--roll-vertical-width) / 100%);} .vertical-roll .roll-wrapper{animation: animation-roll-vertical calc(var(--roll-item-count) * var(--roll-item-duration)) linear infinite;} .vertical-roll .vertical-item{padding: 0 20%;} 



/* -------------------------------------------------- accordion ---------- */

[class*="accordion-horizontal-"]{--accordion-mobile: calc(11 * (40px + 1vw)); --accordion-desktop: calc(8 * (40px + 1vw));} .accordion-horizontal-02{--accordion-count: 2;} .accordion-horizontal-03{--accordion-count: 3;} .accordion-horizontal-04{--accordion-count: 4;} 

.flex-100{display: flex; align-items: stretch; margin: 0 auto; gap: calc(0.2vw + 0.2vh + 2.0px);} .frame-accordion{position: relative; flex-grow: 1; overflow: hidden; cursor: context-menu;} .frame-accordion .image-cover{object-position: 50% 35%;} .js-accordion-item .frame-absolute-upper{min-width: calc(100vw / var(--accordion-count) - var(--padding-px));} 

.content-default, .content-hover{transition: opacity calc(1.7s / var(--accordion-count)) ease-in-out;} 

.js-accordion-item.on .content-default, .js-accordion-item .content-hover, .js-accordion-item.off .content-hover{opacity: 0;} 

.js-accordion-item .content-default, .js-accordion-item.off .content-default, .js-accordion-item.on .content-hover{opacity: 1;}



/* -------------------------------------------------- slide ---------- */

.horizontal-slide{--slide-item-count: 6; --slide-item-width: 40%;} 

.horizontal-slide, .horizontal-slide .slide-wrapper{position: relative; display: block; margin: 0 auto; height: auto;} .horizontal-slide{width: 100%; overflow: hidden;} .horizontal-slide .slide-wrapper{transition: transform .29s; padding: 0 2.5%;} .horizontal-slide .slide-wrapper .list-item{position: relative; display: inline-block; vertical-align: top;} .horizontal-slide .horizontal-item{position: relative; display: block;} 

.horizontal-slide .slide-wrapper{width: calc(var(--slide-item-count) * var(--slide-item-width));} .horizontal-slide .slide-wrapper .list-item{width: calc(100% / var(--slide-item-count));} .horizontal-slide .horizontal-item{padding: 0 6%;} 



/* -------------------------------------------------- sticky ---------- */

.section-sticky{overflow: inherit;} .frame-sticky-auto{position: sticky; top: 0; height: auto;} .desktop-sticky-auto{height: auto;} 



/* -------------------------------------------------- marquee ---------- */

/*[class*="marquee-"]{--gap: 0px; position: relative; display: flex; width: 100%; height: auto; overflow: hidden; user-select: none;} [class*="marquee-"] p{flex-shrink: 0; display: flex; justify-content: space-around; min-width: 100%;} [class*="marquee-"], [class*="marquee-"] p{gap: var(--gap);} [class*="marquee-"] p span{position: relative; display: inline-block; width: 24px; vertical-align: middle; text-align: center;}

.marquee-left p{animation: animation-marguee-left 24s linear infinite;} .marquee-right p{animation: animation-marguee-right 24s linear infinite;} @keyframes animation-marguee-left{from{transform: translateX(calc(0% - var(--gap)));}to{transform: translateX(-100%);}} @keyframes animation-marguee-right{from{transform: translateX(calc(-100% - var(--gap)));}to{transform: translateX(0);}}*/



/* -------------------------------------------------- multistep form ---------- */

.slide-multistep{width: 100%; height: auto; padding: 0; vertical-align: middle; overflow: hidden;} .slide-multistep-wrapper{-webkit-transform: translate(0px,0px);-ms-transform: translate(0px,0px);transform: translate(0px,0px);} .slide-multistep .multistep-tab{height: auto; vertical-align: top;}

#form-initial .slide-multistep-wrapper{width: 200%;} #form-initial .slide-multistep .multistep-tab{width: 50%;} 

[class*="multistep-"]{position: relative; display: inline-block;} [class*="multistep-"] input, [class*="multistep-"] textarea{padding: var(--padding-form) calc(2 * var(--padding-form));}  [class*="form-"] input, [class*="form-"] select, [class*="form-"] textarea, [class*="form-"] fieldset{vertical-align: top; border: none; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none;} [class*="form-"]{margin: 0 calc(-1 * var(--padding-form));} [class*="form-"] .slide-multistep{margin: 0 0;} [class*="form-"] [class*="grid-"], [class*="form-"] [class*="inline-"], [class*="form-"] [class*="squeeze-"]{padding: var(--padding-form) var(--padding-form); vertical-align: middle;} [class*="multistep-"] label, [class*="multistep-"] input, [class*="multistep-"] select, [class*="multistep-"] textarea, [class*="form-"] fieldset{display: block; width: 100%;} 

[class*="multistep-"] .label-default{padding-left: calc(1 * var(--padding-form)); padding-top: calc(var(--padding-vertical) / 10); pointer-events: none;} [class*="multistep-"] label a p{text-decoration: underline;} [class*="multistep-"] input, [class*="multistep-"] select, [class*="multistep-"] textarea{position: relative;} [class*="multistep-"] input, [class*="multistep-"] select, [class*="multistep-"] fieldset, [class*="multistep-"] textarea{margin-top: var(--padding-form);} [class*="multistep-"] textarea{resize: none;} [class*="multistep-"] input, [class*="multistep-"] textarea{-webkit-transition-duration: .14s;-o-transition-duration: .14s;transition-duration: .14s;} /*::placeholder{opacity: .29;}*/ 

/*[class*="form-"] label, [class*="form-"] .written-label{line-height: calc(12px + 0.3vw); font-size: calc(8px + 0.2vw); letter-spacing: calc(2.4px + 0.06vw);} */

.list-indicator .list-item{position: relative; display: none;} .list-indicator p{padding-left: calc(1 * var(--padding-form)); font-weight: 500;} .list-indicator .list-item.toggle{display: block;} .symbol-indicator{position: relative; display: block; width: 87%; height: 2.6px; margin: calc(var(--padding-vertical) / 4) auto; overflow: hidden; opacity: var(--opacity-ci);} .symbol-indicator [class*="shape-"]{height: 2.5px;} .symbol-indicator .shape-0{width: 100%; opacity: var(--opacity-low);} .symbol-indicator .shape-1{left: 0; right: auto; -webkit-transform: translate(0,50%); -ms-transform: translate(0,50%); transform: translate(0,50%); width: 0; -webkit-transition-duration: .57s; -o-transition-duration: .57s; transition-duration: .57s;} .form-multistep [class*="link-"]{text-align: center;} 

/*input, textarea{background-color: rgba(0,36,61,0.05);} input:hover, textarea:hover{background-color: rgba(0,36,61,0.1);} input::placeholder, textarea::placeholder{color: rgba(0,36,61,0.71);}*/ 

[class*="form-"] input, [class*="form-"] textarea{background-color: transparent; border-bottom: solid 2.5px var(--color-front);} input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{-webkit-transition-duration: .29s;transition-duration: .29s; opacity: var(--opacity-low);} input::-moz-placeholder, textarea::-moz-placeholder{transition-duration: .29s; opacity: var(--opacity-low);} input:-ms-input-placeholder, textarea:-ms-input-placeholder{transition-duration: .29s; opacity: var(--opacity-low);} input::-ms-input-placeholder, textarea::-ms-input-placeholder{transition-duration: .29s; opacity: var(--opacity-low);} input::placeholder, textarea::placeholder{-webkit-transition-duration: .29s;-o-transition-duration: .29s;transition-duration: .29s; opacity: var(--opacity-low);} input:hover::-webkit-input-placeholder, textarea:hover::-webkit-input-placeholder{opacity: var(--opacity-middle);} input:hover::-moz-placeholder, textarea:hover::-moz-placeholder{opacity: var(--opacity-middle);} input:hover:-ms-input-placeholder, textarea:hover:-ms-input-placeholder{opacity: var(--opacity-middle);} input:hover::-ms-input-placeholder, textarea:hover::-ms-input-placeholder{opacity: var(--opacity-middle);} input:hover::placeholder, textarea:hover::placeholder{opacity: var(--opacity-middle);} 



/* -------------------------------------------------- more ---------- */

#backlink .image-relative{display: inline-block; margin-left: 2px; width: 25px;} #matomo-opt-out{padding: calc(0.9vw + 0.9vh + 9px) 1.25%;} #matomo-opt-out input{margin-right: calc(0.45vw + 0.45vh + 4.5px); margin-top: calc(0.45vw + 0.45vh + 4.5px);} #matomo-opt-out label{margin: calc(0.9vw + 0.9vh + 9px) 0;} 



/* -------------------------------------------------- transition ---------- */

.js-approach-item{transition: opacity .17s;} 
#html-body, [class*="link-"]{transition-duration: .27s;} 
.js-accordion-item, .js-accordion-item .frame-absolute-lower{transition-duration: calc(1.7s / var(--accordion-count));} 
#body-main, #body-footer, .navigation-brand, .navigation-toggle, .navigation-language, .main-section{transition-duration: .54s;} 



/* #######################################################################
##################################################### signature ##########
####################################################################### */ 



/* -------------------------------------------------- header ---------- */

[class*="navigation-"]{z-index: 10;} 

.navigation-brand{left: calc(var(--padding-horizontal) * 1.5 * 100%); bottom: auto; top: calc(4.4 * var(--padding-vertical)); transform: translate(0,-50%); width: auto;} .navigation-toggle, .navigation-language{right: calc(var(--padding-horizontal) * 1.2 * 100%); transform: translate(calc(50% - 29px),50%); width: auto;} .navigation-toggle{bottom: 32%;} .navigation-language{bottom: calc(30% - 44px);} .navigation-language.scroll{right: 0; transform: translate(100%,50%);} 

.navigation-links{width: calc(var(--h1-size) * 5.5 + var(--padding-horizontal) * 2 * 100%);} .navigation-links .list-item{overflow: hidden;} .navigation-links .list-item [class*="link-"]{transform: translate(0,-7%);} .navigation-cta{width: var(--size-fix);} .navigation-back, .navigation-links, .navigation-cta{pointer-events: none; opacity: 0;} #body-header.toggle .navigation-back, #body-header.toggle .navigation-links, #body-header.toggle .navigation-cta{pointer-events: auto; opacity: 1;} 

.navigation-links{right: 57%; bottom: 44%; transition: opacity .58s ease-out, bottom .87s ease-out;} .navigation-cta{right: 47%; transition: opacity .76s .152s ease-out, bottom 1.14s .228s ease-out;} #body-header.toggle .navigation-links{bottom: 47%;} 



/* -------------------------------------------------- main ---------- */

.overflow-hidden .js-parallax-item{height: 110%;}
[class*="maxwidth-"]{margin: 0 auto;} 
.maxwidth-home-intro{max-width: calc(var(--h1-size) * 11.7); margin: 0 0;} .maxwidth-home-intro .link-cta{margin-right: calc(var(--hp-size) * 2.4);} 

.maxwidth-form{max-width: calc(var(--h0-size) * 5.9);} 
.maxwidth-404{max-width: calc(var(--h0-size) * 3.5);} 
.maxwidth-backdrop{max-width: calc(var(--h0-size) * 4);} 

.maxwidth-icon{max-width: calc(var(--h1-size) * 4);} 

.frame-absolute-asymmetric{bottom: -7.5%; width: 100%;} 

.list-team .list-item{display: inline-block; width: 50%; margin: 0 0; padding: 0 calc(var(--h0-size) * 0.04);} 

.list-tile{--tile-size: calc(var(--h4-size) * 10); display: inline-block;}
.list-tile .list-item{display: inline-block; width: var(--tile-size); padding: calc(var(--h0-size) * 0.04);} .list-tile p{display: block;}

.list-trust{--trust-size: calc(var(--h3-size) * 3.1); display: inline-block;} .list-trust .list-item{display: inline-block; padding: calc(var(--h0-size) * 0.08) calc(var(--h0-size) * 0.24);} .list-trust .link-trust .image-relative{width: 100%; max-width: var(--trust-size); height: 100%; max-height: calc(var(--trust-size) * 0.8);} 

.list-insight{--insight-size: calc(var(--h3-size) * 4.4); } .list-insight .list-item{padding: calc(var(--h0-size) * 0.2) 0;} .list-insight .list-item{display: inline-block;}

.link-insight{width: calc(var(--insight-size) * 2.7); max-width: 100%; height: calc(var(--insight-size) * 0.8);} .link-insight .frame-absolute-image{right: 100%; transform: translate(100%,50%); width: calc(var(--insight-size) * 1.2); height: calc(var(--insight-size) * 0.9); padding: calc(var(--insight-size) * 0.1) calc(var(--insight-size) * 0.2);} .link-insight .frame-absolute-p{right: 0%; transform: translate(0%,50%); width: calc(100% - var(--insight-size) * 1.32);} 



/* -------------------------------------------------- sub folder ---------- */

.frame-relative-aboutus{padding-top: 90%;} .frame-relative-aboutus .frame-absolute-bottomleft, .frame-relative-aboutus .frame-absolute-topright{width: 52.5%;}

.frame-relative-insights .frame-absolute-bottom{right: calc(25% + 50px);} .frame-relative-insights .image-inline{--trust-size: calc(var(--h3-size) * 5.5); width: 50%; max-width: var(--trust-size); height: 100%; max-height: calc(var(--trust-size) * 0.8); transform: translate(0,16.67%);} 



/* -------------------------------------------------- vertical ---------- */

.overlay-vertical{--overlay-vertical-columns: 5; --overlay-vertical-size: calc(var(--h0-size) * 10);} .overlay-vertical{margin: 0 calc((100% - var(--overlay-vertical-size)) / 2); width: var(--overlay-vertical-size);} .list-vertical .list-item{display: inline-block; width: calc(100% / var(--overlay-vertical-columns)); padding: calc(var(--h0-size) * 0.04);} 



/* -------------------------------------------------- logos ---------- */

.overlay-logo{--overlay-logo-columns: 6; --overlay-logo-size: calc(84% + 420px);} .overlay-logo{margin: 0 calc((100% - var(--overlay-logo-size)) / 2); width: var(--overlay-logo-size);} .list-logo .list-item{display: inline-block; width: calc(100% / var(--overlay-logo-columns)); padding: calc(0.47vw + 0.47vh + 4.7px) 4.7vw;} 



/* -------------------------------------------------- collection ---------- */

.overlay-collection{--overlay-collection-columns: 4; --overlay-collection-size: calc(128% + 320px);} .overlay-collection{margin: 0 calc((100% - var(--overlay-collection-size)) / 2); width: var(--overlay-collection-size);} .list-collection .list-item{display: inline-block; width: calc(100% / var(--overlay-collection-columns)); padding: calc(var(--h0-size) * 0.04);} 



/* -------------------------------------------------- footer ---------- */

#body-footer [class*="grid-"]{vertical-align: middle;} #body-footer .link-brand{margin-right: calc(4 * var(--padding-link));} 



/* -------------------------------------------------- temp ---------- */

.link-trust{pointer-events: none;}



/* -------------------------------------------------- media query ---------- */

@media(max-width: 1039px){
    #html-body{--layer-max: calc(540px + 27vw); --layer-diff: 0.15; --font-size: 11/*12*/; --font-rise: 1.32/*1.34*/; --size-fix: calc(var(--h2-size) * 8);}
	
	.navigation-links{transform: translate(50%,25%);} .navigation-cta{bottom: 32%; transform: translate(50%,125%);} #body-header.toggle .navigation-cta{bottom: 37%;} 
    
    [class*="grid-"]{width: 100%;} .grid-25{width: 50%;}  [class*="desktop-absolute-"]{position: relative; display: block; right: auto; bottom: auto; transform: translate(0,0);} [class*="desktop-sticky-"]{position: relative; top: auto; margin: 0 0;} .only-mobile{display: block !important;} .only-desktop{display: none !important;} .frame-relative-insights{padding-top: 92.5%;} .frame-relative-insights .frame-absolute-bottomleft, .frame-relative-insights .frame-absolute-topright{width: 77.5%;} .frame-relative-card{padding-top: calc(var(--size-fix) * 0.4);} .frame-relative-vertical{padding-top: calc(200px + 80%);} .frame-relative-horizontal{padding-top: calc(100px + 40%);} .frame-relative-asymmetric{padding-top: calc(100px + 40% * 1.15 - var(--padding-vertical) * 4);} .frame-absolute-asymmetric{right: 15%;} 
    
    .indent-left-10, .indent-left-15{padding-left: 5%;} .indent-right-10, .indent-right-15{padding-right: 5%;} .indent-horizontal-25{padding: 0 5%;} .indent-left-25, .indent-left-33, .indent-left-38{padding-left: 10%;} .indent-right-25, .indent-right-33, .indent-right-38{padding-right: 10%;} .indent-left-50, .indent-left-62{padding-left: 15%;} .indent-right-50, .indent-right-62{padding-right: 15%;} .squeeze-left-75, .squeeze-right-75{width: 92.5%;} .squeeze-right-75{margin-right: 7.5%;} .squeeze-left-75{margin-left: 7.5%;} .squeeze-left-62, .squeeze-right-62{width: 90%;} .squeeze-right-62{margin-right: 10%;} .squeeze-left-62{margin-left: 10%;} .squeeze-left-50, .squeeze-right-50{width: 87.5%;} .squeeze-right-50{margin-right: 12.5%;} .squeeze-left-50{margin-left: 12.5%;} .squeeze-left-38, .squeeze-right-38{width: 85%;} .squeeze-right-38{margin-right: 15%;} .squeeze-left-38{margin-left: 15%;} .squeeze-left-fix{margin-left: calc(100% - var(--size-fix)); width: var(--size-fix);} .squeeze-right-flex{margin-right: 10%; width: 90%;} .content-first{padding: 0 calc(var(--padding-vertical) * 2.5) 0 0;} .content-second{padding: 0 0 0 calc(var(--padding-vertical) * 2.5);} 
	
	.flex-100{flex-direction: column; height: var(--accordion-mobile); max-height: var(--accordion-mobile);} .js-accordion-item, .js-accordion-item.off, .js-accordion-item.on{width: 100%;} .js-accordion-item{height: calc(100% / var(--accordion-count));} .js-accordion-item.off{height: calc(100% * ((var(--accordion-count) - 1) / var(--accordion-count)) / var(--accordion-count));} .js-accordion-item.on{height: calc(100% * (1 + (var(--accordion-count) - 1) / var(--accordion-count)) / var(--accordion-count));} .js-media-item{--close-bottom: calc(33% - 13vw); --media-bottom: 50%;} .js-media-item .frame-absolute-auto{right: 50%;}

	.desktop-sticky-insights .frame-relative-1to1{padding-top: 50%;} .inline-ctatext{text-align: left;} /*.flex-100{flex-direction: column; max-width: var(--testimonial-mobile); height: calc(9 / 16 * 100vw / var(--testimonial-size)); max-height: calc(9 / 16 * var(--testimonial-mobile) / var(--testimonial-size));} .absolute-height{width: 100%; height: calc(9 / 16 * 100vw); max-height: calc(9 / 16 * var(--testimonial-mobile));} .js-accordion-item, .js-accordion-item.off, .js-accordion-item.on{width: 100%;} .js-accordion-item{height: calc(100% / var(--testimonial-size));} .js-accordion-item.off{height: calc((100% - var(--testimonial-size) * 100%) / (var(--testimonial-num) - 1));} .js-accordion-item.on{height: calc(var(--testimonial-size) * 100%);}*/ 
    }
@media(min-width: 1040px){
    #html-body{--layer-max: calc(1000px + 50vw); --layer-diff: 0.15; --font-size: 11; --font-rise: 1.32; --size-fix: calc(var(--h3-size) * 9);}
	
	.navigation-links{transform: translate(35%,50%);} .navigation-cta{bottom: 35%; transform: translate(130%,50%);} #body-header.toggle .navigation-cta{bottom: 40%;} 
    
    .grid-75{width: 75%;} .grid-67{width: 66.67%;} .grid-62{width: 61.8%;} .grid-55{width: 55.55%;} .grid-50{width: 50%;} .grid-44{width: 44.44%;} .grid-38{width: 38.2%;} .grid-33{width: 33.33%;} .grid-25{width: 25%;} .grid-fix{width: var(--size-fix);} .grid-flex{width: calc(100% - var(--size-fix));} [class*="desktop-absolute-"]{position: absolute; display: block; bottom: 50%; transform: translate(0,50%);} .desktop-absolute-left{left: 0;} .desktop-absolute-middle{right: 50%; transform: translate(50%,50%);} .desktop-absolute-right{right: 0;} .desktop-sticky-auto{position: sticky; top: 0;} .desktop-sticky-insights{position: sticky; top: calc(var(--padding-vertical) * 2.5); margin-top: calc(var(--padding-vertical) * 10);} .only-mobile{display: none !important;} .only-desktop{display: inline-block !important;} .frame-relative-insights{padding-top: 52.5%;} .frame-relative-insights .frame-absolute-bottomleft, .frame-relative-insights .frame-absolute-topright{width: 54%;} .frame-relative-card{padding-top: 133.33%;} .frame-relative-vertical{padding-top: calc(250px + 100%);} .frame-relative-horizontal{padding-top: calc(100px + 40%);} .frame-relative-asymmetric{padding-top: calc(100px + 40% * 0.33 * 0.925);} .frame-absolute-asymmetric{right: -15%;} 
    
    .indent-left-10{padding-left: 12.5%;} .indent-right-10{padding-right: 12.5%;} .indent-left-15{padding-left: 15%;} .indent-right-15{padding-right: 15%;} .indent-left-25{padding-left: 25%;} .indent-right-25{padding-right: 25%;} .indent-horizontal-25{padding: 0 12.5%;} .indent-left-33{padding-left: 33.33%;} .indent-right-33{padding-right: 33.33%;} .indent-left-38{padding-left: 38.2%;} .indent-right-38{padding-right: 38.2%;} .indent-left-50{padding-left: 50%;} .indent-right-50{padding-right: 50%;} .indent-left-62{padding-left: 61.8%;} .indent-right-62{padding-right: 61.8%;} .squeeze-left-75, .squeeze-right-75{width: 75%;} .squeeze-left-62, .squeeze-right-62{width: 61.8%;} .squeeze-left-50, .squeeze-right-50{width: 50%;} .squeeze-left-38, .squeeze-right-38{width: 38.2%;} .squeeze-left-25, .squeeze-right-25{width: 25%;} .squeeze-left-fix{width: var(--size-fix);} .squeeze-right-flex{width: calc(100% - var(--size-fix));} [class*="squeeze-left-"]{margin-left: auto;} [class*="squeeze-right-"]{margin-right: auto;} .mobile-overlay-top{margin-top: 0;} .content-first{padding: 0 0 calc(var(--padding-vertical) * 4) 0;} .content-second{padding: calc(var(--padding-vertical) * 4) 0 0 0;} 
	
	.flex-100{flex-direction: row;} .js-accordion-item, .js-accordion-item.off, .js-accordion-item.on{height: var(--accordion-desktop);} .js-accordion-item{width: calc(100% / var(--accordion-count));} .js-accordion-item.off{width: calc(100% * ((var(--accordion-count) - 1) / var(--accordion-count)) / var(--accordion-count));} .js-accordion-item.on{width: calc(100% * (1 + (var(--accordion-count) - 1) / var(--accordion-count)) / var(--accordion-count));} .js-accordion-item .content-hover{min-width: calc(100vw * (1 + (var(--accordion-count) - 1) / var(--accordion-count)) / var(--accordion-count));} .js-media-item{--close-bottom: 32%; --media-bottom: 47%;} .js-media-item .frame-absolute-auto{right: calc(50% + 0.5 * (var(--padding-horizontal) * 1.2 * 100% + 58px));}
	
	.inline-ctatext{text-align: center;} /*.flex-100{flex-direction: row;} .absolute-height{width: calc(var(--testimonial-size) * 100vw); height: 100%;} .js-accordion-item, .js-accordion-item.off, .js-accordion-item.on{height: calc(var(--testimonial-size) * 9 / 16 * 100vw);} .js-accordion-item{width: calc(100% / var(--testimonial-size));} .js-accordion-item.off{width: calc((100% - var(--testimonial-size) * 100%) / (var(--testimonial-num) - 1));} .js-accordion-item.on{width: calc(var(--testimonial-size) * 100%);}*/ 
    }



/* #######################################################################
##################################################### more media #########
####################################################################### */ 



/* -------------------------------------------------- touch ---------- */

@media(pointer: coarse){
    .js-cursor-outer, .js-cursor-inner{display: none;}
}



/* -------------------------------------------------- print ---------- */

@media screen {
    .js-enable [class*="js-fadein-"]{opacity: 0;} .js-enable .js-fadein-slow-left, .js-enable .js-fadein-fast-left{transform: translate(58px,0);} .js-enable .js-fadein-slow-right, .js-enable .js-fadein-fast-right{transform: translate(-58px,0);} .js-enable .js-fadein-slow-up, .js-enable .js-fadein-fast-up{transform: translate(0,29px);} /*.js-enable .js-fadein-down{transform: translate(0,-41px);}*/ .js-enable [class*="js-fadein-"].on{opacity: 1; transform: translate(0,0);} 
    }
@media print {
    .js-enable [class*="js-fadein-"]{opacity: 1;} .js-enable .js-fadein-slow-left, .js-enable .js-fadein-fast-left{transform: translate(0,0);} .js-enable .js-fadein-slow-right, .js-enable .js-fadein-fast-right{transform: translate(0,0);} .js-enable .js-fadein-slow-up, .js-enable .js-fadein-fast-up{transform: translate(0,0);} /*.js-enable .js-fadein-down{transform: translate(0,0);}*/ .js-enable [class*="js-fadein-"].on{opacity: 1; transform: translate(0,0);} 
    }