html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-family:sans-serif}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{vertical-align:baseline;display:inline-block}audio:not([controls]){height:0;display:none}[hidden],template{display:none}a{background-color:#0000}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0;font-size:2em}mark{color:#000;background:#5600ff}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:none}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}@font-face{font-family:ui-icons;src:url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBiUAAAC8AAAAYGNtYXDpP+a4AAABHAAAAFxnYXNwAAAAEAAAAXgAAAAIZ2x5ZmhS2XEAAAGAAAADHGhlYWQTFw3HAAAEnAAAADZoaGVhCXYFgQAABNQAAAAkaG10eCe4A1oAAAT4AAAAMGxvY2EDtALGAAAFKAAAABptYXhwABAAPgAABUQAAAAgbmFtZSoCsMsAAAVkAAABznBvc3QAAwAAAAAHNAAAACAAAwP4AZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpAwPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAQAAAAAwACAACAAQAAQAg5gPpA//9//8AAAAAACDmAOkA//3//wAB/+MaBBcIAAMAAQAAAAAAAAAAAAAAAAABAAH//wAPAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEBIAAAAyADgAAFAAAJAQcJARcDIP5AQAGA/oBAAcABwED+gP6AQAABAOAAAALgA4AABQAAEwEXCQEH4AHAQP6AAYBAAcABwED+gP6AQAAAAwDAAOADQALAAA8AHwAvAAABISIGHQEUFjMhMjY9ATQmByEiBh0BFBYzITI2PQE0JgchIgYdARQWMyEyNj0BNCYDIP3ADRMTDQJADRMTDf3ADRMTDQJADRMTDf3ADRMTDQJADRMTAsATDSANExMNIA0TwBMNIA0TEw0gDRPAEw0gDRMTDSANEwAAAAABAJ0AtAOBApUABQAACQIHCQEDJP7r/upcAXEBcgKU/usBFVz+fAGEAAAAAAL//f+9BAMDwwAEAAkAABcBJwEXAwE3AQdpA5ps/GZsbAOabPxmbEMDmmz8ZmwDmvxmbAOabAAAAgAA/8AEAAPAAB0AOwAABSInLgEnJjU0Nz4BNzYzMTIXHgEXFhUUBw4BBwYjNTI3PgE3NjU0Jy4BJyYjMSIHDgEHBhUUFx4BFxYzAgBqXV6LKCgoKIteXWpqXV6LKCgoKIteXWpVSktvICEhIG9LSlVVSktvICEhIG9LSlVAKCiLXl1qal1eiygoKCiLXl1qal1eiygoZiEgb0tKVVVKS28gISEgb0tKVVVKS28gIQABAAABwAIAA8AAEgAAEzQ3PgE3NjMxFSIHDgEHBhUxIwAoKIteXWpVSktvICFmAcBqXV6LKChmISBvS0pVAAAAAgAA/8AFtgPAADIAOgAAARYXHgEXFhUUBw4BBwYHIxUhIicuAScmNTQ3PgE3NjMxOAExNDc+ATc2MzIXHgEXFhcVATMJATMVMzUEjD83NlAXFxYXTjU1PQL8kz01Nk8XFxcXTzY1PSIjd1BQWlJJSXInJw3+mdv+2/7c25MCUQYcHFg5OUA/ODlXHBwIAhcXTzY1PTw1Nk8XF1tQUHcjIhwcYUNDTgL+3QFt/pOTkwABAAAAAQAAmM7nP18PPPUACwQAAAAAANciZKUAAAAA1yJkpf/9/70FtgPDAAAACAACAAAAAAAAAAEAAAPA/8AAAAW3//3//QW2AAEAAAAAAAAAAAAAAAAAAAAMBAAAAAAAAAAAAAAAAgAAAAQAASAEAADgBAAAwAQAAJ0EAP/9BAAAAAQAAAAFtwAAAAAAAAAKABQAHgAyAEYAjACiAL4BFgE2AY4AAAABAAAADAA8AAMAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEADQAAAAEAAAAAAAIABwCWAAEAAAAAAAMADQBIAAEAAAAAAAQADQCrAAEAAAAAAAUACwAnAAEAAAAAAAYADQBvAAEAAAAAAAoAGgDSAAMAAQQJAAEAGgANAAMAAQQJAAIADgCdAAMAAQQJAAMAGgBVAAMAAQQJAAQAGgC4AAMAAQQJAAUAFgAyAAMAAQQJAAYAGgB8AAMAAQQJAAoANADsd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzVmVyc2lvbiAxLjAAVgBlAHIAcwBpAG8AbgAgADEALgAwd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzUmVndWxhcgBSAGUAZwB1AGwAYQByd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzRm9udCBnZW5lcmF0ZWQgYnkgSWNvTW9vbi4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==)format("truetype");font-weight:400;font-style:normal}[class^=mw-icon-],[class*=\ mw-icon-]{speak:none;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;font-family:ui-icons!important}.mw-icon-slider-right:before{content:"î"}.mw-icon-slider-left:before{content:"î"}.mw-icon-nav-menu:before{content:"î"}.mw-icon-arrow-down:before,.mw-icon-dropdown-toggle:before{content:"î"}.mw-icon-file-upload-remove:before{content:"î¤"}.mw-icon-file-upload-icon:before{content:"î¤"}*{box-sizing:border-box}html{height:100%}body{color:#333;background-color:#fff;min-height:100%;margin:0;font-family:Arial,sans-serif;font-size:14px;line-height:20px}img{vertical-align:middle;max-width:100%;display:inline-block}html.mw-mod-touch *{background-attachment:scroll!important}.mw-block{display:block}.mw-inline-block{max-width:100%;display:inline-block}.mw-clearfix:before,.mw-clearfix:after{content:" ";grid-area:1/1/2/2;display:table}.mw-clearfix:after{clear:both}.mw-hidden{display:none}.mw-button{color:#fff;line-height:inherit;cursor:pointer;background-color:#b338ec;border:0;border-radius:0;padding:9px 15px;text-decoration:none;display:inline-block}input.mw-button{-webkit-appearance:button}html[data-w-dynpage] [data-w-cloak]{color:#0000!important}.mw-code-block{margin:unset}pre.mw-code-block code{all:inherit}.mw-optimization{display:contents}.mw-brand-chip,.mw-brand-chip>img{box-sizing:unset;width:unset;height:unset;max-height:unset;max-width:unset;min-height:unset;min-width:unset;margin:unset;padding:unset;float:unset;clear:unset;border:unset;border-radius:unset;background:unset;background-image:unset;background-position:unset;background-size:unset;background-repeat:unset;background-origin:unset;background-clip:unset;background-attachment:unset;background-color:unset;box-shadow:unset;transform:unset;direction:unset;font-family:unset;font-weight:unset;color:unset;font-size:unset;line-height:unset;font-style:unset;font-variant:unset;text-align:unset;letter-spacing:unset;-webkit-text-decoration:unset;text-decoration:unset;text-indent:unset;text-transform:unset;list-style-type:unset;text-shadow:unset;vertical-align:unset;cursor:unset;white-space:unset;word-break:unset;word-spacing:unset;word-wrap:unset;transition:unset}.mw-brand-chip{white-space:nowrap;cursor:pointer;box-shadow:0 0 0 1px #0000001a,0 1px 3px #0000001a;visibility:visible!important;opacity:1!important;z-index:2147483647!important;color:#aaadb0!important;overflow:unset!important;background-color:#fff!important;border-radius:3px!important;width:auto!important;height:auto!important;margin:0!important;padding:6px!important;font-size:12px!important;line-height:14px!important;text-decoration:none!important;display:inline-block!important;position:fixed!important;inset:auto 12px 12px auto!important;transform:none!important}.mw-brand-chip>img{position:unset;visibility:unset!important;opacity:1!important;vertical-align:middle!important;display:inline-block!important}h1,h2,h3,h4,h5,h6{margin-bottom:10px;font-weight:700}h1{margin-top:20px;font-size:38px;line-height:44px}h2{margin-top:20px;font-size:32px;line-height:36px}h3{margin-top:20px;font-size:24px;line-height:30px}h4{margin-top:10px;font-size:18px;line-height:24px}h5{margin-top:10px;font-size:14px;line-height:20px}h6{margin-top:10px;font-size:12px;line-height:18px}p{margin-top:0;margin-bottom:10px}blockquote{border-left:5px solid #e2e2e2;margin:0 0 10px;padding:10px 20px;font-size:18px;line-height:22px}figure{margin:0 0 10px}figcaption{text-align:center;margin-top:5px}ul,ol{margin-top:0;margin-bottom:10px;padding-left:40px}.mw-list-unstyled{padding-left:0;list-style:none}.mw-embed:before,.mw-embed:after{content:" ";grid-area:1/1/2/2;display:table}.mw-embed:after{clear:both}.mw-video{width:100%;padding:0;position:relative}.mw-video iframe,.mw-video object,.mw-video embed{border:none;width:100%;height:100%;position:absolute;top:0;left:0}fieldset{border:0;margin:0;padding:0}button,[type=button],[type=reset]{cursor:pointer;-webkit-appearance:button;border:0}.mw-form{margin:0 0 15px}.mw-form-done{text-align:center;background-color:#ddd;padding:20px;display:none}.mw-form-fail{background-color:#E4D9C3;margin-top:10px;padding:10px;display:none}label{margin-bottom:5px;font-weight:700;display:block}.mw-input,.mw-select{color:#333;vertical-align:middle;background-color:#fff;border:1px solid #ccc;width:100%;height:38px;margin-bottom:10px;padding:8px 12px;font-size:14px;line-height:1.42857;display:block}.mw-input::placeholder,.mw-select::placeholder{color:#999}.mw-input:focus,.mw-select:focus{border-color:#b338ec;outline:0}.mw-input[disabled],.mw-select[disabled],.mw-input[readonly],.mw-select[readonly],fieldset[disabled] .mw-input,fieldset[disabled] .mw-select{cursor:not-allowed}.mw-input[disabled]:not(.mw-input-disabled),.mw-select[disabled]:not(.mw-input-disabled),.mw-input[readonly],.mw-select[readonly],fieldset[disabled]:not(.mw-input-disabled) .mw-input,fieldset[disabled]:not(.mw-input-disabled) .mw-select{background-color:#eee}textarea.mw-input,textarea.mw-select{height:auto}.mw-select{background-color:#f3f3f3}.mw-select[multiple]{height:auto}.mw-form-label{cursor:pointer;margin-bottom:0;font-weight:400;display:inline-block}.mw-radio{margin-bottom:5px;padding-left:20px;display:block}.mw-radio:before,.mw-radio:after{content:" ";grid-area:1/1/2/2;display:table}.mw-radio:after{clear:both}.mw-radio-input{float:left;margin:3px 0 0 -20px;line-height:normal}.mw-file-upload{margin-bottom:10px;display:block}.mw-file-upload-input{opacity:0;z-index:-100;width:.1px;height:.1px;position:absolute;overflow:hidden}.mw-file-upload-default,.mw-file-upload-uploading,.mw-file-upload-success{color:#333;display:inline-block}.mw-file-upload-error{margin-top:10px;display:block}.mw-file-upload-default.mw-hidden,.mw-file-upload-uploading.mw-hidden,.mw-file-upload-error.mw-hidden,.mw-file-upload-success.mw-hidden{display:none}.mw-file-upload-uploading-btn{cursor:pointer;background-color:#fafafa;border:1px solid #ccc;margin:0;padding:8px 12px;font-size:14px;font-weight:400;display:flex}.mw-file-upload-file{background-color:#fafafa;border:1px solid #ccc;flex-grow:1;justify-content:space-between;margin:0;padding:8px 9px 8px 11px;display:flex}.mw-file-upload-file-name{font-size:14px;font-weight:400;display:block}.mw-file-remove-link{cursor:pointer;width:auto;height:auto;margin-top:3px;margin-left:10px;padding:3px;display:block}.mw-icon-file-upload-remove{margin:auto;font-size:10px}.mw-file-upload-error-msg{color:#ea38e7;padding:2px 0;display:inline-block}.mw-file-upload-info{padding:0 12px;line-height:38px;display:inline-block}.mw-file-upload-label{cursor:pointer;background-color:#fafafa;border:1px solid #ccc;margin:0;padding:8px 12px;font-size:14px;font-weight:400;display:inline-block}.mw-icon-file-upload-icon,.mw-icon-file-upload-uploading{width:20px;margin-right:8px;display:inline-block}.mw-icon-file-upload-uploading{height:20px}.mw-container{max-width:940px;margin-left:auto;margin-right:auto}.mw-container:before,.mw-container:after{content:" ";grid-area:1/1/2/2;display:table}.mw-container:after{clear:both}.mw-container .mw-row{margin-left:-10px;margin-right:-10px}.mw-row:before,.mw-row:after{content:" ";grid-area:1/1/2/2;display:table}.mw-row:after{clear:both}.mw-row .mw-row{margin-left:0;margin-right:0}.mw-col{float:left;width:100%;min-height:1px;padding-left:10px;padding-right:10px;position:relative}.mw-col .mw-col{padding-left:0;padding-right:0}.mw-col-1{width:8.33333%}.mw-col-2{width:16.6667%}.mw-col-3{width:25%}.mw-col-4{width:33.3333%}.mw-col-5{width:41.6667%}.mw-col-6{width:50%}.mw-col-7{width:58.3333%}.mw-col-8{width:66.6667%}.mw-col-9{width:75%}.mw-col-10{width:83.3333%}.mw-col-11{width:91.6667%}.mw-col-12{width:100%}.mw-hidden-main{display:none!important}@media screen and (max-width:991px){.mw-container{max-width:728px}.mw-hidden-main{display:inherit!important}.mw-hidden-medium{display:none!important}.mw-col-medium-1{width:8.33333%}.mw-col-medium-2{width:16.6667%}.mw-col-medium-3{width:25%}.mw-col-medium-4{width:33.3333%}.mw-col-medium-5{width:41.6667%}.mw-col-medium-6{width:50%}.mw-col-medium-7{width:58.3333%}.mw-col-medium-8{width:66.6667%}.mw-col-medium-9{width:75%}.mw-col-medium-10{width:83.3333%}.mw-col-medium-11{width:91.6667%}.mw-col-medium-12{width:100%}.mw-col-stack{width:100%;left:auto;right:auto}}@media screen and (max-width:767px){.mw-hidden-main,.mw-hidden-medium{display:inherit!important}.mw-hidden-small{display:none!important}.mw-row,.mw-container .mw-row{margin-left:0;margin-right:0}.mw-col{width:100%;left:auto;right:auto}.mw-col-small-1{width:8.33333%}.mw-col-small-2{width:16.6667%}.mw-col-small-3{width:25%}.mw-col-small-4{width:33.3333%}.mw-col-small-5{width:41.6667%}.mw-col-small-6{width:50%}.mw-col-small-7{width:58.3333%}.mw-col-small-8{width:66.6667%}.mw-col-small-9{width:75%}.mw-col-small-10{width:83.3333%}.mw-col-small-11{width:91.6667%}.mw-col-small-12{width:100%}}@media screen and (max-width:479px){.mw-container{max-width:none}.mw-hidden-main,.mw-hidden-medium,.mw-hidden-small{display:inherit!important}.mw-hidden-tiny{display:none!important}.mw-col{width:100%}.mw-col-tiny-1{width:8.33333%}.mw-col-tiny-2{width:16.6667%}.mw-col-tiny-3{width:25%}.mw-col-tiny-4{width:33.3333%}.mw-col-tiny-5{width:41.6667%}.mw-col-tiny-6{width:50%}.mw-col-tiny-7{width:58.3333%}.mw-col-tiny-8{width:66.6667%}.mw-col-tiny-9{width:75%}.mw-col-tiny-10{width:83.3333%}.mw-col-tiny-11{width:91.6667%}.mw-col-tiny-12{width:100%}}.mw-widget{position:relative}.mw-widget-map{width:100%;height:400px}.mw-widget-map label{width:auto;display:inline}.mw-widget-map img{max-width:inherit}.mw-widget-map .gm-style-iw{text-align:center}.mw-widget-map .gm-style-iw>button{display:none!important}.mw-widget-twitter{overflow:hidden}.mw-widget-twitter-count-shim{vertical-align:top;text-align:center;background:#fff;border:1px solid #8c7596;border-radius:3px;width:28px;height:20px;display:inline-block;position:relative}.mw-widget-twitter-count-shim *{pointer-events:none;-webkit-user-select:none;user-select:none}.mw-widget-twitter-count-shim .mw-widget-twitter-count-inner{text-align:center;color:#999;font-family:serif;font-size:15px;line-height:12px;position:relative}.mw-widget-twitter-count-shim .mw-widget-twitter-count-clear{display:block;position:relative}.mw-widget-twitter-count-shim.mw--large{width:36px;height:28px}.mw-widget-twitter-count-shim.mw--large .mw-widget-twitter-count-inner{font-size:18px;line-height:18px}.mw-widget-twitter-count-shim:not(.mw--vertical){margin-left:5px;margin-right:8px}.mw-widget-twitter-count-shim:not(.mw--vertical).mw--large{margin-left:6px}.mw-widget-twitter-count-shim:not(.mw--vertical):before,.mw-widget-twitter-count-shim:not(.mw--vertical):after{content:" ";pointer-events:none;border:solid #0000;width:0;height:0;position:absolute;top:50%;left:0}.mw-widget-twitter-count-shim:not(.mw--vertical):before{border-width:4px;border-color:#75869600 #725d7b #75869600 #75869600;margin-top:-4px;margin-left:-9px}.mw-widget-twitter-count-shim:not(.mw--vertical).mw--large:before{border-width:5px;margin-top:-5px;margin-left:-10px}.mw-widget-twitter-count-shim:not(.mw--vertical):after{border-width:4px;border-color:#fff0 #fff #fff0 #fff0;margin-top:-4px;margin-left:-8px}.mw-widget-twitter-count-shim:not(.mw--vertical).mw--large:after{border-width:5px;margin-top:-5px;margin-left:-9px}.mw-widget-twitter-count-shim.mw--vertical{width:61px;height:33px;margin-bottom:8px}.mw-widget-twitter-count-shim.mw--vertical:before,.mw-widget-twitter-count-shim.mw--vertical:after{content:" ";pointer-events:none;border:solid #0000;width:0;height:0;position:absolute;top:100%;left:50%}.mw-widget-twitter-count-shim.mw--vertical:before{border-width:5px;border-color:#725d7b #75869600 #75869600;margin-left:-5px}.mw-widget-twitter-count-shim.mw--vertical:after{border-width:4px;border-color:#fff #fff0 #fff0;margin-left:-4px}.mw-widget-twitter-count-shim.mw--vertical .mw-widget-twitter-count-inner{font-size:18px;line-height:22px}.mw-widget-twitter-count-shim.mw--vertical.mw--large{width:76px}.mw-background-video{color:#fff;height:500px;position:relative;overflow:hidden}.mw-background-video>video{object-fit:cover;z-index:-100;background-position:50%;background-size:cover;width:100%;height:100%;margin:auto;position:absolute;inset:-100%}.mw-background-video>video::-webkit-media-controls-start-playback-button{-webkit-appearance:none;display:none!important}.mw-background-video--control{background-color:#0000;padding:0;position:absolute;bottom:1em;right:1em}.mw-background-video--control>[hidden]{display:none!important}.mw-slider{text-align:center;clear:both;-webkit-tap-highlight-color:#0000;tap-highlight-color:#0000;background:#ddd;height:300px;position:relative}.mw-slider-mask{z-index:1;white-space:nowrap;height:100%;display:block;position:relative;left:0;right:0;overflow:hidden}.mw-slide{vertical-align:top;white-space:normal;text-align:left;width:100%;height:100%;display:inline-block;position:relative}.mw-slider-nav{z-index:2;text-align:center;-webkit-tap-highlight-color:#0000;tap-highlight-color:#0000;height:40px;margin:auto;padding-top:10px;position:absolute;inset:auto 0 0}.mw-slider-nav.mw-round>div{border-radius:100%}.mw-slider-nav.mw-num>div{font-size:inherit;line-height:inherit;width:auto;height:auto;padding:.2em .5em}.mw-slider-nav.mw-shadow>div{box-shadow:0 0 3px #3336}.mw-slider-nav-invert{color:#fff}.mw-slider-nav-invert>div{background-color:#2226}.mw-slider-nav-invert>div.mw-active{background-color:#222}.mw-slider-dot{cursor:pointer;background-color:#fff6;width:1em;height:1em;margin:0 3px .5em;transition:background-color .1s,color .1s;display:inline-block;position:relative}.mw-slider-dot.mw-active{background-color:#fff}.mw-slider-dot:focus{outline:none;box-shadow:0 0 0 2px #fff}.mw-slider-dot:focus.mw-active{box-shadow:none}.mw-slider-arrow-left,.mw-slider-arrow-right{cursor:pointer;color:#fff;-webkit-tap-highlight-color:#0000;tap-highlight-color:#0000;-webkit-user-select:none;user-select:none;width:80px;margin:auto;font-size:40px;position:absolute;inset:0;overflow:hidden}.mw-slider-arrow-left [class^=mw-icon-],.mw-slider-arrow-right [class^=mw-icon-],.mw-slider-arrow-left [class*=\ mw-icon-],.mw-slider-arrow-right [class*=\ mw-icon-]{position:absolute}.mw-slider-arrow-left:focus,.mw-slider-arrow-right:focus{outline:0}.mw-slider-arrow-left{z-index:3;right:auto}.mw-slider-arrow-right{z-index:4;left:auto}.mw-icon-slider-left,.mw-icon-slider-right{width:1em;height:1em;margin:auto;inset:0}.mw-slider-aria-label{clip:rect(0 0 0 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.mw-slider-force-show{display:block!important}.mw-dropdown{text-align:left;z-index:900;margin-left:auto;margin-right:auto;display:inline-block;position:relative}.mw-dropdown-btn,.mw-dropdown-toggle,.mw-dropdown-link{vertical-align:top;color:#222;text-align:left;white-space:nowrap;margin-left:auto;margin-right:auto;padding:20px;text-decoration:none;position:relative}.mw-dropdown-toggle{-webkit-user-select:none;user-select:none;cursor:pointer;padding-right:40px;display:inline-block}.mw-dropdown-toggle:focus{outline:0}.mw-icon-dropdown-toggle{width:1em;height:1em;margin:auto 20px auto auto;position:absolute;top:0;bottom:0;right:0}.mw-dropdown-list{background:#ddd;min-width:100%;display:none;position:absolute}.mw-dropdown-list.mw--open{display:block}.mw-dropdown-link{color:#222;padding:10px 20px;display:block}.mw-dropdown-link.mw--current{color:#a600f3}.mw-dropdown-link:focus{outline:0}@media screen and (max-width:767px){.mw-nav-brand{padding-left:10px}}.mw-lightbox-backdrop{cursor:auto;letter-spacing:normal;text-indent:0;text-shadow:none;text-transform:none;visibility:visible;white-space:normal;word-break:normal;word-spacing:normal;word-wrap:normal;color:#fff;text-align:center;z-index:2000;opacity:0;-webkit-user-select:none;-moz-user-select:none;-webkit-tap-highlight-color:transparent;background:#000000e6;outline:0;font-family:Helvetica Neue,Helvetica,Ubuntu,Segoe UI,Verdana,sans-serif;font-size:17px;font-style:normal;font-weight:300;line-height:1.2;list-style:disc;position:fixed;inset:0;-webkit-transform:translate(0)}.mw-lightbox-backdrop,.mw-lightbox-container{-webkit-overflow-scrolling:touch;height:100%;overflow:auto}.mw-lightbox-content{height:100vh;position:relative;overflow:hidden}.mw-lightbox-view{opacity:0;width:100vw;height:100vh;position:absolute}.mw-lightbox-view:before{content:"";height:100vh}.mw-lightbox-group,.mw-lightbox-group .mw-lightbox-view,.mw-lightbox-group .mw-lightbox-view:before{height:86vh}.mw-lightbox-frame,.mw-lightbox-view:before{vertical-align:middle;display:inline-block}.mw-lightbox-figure{margin:0;position:relative}.mw-lightbox-group .mw-lightbox-figure{cursor:pointer}.mw-lightbox-img{width:auto;max-width:none;height:auto}.mw-lightbox-image{float:none;max-width:100vw;max-height:100vh;display:block}.mw-lightbox-group .mw-lightbox-image{max-height:86vh}.mw-lightbox-caption{text-align:left;text-overflow:ellipsis;white-space:nowrap;background:#0006;padding:.5em 1em;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.mw-lightbox-embed{width:100%;height:100%;position:absolute;inset:0}.mw-lightbox-control{cursor:pointer;background-position:50%;background-repeat:no-repeat;background-size:24px;width:4em;transition:all .3s;position:absolute;top:0}.mw-lightbox-left{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0yMCAwIDI0IDQwIiB3aWR0aD0iMjQiIGhlaWdodD0iNDAiPjxnIHRyYW5zZm9ybT0icm90YXRlKDQ1KSI+PHBhdGggZD0ibTAgMGg1djIzaDIzdjVoLTI4eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDN2MjNoMjN2M2gtMjZ6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg==);display:none;bottom:0;left:0}.mw-lightbox-right{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMjQgNDAiIHdpZHRoPSIyNCIgaGVpZ2h0PSI0MCI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMC0waDI4djI4aC01di0yM2gtMjN6IiBvcGFjaXR5PSIuNCIvPjxwYXRoIGQ9Im0xIDFoMjZ2MjZoLTN2LTIzaC0yM3oiIGZpbGw9IiNmZmYiLz48L2c+PC9zdmc+);display:none;bottom:0;right:0}.mw-lightbox-close{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMTggMTciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxNyI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMCAwaDd2LTdoNXY3aDd2NWgtN3Y3aC01di03aC03eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDd2LTdoM3Y3aDd2M2gtN3Y3aC0zdi03aC03eiIgZmlsbD0iI2ZmZiIvPjwvZz48L3N2Zz4=);background-size:18px;height:2.6em;right:0}.mw-lightbox-strip{white-space:nowrap;padding:0 1vh;line-height:0;position:absolute;bottom:0;left:0;right:0;overflow:auto hidden}.mw-lightbox-item{box-sizing:content-box;cursor:pointer;width:10vh;padding:2vh 1vh;display:inline-block;-webkit-transform:translate(0,0)}.mw-lightbox-active{opacity:.3}.mw-lightbox-thumbnail{background:#222;height:10vh;position:relative;overflow:hidden}.mw-lightbox-thumbnail-image{position:absolute;top:0;left:0}.mw-lightbox-thumbnail .mw-lightbox-tall{width:100%;top:50%;transform:translateY(-50%)}.mw-lightbox-thumbnail .mw-lightbox-wide{height:100%;left:50%;transform:translate(-50%)}.mw-lightbox-spinner{box-sizing:border-box;border:5px solid #0006;border-radius:50%;width:40px;height:40px;margin-top:-20px;margin-left:-20px;animation:.8s linear infinite spin;position:absolute;top:50%;left:50%}.mw-lightbox-spinner:after{content:"";border:3px solid #0000;border-bottom-color:#fff;border-radius:50%;position:absolute;inset:-4px}.mw-lightbox-hide{display:none}.mw-lightbox-noscroll{overflow:hidden}@media (min-width:768px){.mw-lightbox-content{height:96vh;margin-top:2vh}.mw-lightbox-view,.mw-lightbox-view:before{height:96vh}.mw-lightbox-group,.mw-lightbox-group .mw-lightbox-view,.mw-lightbox-group .mw-lightbox-view:before{height:84vh}.mw-lightbox-image{max-width:96vw;max-height:96vh}.mw-lightbox-group .mw-lightbox-image{max-width:82.3vw;max-height:84vh}.mw-lightbox-left,.mw-lightbox-right{opacity:.5;display:block}.mw-lightbox-close{opacity:.8}.mw-lightbox-control:hover{opacity:1}}.mw-lightbox-inactive,.mw-lightbox-inactive:hover{opacity:0}.mw-richtext:before,.mw-richtext:after{content:" ";grid-area:1/1/2/2;display:table}.mw-richtext:after{clear:both}.mw-richtext[contenteditable=true]:before,.mw-richtext[contenteditable=true]:after{white-space:initial}.mw-richtext ol,.mw-richtext ul{overflow:hidden}.mw-richtext .mw-richtext-figure-selected.mw-richtext-figure-type-video div:after,.mw-richtext .mw-richtext-figure-selected[data-rt-type=video] div:after,.mw-richtext .mw-richtext-figure-selected.mw-richtext-figure-type-image div,.mw-richtext .mw-richtext-figure-selected[data-rt-type=image] div{outline:2px solid #b528f7}.mw-richtext figure.mw-richtext-figure-type-video>div:after,.mw-richtext figure[data-rt-type=video]>div:after{content:"";display:none;position:absolute;inset:0}.mw-richtext figure{max-width:60%;position:relative}.mw-richtext figure>div:before{cursor:default!important}.mw-richtext figure img{width:100%}.mw-richtext figure figcaption.mw-richtext-figcaption-placeholder{opacity:.6}.mw-richtext figure div{color:#0000;font-size:0}.mw-richtext figure.mw-richtext-figure-type-image,.mw-richtext figure[data-rt-type=image]{display:table}.mw-richtext figure.mw-richtext-figure-type-image>div,.mw-richtext figure[data-rt-type=image]>div{display:inline-block}.mw-richtext figure.mw-richtext-figure-type-image>figcaption,.mw-richtext figure[data-rt-type=image]>figcaption{caption-side:bottom;display:table-caption}.mw-richtext figure.mw-richtext-figure-type-video,.mw-richtext figure[data-rt-type=video]{width:60%;height:0}.mw-richtext figure.mw-richtext-figure-type-video iframe,.mw-richtext figure[data-rt-type=video] iframe{width:100%;height:100%;position:absolute;top:0;left:0}.mw-richtext figure.mw-richtext-figure-type-video>div,.mw-richtext figure[data-rt-type=video]>div{width:100%}.mw-richtext figure.mw-richtext-align-center{clear:both;margin-left:auto;margin-right:auto}.mw-richtext figure.mw-richtext-align-center.mw-richtext-figure-type-image>div,.mw-richtext figure.mw-richtext-align-center[data-rt-type=image]>div{max-width:100%}.mw-richtext figure.mw-richtext-align-normal{clear:both}.mw-richtext figure.mw-richtext-align-fullwidth{text-align:center;clear:both;width:100%;max-width:100%;margin-left:auto;margin-right:auto;display:block}.mw-richtext figure.mw-richtext-align-fullwidth>div{padding-bottom:inherit;display:inline-block}.mw-richtext figure.mw-richtext-align-fullwidth>figcaption{display:block}.mw-richtext figure.mw-richtext-align-floatleft{float:left;clear:none;margin-right:15px}.mw-richtext figure.mw-richtext-align-floatright{float:right;clear:none;margin-left:15px}.mw-nav{z-index:1000;background:#ddd;position:relative}.mw-nav:before,.mw-nav:after{content:" ";grid-area:1/1/2/2;display:table}.mw-nav:after{clear:both}.mw-nav-brand{float:left;color:#333;text-decoration:none;position:relative}.mw-nav-link{vertical-align:top;color:#222;text-align:left;margin-left:auto;margin-right:auto;padding:20px;text-decoration:none;display:inline-block;position:relative}.mw-nav-link.mw--current{color:#a600f3}.mw-nav-menu{float:right;position:relative}[data-nav-menu-open]{text-align:center;background:#c8c8c8;min-width:200px;position:absolute;top:100%;left:0;right:0;overflow:visible;display:block!important}.mw--nav-link-open{display:block;position:relative}.mw-nav-overlay{width:100%;display:none;position:absolute;top:100%;left:0;right:0;overflow:hidden}.mw-nav-overlay [data-nav-menu-open]{top:0}.mw-nav[data-animation=over-left] .mw-nav-overlay{width:auto}.mw-nav[data-animation=over-left] .mw-nav-overlay,.mw-nav[data-animation=over-left] [data-nav-menu-open]{z-index:1;top:0;right:auto}.mw-nav[data-animation=over-right] .mw-nav-overlay{width:auto}.mw-nav[data-animation=over-right] .mw-nav-overlay,.mw-nav[data-animation=over-right] [data-nav-menu-open]{z-index:1;top:0;left:auto}.mw-nav-button{float:right;cursor:pointer;-webkit-tap-highlight-color:#0000;tap-highlight-color:#0000;-webkit-user-select:none;user-select:none;padding:18px;font-size:24px;display:none;position:relative}.mw-nav-button:focus{outline:0}.mw-nav-button.mw--open{color:#fff;background-color:#c8c8c8}.mw-nav[data-collapse=all] .mw-nav-menu{display:none}.mw-nav[data-collapse=all] .mw-nav-button,.mw--nav-dropdown-open,.mw--nav-dropdown-toggle-open{display:block}.mw--nav-dropdown-list-open{position:static}@media screen and (max-width:991px){.mw-nav[data-collapse=medium] .mw-nav-menu{display:none}.mw-nav[data-collapse=medium] .mw-nav-button{display:block}}@media screen and (max-width:767px){.mw-nav[data-collapse=small] .mw-nav-menu{display:none}.mw-nav[data-collapse=small] .mw-nav-button{display:block}.mw-nav-brand{padding-left:10px}}@media screen and (max-width:479px){.mw-nav[data-collapse=tiny] .mw-nav-menu{display:none}.mw-nav[data-collapse=tiny] .mw-nav-button{display:block}}.mw-tabs{position:relative}.mw-tabs:before,.mw-tabs:after{content:" ";grid-area:1/1/2/2;display:table}.mw-tabs:after{clear:both}.mw-tab-menu{position:relative}.mw-tab-link{vertical-align:top;text-align:left;cursor:pointer;color:#222;background-color:#ddd;padding:9px 30px;text-decoration:none;display:inline-block;position:relative}.mw-tab-link.mw--current{background-color:#c8c8c8}.mw-tab-link:focus{outline:0}.mw-tab-content{display:block;position:relative;overflow:hidden}.mw-tab-pane{display:none;position:relative}.mw--tab-active{display:block}@media screen and (max-width:479px){.mw-tab-link{display:block}}.mw-ix-emptyfix:after{content:""}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.mw-dyn-empty{background-color:#ddd;padding:10px}.mw-dyn-hide,.mw-dyn-bind-empty,.mw-condition-invisible{display:none!important}.mw-layout-grid{display:grid}@font-face{font-family:Bebasneue;src:url(/mainpage/fonts/bebasneue-regular.ttf)format("truetype");font-weight:400;font-style:normal;font-display:block}@font-face{font-family:DM Sans;src:url(/mainpage/fonts/dmsans-variablefont-opsz-wght.ttf)format("truetype");font-weight:100 1000;font-style:normal;font-display:swap}:root{--_typography---font-family--body-font:"DM Sans",Arial,sans-serif;--gray:#383838;--_typography---font-sizes--body--text-lg:20px;--_typography---line-height--1-5:1.5;--_typography---font-weight--400:400;--_typography---font-family--heading-font:Bebasneue,Arial,sans-serif;--white:white;--_typography---font-sizes--heading--h1:19vw;--_typography---line-height--1:1;--black-secondary:#121212;--_typography---font-sizes--heading--h2:clamp(3.75rem,-.1942rem + 16.8285vw,20rem);--_typography---letter-spacing--0-03:-.03em;--_typography---font-sizes--heading--h3:clamp(2.75rem,1.4757rem + 5.4369vw,8rem);--_typography---letter-spacing--0-01:-.01em;--black-primary:#000;--_typography---font-sizes--heading--h4:clamp(2rem,1.2112rem + 3.3657vw,5.25rem);--_typography---font-sizes--heading--h5:clamp(1.75rem,1.5376rem + .9061vw,2.625rem);--_spacing---spacing-primitives--0:0px;--_spacing---spacing-primitives--8px:8px;--_typography---font-sizes--body--text-sm:16px;--_typography---font-weight--700:700;--_spacing---section-padding--padding-regular:150px;--_spacing---spacing-primitives--64px:64px;--_spacing---spacing-primitives--32px:32px;--_layout---container:1680px;--_layout---padding-global:5%;--_spacing---spacing-primitives--28px:28px;--_spacing---spacing-primitives--24px:24px;--_spacing---spacing-primitives--40px:40px;--_spacing---spacing-primitives--16px:16px;--_typography---line-height--1-4:1.4;--_typography---font-weight--500:500;--_spacing---spacing-primitives--12px:12px;--_spacing---spacing-primitives--20px:20px;--_spacing---spacing-primitives--4px:4px;--_typography---font-sizes--body--text-2xl:30px;--_typography---font-weight--600:600;--_typography---font-sizes--heading--about-year-text:clamp(5rem,1.3592rem + 15.534vw,20rem);--_spacing---spacing-semantics--spacing-3xl:var(--_spacing---spacing-primitives--40px);--_spacing---spacing-primitives--52px:52px;--_spacing---border-radious--lg:40px;--_spacing---border-radious--xl:100px;--_spacing---spacing-semantics--spacing-8xl:var(--_spacing---spacing-primitives--80px);--_spacing---spacing-semantics--spacing-xs:var(--_spacing---spacing-primitives--16px);--_spacing---spacing-primitives--44px:44px;--_spacing---spacing-semantics--spacing-md:var(--_spacing---spacing-primitives--24px);--_typography---font-sizes--body--text-xl:24px;--vivid-red:#8B6D3F;--vivid-orange:#C9A66B;--_typography---font-sizes--body--text-md:18px;--_spacing---border-radious--full:100%;--_spacing---spacing-semantics--spacing-xl:var(--_spacing---spacing-primitives--32px);--_spacing---border-radious--sm:20px;--_spacing---spacing-primitives--80px:80px;--_spacing---spacing-primitives--60px:60px;--yellow:#10192B;--_spacing---spacing-semantics--spacing-7xl:var(--_spacing---spacing-primitives--60px);--linen:#E4D9C3;--_spacing---spacing-primitives--100px:100px;--_spacing---spacing-primitives--48px:48px;--_spacing---spacing-semantics--spacing-sm:var(--_spacing---spacing-primitives--20px);--_typography---font-sizes--body--text-xs:14px;--_spacing---border-radious--showreel-video-radius:40px;--_spacing---border-radious--999:999px;--transparent:#fff0;--black-80:#000c;--_typography---font-sizes--body--text-3xl:clamp(1.5rem,1.2573rem + 1.0356vw,2.5rem);--_typography---line-height--1-3:1.3;--_typography---font-sizes--heading--200px:clamp(3rem,.6942rem + 9.8382vw,12.5rem);--_spacing---spacing--12px\<deleted\|variable-f7fbc2ae-f10d-aa16-7bf7-2f0ebd5c8e25\>:12px;--_spacing---spacing--0px\<deleted\|variable-bf0d4080-7243-f69d-3393-6c852d876a5b\>:0px;--white-30:#ffffff4d;--_typography---font-sizes--heading--footer-logo-text:var(--_typography---font-sizes--heading--h2);--_typography---line-height--0-8:.8;--black-secondary-30:#1212124d;--vivid-red-active:#10192B;--_spacing---spacing-semantics--spacing-5xl:var(--_spacing---spacing-primitives--48px);--_spacing---border-radious--md:30px;--_typography---font-weight--800:800;--_spacing---spacing-primitives--36px:36px;--new-gray:grey;--_spacing---spacing-primitives--76px:76px;--_spacing---spacing-primitives--120px:120px;--_spacing---spacing-semantics--72px\<deleted\|variable-64ec9391-7cce-5908-3750-a41948f4ed7c\>:72px;--_typography---font-sizes--body--text-xxs:12px;--_typography---font-sizes--heading--nav-logo-text:40px;--_typography---line-height--1-1:1.1;--_typography---line-height--1-2:1.2;--_typography---font-weight--900:900;--_typography---letter-spacing--0-02:-.02em;--_spacing---spacing-primitives--56px:0px;--_spacing---spacing-primitives--68px:68px;--_spacing---spacing-primitives--72px:72px;--_spacing---spacing-semantics--spacing-lg:var(--_spacing---spacing-primitives--28px);--_spacing---spacing-semantics--spacing-2xl:var(--_spacing---spacing-primitives--36px);--_spacing---spacing-semantics--spacing-4xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-6xl:var(--_spacing---spacing-primitives--52px);--_spacing---spacing-semantics--spacing-9xl:var(--_spacing---spacing-primitives--100px)}.mw-backgroundvideo-backgroundvideoplaypausebutton:focus-visible{outline-offset:2px;border-radius:50%;outline:2px solid #C9A66B}body{font-family:var(--_typography---font-family--body-font);color:var(--gray);font-size:var(--_typography---font-sizes--body--text-lg);line-height:var(--_typography---line-height--1-5);font-weight:var(--_typography---font-weight--400);text-transform:uppercase}h1{font-family:var(--_typography---font-family--heading-font);color:var(--white);font-size:var(--_typography---font-sizes--heading--h1);line-height:var(--_typography---line-height--1);margin-top:0;margin-bottom:0}h2{font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--heading--h2);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-03);text-transform:uppercase;margin-top:0;margin-bottom:0}h3{font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);margin-top:0;margin-bottom:0}h4{font-family:var(--_typography---font-family--heading-font);color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h4);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);margin-top:0;margin-bottom:0}h5{font-family:var(--_typography---font-family--heading-font);color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);margin-top:0;margin-bottom:0}h6{margin-top:var(--_spacing---spacing-primitives--0);margin-bottom:var(--_spacing---spacing-primitives--0);font-size:12px;font-weight:700;line-height:18px}p{text-transform:none;margin-bottom:0}a{color:var(--black-secondary);text-transform:none;text-decoration:none;transition:color .35s}a:hover{color:var(--black-secondary)}ul{margin-top:0;margin-bottom:10px;padding-left:40px}ol{margin-top:0}img{max-width:100%;display:block}label{margin-bottom:var(--_spacing---spacing-primitives--8px);color:var(--black-primary);font-size:var(--_typography---font-sizes--body--text-sm);font-weight:var(--_typography---font-weight--700);display:block}blockquote{border-left:5px solid #e2e2e2;margin-bottom:10px;padding:10px 20px;font-size:18px;line-height:22px}.hero_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.container{max-width:var(--_layout---container);width:100%;margin-left:auto;margin-right:auto}.hero_wrapper{padding-right:var(--_layout---padding-global);padding-left:var(--_layout---padding-global)}.hero_heading{z-index:1;text-align:center;margin-bottom:180px;position:relative}.hero_content_wrapper{z-index:1;grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);justify-content:space-between;align-items:center;margin-bottom:250px;display:flex;position:relative}.hero_sub_title{color:var(--white);font-size:6vw;line-height:var(--_typography---line-height--1);max-width:12ch}.hero_info{color:var(--white);line-height:var(--_typography---line-height--1-4);font-weight:var(--_typography---font-weight--500);text-transform:uppercase;max-width:450px}.hero_proof_area{z-index:1;justify-content:space-between;align-items:center;display:flex;position:relative}.hero_social_links{grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);justify-content:center;align-items:center;display:flex}.hero_social_line{background-color:#fff;width:40px;height:1px}.hero_social_icon_wrapper{grid-column-gap:8px;grid-row-gap:8px;display:flex}.hero_social_icon{display:inline-flex}.hero_stat{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);justify-content:center;align-items:center;display:flex}.hero_stat_icon{max-width:51px}.hero_stat_title{margin-bottom:var(--_spacing---spacing-primitives--4px);font-family:var(--_typography---font-family--heading-font);color:var(--white);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1)}.hero_stat_info{color:var(--white);font-size:var(--_typography---font-sizes--body--text-sm);text-transform:uppercase}.hero_image{background-image:url(../images/hero-image.webp);background-position:50% 100%;background-repeat:no-repeat;background-size:cover;position:absolute;inset:0%}.image-cover{object-fit:cover;width:100%;height:100%}.about_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.section_caption{grid-column-gap:10px;grid-row-gap:10px;justify-content:flex-start;align-items:center;display:flex}.section_caption_circle{aspect-ratio:1;background-color:var(--black-secondary);border-radius:100%;width:28px}.section_caption_text{color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-2xl);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--600);text-transform:none}.text-italic{font-style:italic}.year_wrapper{grid-column-gap:120px;grid-row-gap:120px;flex:none;display:flex}.year_item{flex-flow:column;align-items:flex-end;max-width:638px;display:flex;position:relative}.year_text{font-size:var(--_typography---font-sizes--heading--about-year-text)}.year_info_text{margin-top:var(--_spacing---spacing-semantics--spacing-3xl);margin-bottom:var(--_spacing---spacing-primitives--52px);color:var(--black-secondary);text-transform:none}.year_divider{background-color:var(--black-primary);width:100%;height:1px}.year_image{border-radius:var(--_spacing---border-radious--lg);width:100%;overflow:hidden}.year_content{max-width:480px}.step_section{position:relative;padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);border-radius:var(--_spacing---border-radious--xl);background-color:#f0f0f0}.section_header{margin-bottom:var(--_spacing---spacing-semantics--spacing-8xl);position:relative}.section_header.is_work{position:relative}.section_header.is_service{text-align:center;position:relative}.section_header.is_project{text-align:center}.section_header.is_life{grid-column-gap:var(--_spacing---spacing-semantics--spacing-xs);grid-row-gap:var(--_spacing---spacing-semantics--spacing-xs);text-align:center;flex-flow:column;display:flex}.step_section_info{line-height:var(--_typography---line-height--1-4);text-align:center;text-transform:none}.step_item_inner{z-index:2;padding:var(--_spacing---spacing-primitives--40px)var(--_spacing---spacing-primitives--16px)var(--_spacing---spacing-primitives--64px);border-radius:var(--_spacing---border-radious--lg);text-align:center;background-color:#fff;position:relative}.step_count{margin-bottom:var(--_spacing---spacing-semantics--spacing-md);font-family:var(--_typography---font-family--heading-font);color:#000;font-size:var(--_typography---font-sizes--body--text-xl);line-height:var(--_typography---line-height--1);letter-spacing:var(--_typography---letter-spacing--0-01)}.step_title{font-family:var(--_typography---font-family--heading-font);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1);letter-spacing:var(--_typography---letter-spacing--0-01)}.step_title.is_gradiant{background-image:linear-gradient(180deg,var(--vivid-red),var(--vivid-orange));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;position:absolute;inset:100% 0% auto}.step_info{margin-top:var(--_spacing---spacing-semantics--spacing-md);font-size:var(--_typography---font-sizes--body--text-md);line-height:var(--_typography---line-height--1-4);text-transform:none}.steps_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);grid-template-rows:auto;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);grid-auto-columns:1fr;place-items:start stretch;display:grid;position:relative}.step_title_wrapper{position:relative;overflow:hidden}.step_icon{aspect-ratio:1;border-radius:var(--_spacing---border-radious--full);pointer-events:auto;cursor:pointer;background-color:#d9d9d9;justify-content:center;align-items:center;width:60px;display:flex;position:absolute;bottom:-58px;left:50%;transform:translate(-50%,-50%)}.step_icon_code_embed{max-width:32px;display:flex}.step_item{flex-flow:column;justify-content:flex-start;align-items:center;display:flex;position:relative}.step_line_icon{margin-bottom:var(--_spacing---spacing-semantics--spacing-xl);color:var(--black-primary);display:inline-flex}.steps_line{border:2px dashed #d9d9d9;width:79%;max-width:1300px;position:absolute;top:12px;left:50%;transform:translate(-50%)}.heading_style_h4{font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--heading--h4);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);text-transform:uppercase}.heading_style_h4.step_section_title{margin-bottom:var(--_spacing---spacing-primitives--12px);text-align:center}.heading_style_h4.about_section_title{margin-top:var(--_spacing---spacing-semantics--spacing-3xl);margin-bottom:var(--_spacing---spacing-semantics--spacing-xl);max-width:29ch}.heading_style_h4.work_title{color:var(--black-secondary);max-width:18ch}.work_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);overflow:clip}.work_section_title{text-align:center}.work_item{z-index:4;grid-column-gap:0px;grid-row-gap:0px;border-radius:var(--_spacing---border-radious--sm);background-color:var(--vivid-orange);grid-template-rows:auto;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-auto-columns:1fr;max-width:1480px;margin-left:auto;margin-right:auto;display:grid;overflow:clip}.work_item._2{z-index:3;background-color:#f853ff}.work_item._3{z-index:2;background-color:#b939fa}.work_item._4{z-index:1;background-color:#fa39f5}.work_left_content{padding:var(--_spacing---spacing-primitives--80px)var(--_spacing---spacing-primitives--60px);flex-flow:column;justify-content:center;align-items:flex-start;display:flex}.work_right_content{padding:var(--_spacing---spacing-primitives--32px);background-color:var(--yellow);flex-flow:column;justify-content:center;align-items:center;display:flex}.work_description_text{margin-top:var(--_spacing---spacing-semantics--spacing-md);margin-bottom:var(--_spacing---spacing-semantics--spacing-7xl);color:var(--black-secondary);text-transform:none;max-width:520px}.work_image_visual{aspect-ratio:1;border-radius:var(--_spacing---border-radious--sm);max-width:500px;overflow:hidden}.work_items_wrapper{perspective:1500px;width:100%;position:sticky;top:10%}.work_items_track{justify-content:space-between;align-items:flex-start;height:300vh}.service_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);background-color:var(--linen)}.service_item{top:var(--_spacing---spacing-primitives--100px);padding-top:var(--_spacing---spacing-primitives--60px);padding-bottom:var(--_spacing---spacing-primitives--60px);border-top:1px solid var(--black-secondary);background-color:var(--linen);position:sticky}.service_item_inner{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--40px);flex-flow:wrap;justify-content:space-between;align-items:center;display:flex}.service_item_content{flex:260px}.service_item_video_wrap{aspect-ratio:4/3;border-radius:var(--_spacing---border-radious--lg);flex:200px;max-width:600px;overflow:hidden}.service_item_title{margin-bottom:var(--_spacing---spacing-semantics--spacing-3xl)}.service_item_tags_subtitle{margin-bottom:var(--_spacing---spacing-semantics--spacing-sm);color:var(--black-secondary);font-weight:var(--_typography---font-weight--700);text-transform:uppercase}.service_item_tags_wrapper{grid-column-gap:8px;grid-row-gap:12px;flex-flow:wrap;max-width:610px;display:flex}.service_item_tag{padding:var(--_spacing---spacing-primitives--8px)var(--_spacing---spacing-primitives--20px);background-color:#fff;border-radius:999px}.service_item_tag_text{color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-sm);font-weight:var(--_typography---font-weight--500);text-transform:uppercase}.showreel_section{overflow:clip}.showreel_track{width:100vw;height:250vh}.showreel_sticky{justify-content:center;align-items:center;width:100%;height:100vh;display:flex;position:sticky;top:0}.showreel_text{z-index:1;position:absolute;top:50%;left:0;transform:translateY(-50%)}.showreel_text._2{left:auto;right:0;transform:translate(-34vw,-50%)}.showreel_text._1{transform:translate(34vw,-50%)}.showreel_video{z-index:2;width:100%;height:100%;position:relative}.showreel_video_wrapper{z-index:1;transform:scale3d(1none,1none,1none);transform-style:preserve-3d;flex:none;width:100vw;height:100vh}.showreel_wrapper{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.showreel_video_button{aspect-ratio:1;border-radius:var(--_spacing---border-radious--full);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#fff3;border:1px solid #ffffff80;justify-content:center;align-items:center;width:100px;display:flex;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.showreel_video_mask{border-radius:var(--_spacing---border-radious--showreel-video-radius);justify-content:center;align-items:center;width:50vw;height:40vh;display:flex;position:relative;overflow:hidden}.button_primary{grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);border:2px solid var(--black-primary);border-radius:var(--_spacing---border-radious--999);background-color:var(--transparent);justify-content:center;align-items:center;padding:23px 40px;text-decoration:none;display:inline-flex;position:relative}.button_primary:where(.mw-variant-6f4c28b7-a4d7-55b2-4db6-4716f376ac9c),.button_primary:where(.mw-variant-4025ac4a-6549-2c92-664a-c77a444cccf0){padding:var(--_spacing---spacing-primitives--16px)var(--_spacing---spacing-primitives--20px)}.button_primary.v2{padding:var(--_spacing---spacing-primitives--20px);border-color:var(--black-secondary)}.button_line{border-radius:var(--_spacing---border-radious--999);background-color:var(--black-primary);transform-origin:100%;width:25px;height:2px;position:relative}.button_text{font-family:var(--_typography---font-family--heading-font);color:var(--black-primary);font-size:var(--_spacing---spacing-primitives--24px);line-height:var(--_typography---line-height--1)}.button_text.second_text{color:var(--white);position:absolute;inset:100% 0% auto}.button_line_mask{background-color:var(--white);width:25px;height:2px;position:absolute;top:-2px;left:40px}.button_line_mask._2{inset:auto 65px -2px auto}.button_line_mask._3{width:10px;inset:auto 45px -2px auto}.button_line_mask_wrapper{pointer-events:none;position:absolute;inset:0%}.button_text_wrapper{position:relative;overflow:hidden}.box{aspect-ratio:90/90;border:1px solid #1C1C1E;border-width:0 1px 1px 0}.box.bottom_border{border-bottom-width:1px}.box.right_none{border-right-width:0}.brands_grid{z-index:1;grid-column-gap:0px;grid-row-gap:0px;grid-template-rows:auto auto;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;display:grid;position:relative}.brands_grid.absolute{z-index:1;grid-column-gap:0px;grid-row-gap:0px;pointer-events:auto;grid-template-rows:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;grid-auto-columns:1fr;width:100%;height:100%;display:grid;position:absolute;inset:0%}.brands_section{background-color:#000;position:relative}.brand_logo_wrapper{border:1px solid var(--black-secondary);background-color:var(--black-80);justify-content:center;align-items:center;padding:16px;display:flex}.brand_logo{width:100%;max-width:100px}.brands_testimony_area{padding:6% var(--_spacing---spacing-primitives--32px);border:1px solid var(--black-secondary);background-color:var(--black-80);flex-flow:column;justify-content:space-between;display:flex;overflow:clip}.brands_ticker{border:1px solid var(--black-secondary);background-color:var(--black-80);flex-flow:row;justify-content:flex-start;align-items:center;display:flex;overflow:clip}.brands_testimony_text{color:var(--white);font-size:var(--_typography---font-sizes--body--text-3xl);line-height:var(--_typography---line-height--1-3);text-transform:none;margin-bottom:32px}.brands_testimony_author_content{padding-left:var(--_spacing---spacing-primitives--24px);border-left:1px dashed var(--white)}.brands_testimony_author_name{color:var(--white);font-weight:var(--_typography---font-weight--700);text-transform:uppercase}.brands_testimony_author_designation{color:var(--white);text-transform:none}.brands_wrapper{position:relative}.brands_ticker_text{margin-right:var(--_spacing---spacing-primitives--40px);color:var(--white);font-weight:var(--_typography---font-weight--500);text-transform:uppercase;flex:none}.brands_ticker_icon{margin-right:var(--_spacing---spacing-primitives--40px);display:inline-flex}.brands_ticker_row{flex:none;justify-content:flex-start;align-items:center;display:flex}.leader_section{justify-content:center;align-items:center;min-height:150vh;display:flex;position:relative;overflow:clip}.leader_circle_item{transform-origin:50% 100%;width:14vw;padding-bottom:22vw;position:absolute;bottom:0;left:50%;transform:translate(-50%)rotate(0)}.leader_circle_item._2{z-index:9;transform:translate(-50%)rotate(36deg)}.leader_circle_item._3{z-index:3;transform:translate(-50%)rotate(72deg)}.leader_circle_item._4{z-index:2;transform:translate(-50%)rotate(108deg)}.leader_circle_item._5{z-index:1;transform:translate(-50%)rotate(144deg)}.leader_circle_item._6{display:block;transform:translate(-50%)rotate(180deg)}.leader_circle_item._7{transform:translate(-50%)rotate(216deg)}.leader_circle_item._8{transform:translate(-50%)rotate(252deg)}.leader_circle_item._9{transform:translate(-50%)rotate(288deg)}.leader_circle_item._10{transform-origin:50% 100%;transform:translate(-50%)rotate(324deg)}.leader_circle_image{object-fit:cover;border-radius:40px;width:100%;height:100%}.leader_circle_wrapper{border:1px solid #000;justify-content:center;align-items:center;position:absolute;inset:50% auto auto 50%}.leader_section_content{z-index:10;opacity:.5;text-align:center;flex-flow:column;justify-content:flex-start;align-items:center;display:flex;position:relative}.leader_section_title{margin-bottom:var(--_spacing---spacing-semantics--spacing-xl);max-width:10ch}.text_gradiant{-webkit-text-fill-color:transparent;background-image:linear-gradient(#8B6D3F,#C9A66B);-webkit-background-clip:text;background-clip:text}.leader_section_badge{z-index:-1;padding:var(--_spacing---spacing-primitives--16px)var(--_spacing---spacing-primitives--28px);font-family:var(--_typography---font-family--heading-font);color:#000;font-size:var(--_typography---font-sizes--body--text-3xl);line-height:var(--_typography---line-height--1);letter-spacing:var(--_typography---letter-spacing--0-01);background-color:#C9A66B;position:absolute;top:-72px;left:89px;transform:rotate(-15deg)}.cta_section{margin-bottom:var(--_spacing---spacing-semantics--spacing-3xl);position:relative;overflow:clip}.cta_ticker_text{margin-right:var(--_spacing---spacing-semantics--spacing-3xl);opacity:.5;font-size:var(--_typography---font-sizes--heading--200px);flex:none}.cta_ticker_text.is_stroke{color:#fff0;-webkit-text-stroke-width:1px;-webkit-text-stroke-color:#000}.cta_ticker_row{display:flex}.cta_button{padding:var(--_spacing---spacing-primitives--28px)var(--_spacing---spacing-primitives--60px);grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px);background-color:#C9A66B;border:2px solid #000;border-radius:999px;justify-content:center;align-items:center;text-decoration:none;display:inline-flex;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.cta_button_arrow{aspect-ratio:1;background-color:#000;border-radius:999px;justify-content:flex-end;align-items:center;width:70px;display:flex;position:relative;overflow:hidden}.cta_button_icon{display:inline-flex}.cta_button_text{font-family:var(--_typography---font-family--heading-font);color:#000;font-size:60px;line-height:var(--_typography---line-height--1)}.cta_button_text.second_text{position:absolute;inset:100% 0% auto}.cta_button_line_mask{background-color:#fff;width:48px;height:2px;position:absolute;top:-2px;left:81px}.cta_button_line_mask._2{inset:auto 116px -2px auto}.cta_button_line_mask._3{width:20px;inset:auto 73px -2px auto}.footer{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---spacing-primitives--40px);background-color:var(--black-primary);overflow:clip}.footer_links{grid-column-gap:var(--_spacing---spacing-primitives--44px);grid-row-gap:var(--_spacing---spacing-primitives--44px);flex:auto;grid-template-rows:auto;grid-template-columns:auto auto auto auto;grid-auto-columns:1fr;justify-content:space-between;display:flex}.footer_link_col_heading{margin-bottom:var(--_spacing---spacing-semantics--spacing-xl);color:var(--white);font-weight:var(--_typography---font-weight--700);letter-spacing:var(--_typography---letter-spacing--0-03);text-transform:uppercase}.footer_link_text{color:#ffffff80;font-size:var(--_typography---font-sizes--body--text-md);text-transform:none;text-decoration:none}.footer_link_text.secondary-text{position:absolute}.footer_link_wrapper{grid-column-gap:var(--_spacing---spacing-semantics--spacing-xs);grid-row-gap:var(--_spacing---spacing-semantics--spacing-xs);flex-flow:column;justify-content:flex-start;align-items:flex-start;display:flex}.footer_address_text{margin-bottom:var(--_spacing---spacing-primitives--8px);color:#ffffff80;font-size:var(--_typography---font-sizes--body--text-md);text-transform:none;max-width:15ch}.footer_contact_link_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);color:var(--white);flex-flow:column;justify-content:flex-start;align-items:flex-start;display:flex}.footer_link_widget{flex-flow:column;text-decoration:none;position:relative;overflow:clip}.footer_cta{flex:0 auto}.footer_cta_form_block{margin-bottom:0}.footer_cta_form{grid-row-gap:var(--_spacing---spacing-primitives--12px);flex-flow:wrap;justify-content:flex-start;align-items:center;display:flex}.footer_top_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--80px);grid-row-gap:var(--_spacing---spacing-primitives--80px);flex-flow:wrap;margin-bottom:200px;display:flex}.footer_cta_input{padding-right:var(--_spacing---spacing-semantics--spacing-md);padding-left:var(--_spacing---spacing-semantics--spacing-md);border:1px solid var(--white-30);border-radius:var(--_spacing---border-radious--999);color:var(--white);font-size:var(--_typography---font-sizes--body--text-sm);background-color:#1C1C1E;flex:222px;height:60px;margin-bottom:0}.footer_cta_input:focus{border-color:var(--yellow)}.footer_cta_input::placeholder{color:#ffffff80}.footer_cta_submit_button{padding:var(--_spacing---spacing--12px\<deleted\|variable-f7fbc2ae-f10d-aa16-7bf7-2f0ebd5c8e25\>)var(--_spacing---spacing-semantics--spacing-xl);border-radius:var(--_spacing---border-radious--999);background-color:var(--white);font-family:var(--_typography---font-family--heading-font);color:#000;flex:auto;font-size:22px;transition:background-color .35s}.footer_cta_submit_button:hover{background-color:var(--yellow)}.footer_bottom_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);justify-content:space-between;align-items:flex-end;display:flex}.logo_big_text{font-family:var(--_typography---font-family--heading-font);font-size:var(--_typography---font-sizes--heading--footer-logo-text);line-height:var(--_typography---line-height--0-8);letter-spacing:var(--_typography---letter-spacing--0-03);-webkit-text-fill-color:transparent;background-image:linear-gradient(#fff,#000 80%);-webkit-background-clip:text;background-clip:text}.footer_legal_corner{margin-bottom:var(--_spacing---spacing-primitives--24px);grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);flex-flow:column;display:flex}.footer_legal_text{color:#fffc;font-size:var(--_typography---font-sizes--body--text-sm)}.testimonial_section{padding-bottom:var(--_spacing---section-padding--padding-regular);overflow:clip}.testimonial_section:where(.mw-variant-6810366c-2758-6af1-e2de-949ff57b34af){padding-top:var(--_spacing---section-padding--padding-regular)}.testimonial_card{padding:var(--_spacing---spacing-primitives--32px);border-radius:var(--_spacing---border-radious--lg);background-color:#f0f0f0;flex-flow:column;justify-content:space-between;width:30vw;max-width:460px;min-height:620px;display:flex;position:relative;transform:rotate(-3deg)}.testimonial_card:hover{z-index:1}.testimonial_card.card_two{background-color:#8B6D3F;margin-top:-8vw;margin-left:-10vw;position:relative;transform:rotate(5deg)}.testimonial_card.card_three{margin-left:-10vw}.testimonial_card.card_four{background-color:#8B6D3F;margin-left:-10vw}.testimonial_icon_area{grid-column-gap:4px;grid-row-gap:4px;display:flex}.testimonial_text{margin-bottom:var(--_spacing---spacing-semantics--spacing-3xl);color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-xl);line-height:var(--_typography---line-height--1-4);text-transform:none}.testimonial_text.color-white{color:#fff}.testimonial_author_area{grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);justify-content:flex-start;align-items:center;display:flex}.testimonial_author_image{border-radius:999px;width:64px;overflow:clip}.testimonial_author_name{margin-bottom:var(--_spacing---spacing-primitives--8px);font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-xl);line-height:var(--_typography---line-height--0-8)}.testimonial_author_name.color-white{color:var(--white)}.testimonial_author_profession{font-size:var(--_typography---font-sizes--body--text-md);text-transform:none}.testimonial_author_profession.color-white{color:var(--white)}.testimonial_icon{color:var(--vivid-orange);width:30px;display:flex}.testimonial_icon.is-yellow{color:var(--yellow)}.testimonial_cards{grid-column-gap:16px;grid-row-gap:16px;grid-template-rows:auto auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;justify-content:center;align-items:center;padding-top:68px;display:flex}.floating_text{font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-3xl);line-height:var(--_typography---line-height--0-8);letter-spacing:var(--_typography---letter-spacing--0-01);background-color:#C9A66B;padding:20px 36px;position:absolute;top:46px;right:207px;transform:rotate(-15deg)}.floating_text.is-testimony{background-color:#E4D9C3;top:40px;left:215px;right:auto}.floating_text.is_service{background-color:#D9BD84;inset:52px auto auto 234px}.floating_text.is-about{padding:var(--_spacing---spacing-primitives--16px)var(--_spacing---spacing-primitives--24px);top:55px;right:154px}.floating_text.is-team{background-color:#FAF7F0;top:40px;left:215px;right:auto}.floating_text.is-canvas{background-color:#C9B98C;top:50px;left:auto;right:auto}.text-center{text-align:center}.showreel_video_icon_wrapper{display:inline-block}.service_item_video{z-index:1;width:100%;height:100%;position:relative}.step_item_info_wrap{overflow:hidden}.year_text_wrapper{margin-bottom:var(--_spacing---spacing-semantics--spacing-md);grid-column-gap:var(--_spacing---spacing-primitives--32px);grid-row-gap:var(--_spacing---spacing-primitives--32px);justify-content:flex-start;align-items:center;display:flex;position:relative}.year_text_line{background-color:var(--black-primary);width:78px;height:8px}.about_track_scrub{height:500vh}.about_sticky{justify-content:flex-start;align-items:center;width:100%;height:100vh;display:flex;position:sticky;top:0%}.about_year_item_frame{flex-flow:row;display:flex}.padding_global{padding-right:var(--_layout---padding-global);padding-left:var(--_layout---padding-global)}.about_section_pattern{max-width:480px}.about_header_area{justify-content:space-between;align-items:center;margin-bottom:150px;display:flex}.hero_social_icon_link{display:flex}.cta_button_icon_wrap{flex:none;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.scrolll-top{z-index:30;aspect-ratio:1;color:#fff;background-color:#10192B;border-radius:100%;flex-direction:row;justify-content:center;align-items:center;width:44px;margin-bottom:45px;margin-right:40px;font-size:30px;text-decoration:none;transition:background-color .4s,color .4s;display:flex;position:fixed;inset:auto 0% 0% auto;box-shadow:1px 6px 9px #0a0a0a66}.scrolll-top:hover{background-color:#1C1C1E}.page-link{grid-column-gap:5px;grid-row-gap:5px;flex-direction:column;align-items:flex-start;font-weight:500;line-height:1;text-decoration:none;display:flex;overflow:hidden}.menu-horizontal-bar{background-color:#10192B;width:100%;height:2px}.nav_link_text{padding:var(--_spacing---spacing-primitives--0);color:var(--white);font-size:var(--_typography---font-sizes--body--text-sm);text-transform:uppercase;text-decoration:none}.nav_link_text.mw--current{color:#555}.nav_link_text.mw--current:hover{color:#C9A66B}.nav_link_text._2{position:absolute}.nav_link_text._2.is-dark,.nav_link_text.is-dark{color:inherit}.nav_menu{flex:1}.menu-icon-wrapper{aspect-ratio:1;justify-content:center;align-items:center;width:16px;display:flex;position:relative}.navigation{z-index:99;padding-right:var(--_spacing---spacing-primitives--28px);padding-left:var(--_spacing---spacing-primitives--28px);background-color:var(--transparent);justify-content:space-between;align-items:center;position:absolute;inset:0% 0% auto}.brand{padding-top:var(--_spacing---spacing-primitives--12px);padding-bottom:var(--_spacing---spacing-primitives--12px);border-bottom:1px solid var(--white);flex:1;max-width:20%;padding-left:0}.brand.is-dark{border-bottom-color:var(--black-secondary-30)}.nav_menu_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--28px);grid-row-gap:var(--_spacing---spacing-primitives--28px);display:flex;position:relative}.navigation_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--28px);grid-row-gap:var(--_spacing---spacing-primitives--28px);justify-content:space-between;align-items:stretch;display:flex}.logo_text{font-family:var(--_typography---font-family--heading-font);color:var(--white);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1)}.logo_text.is-dark{color:var(--black-secondary)}.nav_link{padding-top:var(--_spacing---spacing-primitives--20px);padding-bottom:var(--_spacing---spacing-primitives--20px);grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px);border-bottom:1px solid var(--white);flex:1;justify-content:flex-start;align-items:center;display:flex}.nav_link.is-secondary{border-bottom-color:var(--black-secondary-30);color:var(--black-secondary)}.nav_link.is-secondary.mw--current{border-bottom-color:var(--vivid-red-active);color:var(--vivid-red-active);font-weight:var(--_typography---font-weight--500)}.nav_link_circle{aspect-ratio:1;border:1px solid var(--white);border-radius:var(--_spacing---border-radious--full);width:12px}.nav_link_circle.is-secondary{border-color:var(--black-secondary)}.button_text_v2{font-family:var(--_typography---font-family--body-font);font-size:var(--_typography---font-sizes--body--text-sm);line-height:var(--_typography---line-height--1)}.button_text_v2.second_text{position:absolute;inset:100% 0% auto}.button_line_mask_v2{padding:var(--_spacing---spacing-primitives--0);background-color:var(--white);width:25px;height:4px;position:absolute;top:-3px;left:40px}.button_line_mask_v2._2{inset:auto 65px -3px auto}.button_line_mask_v2._3{width:10px;inset:auto 45px -3px auto}.about_hero_section{padding-top:184px;padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.about_hero_content{text-align:center;flex-flow:column;justify-content:center;align-items:center;display:flex;position:relative}.about_hero_title{margin-top:var(--_spacing---spacing-semantics--spacing-5xl);margin-bottom:var(--_spacing---spacing-semantics--spacing-5xl);color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);max-width:26ch}.about_hero_review_area{grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);flex-flow:wrap;justify-content:center;align-items:center;display:flex}.users_avatar{max-width:150px}.review_content{text-align:left}.review_content_top{margin-bottom:var(--_spacing---spacing-primitives--8px);grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);justify-content:flex-start;align-items:center;display:flex}.review_number{color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-xl);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--700)}.review_star{width:124px}.text_small{font-size:var(--_typography---font-sizes--body--text-sm);text-transform:none}.hero_circle_secondary{aspect-ratio:1;border-radius:var(--_spacing---border-radious--full);background-image:linear-gradient(180deg,var(--white)30%,var(--vivid-orange));opacity:.2;width:75vw;margin-left:auto;margin-right:auto;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.about_stats_section{padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.about_stats_item{padding:var(--_spacing---spacing-primitives--24px)var(--_spacing---spacing-primitives--32px);border-radius:var(--_spacing---border-radious--md);background-color:var(--vivid-orange);flex-flow:column;justify-content:space-between;min-height:330px;display:flex;position:relative}.about_stats_item._2{background-color:var(--black-secondary);background-image:url(../images/about-stats-item-visual-3.svg);background-position:100% 100%;background-repeat:no-repeat;background-size:auto}.about_stats_item._3{background-color:#f0f0f0;background-image:url(../images/about-stats-item-visual-2.svg);background-position:100% 0;background-repeat:no-repeat;background-size:auto}.about_stats_item._4{background-color:var(--vivid-red);background-image:url(../images/about-stats-item-visual-4.svg);background-position:100% 100%;background-repeat:no-repeat;background-size:auto}.about_stats_item._1{background-image:url(../images/about-stats-item-visual-1.svg);background-position:100% 100%;background-repeat:no-repeat;background-size:auto}.about_stats_item_text{color:var(--white);font-size:var(--_typography---font-sizes--body--text-xl);line-height:var(--_typography---line-height--1-3);text-transform:none;max-width:16ch}.about_stats_item_text.color-black{color:var(--black-secondary)}.stats_counter_visible_height{height:var(--_typography---font-sizes--heading--h3);color:var(--white);justify-content:flex-start;align-items:center;display:flex;overflow:hidden}.section-counter-main{margin-bottom:70px}.stats_counter_number{font-family:var(--_typography---font-family--heading-font);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1)}.stats_column.is-align-top{align-self:flex-start}.stats_column.is-align-bottom{align-self:flex-end}.stats_counter_number_suffix{font-family:var(--_typography---font-family--heading-font);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1)}.about_stats_grid{grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);grid-template-rows:auto auto;grid-template-columns:1fr .5fr .5fr;grid-auto-columns:1fr;display:grid}.about_stats_image{border-radius:var(--_spacing---border-radious--md);overflow:clip}.why_choose_us_section{position:relative;overflow:clip}.why_choose_section_header{margin-bottom:var(--_spacing---spacing-semantics--spacing-5xl);padding-bottom:var(--_spacing---spacing-primitives--48px);grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);border-bottom:1px solid var(--black-secondary);flex-flow:wrap;justify-content:space-between;align-items:flex-start;display:flex}.why_choose_section_info{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);flex-flow:column;max-width:321px;margin-left:auto;display:flex}.text-case-normal{text-transform:none}.why_choose_track{height:300vh}.why_choose_sticky{width:100%;height:100vh;position:sticky;top:10%}.why_choose_item{border-radius:var(--_spacing---border-radious--lg);background-color:#E4D9C3;background-image:url(../images/why-choose-image-1.svg);background-position:100% 100%;background-repeat:no-repeat;flex:none;justify-content:center;align-items:center;width:100%;height:680px;display:flex;position:relative}.why_choose_item._2{background-image:url(../images/why-choose-image-2.svg)}.why_choose_item._3{background-image:url(../images/why-choose-image-3.svg)}.why_choose_items{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);display:flex}.why_choose_item_title{font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-3xl);line-height:var(--_typography---line-height--1);letter-spacing:var(--_typography---letter-spacing--0-01)}.color-black{color:var(--black-primary)}.why_choose_item_sub_text{left:var(--_spacing---spacing-primitives--40px);top:var(--_spacing---spacing-primitives--40px);color:var(--black-primary);font-weight:var(--_typography---font-weight--800);text-transform:uppercase;position:absolute;bottom:auto;right:auto}.team_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-left:5%;padding-right:5%}.team_card._2{margin-top:100px}.team_card._3{margin-top:200px}.team_card._4{margin-top:300px}.member_image_wrap{margin-bottom:var(--_spacing---spacing-semantics--spacing-xl);border-radius:var(--_spacing---border-radious--lg);overflow:clip}.team_content{grid-column-gap:var(--_spacing---spacing-primitives--4px);grid-row-gap:var(--_spacing---spacing-primitives--4px);flex-flow:column;display:flex}.text-xxl{font-size:var(--_typography---font-sizes--body--text-3xl);letter-spacing:var(--_typography---letter-spacing--0-01)}.team_cards{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);grid-template-rows:auto;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-auto-columns:1fr;display:grid}.track{width:100%;height:300vh}.sticky{width:100%;height:100vh;position:sticky;top:10%}.text-md{font-size:var(--_typography---font-sizes--body--text-md)}.awards_section{padding:var(--_spacing---section-padding--padding-regular)5%;background-color:#E4D9C3}.award_name{z-index:1;font-weight:var(--_typography---font-weight--700);position:relative}.award_number{z-index:1;font-weight:var(--_typography---font-weight--500);text-align:center;position:relative}.award_status{z-index:1;font-weight:var(--_typography---font-weight--700);text-align:right;position:relative}.award_item{padding-top:var(--_spacing---spacing-primitives--36px);padding-bottom:var(--_spacing---spacing-primitives--36px);grid-column-gap:var(--_spacing---spacing-primitives--0);grid-row-gap:var(--_spacing---spacing-primitives--0);border-bottom:1px solid var(--black-primary);color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-sm);grid-template-rows:auto;grid-template-columns:1fr 1fr 1fr;grid-auto-columns:1fr;align-items:center;display:grid;position:relative}.award_item.is-first{border-top:1px solid var(--black-primary)}.service_hero_section{padding-top:184px;padding-bottom:var(--_spacing---spacing-primitives--80px);max-width:1920px;margin-left:auto;margin-right:auto;position:relative;overflow:clip}.service_hero_circle{aspect-ratio:1;border-radius:var(--_spacing---border-radious--full);background-image:linear-gradient(180deg,var(--white)20%,var(--vivid-orange));opacity:.1;width:45vw;margin-left:auto;margin-right:auto;position:absolute;bottom:0%;left:0%}.service_hero_circle._2{background-image:linear-gradient(180deg,var(--vivid-orange),var(--white)70%);inset:0% 0% auto auto}.service_hero_content{z-index:2;grid-column-gap:var(--_spacing---spacing-semantics--spacing-5xl);grid-row-gap:var(--_spacing---spacing-semantics--spacing-5xl);text-align:center;flex-flow:column;justify-content:center;align-items:center;display:flex;position:relative}.service_hero_title{color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);max-width:24ch}.service_hero_visual_elements{pointer-events:none;width:100%;max-width:1492px;margin-left:auto;margin-right:auto;position:absolute;inset:0%}.service_hero_visual_image{aspect-ratio:142/87;object-fit:cover;width:142px;position:absolute;top:241px;right:71px}.scroll_indicatior{aspect-ratio:1/2;border:1px solid var(--gray);border-radius:var(--_spacing---border-radious--999);color:var(--black-secondary);justify-content:center;align-items:center;width:40px;display:flex}.scroll_indicator_icon{max-width:16px;display:flex}.service_video{aspect-ratio:192/65;width:100%;height:100%}.project_hero_section{padding-top:184px;padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.project_hero_content{grid-column-gap:var(--_spacing---spacing-semantics--spacing-5xl);grid-row-gap:var(--_spacing---spacing-semantics--spacing-5xl);text-align:center;flex-flow:column;justify-content:center;align-items:center;display:flex;position:relative}.project_hero_title{color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);max-width:24ch}.project_ticker{padding-top:var(--_spacing---spacing-primitives--16px);padding-bottom:var(--_spacing---spacing-primitives--16px);background-color:var(--vivid-orange);width:100%;overflow:clip}.heading-style-h3{font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);text-transform:uppercase}.heading-style-h3.is-blog-hero,.heading-style-h3.is-contact{margin-top:var(--_spacing---spacing-semantics--spacing-3xl);max-width:22ch}.color-white{color:var(--white)}.project_ticker_icon{margin-right:var(--_spacing---spacing-primitives--60px);color:var(--black-secondary);max-width:90px;display:flex}.project_ticker_item{flex:none;justify-content:flex-start;align-items:center;display:flex}.project_ticker_title{margin-right:var(--_spacing---spacing-primitives--60px);font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--heading--h3);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);text-transform:uppercase;flex:none}.project_ticker_row{display:flex}.border{margin-top:var(--_spacing---spacing-primitives--4px);grid-column-gap:var(--_spacing---spacing-primitives--4px);grid-row-gap:var(--_spacing---spacing-primitives--4px);flex-flow:column;display:flex}.border:where(.mw-variant-cb23eb3a-188e-4961-4b60-4654cb231014){flex-flow:column-reverse}.border_line{padding:var(--_spacing---spacing-primitives--0);background-color:var(--vivid-orange);width:100%;height:12px}.border_line._2{height:9px}.border_line._3{height:6px}.border_line._4{height:4px}.border_line._5{height:3px}.projects_listing{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular)}.service_hero_title_span{margin-right:var(--_spacing---spacing-primitives--8px);margin-left:var(--_spacing---spacing-primitives--8px);aspect-ratio:95/44;border-radius:var(--_spacing---border-radious--999);vertical-align:middle;background-image:url(../images/service-text-image.avif);background-position:0 0;background-repeat:no-repeat;background-size:cover;width:150px;display:inline-block}.project_single_hero{padding-top:184px;padding-bottom:var(--_spacing---section-padding--padding-regular)}.pointer-events-none{pointer-events:none}.text-weight-medium{font-weight:500}.text-sm{font-size:var(--_typography---font-sizes--body--text-sm)}.heading-style-h4{font-family:var(--_typography---font-family--heading-font);color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h4);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);text-transform:uppercase}.heading-style-h4.is-menu{color:var(--new-gray);line-height:.5}.heading-style-h4.is-menu.hidden{opacity:0;color:var(--white);position:absolute;top:100%;left:0;right:0}.text-2xl{font-size:var(--_typography---font-sizes--body--text-2xl);letter-spacing:var(--_typography---letter-spacing--0-01)}.text-lg{font-size:var(--_typography---font-sizes--body--text-lg)}.project_tag_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);flex-flow:wrap;display:flex}.project_tag{padding:var(--_spacing---spacing-primitives--4px)var(--_spacing---spacing-primitives--20px);border:1px solid var(--black-primary);border-radius:var(--_spacing---border-radious--999);background-color:var(--transparent);color:var(--black-primary);font-size:var(--_typography---font-sizes--body--text-sm);line-height:var(--_typography---line-height--1-4);font-weight:var(--_typography---font-weight--600);text-transform:uppercase;justify-content:center;align-items:center;text-decoration:none;display:flex}.project_tag:hover{text-decoration:underline}.project_single_hero_area{margin-bottom:var(--_spacing---spacing-semantics--spacing-3xl);grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);flex-flow:column;display:flex}.project_meta_area{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);flex-flow:wrap;flex:1 0 auto;grid-template-rows:auto;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-auto-columns:1fr;justify-content:space-between;display:grid}.project_meta_item{grid-column-gap:var(--_spacing---spacing-primitives--4px);grid-row-gap:var(--_spacing---spacing-primitives--4px);color:var(--black-primary);flex-flow:column;display:flex}.font-bold{font-weight:var(--_typography---font-weight--700)}.project_single_fluid_image{aspect-ratio:192/65;width:100%}.project_single_fluid_image._2{aspect-ratio:12/5;margin-bottom:0}.why_choose_content{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--40px);justify-content:space-between;display:flex}.why_choose_right_col{grid-column-gap:var(--_spacing---spacing-semantics--spacing-3xl);grid-row-gap:var(--_spacing---spacing-semantics--spacing-3xl);color:var(--black-primary);flex-flow:column;width:59%;max-width:810px;display:flex}.overview_content{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--40px);justify-content:space-between;display:flex}.overview_left_col{grid-column-gap:var(--_spacing---spacing-semantics--spacing-md);grid-row-gap:var(--_spacing---spacing-semantics--spacing-md);color:var(--black-primary);flex-flow:column;width:46%;max-width:513px;display:flex}.overview_items{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--76px);color:var(--black-primary);flex-flow:column;grid-template-rows:auto auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;width:50%;max-width:810px;display:grid}.overview_item{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);flex-flow:column;display:flex}.overview_item_divider{background-color:var(--black-primary);opacity:.1;width:100%;padding-top:1px}.overview_stat_counter_number{font-family:var(--_typography---font-family--heading-font);color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400)}.overview_counter_height{height:var(--_typography---font-sizes--heading--h5);color:var(--white);justify-content:flex-start;align-items:center;display:flex;overflow:hidden}.image_showcase_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--60px);grid-row-gap:var(--_spacing---spacing-primitives--60px);grid-template-rows:auto;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-auto-columns:1fr;display:grid}.project_image_item{aspect-ratio:9/10;border-radius:var(--_spacing---border-radious--lg);overflow:hidden}.project_image_item._2{margin-top:var(--_spacing---spacing-primitives--60px)}.result_content{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--40px);justify-content:space-between;align-items:flex-start;display:flex}.result_left_col{top:var(--_spacing---spacing-primitives--80px);grid-column-gap:var(--_spacing---spacing-semantics--spacing-md);grid-row-gap:var(--_spacing---spacing-semantics--spacing-md);color:var(--black-primary);flex-flow:column;width:50%;max-width:530px;display:flex;position:sticky}.result_image_wrap{grid-column-gap:var(--_spacing---spacing-primitives--60px);grid-row-gap:var(--_spacing---spacing-primitives--60px);flex-flow:column;width:50%;max-width:810px;display:flex}.result_image{top:var(--_spacing---spacing-primitives--80px);aspect-ratio:81/70;border-radius:var(--_spacing---border-radious--lg);width:100%;position:sticky;overflow:hidden}.result_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);background-color:#e9e4f9}.project_quote{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);overflow:clip}.project_why_choose,.overview_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular)}.project_quote_content{text-align:center;flex-flow:column;justify-content:flex-start;align-items:center;display:flex;position:relative}.project_quote_text{color:#121212;font-size:var(--_typography---font-sizes--heading--200px);line-height:var(--_typography---line-height--0-8);letter-spacing:var(--_typography---letter-spacing--0-03);max-width:10ch}.project_quote_line{padding-top:var(--_spacing---spacing-primitives--4px);padding-right:var(--_spacing---spacing-primitives--4px);display:inline-flex;position:relative}.project_quote_overlay{z-index:6;pointer-events:none;background-color:#fff9;position:absolute;inset:0%}.project_listing{grid-column-gap:var(--_spacing---spacing-primitives--36px);grid-template-rows:auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;place-items:start stretch;display:grid}.text-3xl{font-size:var(--_typography---font-sizes--body--text-3xl)}.project_item:nth-child(2n){margin-top:var(--_spacing---spacing-primitives--80px)}.project_image{margin-bottom:var(--_spacing---spacing-semantics--spacing-xl);aspect-ratio:1;border-radius:var(--_spacing---border-radious--lg);display:block;overflow:hidden}.project_content_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);justify-content:space-between;align-items:center;display:flex}.project_content_left{grid-column-gap:var(--_spacing---spacing-semantics--spacing-sm);grid-row-gap:var(--_spacing---spacing-semantics--spacing-sm);flex-flow:column;display:flex}.project_content_right{flex:none}.link-secondary{color:var(--black-secondary);text-decoration:underline;-webkit-text-decoration-color:var(--transparent);text-decoration-color:var(--transparent);text-decoration-thickness:3px;transition:color .3s,text-decoration-color .3s}.link-secondary:hover{color:var(--gray);-webkit-text-decoration-color:var(--gray);text-decoration-color:var(--gray)}.color-inherit{color:inherit}.blog_hero_section{padding-top:184px;padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.blog_hero_content{text-align:center;flex-flow:column;justify-content:center;align-items:center;display:flex;position:relative}.blog_listing_section{padding-bottom:var(--_spacing---section-padding--padding-regular)}.blog_item_inner{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--40px);justify-content:space-between;align-items:center;max-width:90%;display:flex}.blog_item_left{flex:none}.blog_item_right{width:70%;max-width:850px}.blog_item_image{margin-bottom:var(--_spacing---spacing-semantics--72px\<deleted\|variable-64ec9391-7cce-5908-3750-a41948f4ed7c\>);aspect-ratio:17/12;border-radius:var(--_spacing---border-radious--lg);display:block;overflow:hidden}.blog_item_content{padding-left:var(--_spacing---spacing-primitives--80px);grid-column-gap:var(--_spacing---spacing-semantics--spacing-3xl);grid-row-gap:var(--_spacing---spacing-semantics--spacing-3xl);flex-flow:column;justify-content:flex-start;align-items:flex-start;display:flex}.blog_item_wrapper{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);border-bottom:1px solid #0003}.blog_item_wrapper:last-child{padding-bottom:var(--_spacing---spacing-primitives--0);border-bottom-width:0}.blog_details_section{padding-top:184px;padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.blog_details_header{grid-column-gap:var(--_spacing---spacing-semantics--spacing-3xl);grid-row-gap:var(--_spacing---spacing-semantics--spacing-3xl);text-align:center;flex-flow:column;justify-content:flex-start;align-items:center;max-width:1000px;margin-left:auto;margin-right:auto;display:flex}.primary_richtext{color:var(--black-primary);max-width:1000px;margin-left:auto;margin-right:auto}.primary_richtext h1{margin-bottom:var(--_spacing---spacing-semantics--spacing-sm);color:var(--black-secondary)}.primary_richtext h2,.primary_richtext h4,.primary_richtext h3,.primary_richtext h5{margin-bottom:var(--_spacing---spacing-semantics--spacing-sm)}.primary_richtext p{margin-bottom:var(--_spacing---spacing-primitives--40px)}.primary_richtext blockquote{margin-bottom:var(--_spacing---spacing-semantics--spacing-3xl);padding:var(--_spacing---spacing-primitives--24px)var(--_spacing---spacing-primitives--20px);border-left-width:2px;border-left-color:var(--black-primary);font-family:var(--_typography---font-family--heading-font);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1)}.primary_richtext ol{margin-bottom:var(--_spacing---spacing-primitives--40px);padding-left:var(--_spacing---spacing-primitives--20px)}.primary_richtext ul{margin-bottom:var(--_spacing---spacing-semantics--spacing-3xl);padding-left:var(--_spacing---spacing-primitives--20px)}.primary_richtext li{text-transform:none}.primary_richtext pre{margin-bottom:var(--_spacing---spacing-semantics--spacing-xs)}.blog_image{margin-top:var(--_spacing---spacing-primitives--100px);margin-bottom:var(--_spacing---spacing-primitives--100px);grid-column-gap:16px;grid-row-gap:16px;aspect-ratio:12/5;border-radius:var(--_spacing---border-radious--lg);grid-template-rows:auto auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;width:100%;overflow:hidden}.contact_section{padding-top:184px;padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.contact_hero_content{flex-flow:column;justify-content:center;align-items:center}.contact_form_block{margin-bottom:var(--_spacing---spacing-primitives--0)}.contact_heading{margin-bottom:var(--_spacing---spacing-primitives--60px);text-align:center;flex-flow:column;justify-content:flex-start;align-items:center;display:flex}.contact_form{flex-flow:column;justify-content:flex-start;align-items:flex-end}.contact_form_input{margin-bottom:var(--_spacing---spacing-primitives--0);padding:var(--_spacing---spacing-primitives--28px);border:1px solid var(--transparent);border-radius:var(--_spacing---border-radious--sm);color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-lg);background-color:#FAF7F0;height:72px}.contact_form_input:focus{border-width:1px;border-color:var(--vivid-orange)}.contact_form_input::placeholder{color:var(--black-secondary);font-size:var(--_typography---font-sizes--body--text-lg)}.contact_form_input.is-textarea{margin-bottom:var(--_spacing---spacing-primitives--0);padding:var(--_spacing---spacing-primitives--20px);height:200px}.contact_form_input.is-select{padding-top:var(--_spacing---spacing-primitives--0);padding-bottom:var(--_spacing---spacing-primitives--0);background-image:url(../images/select-box-arrow.svg);background-position:96%;background-repeat:no-repeat;-webkit-appearance:none!important;appearance:none!important}.form_success{border-radius:var(--_spacing---border-radious--999);background-color:var(--vivid-orange);color:var(--black-secondary);font-weight:var(--_typography---font-weight--600)}.form_error{padding-top:var(--_spacing---spacing-primitives--16px);padding-bottom:var(--_spacing---spacing-primitives--16px);border-radius:var(--_spacing---border-radious--999);color:var(--black-secondary);font-weight:var(--_typography---font-weight--600);text-align:center;background-color:#C9A66B}.contact_form_input_wrapper{margin-bottom:var(--_spacing---spacing-semantics--spacing-7xl);grid-column-gap:var(--_spacing---spacing-primitives--32px);grid-row-gap:var(--_spacing---spacing-primitives--32px);grid-template-rows:auto auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;display:grid}.contact_tabs{max-width:1000px;margin-left:auto;margin-right:auto}.contact_tabs_menu{margin-bottom:var(--_spacing---spacing-semantics--spacing-5xl);grid-column-gap:var(--_spacing---spacing-primitives--60px);grid-row-gap:var(--_spacing---spacing-primitives--60px);display:flex}.contact_tabs_links{padding:var(--_spacing---spacing-primitives--0)var(--_spacing---spacing-primitives--0)var(--_spacing---spacing-primitives--8px);border-bottom:4px solid var(--transparent);background-color:var(--transparent);opacity:.2}.contact_tabs_links.mw--current{border-bottom-color:var(--black-secondary);background-color:var(--transparent);opacity:1}.contact_tabs_link_text{font-family:var(--_typography---font-family--heading-font);color:var(--black-secondary);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1)}.align-center{justify-content:center;align-items:flex-start;display:flex}.cursor-pointer{cursor:pointer}.error_content_wrapper{text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100vh;display:flex}.error_number_logo{margin-top:var(--_spacing---spacing-semantics--spacing-7xl);margin-bottom:var(--_spacing---spacing-semantics--spacing-8xl);align-items:flex-end;max-width:613px}.work_collection_list_wrapper{z-index:4;position:relative}.work_collection_list_wrapper._2{z-index:3;position:absolute;inset:0 0 auto}.work_collection_list_wrapper._3{z-index:2;position:absolute;inset:0 0 auto}.work_collection_list_wrapper._4{z-index:1;position:absolute;inset:0 0 auto}.work_link{text-decoration:underline;-webkit-text-decoration-color:var(--transparent);text-decoration-color:var(--transparent);text-decoration-thickness:3px;transition:color .3s,text-decoration-color .3s}.work_link:hover{-webkit-text-decoration-color:var(--black-secondary);text-decoration-color:var(--black-secondary)}.canvas_menu_element{z-index:999;background-color:var(--black-secondary);flex-flow:column;justify-content:flex-start;align-items:stretch;width:100%;height:100%;display:flex}.canvas_menu_link{padding-top:var(--_spacing---spacing-primitives--36px);text-align:center;text-decoration:none;position:relative;overflow:hidden}.canvas_menu_wrapper{flex-flow:column;flex:1;display:flex}.canvas_menu_active_bg{background-color:var(--vivid-orange);transform-origin:50% 100%;transform-style:preserve-3d;height:100%;position:absolute;inset:auto 0% 0%;transform:scaleY(0)}.canvas_menu_text{position:relative}.canvas_menu_border_line{background-color:var(--white-30);height:1px;position:absolute;inset:auto 0% 0%}.canvas_logo{opacity:.3;font-family:var(--_typography---font-family--heading-font);font-size:var(--_typography---font-sizes--heading--h1);line-height:var(--_typography---line-height--0-8);text-align:center;letter-spacing:var(--_typography---letter-spacing--0-03);-webkit-text-fill-color:transparent;background-image:linear-gradient(#fff 32%,#000 90%);-webkit-background-clip:text;background-clip:text}.canvas_logo_wrapper{justify-content:center;align-items:center;display:flex;position:relative}.canvas_menu_bottom{padding:var(--_spacing---spacing-primitives--40px)var(--_spacing---spacing-primitives--60px);grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);flex-flow:wrap;justify-content:space-between;align-items:center;display:flex}.hamburger_menu_icon{z-index:99;grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);border-bottom:1px solid var(--white);cursor:pointer;flex-flow:column;justify-content:center;align-items:center;width:70px;display:flex}.hamburger_menu_icon:where(.mw-variant-f2cbe589-1fd0-33a3-fc39-1d62a9947e8a){border-bottom-color:var(--black-secondary-30)}.hamburger_menu_icon.is-close{aspect-ratio:1;border:1px solid var(--white-30);border-radius:var(--_spacing---border-radious--sm);background-color:var(--black-secondary);position:absolute;inset:auto 4% 15% auto}.hamburger_menu_icon_line{border-radius:var(--_spacing---border-radious--999);background-color:var(--white);width:16px;height:2px}.hamburger_menu_icon_line:where(.mw-variant-f2cbe589-1fd0-33a3-fc39-1d62a9947e8a){background-color:var(--black-secondary)}.hamburger_menu_icon_line.is-middle{width:32px}.why-choose_section_right{flex:1;max-width:321px}.hamburger_menu_inner{grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);flex-flow:column;justify-content:center;align-items:center;display:flex;transform:rotate(-45deg)}.hamburger_menu_inner.is-close{aspect-ratio:1;justify-content:space-between;align-items:center;width:30px;display:flex;transform:none}.hamburger_close_menu_icon_line{border-radius:var(--_spacing---border-radious--999);transform-origin:0 0;background-color:#fff;width:100%;height:2px;transform:translate(5px,4px)rotate(45deg)}.hamburger_close_menu_icon_line.is-close-middle{transform:translate(3px,-2px)rotate(-45deg)}.nav_link_text_wrap{position:relative;overflow:clip}.project_meta_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--32px);grid-row-gap:var(--_spacing---spacing-primitives--32px);flex-flow:column;max-width:1500px;display:flex}.about_hero_title_span{margin-right:var(--_spacing---spacing-primitives--8px);margin-left:var(--_spacing---spacing-primitives--8px);aspect-ratio:95/44;border-radius:var(--_spacing---border-radious--999);vertical-align:middle;background-image:url(../images/about-text-image.avif);background-position:0 0;background-repeat:no-repeat;background-size:cover;width:150px;display:inline-block}.link-primary{color:var(--white);text-decoration:underline;-webkit-text-decoration-color:var(--white);text-decoration-color:var(--white);text-underline-position:under;text-decoration-thickness:2px;transition:color .3s,text-decoration-color .3s}.link-primary:hover{color:var(--vivid-orange);-webkit-text-decoration-color:var(--vivid-orange);text-decoration-color:var(--vivid-orange)}.utility-page-wrap{justify-content:center;align-items:center;width:100vw;max-width:100%;height:100vh;max-height:100%;display:flex}.utility-page-content{text-align:center;flex-direction:column;width:260px;display:flex}.utility-page-form{flex-direction:column;align-items:stretch;display:flex}.spacer-regular{padding-top:var(--_spacing---section-padding--padding-regular)}.award_item_background{z-index:0;background-color:var(--black-secondary);transform-origin:50% 100%;transform-style:preserve-3d;width:100%;height:100%;position:absolute;inset:0%;transform:scaleY(0)}.preloader{z-index:999;background-color:var(--black-secondary);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;inset:0%;transform:translateY(-120%)}.preloader_border{position:absolute;top:100%;left:0;right:0}.utility_hero_section{padding-top:184px;padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.utility_hero_content{grid-column-gap:var(--_spacing---spacing-semantics--spacing-xl);grid-row-gap:var(--_spacing---spacing-semantics--spacing-xl);text-align:center;flex-flow:column;justify-content:center;align-items:center;display:flex;position:relative}.utility_single_block{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);grid-column-gap:var(--_spacing---spacing-primitives--64px);grid-row-gap:var(--_spacing---spacing-primitives--64px);border-bottom:1px solid var(--black-secondary-30);display:flex}.utility_single_block.is-first{padding-top:var(--_spacing---spacing-primitives--0)}.utility_single_left{flex:0 140px}.utility_single_right{flex:1}.utility_main_section{padding-bottom:var(--_spacing---section-padding--padding-regular);position:relative;overflow:clip}.utility_single_color_background{padding:var(--_spacing---spacing-primitives--20px);background-color:var(--transparent);text-align:center;justify-content:center;align-items:center;height:180px;display:flex}.background-gradiant{background-image:linear-gradient(180deg,var(--vivid-red),var(--vivid-orange))}.utility_single_color_item{border-radius:var(--_spacing---border-radious--md);overflow:hidden}.background-black{background-color:var(--black-primary)}.background-orange{background-color:var(--vivid-orange)}.utility_single_colors{grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px);grid-template-rows:auto auto;grid-template-columns:1fr 1fr 1fr;grid-auto-columns:1fr;display:grid}.background-red{background-color:var(--vivid-red)}.background-linen{background-color:var(--linen)}.utility_single_font.is-paragraph{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);flex-flow:column;display:flex}.utility_single_buttons{grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px);flex-flow:wrap;justify-content:flex-start;align-items:center;display:flex}.background-gray{background-color:var(--gray)}.text-xl{font-size:var(--_typography---font-sizes--body--text-xl);letter-spacing:var(--_typography---letter-spacing--0-01)}.text-xs{font-size:var(--_typography---font-sizes--body--text-xs)}.text-xxs{font-size:var(--_typography---font-sizes--body--text-xxs)}.utility_single_links{padding:var(--_spacing---spacing-primitives--24px);grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);border-radius:var(--_spacing---border-radious--sm);background-color:var(--yellow);flex-flow:column;display:flex}.heading-style-h5{font-family:var(--_typography---font-family--heading-font);color:var(--black-primary);font-size:var(--_typography---font-sizes--heading--h5);line-height:var(--_typography---line-height--1);font-weight:var(--_typography---font-weight--400);letter-spacing:var(--_typography---letter-spacing--0-01);text-transform:uppercase}.utility_single_list{margin-top:var(--_spacing---spacing-semantics--spacing-md);margin-bottom:var(--_spacing---spacing-primitives--0);padding-left:var(--_spacing---spacing-primitives--20px);grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);color:var(--black-primary);flex-flow:column;display:flex}.utility_single_list_item{text-transform:none}.utility_single_link{text-decoration:underline}.utility_hero_licenses_text{color:var(--black-secondary);max-width:770px}.video_control_button{padding:var(--_spacing---spacing-primitives--12px);border-radius:var(--_spacing---border-radious--full);background-color:var(--linen)}.video_state{width:24px;display:block}.life_section{padding-top:var(--_spacing---section-padding--padding-regular);padding-bottom:var(--_spacing---section-padding--padding-regular);overflow:clip}.life_section:where(.mw-variant-6810366c-2758-6af1-e2de-949ff57b34af){padding-top:var(--_spacing---section-padding--padding-regular)}.life_images{grid-column-gap:16px;grid-row-gap:16px;grid-template-rows:auto auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;justify-content:center;align-items:center;padding-top:68px;display:flex}.life_image_item{aspect-ratio:23/31;border:20px solid var(--white);border-radius:var(--_spacing---border-radious--lg);flex-flow:column;justify-content:space-between;width:30vw;max-width:460px;position:relative;overflow:hidden;transform:rotate(-3deg);box-shadow:0 30px 80px #0000001f}.life_image_item:hover{z-index:1}.life_image_item.card_two{margin-top:-8vw;margin-left:-10vw;position:relative;transform:rotate(5deg)}.life_image_item.card_three,.life_image_item.card_four{margin-left:-10vw}.canvas_menu{z-index:999;width:100vw;height:100dvh;max-height:100dvh;position:fixed;inset:0%;overflow:clip;transform:translateY(-100dvh)}@media screen and (min-width:1280px){.footer_cta_input:focus{border-color:var(--vivid-orange)}.project_image_item._2{margin-top:var(--_spacing---spacing-primitives--80px)}}@media screen and (min-width:1440px){.hero_section{padding-top:170px}.year_wrapper{grid-column-gap:200px;grid-row-gap:200px}.step_item_inner{padding-left:20px;padding-right:20px}.steps_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--40px)}.work_right_content{padding-top:var(--_spacing---spacing-primitives--80px);padding-bottom:var(--_spacing---spacing-primitives--80px)}.showreel_video_button{width:120px}.footer_cta{flex-basis:486px}.footer_cta_form{flex-flow:row}.footer_cta_input{padding-right:var(--_spacing---spacing-semantics--spacing-xl);padding-left:var(--_spacing---spacing-semantics--spacing-xl);flex-basis:auto;height:72px}.footer_cta_submit_button{padding-top:var(--_spacing---spacing-semantics--spacing-xs);padding-bottom:var(--_spacing---spacing-semantics--spacing-xs);flex:none;font-size:24px}.logo_big_text{font-size:var(--_typography---font-sizes--heading--h2)}.testimonial_cards{padding-top:73px}.floating_text.is_service{top:64px;left:264px}.brand{max-width:350px}.about_hero_section{padding-top:273px}.hero_circle_secondary{width:1212px}.team_cards{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--40px)}.service_hero_section{padding-top:273px}.service_hero_visual_image{right:113px}.project_hero_section{padding-top:273px}.project_listing{grid-column-gap:var(--_spacing---spacing-primitives--60px)}.blog_hero_section{padding-top:273px}.canvas_logo{font-size:var(--_typography---font-sizes--heading--h2)}.hamburger_menu_icon{top:12px;right:29px}.hamburger_menu_icon.is-close{left:auto;top:var(--_spacing---spacing-primitives--28px);right:var(--_spacing---spacing-primitives--36px);bottom:auto}.project_meta_wrapper{flex-flow:row}.utility_single_colors{grid-template-columns:1fr 1fr 1fr 1fr}.life_images{padding-top:73px}}@media screen and (min-width:1920px){.hero_sub_title{font-size:96px}.section_header.is_work,.section_header.is_service{position:relative}.step_item_inner{padding-left:40px;padding-right:40px}.steps_line{top:13px}.work_description_text{max-width:607px}.service_item{padding-top:100px;padding-bottom:100px}.service_item_video_wrap{flex-basis:600px}.box{aspect-ratio:1}.brands_grid{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;grid-auto-columns:1fr}.brand_logo_wrapper{padding:8px}.brands_testimony_area{padding:56px 48px}.leader_section{min-height:200vh}.leader_circle_item{width:260px;padding-bottom:22vw}.leader_section_badge{top:-79px;left:118px}.footer_cta{flex-basis:656px}.footer_top_wrapper{grid-column-gap:180px;grid-row-gap:180px}.footer_cta_submit_button{padding-right:var(--_spacing---spacing-semantics--spacing-3xl);padding-left:var(--_spacing---spacing-semantics--spacing-3xl)}.testimonial_card.card_two{margin-top:-5vw;margin-left:-6vw}.testimonial_card.card_three,.testimonial_card.card_four{margin-left:-6vw}.testimonial_text{font-size:28px}.testimonial_cards{padding-top:65px}.floating_text{top:82px;right:277px}.floating_text.is-testimony{top:74px;left:321px}.floating_text.is_service{top:94px;left:323px}.floating_text.is-about{top:86px;right:199px}.floating_text.is-team{top:74px;left:321px}.floating_text.is-canvas{top:70px}.about_section_pattern{max-width:none}.brand{max-width:560px}.about_hero_section{overflow:visible}.about_stats_item{padding:var(--_spacing---spacing-primitives--48px);min-height:430px}.service_hero_circle{width:746px}.service_hero_visual_image{top:293px;right:182px}.service_hero_title_span{width:210px}.project_single_hero{padding-top:273px}.project_image_item._2{margin-top:var(--_spacing---spacing-primitives--120px)}.blog_hero_section{padding-top:273px;overflow:visible}.blog_item_inner{max-width:75%}.blog_item_right{width:70%}.blog_details_section,.contact_section{padding-top:273px;overflow:visible}.hamburger_menu_icon{top:23px;right:34px}.about_hero_title_span{width:210px}.utility_single_block{grid-column-gap:150px;grid-row-gap:150px}.utility_main_section{overflow:visible}.life_images{padding-top:65px}.life_image_item.card_two{margin-top:-5vw;margin-left:-6vw}.life_image_item.card_three,.life_image_item.card_four{margin-left:-6vw}}@media screen and (max-width:991px){body{--_typography---font-family--body-font:"DM Sans",Arial,sans-serif;--_typography---font-sizes--body--text-lg:16px;--_typography---line-height--1-5:1.5;--_typography---font-weight--400:400;--_typography---font-family--heading-font:Bebasneue,Arial,sans-serif;--_typography---font-sizes--heading--h1:19vw;--_typography---line-height--1:1;--_typography---font-sizes--heading--h2:clamp(3.75rem,-.1942rem + 16.8285vw,20rem);--_typography---letter-spacing--0-03:-.03em;--_typography---font-sizes--heading--h3:clamp(2.75rem,1.4757rem + 5.4369vw,8rem);--_typography---letter-spacing--0-01:-.01em;--_typography---font-sizes--heading--h4:clamp(2rem,1.2112rem + 3.3657vw,5.25rem);--_typography---font-sizes--heading--h5:clamp(1.75rem,1.5376rem + .9061vw,2.625rem);--_typography---font-sizes--body--text-sm:16px;--_typography---font-weight--700:700;--_typography---line-height--1-4:1.4;--_typography---font-weight--500:500;--_typography---font-sizes--body--text-2xl:24px;--_typography---font-weight--600:600;--_typography---font-sizes--heading--about-year-text:clamp(5rem,1.3592rem + 15.534vw,20rem);--_typography---font-sizes--body--text-xl:20px;--_typography---font-sizes--body--text-md:18px;--_typography---font-sizes--body--text-xs:14px;--_typography---font-sizes--body--text-3xl:clamp(1.5rem,1.2573rem + 1.0356vw,2.5rem);--_typography---line-height--1-3:1.3;--_typography---font-sizes--heading--200px:clamp(3rem,.6942rem + 9.8382vw,12.5rem);--_typography---font-sizes--heading--footer-logo-text:24vw;--_typography---line-height--0-8:.8;--_typography---font-weight--800:800;--_typography---font-sizes--body--text-xxs:12px;--_typography---font-sizes--heading--nav-logo-text:40px;--_typography---line-height--1-1:1.1;--_typography---line-height--1-2:1.2;--_typography---font-weight--900:900;--_typography---letter-spacing--0-02:-.02em;--_spacing---spacing-primitives--0:0px;--_spacing---spacing-primitives--8px:8px;--_spacing---section-padding--padding-regular:100px;--_spacing---spacing-primitives--64px:64px;--_spacing---spacing-primitives--32px:32px;--_spacing---spacing-primitives--28px:28px;--_spacing---spacing-primitives--24px:24px;--_spacing---spacing-primitives--40px:40px;--_spacing---spacing-primitives--16px:16px;--_spacing---spacing-primitives--12px:12px;--_spacing---spacing-primitives--20px:20px;--_spacing---spacing-primitives--4px:4px;--_spacing---spacing-semantics--spacing-3xl:var(--_spacing---spacing-primitives--24px);--_spacing---spacing-primitives--52px:52px;--_spacing---border-radious--lg:24px;--_spacing---border-radious--xl:60px;--_spacing---spacing-semantics--spacing-8xl:var(--_spacing---spacing-primitives--52px);--_spacing---spacing-semantics--spacing-xs:var(--_spacing---spacing-primitives--16px);--_spacing---spacing-primitives--44px:44px;--_spacing---spacing-semantics--spacing-md:var(--_spacing---spacing-primitives--20px);--_spacing---border-radious--full:100%;--_spacing---spacing-semantics--spacing-xl:var(--_spacing---spacing-primitives--24px);--_spacing---border-radious--sm:16px;--_spacing---spacing-primitives--80px:80px;--_spacing---spacing-primitives--60px:60px;--_spacing---spacing-semantics--spacing-7xl:var(--_spacing---spacing-primitives--48px);--_spacing---spacing-primitives--100px:100px;--_spacing---spacing-primitives--48px:48px;--_spacing---spacing-semantics--spacing-sm:var(--_spacing---spacing-primitives--16px);--_spacing---border-radious--showreel-video-radius:24px;--_spacing---border-radious--999:999px;--_spacing---spacing--12px\<deleted\|variable-f7fbc2ae-f10d-aa16-7bf7-2f0ebd5c8e25\>:12px;--_spacing---spacing--0px\<deleted\|variable-bf0d4080-7243-f69d-3393-6c852d876a5b\>:0px;--_spacing---spacing-semantics--spacing-5xl:var(--_spacing---spacing-primitives--36px);--_spacing---border-radious--md:20px;--_spacing---spacing-primitives--36px:36px;--_spacing---spacing-primitives--76px:76px;--_spacing---spacing-primitives--120px:120px;--_spacing---spacing-semantics--72px\<deleted\|variable-64ec9391-7cce-5908-3750-a41948f4ed7c\>:72px;--_spacing---spacing-primitives--56px:0px;--_spacing---spacing-primitives--68px:68px;--_spacing---spacing-primitives--72px:72px;--_spacing---spacing-semantics--spacing-lg:var(--_spacing---spacing-primitives--28px);--_spacing---spacing-semantics--spacing-2xl:var(--_spacing---spacing-primitives--24px);--_spacing---spacing-semantics--spacing-4xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-6xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-9xl:var(--_spacing---spacing-primitives--64px)}.hero_section{padding-top:130px}.hero_heading{margin-bottom:230px}.hero_content_wrapper{margin-bottom:72px}.hero_sub_title{font-size:8vw}.hero_info{max-width:300px}.hero_stat{grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px)}.hero_stat_icon{max-width:40px}.section_caption_circle{width:20px}.year_wrapper{grid-column-gap:64px;grid-row-gap:64px}.year_item{max-width:300px}.year_info_text{margin-bottom:var(--_spacing---spacing-primitives--32px)}.year_content{max-width:300px}.step_item_inner{padding-top:var(--_spacing---spacing-primitives--32px);padding-bottom:var(--_spacing---spacing-primitives--32px);pointer-events:auto}.steps_wrapper{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.step_icon,.step_line_icon,.steps_line{display:none}.heading_style_h4.about_section_title{max-width:none}.work_left_content{padding:var(--_spacing---spacing-primitives--60px)var(--_spacing---spacing-primitives--32px)}.work_right_content{padding:var(--_spacing---spacing-primitives--32px)}.service_item{padding-top:var(--_spacing---spacing-primitives--40px);padding-bottom:var(--_spacing---spacing-primitives--40px)}.service_item_content{flex-basis:290px}.service_item_title{--_spacing---spacing-primitives--0:0px;--_spacing---spacing-primitives--8px:8px;--_spacing---section-padding--padding-regular:100px;--_spacing---spacing-primitives--64px:64px;--_spacing---spacing-primitives--32px:32px;--_spacing---spacing-primitives--28px:28px;--_spacing---spacing-primitives--24px:24px;--_spacing---spacing-primitives--40px:40px;--_spacing---spacing-primitives--16px:16px;--_spacing---spacing-primitives--12px:12px;--_spacing---spacing-primitives--20px:20px;--_spacing---spacing-primitives--4px:4px;--_spacing---spacing-semantics--spacing-3xl:var(--_spacing---spacing-primitives--24px);--_spacing---spacing-primitives--52px:52px;--_spacing---border-radious--lg:24px;--_spacing---border-radious--xl:60px;--_spacing---spacing-semantics--spacing-8xl:var(--_spacing---spacing-primitives--52px);--_spacing---spacing-semantics--spacing-xs:var(--_spacing---spacing-primitives--16px);--_spacing---spacing-primitives--44px:44px;--_spacing---spacing-semantics--spacing-md:var(--_spacing---spacing-primitives--20px);--_spacing---border-radious--full:100%;--_spacing---spacing-semantics--spacing-xl:var(--_spacing---spacing-primitives--24px);--_spacing---border-radious--sm:16px;--_spacing---spacing-primitives--80px:80px;--_spacing---spacing-primitives--60px:60px;--_spacing---spacing-semantics--spacing-7xl:var(--_spacing---spacing-primitives--48px);--_spacing---spacing-primitives--100px:100px;--_spacing---spacing-primitives--48px:48px;--_spacing---spacing-semantics--spacing-sm:var(--_spacing---spacing-primitives--16px);--_spacing---border-radious--showreel-video-radius:24px;--_spacing---border-radious--999:999px;--_spacing---spacing--12px\<deleted\|variable-f7fbc2ae-f10d-aa16-7bf7-2f0ebd5c8e25\>:12px;--_spacing---spacing--0px\<deleted\|variable-bf0d4080-7243-f69d-3393-6c852d876a5b\>:0px;--_spacing---spacing-semantics--spacing-5xl:var(--_spacing---spacing-primitives--36px);--_spacing---border-radious--md:20px;--_spacing---spacing-primitives--36px:36px;--_spacing---spacing-primitives--76px:76px;--_spacing---spacing-primitives--120px:120px;--_spacing---spacing-semantics--72px\<deleted\|variable-64ec9391-7cce-5908-3750-a41948f4ed7c\>:72px;--_spacing---spacing-primitives--56px:0px;--_spacing---spacing-primitives--68px:68px;--_spacing---spacing-primitives--72px:72px;--_spacing---spacing-semantics--spacing-lg:var(--_spacing---spacing-primitives--28px);--_spacing---spacing-semantics--spacing-2xl:var(--_spacing---spacing-primitives--24px);--_spacing---spacing-semantics--spacing-4xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-6xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-9xl:var(--_spacing---spacing-primitives--64px)}.service_item_tag{padding:var(--_spacing---spacing-primitives--4px)var(--_spacing---spacing-primitives--12px)}.service_item_tag_text{font-size:var(--_typography---font-sizes--body--text-xs)}.showreel_section{padding:var(--_spacing---section-padding--padding-regular)var(--_layout---padding-global)}.showreel_track{width:100%;height:auto}.showreel_sticky{height:auto}.showreel_text._2{transform:translate(-25vw,-50%)}.showreel_text._1{transform:translate(25vw,-50%)}.showreel_video_wrapper{aspect-ratio:3/2;width:100%;height:auto}.showreel_video_button{width:80px}.showreel_video_mask{width:100%;height:auto}.button_primary{padding:16px 30px}.button_primary:where(.mw-variant-6f4c28b7-a4d7-55b2-4db6-4716f376ac9c),.button_primary:where(.mw-variant-4025ac4a-6549-2c92-664a-c77a444cccf0){padding:var(--_spacing---spacing-primitives--12px)var(--_spacing---spacing-primitives--16px);grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px)}.button_primary.v2{padding:var(--_spacing---spacing-primitives--16px)}.button_line:where(.mw-variant-6f4c28b7-a4d7-55b2-4db6-4716f376ac9c),.button_line:where(.mw-variant-4025ac4a-6549-2c92-664a-c77a444cccf0){width:20px}.box.hide_tablet{display:none}.brands_grid{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;width:100%}.brands_grid.absolute{pointer-events:auto;grid-template-rows:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr}.brands_testimony_area{padding-left:24px;padding-right:24px}.brands_wrapper{width:100%}.leader_section{min-height:120vh}.leader_circle_item{width:18vw;padding-bottom:30vw}.leader_circle_image{border-radius:24px}.leader_section_content{opacity:1}.leader_section_badge{padding:var(--_spacing---spacing-primitives--12px)var(--_spacing---spacing-primitives--16px);top:-52px;left:28px}.cta_ticker_text{margin-bottom:var(--_spacing---spacing--12px\<deleted\|variable-f7fbc2ae-f10d-aa16-7bf7-2f0ebd5c8e25\>)}.cta_ticker_text.is_stroke{margin-bottom:var(--_spacing---spacing--0px\<deleted\|variable-bf0d4080-7243-f69d-3393-6c852d876a5b\>)}.cta_button{padding:var(--_spacing---spacing-primitives--16px)var(--_spacing---spacing-primitives--40px)}.cta_button_arrow{width:50px}.cta_button_icon{width:24px}.cta_button_text{font-size:32px}.footer_links{grid-template-rows:auto;grid-template-columns:1.5fr 1fr 1fr 1fr;grid-auto-columns:1fr;display:grid}.footer_cta{flex:none}.footer_top_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--80px);grid-row-gap:var(--_spacing---spacing-primitives--60px);flex-flow:column;margin-bottom:140px}.footer_cta_input{flex-basis:450px}.footer_bottom_wrapper{flex-flow:column;justify-content:flex-start;align-items:center}.footer_legal_corner{margin-bottom:var(--_spacing---spacing-primitives--0)}.footer_legal_text{text-align:center}.testimonial_card{padding:var(--_spacing---spacing-primitives--24px);width:100%;max-width:none;min-height:490px;transform:none}.testimonial_card.card_two{margin-top:0;margin-left:0;transform:none}.testimonial_card.card_three,.testimonial_card.card_four{margin-left:0}.testimonial_author_profession{font-size:var(--_typography---font-sizes--body--text-sm)}.testimonial_icon{width:20px}.testimonial_cards{padding-top:var(--_spacing---spacing-primitives--0);grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);grid-template-rows:auto auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;display:grid}.floating_text{padding:12px 20px;top:24px;right:210px}.floating_text.is-testimony{top:24px;left:150px}.floating_text.is_service{top:18px;left:256px}.floating_text.is-about{padding:var(--_spacing---spacing-primitives--12px)var(--_spacing---spacing-primitives--16px);top:36px;right:131px}.floating_text.is-team{top:24px;left:150px}.floating_text.is-canvas{top:29px}.year_text_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px)}.year_text_line{width:50px}.about_sticky{height:70vh;top:18%}.about_section_pattern{display:none}.about_header_area{margin-bottom:120px}.scrolll-top{color:#fff;justify-content:center;align-items:center;margin-bottom:45px;margin-right:40px;font-size:30px;text-decoration:none;display:flex;position:fixed;inset:auto 0% 0% auto}.scrolll-top.mw--current{z-index:30;margin-right:15px;display:none;position:fixed;inset:auto 7% 6% auto}.menu-horizontal-bar{background-color:#fff;border-radius:60px;height:3px}.nav_link_text{margin-left:0;margin-right:0;padding-top:10px;padding-bottom:10px;padding-right:0}.menu-icon-wrapper{grid-column-gap:5px;grid-row-gap:5px;flex-direction:column;width:23px}.navigation{padding:var(--_spacing---spacing-primitives--20px);border-bottom:1px solid var(--white-30)}.navigation.is-secondary{border-bottom-color:var(--black-secondary-30)}.brand{padding-top:var(--_spacing---spacing-primitives--0);padding-bottom:var(--_spacing---spacing-primitives--0);border-bottom-width:0;flex:0 auto;max-width:none}.menu-button{color:#fff;background-color:#10192B;border-radius:50%}.menu-button.mw--open{background-color:#10192B}.icon{display:none}.nav_menu_wrapper{background-color:#fff;border-top:1px solid #ebebeb;flex-direction:column;align-items:flex-start;padding:30px;box-shadow:0 27px 49px #00000042}.about_hero_section{padding-top:150px}.review_star{width:100px}.hero_circle_secondary{width:90vw}.about_stats_item{padding:var(--_spacing---spacing-primitives--20px);min-height:auto}.about_stats_item._2{background-size:144px}.about_stats_item._3{background-size:59px}.about_stats_item._4{background-size:90px}.about_stats_item._1{background-size:89px}.about_stats_item_text{margin-bottom:var(--_spacing---spacing-primitives--48px)}.section-counter-main{margin-bottom:0}.why_choose_us_section{padding-bottom:var(--_spacing---section-padding--padding-regular)}.why_choose_section_header{padding-bottom:var(--_spacing---spacing-primitives--24px)}.why_choose_section_info{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);max-width:220px}.why_choose_track{height:auto}.why_choose_sticky{flex-flow:column;justify-content:center;height:auto;position:static}.why_choose_item{background-size:93px;flex:200px;height:350px}.why_choose_items{flex-flow:wrap}.why_choose_item_sub_text{left:var(--_spacing---spacing-primitives--20px);top:var(--_spacing---spacing-primitives--20px)}.team_section{padding-bottom:var(--_spacing---section-padding--padding-regular)}.team_card._2,.team_card._3,.team_card._4{margin-top:0}.team_cards{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.track{height:auto}.sticky{height:auto;position:static}.service_hero_section{padding-top:150px;padding-bottom:var(--_spacing---spacing-primitives--40px)}.service_hero_visual_image{width:96px}.project_hero_section{padding-top:150px}.project_ticker_icon{margin-right:var(--_spacing---spacing-primitives--40px);max-width:60px}.project_ticker_title{margin-right:var(--_spacing---spacing-primitives--40px)}.border_line{height:8px}.border_line._2{height:6px}.service_hero_title_span{margin-right:var(--_spacing---spacing-primitives--4px);margin-left:var(--_spacing---spacing-primitives--4px);width:110px}.project_single_hero{padding-top:150px}.project_tag{padding-right:var(--_spacing---spacing-primitives--12px);padding-left:var(--_spacing---spacing-primitives--12px);font-size:var(--_typography---font-sizes--body--text-xs);line-height:var(--_typography---line-height--1)}.overview_items{grid-row-gap:var(--_spacing---spacing-primitives--32px)}.overview_item{grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px)}.image_showcase_wrapper,.result_image_wrap{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px)}.project_listing{grid-column-gap:var(--_spacing---spacing-primitives--20px)}.project_item:nth-child(2n){margin-top:var(--_spacing---spacing-primitives--48px)}.project_content_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);flex-flow:wrap}.project_content_left{flex:230px}.blog_hero_section{padding-top:150px}.blog_item_inner{max-width:none}.blog_item_image{margin-bottom:var(--_spacing---spacing-semantics--spacing-5xl)}.blog_item_content{padding-left:var(--_spacing---spacing-primitives--0)}.blog_details_section{padding-top:150px}.blog_image{margin-top:var(--_spacing---spacing-primitives--28px);margin-bottom:var(--_spacing---spacing-primitives--44px)}.contact_section{padding-top:150px}.contact_form_input{padding:var(--_spacing---spacing-primitives--20px);height:64px}.contact_form_input_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px)}.contact_tabs_menu{grid-column-gap:var(--_spacing---spacing-primitives--28px);grid-row-gap:var(--_spacing---spacing-primitives--28px)}.error_number_logo{max-width:500px}.canvas_menu_element{padding-top:var(--_spacing---spacing-primitives--44px)}.canvas_menu_link{padding-top:var(--_spacing---spacing-primitives--28px)}.canvas_logo_wrapper{margin-bottom:var(--_spacing---spacing-primitives--40px)}.canvas_menu_bottom{padding:var(--_spacing---spacing-primitives--24px)}.hamburger_menu_icon{border-bottom-width:0;width:auto}.hamburger_menu_icon.is-close{left:auto;top:var(--_spacing---spacing-primitives--16px);right:var(--_spacing---spacing-primitives--16px);border-bottom-width:1px;width:60px;bottom:auto}.why-choose_section_right{max-width:220px}.project_meta_wrapper{flex-flow:column;width:100%}.about_hero_title_span{margin-right:var(--_spacing---spacing-primitives--4px);margin-left:var(--_spacing---spacing-primitives--4px);width:110px}.utility_hero_section{padding-top:150px}.utility_single_block{grid-column-gap:var(--_spacing---spacing-primitives--36px);grid-row-gap:var(--_spacing---spacing-primitives--36px)}.utility_single_left{flex-basis:auto}.utility_single_colors{grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px);grid-template-columns:1fr 1fr 1fr}.life_images{padding-top:var(--_spacing---spacing-primitives--0);grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);grid-template-rows:auto auto;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));grid-auto-columns:1fr;align-items:stretch;display:grid}.life_image_item{width:100%;max-width:none;transform:none}.life_image_item.card_two{margin-top:0;margin-left:0;transform:none}.life_image_item.card_three,.life_image_item.card_four{margin-left:0}}@media screen and (max-width:767px){body{--_typography---font-family--body-font:"DM Sans",Arial,sans-serif;--_typography---font-sizes--body--text-lg:16px;--_typography---line-height--1-5:1.5;--_typography---font-weight--400:400;--_typography---font-family--heading-font:Bebasneue,Arial,sans-serif;--_typography---font-sizes--heading--h1:19vw;--_typography---line-height--1:1;--_typography---font-sizes--heading--h2:clamp(3.75rem,-.1942rem + 16.8285vw,20rem);--_typography---letter-spacing--0-03:-.03em;--_typography---font-sizes--heading--h3:clamp(2.75rem,1.4757rem + 5.4369vw,8rem);--_typography---letter-spacing--0-01:-.01em;--_typography---font-sizes--heading--h4:clamp(2rem,1.2112rem + 3.3657vw,5.25rem);--_typography---font-sizes--heading--h5:clamp(1.75rem,1.5376rem + .9061vw,2.625rem);--_typography---font-sizes--body--text-sm:16px;--_typography---font-weight--700:700;--_typography---line-height--1-4:1.4;--_typography---font-weight--500:500;--_typography---font-sizes--body--text-2xl:20px;--_typography---font-weight--600:600;--_typography---font-sizes--heading--about-year-text:clamp(5rem,1.3592rem + 15.534vw,20rem);--_typography---font-sizes--body--text-xl:16px;--_typography---font-sizes--body--text-md:16px;--_typography---font-sizes--body--text-xs:14px;--_typography---font-sizes--body--text-3xl:clamp(1.5rem,1.2573rem + 1.0356vw,2.5rem);--_typography---line-height--1-3:1.3;--_typography---font-sizes--heading--200px:clamp(3rem,.6942rem + 9.8382vw,12.5rem);--_typography---font-sizes--heading--footer-logo-text:24vw;--_typography---line-height--0-8:.8;--_typography---font-weight--800:800;--_typography---font-sizes--body--text-xxs:12px;--_typography---font-sizes--heading--nav-logo-text:40px;--_typography---line-height--1-1:1.1;--_typography---line-height--1-2:1.2;--_typography---font-weight--900:900;--_typography---letter-spacing--0-02:-.02em;--_spacing---spacing-primitives--0:0px;--_spacing---spacing-primitives--8px:8px;--_spacing---section-padding--padding-regular:80px;--_spacing---spacing-primitives--64px:64px;--_spacing---spacing-primitives--32px:32px;--_spacing---spacing-primitives--28px:28px;--_spacing---spacing-primitives--24px:24px;--_spacing---spacing-primitives--40px:40px;--_spacing---spacing-primitives--16px:16px;--_spacing---spacing-primitives--12px:12px;--_spacing---spacing-primitives--20px:20px;--_spacing---spacing-primitives--4px:4px;--_spacing---spacing-semantics--spacing-3xl:var(--_spacing---spacing-primitives--20px);--_spacing---spacing-primitives--52px:52px;--_spacing---border-radious--lg:20px;--_spacing---border-radious--xl:40px;--_spacing---spacing-semantics--spacing-8xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-xs:var(--_spacing---spacing-primitives--12px);--_spacing---spacing-primitives--44px:44px;--_spacing---spacing-semantics--spacing-md:var(--_spacing---spacing-primitives--16px);--_spacing---border-radious--full:100%;--_spacing---spacing-semantics--spacing-xl:var(--_spacing---spacing-primitives--20px);--_spacing---border-radious--sm:12px;--_spacing---spacing-primitives--80px:80px;--_spacing---spacing-primitives--60px:60px;--_spacing---spacing-semantics--spacing-7xl:var(--_spacing---spacing-primitives--36px);--_spacing---spacing-primitives--100px:100px;--_spacing---spacing-primitives--48px:48px;--_spacing---spacing-semantics--spacing-sm:var(--_spacing---spacing-primitives--16px);--_spacing---border-radious--showreel-video-radius:20px;--_spacing---border-radious--999:999px;--_spacing---spacing--12px\<deleted\|variable-f7fbc2ae-f10d-aa16-7bf7-2f0ebd5c8e25\>:12px;--_spacing---spacing--0px\<deleted\|variable-bf0d4080-7243-f69d-3393-6c852d876a5b\>:0px;--_spacing---spacing-semantics--spacing-5xl:var(--_spacing---spacing-primitives--32px);--_spacing---border-radious--md:16px;--_spacing---spacing-primitives--36px:36px;--_spacing---spacing-primitives--76px:76px;--_spacing---spacing-primitives--120px:120px;--_spacing---spacing-semantics--72px\<deleted\|variable-64ec9391-7cce-5908-3750-a41948f4ed7c\>:72px;--_spacing---spacing-primitives--56px:0px;--_spacing---spacing-primitives--68px:68px;--_spacing---spacing-primitives--72px:72px;--_spacing---spacing-semantics--spacing-lg:var(--_spacing---spacing-primitives--28px);--_spacing---spacing-semantics--spacing-2xl:var(--_spacing---spacing-primitives--20px);--_spacing---spacing-semantics--spacing-4xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-6xl:var(--_spacing---spacing-primitives--36px);--_spacing---spacing-semantics--spacing-9xl:var(--_spacing---spacing-primitives--44px)}.hero_section{padding-top:110px;padding-bottom:var(--_spacing---spacing-primitives--64px)}.hero_heading{margin-bottom:180px}.hero_content_wrapper{margin-bottom:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--16px);flex-flow:wrap}.hero_sub_title,.hero_info{flex:140px;max-width:none}.hero_stat{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px)}.hero_stat_icon{max-width:34px}.section_caption_circle{width:18px}.year_wrapper{grid-column-gap:48px;grid-row-gap:48px}.year_item{justify-content:flex-start;align-items:flex-start}.year_info_text{margin-bottom:var(--_spacing---spacing-primitives--24px)}.year_content{max-width:none}.steps_wrapper{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.heading_style_h4.work_title{max-width:none}.work_item{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));width:100%;max-width:none}.work_item._2,.work_item._3,.work_item._4{position:relative}.work_left_content{padding-top:var(--_spacing---spacing-primitives--40px);padding-bottom:var(--_spacing---spacing-primitives--40px)}.work_right_content{padding-top:var(--_spacing---spacing-primitives--52px);padding-bottom:var(--_spacing---spacing-primitives--52px)}.work_items_wrapper{grid-column-gap:20px;grid-row-gap:20px;flex-flow:column;height:auto;display:flex}.work_items_track{height:auto}.service_item{top:var(--_spacing---spacing-primitives--48px);padding-top:var(--_spacing---spacing-primitives--32px);padding-bottom:var(--_spacing---spacing-primitives--32px)}.service_item_content{flex-basis:330px}.service_item_video_wrap{flex-basis:320px;max-width:none}.showreel_text._2{transform:translate(-22vw,-50%)}.showreel_text._1{transform:translate(22vw,-50%)}.button_primary{padding-left:22px;padding-right:22px}.button_primary:where(.mw-variant-6f4c28b7-a4d7-55b2-4db6-4716f376ac9c),.button_primary:where(.mw-variant-4025ac4a-6549-2c92-664a-c77a444cccf0){padding:var(--_spacing---spacing-primitives--12px)var(--_spacing---spacing-primitives--16px)}.button_line:where(.mw-variant-6f4c28b7-a4d7-55b2-4db6-4716f376ac9c),.button_line:where(.mw-variant-4025ac4a-6549-2c92-664a-c77a444cccf0){width:16px}.button_text{font-size:var(--_spacing---spacing-primitives--20px)}.box{display:none}.brands_grid{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;display:block}.brands_grid.absolute{grid-column-gap:8px;grid-row-gap:8px;grid-template-rows:minmax(0,1fr);grid-template-columns:1fr 1fr 1fr 1fr;display:grid;position:relative;inset:auto}.brands_section{padding:83px 20px}.brand_logo_wrapper{padding-top:24px;padding-bottom:24px}.brand_logo{max-width:80px}.brands_testimony_area{margin-bottom:20px;padding-top:24px;padding-bottom:24px}.brands_ticker{margin-bottom:40px;padding-top:20px;padding-bottom:20px}.brands_testimony_text{margin-bottom:60px}.leader_section{min-height:90vh}.leader_circle_item{width:100px;padding-bottom:175px}.leader_circle_image{border-radius:16px}.leader_section_badge{top:-46px}.cta_button{padding:var(--_spacing---spacing-primitives--12px)var(--_spacing---spacing-primitives--12px)var(--_spacing---spacing-primitives--12px)var(--_spacing---spacing-primitives--28px);grid-column-gap:var(--_spacing---spacing-primitives--12px);grid-row-gap:var(--_spacing---spacing-primitives--12px)}.cta_button_arrow{width:40px}.cta_button_icon{width:16px}.cta_button_text{font-size:28px}.cta_button_line_mask{width:30px;left:44px}.cta_button_line_mask._2{right:75px}.cta_button_line_mask._3{right:38px}.footer_links{grid-column-gap:var(--_spacing---spacing-primitives--32px);grid-row-gap:var(--_spacing---spacing-primitives--32px);grid-template-columns:1fr 1fr 1fr}.footer_top_wrapper{margin-bottom:var(--_spacing---spacing-primitives--100px)}.footer_cta_input{flex-basis:250px}.footer_cta_submit_button{padding-right:var(--_spacing---spacing-semantics--spacing-sm);padding-left:var(--_spacing---spacing-semantics--spacing-sm);flex-grow:0}.testimonial_card{padding:var(--_spacing---spacing-primitives--20px);min-height:auto}.testimonial_icon_area{margin-bottom:52px}.testimonial_author_area{grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px)}.testimonial_author_image{width:56px}.testimonial_author_name{margin-bottom:var(--_spacing---spacing-primitives--4px)}.testimonial_cards{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));place-items:stretch stretch}.floating_text{padding:8px 16px;top:-37px;right:130px}.floating_text.is-testimony{top:15px;left:104px}.floating_text.is-work{top:19px}.floating_text.is-about{top:26px;right:86px}.floating_text.is-team{top:15px;left:104px}.floating_text.is-canvas{top:20px}.year_text_line{width:40px}.about_header_area{margin-bottom:80px}.scrolll-top{margin-right:30px}.scrolll-top.mw--current{right:auto}.navigation{padding:var(--_spacing---spacing-primitives--16px)}.nav_menu_wrapper{background-color:#fff;padding:20px 25px}.about_hero_section{padding-top:120px}.users_avatar{max-width:120px}.section-counter-main{margin-bottom:30px}.about_stats_grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.member_image_wrap{margin-bottom:var(--_spacing---spacing-primitives--20px)}.team_cards{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.award_item{padding-top:var(--_spacing---spacing-primitives--20px);padding-bottom:var(--_spacing---spacing-primitives--20px)}.service_hero_section{padding-top:120px}.service_hero_visual_image{right:35px}.scroll_indicatior{width:32px}.scroll_indicator_icon{max-width:14px}.service_video{aspect-ratio:3/2}.project_hero_section{padding-top:120px}.project_ticker_icon{margin-right:var(--_spacing---spacing-primitives--24px);max-width:50px}.project_ticker_title{margin-right:var(--_spacing---spacing-primitives--24px)}.border_line{height:5px}.border_line._2{height:4px}.border_line._3{height:3px}.border_line._4{height:2px}.border_line._5{height:1px}.service_hero_title_span{width:90px}.project_single_hero{padding-top:120px}.project_single_hero_area{flex-flow:wrap}.why_choose_content{grid-row-gap:var(--_spacing---spacing-primitives--24px);flex-flow:wrap}.why_choose_right_col{flex:299px;width:100%}.overview_content{grid-row-gap:var(--_spacing---spacing-primitives--40px);flex-flow:wrap}.overview_left_col{flex:280px;width:648px;max-width:none}.overview_items{flex:50%;width:auto;max-width:none}.project_image_item._2{margin-top:var(--_spacing---spacing-primitives--40px)}.result_content{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px)}.project_listing{grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--36px);grid-template-columns:repeat(auto-fit,minmax(310px,1fr))}.project_item:nth-child(2n){margin-top:var(--_spacing---spacing-primitives--0)}.blog_hero_section{padding-top:120px}.blog_item_inner{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px)}.blog_details_section{padding-top:120px}.primary_richtext blockquote{padding:var(--_spacing---spacing-primitives--12px)}.contact_section{padding-top:120px}.contact_form_input.is-textarea{height:170px}.contact_form_input.is-select{background-position:94%;background-size:auto;background-attachment:scroll}.error_number_logo{max-width:400px}.work_collection_list_wrapper._2,.work_collection_list_wrapper._3,.work_collection_list_wrapper._4,.work_collection_list_wrapper._5{position:static}.canvas_menu_element{padding-top:var(--_spacing---spacing-primitives--60px)}.about_hero_title_span{width:90px}.utility_hero_section{padding-top:120px}.utility_single_colors{grid-template-columns:1fr 1fr}.life_image_item{border-width:11px}}@media screen and (max-width:479px){body{--_typography---font-family--body-font:"DM Sans",Arial,sans-serif;--_typography---font-sizes--body--text-lg:16px;--_typography---line-height--1-5:1.5;--_typography---font-weight--400:400;--_typography---font-family--heading-font:Bebasneue,Arial,sans-serif;--_typography---font-sizes--heading--h1:19vw;--_typography---line-height--1:1;--_typography---font-sizes--heading--h2:clamp(3.75rem,-.1942rem + 16.8285vw,20rem);--_typography---letter-spacing--0-03:-.03em;--_typography---font-sizes--heading--h3:clamp(2.75rem,1.4757rem + 5.4369vw,8rem);--_typography---letter-spacing--0-01:-.01em;--_typography---font-sizes--heading--h4:clamp(2rem,1.2112rem + 3.3657vw,5.25rem);--_typography---font-sizes--heading--h5:clamp(1.75rem,1.5376rem + .9061vw,2.625rem);--_typography---font-sizes--body--text-sm:16px;--_typography---font-weight--700:700;--_typography---line-height--1-4:1.4;--_typography---font-weight--500:500;--_typography---font-sizes--body--text-2xl:20px;--_typography---font-weight--600:600;--_typography---font-sizes--heading--about-year-text:clamp(5rem,1.3592rem + 15.534vw,20rem);--_typography---font-sizes--body--text-xl:16px;--_typography---font-sizes--body--text-md:16px;--_typography---font-sizes--body--text-xs:14px;--_typography---font-sizes--body--text-3xl:clamp(1.5rem,1.2573rem + 1.0356vw,2.5rem);--_typography---line-height--1-3:1.3;--_typography---font-sizes--heading--200px:clamp(3rem,.6942rem + 9.8382vw,12.5rem);--_typography---font-sizes--heading--footer-logo-text:28vw;--_typography---line-height--0-8:.8;--_typography---font-weight--800:800;--_typography---font-sizes--body--text-xxs:12px;--_typography---font-sizes--heading--nav-logo-text:40px;--_typography---line-height--1-1:1.1;--_typography---line-height--1-2:1.2;--_typography---font-weight--900:900;--_typography---letter-spacing--0-02:-.02em;--_spacing---spacing-primitives--0:0px;--_spacing---spacing-primitives--8px:8px;--_spacing---section-padding--padding-regular:64px;--_spacing---spacing-primitives--64px:64px;--_spacing---spacing-primitives--32px:32px;--_spacing---spacing-primitives--28px:28px;--_spacing---spacing-primitives--24px:24px;--_spacing---spacing-primitives--40px:40px;--_spacing---spacing-primitives--16px:16px;--_spacing---spacing-primitives--12px:12px;--_spacing---spacing-primitives--20px:20px;--_spacing---spacing-primitives--4px:4px;--_spacing---spacing-semantics--spacing-3xl:var(--_spacing---spacing-primitives--20px);--_spacing---spacing-primitives--52px:52px;--_spacing---border-radious--lg:16px;--_spacing---border-radious--xl:32px;--_spacing---spacing-semantics--spacing-8xl:var(--_spacing---spacing-primitives--32px);--_spacing---spacing-semantics--spacing-xs:var(--_spacing---spacing-primitives--12px);--_spacing---spacing-primitives--44px:44px;--_spacing---spacing-semantics--spacing-md:var(--_spacing---spacing-primitives--16px);--_spacing---border-radious--full:100%;--_spacing---spacing-semantics--spacing-xl:var(--_spacing---spacing-primitives--20px);--_spacing---border-radious--sm:12px;--_spacing---spacing-primitives--80px:80px;--_spacing---spacing-primitives--60px:60px;--_spacing---spacing-semantics--spacing-7xl:var(--_spacing---spacing-primitives--32px);--_spacing---spacing-primitives--100px:100px;--_spacing---spacing-primitives--48px:48px;--_spacing---spacing-semantics--spacing-sm:var(--_spacing---spacing-primitives--16px);--_spacing---border-radious--showreel-video-radius:16px;--_spacing---border-radious--999:999px;--_spacing---spacing--12px\<deleted\|variable-f7fbc2ae-f10d-aa16-7bf7-2f0ebd5c8e25\>:12px;--_spacing---spacing--0px\<deleted\|variable-bf0d4080-7243-f69d-3393-6c852d876a5b\>:0px;--_spacing---spacing-semantics--spacing-5xl:var(--_spacing---spacing-primitives--24px);--_spacing---border-radious--md:16px;--_spacing---spacing-primitives--36px:36px;--_spacing---spacing-primitives--76px:76px;--_spacing---spacing-primitives--120px:120px;--_spacing---spacing-semantics--72px\<deleted\|variable-64ec9391-7cce-5908-3750-a41948f4ed7c\>:72px;--_spacing---spacing-primitives--56px:0px;--_spacing---spacing-primitives--68px:68px;--_spacing---spacing-primitives--72px:72px;--_spacing---spacing-semantics--spacing-lg:var(--_spacing---spacing-primitives--28px);--_spacing---spacing-semantics--spacing-2xl:var(--_spacing---spacing-primitives--20px);--_spacing---spacing-semantics--spacing-4xl:var(--_spacing---spacing-primitives--44px);--_spacing---spacing-semantics--spacing-6xl:var(--_spacing---spacing-primitives--32px);--_spacing---spacing-semantics--spacing-9xl:var(--_spacing---spacing-primitives--36px)}.hero_section{padding-bottom:var(--_spacing---spacing-primitives--32px);flex-flow:column;justify-content:space-between;height:40rem;display:flex}.hero_heading{margin-bottom:var(--_spacing---spacing-primitives--28px)}.hero_content_wrapper{margin-bottom:var(--_spacing---spacing-primitives--32px);flex-flow:column}.hero_sub_title{text-align:center;flex:1;font-size:44px}.hero_info{text-align:center;flex:none}.hero_proof_area{grid-column-gap:var(--_spacing---spacing-primitives--24px);grid-row-gap:var(--_spacing---spacing-primitives--24px);flex-flow:column}.hero_image{background-image:linear-gradient(#0003,#0003),url(../images/hero-image.webp);background-position:0 0,45% 100%;background-repeat:repeat,no-repeat}.about_section{padding-top:64px}.year_wrapper{grid-column-gap:32px;grid-row-gap:32px}.step_item_inner{padding-top:var(--_spacing---spacing-primitives--44px);padding-bottom:var(--_spacing---spacing-primitives--44px)}.steps_wrapper,.work_item{grid-template-columns:1fr}.work_left_content{padding:var(--_spacing---spacing-primitives--32px)var(--_spacing---spacing-primitives--20px)}.work_right_content{padding:var(--_spacing---spacing-primitives--24px)}.service_item{padding-top:var(--_spacing---spacing-primitives--24px);padding-bottom:var(--_spacing---spacing-primitives--24px)}.service_item_inner{grid-column-gap:var(--_spacing---spacing-primitives--32px);grid-row-gap:var(--_spacing---spacing-primitives--32px)}.showreel_text._2{transform:translate(-15vw,-50%)}.showreel_text._1{transform:translate(15vw,-50%)}.showreel_video_button{width:60px}.button_line{width:20px}.brands_grid{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr}.brands_grid.absolute{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.brands_section{padding-top:38px}.brands_testimony_area{border-color:#ffffff52;padding:20px}.brands_testimony_text{margin-bottom:38px}.brands_testimony_author_content{padding-left:var(--_spacing---spacing-primitives--16px)}.brands_testimony_author_designation{font-size:16px}.brands_ticker_text,.brands_ticker_icon{margin-right:var(--_spacing---spacing-primitives--24px)}.leader_section{min-height:70vh}.leader_circle_item{width:80px;padding-bottom:131px}.leader_circle_image{border-radius:8px}.leader_section_badge{padding:var(--_spacing---spacing-primitives--8px)var(--_spacing---spacing-primitives--12px);top:-33px;left:9px;transform:rotate(-7deg)}.cta_section{flex-flow:column;justify-content:flex-start;align-items:center}.cta_button{padding:var(--_spacing---spacing-primitives--8px)var(--_spacing---spacing-primitives--8px)var(--_spacing---spacing-primitives--8px)var(--_spacing---spacing-primitives--16px);grid-column-gap:var(--_spacing---spacing-primitives--4px);grid-row-gap:var(--_spacing---spacing-primitives--4px)}.cta_button_arrow{width:28px}.cta_button_icon{width:12px}.cta_button_text{font-size:22px}.footer_links{grid-template-columns:1fr 1fr}.footer_address_text{max-width:none}.footer_top_wrapper{margin-bottom:var(--_spacing---spacing-primitives--64px);grid-row-gap:var(--_spacing---spacing-primitives--40px)}.footer_cta_input{padding-right:var(--_spacing---spacing-semantics--spacing-sm);padding-left:var(--_spacing---spacing-semantics--spacing-sm)}.footer_cta_submit_button{flex:1}.testimonial_author_image{width:48px}.testimonial_cards{grid-template-columns:1fr}.floating_text{display:none}.floating_text.is-testimony{top:-33px}.floating_text.is-work{top:3px;right:92px}.floating_text.is_service{top:56px;left:2px}.floating_text.is-about{position:relative;top:auto;right:auto}.floating_text.is-team{top:-33px}.showreel_video_icon_wrapper{max-width:24px}.year_text_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px)}.year_text_line{width:30px;height:6px}.scrolll-top{width:40px;height:40px;font-size:20px}.scrolll-top.mw--current{left:auto}.menu-icon-wrapper{grid-column-gap:5px;grid-row-gap:5px;width:20px}.menu-button{padding:11px}.nav_menu_wrapper{background-color:#fff}.hero_circle_secondary{background-image:linear-gradient(180deg,var(--white)30%,var(--vivid-orange));width:100vw}.about_stats_item{padding:var(--_spacing---spacing-primitives--20px)}.about_stats_grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.about_stats_image{display:none}.why_choose_section_header{padding-bottom:var(--_spacing---spacing-primitives--16px);flex-flow:column}.why_choose_section_info{grid-column-gap:var(--_spacing---spacing-primitives--8px);grid-row-gap:var(--_spacing---spacing-primitives--8px);max-width:none;margin-left:0}.why_choose_item{flex-basis:160px}.why_choose_item_sub_text{left:var(--_spacing---spacing-primitives--16px);right:var(--_spacing---spacing-primitives--16px)}.team_cards{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.award_number,.award_status{text-align:left}.award_item{grid-row-gap:var(--_spacing---spacing-primitives--12px);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.service_hero_circle{background-image:linear-gradient(180deg,var(--white)30%,var(--vivid-orange))}.service_hero_visual_image{width:60px;top:209px;right:15px}.scroll_indicatior{width:28px}.scroll_indicator_icon{max-width:12px}.project_ticker_icon{max-width:40px}.service_hero_title_span{width:75px}.project_tag{padding-right:var(--_spacing---spacing-primitives--12px);padding-left:var(--_spacing---spacing-primitives--12px)}.project_meta_area{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.project_single_fluid_image{aspect-ratio:2}.overview_items{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.image_showcase_wrapper{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.project_image_item._2{margin-top:var(--_spacing---spacing-primitives--0)}.result_content{grid-column-gap:var(--_spacing---spacing-primitives--32px);grid-row-gap:var(--_spacing---spacing-primitives--32px);flex-flow:column}.result_left_col{width:auto;max-width:none;position:static}.result_image_wrap{grid-column-gap:var(--_spacing---spacing-primitives--16px);grid-row-gap:var(--_spacing---spacing-primitives--16px);width:auto;max-width:none}.result_image{position:static}.project_listing{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.blog_item_inner{flex-flow:column;justify-content:space-between;align-items:flex-start}.blog_item_right{width:100%;max-width:none}.blog_image{aspect-ratio:3/2}.contact_heading{margin-bottom:var(--_spacing---spacing-primitives--40px)}.contact_form_input{padding:var(--_spacing---spacing-primitives--16px);height:54px}.contact_form_input.is-textarea{height:140px}.contact_form_input_wrapper{grid-template-columns:1fr}.error_number_logo{max-width:260px}.canvas_menu_link{padding-top:var(--_spacing---spacing-primitives--24px)}.canvas_menu_wrapper{flex:1}.canvas_menu_bottom{grid-column-gap:var(--_spacing---spacing-primitives--40px);grid-row-gap:var(--_spacing---spacing-primitives--16px);flex:none;grid-template-rows:auto auto;grid-template-columns:1fr 1fr;grid-auto-columns:1fr;justify-content:center;align-items:flex-end}.hamburger_menu_icon{right:0;transform:scale(.8)}.hamburger_menu_icon.is-close{transform-origin:100% 0}.about_hero_title_span{width:75px}.utility_single_block{grid-column-gap:var(--_spacing---spacing-primitives--20px);grid-row-gap:var(--_spacing---spacing-primitives--20px);flex-flow:column}.utility_single_colors{grid-template-columns:1fr}.life_images{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b51ed-2b3b50f7{grid-area:2/-3/2/13}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5202-2b3b50f7{grid-area:4/5/10/15}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520a-2b3b50f7{grid-area:2/4/4/6}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520c-2b3b50f7{grid-area:11/2/9/4}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520e-2b3b50f7{grid-area:3/15/5/17}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5210-2b3b50f7{grid-area:3/21/5/19}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5212-2b3b50f7{grid-area:6/17/8/19}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5214-2b3b50f7{grid-area:8/20/10/22}#mw-node-_6556c43b-3823-239a-7ef2-acd9d7fe0052-9b82cdc2{grid-area:span 2/span 1/span 2/span 1}#mw-node-c7e43307-1ff5-9643-b5b6-c65289e341d0-9b82cdc2,#mw-node-_6e3493aa-a963-9105-8a86-beaad92f76e6-9b82cdc2,#mw-node-_86937463-c157-a42c-9acf-4f7b47e6e76d-9b82cdc2,#mw-node-_3d7b5d98-a7ec-d8d5-eca9-fc43f60ffa6e-9b82cdc2,#mw-node-_1ac61769-56b8-91fa-8ecc-288875b1276e-ba918670{justify-self:center}#mw-node-b86c6ad8-2dba-7347-8e90-25275f21903c-f864df35,#mw-node-d470ade0-a311-6508-2ec2-7869df86e2a6-f864df35{grid-area:span 1/span 2/span 1/span 2}@media screen and (min-width:1920px){#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b51ec-2b3b50f7{grid-column-start:-2147483648}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b51ed-2b3b50f7{grid-column:-3/13;grid-row-start:2}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5202-2b3b50f7{grid-area:5/6/10/13}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520a-2b3b50f7{grid-row:3/5;grid-column-start:4}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520c-2b3b50f7{grid-column:3/5}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520e-2b3b50f7{grid-area:4/13/6/15}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5210-2b3b50f7{grid-row:4/6}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5212-2b3b50f7{grid-area:7/15/9/17}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5214-2b3b50f7{grid-area:11/18/9/20}#mw-node-_1ac61769-56b8-91fa-8ecc-288875b1276e-ba918670{justify-self:auto}}@media screen and (min-width:1440px){#mw-node-_1ac61769-56b8-91fa-8ecc-288875b1276e-ba918670{justify-self:center}}@media screen and (max-width:991px){#mw-node-dddde0e5-8462-f20e-9113-b8873652cd8e-3652cd50{grid-area:2/1/3/2}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b51ed-2b3b50f7{grid-column-end:2}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5202-2b3b50f7{grid-column:5/11;grid-row-end:8}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520a-2b3b50f7{grid-area:15/7/17/9}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520c-2b3b50f7{grid-area:8/2/11/5}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520e-2b3b50f7{grid-area:10/8/13/11}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5210-2b3b50f7{grid-area:18/10/20/12}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5212-2b3b50f7{grid-area:12/4/14/6}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5214-2b3b50f7{grid-area:17/2/22/5}#mw-node-_3c266309-132e-43c1-a7bb-7450a6c79c28-9b82cdc2{grid-area:2/1/3/2}#mw-node-_0e110d96-798d-5630-7c9a-44a157a7c511-ba918670{grid-area:span 1/span 3/span 1/span 3;justify-self:start}#mw-node-_1ac61769-56b8-91fa-8ecc-288875b1276e-ba918670{justify-self:auto}}@media screen and (max-width:767px){#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276aca-ac276ac6{grid-area:3/1/4/4}#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276ad4-ac276ac6{grid-area:1/1/3/2}#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276ae0-ac276ac6{grid-area:1/2/3/3}#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276aec-ac276ac6{grid-area:1/3/3/4}#mw-node-dddde0e5-8462-f20e-9113-b8873652cd8e-3652cd50,#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b51ec-2b3b50f7{grid-area:span 1/span 1/span 1/span 1}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b51ed-2b3b50f7,#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5202-2b3b50f7{grid-area:span 1/span 4/span 1/span 4}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520a-2b3b50f7{grid-area:span 2/span 1/span 2/span 1}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520c-2b3b50f7{grid-area:span 1/span 1/span 1/span 1}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520e-2b3b50f7{grid-area:3/3/5/4}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5210-2b3b50f7{grid-area:span 1/span 1/span 1/span 1}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5212-2b3b50f7{grid-area:4/2/5/3}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5214-2b3b50f7{grid-area:4/4/5/5}#mw-node-_6556c43b-3823-239a-7ef2-acd9d7fe0052-9b82cdc2{grid-area:span 1/span 2/span 1/span 2}#mw-node-_3c266309-132e-43c1-a7bb-7450a6c79c28-9b82cdc2{grid-area:span 1/span 1/span 1/span 1}#mw-node-_0e110d96-798d-5630-7c9a-44a157a7c511-ba918670{grid-column:span 2/span 2}}@media screen and (max-width:479px){#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276aca-ac276ac6{grid-area:span 1/span 2/span 1/span 2}#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276ad4-ac276ac6,#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276ae0-ac276ac6,#mw-node-acf3e24e-2686-e8fa-9eb0-72f3ac276aec-ac276ac6{grid-area:span 1/span 1/span 1/span 1}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b51ed-2b3b50f7,#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5202-2b3b50f7{grid-area:span 1/span 2/span 1/span 2}#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520c-2b3b50f7,#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b520e-2b3b50f7,#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5210-2b3b50f7,#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5212-2b3b50f7,#mw-node-_1def5633-bbe5-f8fb-0cf8-29d12b3b5214-2b3b50f7{grid-area:span 2/span 1/span 2/span 1}#mw-node-_6556c43b-3823-239a-7ef2-acd9d7fe0052-9b82cdc2{grid-column:span 1/span 1}#mw-node-c7e43307-1ff5-9643-b5b6-c65289e341d0-9b82cdc2,#mw-node-c7e43307-1ff5-9643-b5b6-c65289e341d2-9b82cdc2,#mw-node-_6e3493aa-a963-9105-8a86-beaad92f76e6-9b82cdc2,#mw-node-_6e3493aa-a963-9105-8a86-beaad92f76e8-9b82cdc2,#mw-node-_86937463-c157-a42c-9acf-4f7b47e6e76d-9b82cdc2,#mw-node-_86937463-c157-a42c-9acf-4f7b47e6e76f-9b82cdc2,#mw-node-_3d7b5d98-a7ec-d8d5-eca9-fc43f60ffa6e-9b82cdc2,#mw-node-_3d7b5d98-a7ec-d8d5-eca9-fc43f60ffa70-9b82cdc2{justify-self:auto}#mw-node-_0e110d96-798d-5630-7c9a-44a157a7c511-ba918670,#mw-node-b86c6ad8-2dba-7347-8e90-25275f21903c-f864df35,#mw-node-d470ade0-a311-6508-2ec2-7869df86e2a6-f864df35{grid-column:span 1/span 1}}

/* === Penyesuaian footer (situs dipangkas jadi 5 halaman) ===
   Footer aslinya 4 kolom (Contact, Pages, Pages, utilities); sekarang 2.

   DESKTOP (>=992px): .footer_links memakai display:flex + space-between.
   Dengan 2 anak, keduanya terlempar ke ujung berlawanan dan menyisakan lubang
   ~475px. Diperbaiki dengan mengelompokkan kolom link di kiri, lalu newsletter
   didorong ke kanan lewat .footer_top_wrapper.

   <=991px: .footer_links beralih ke display:grid, dan di sinilah aturan
   #mw-node-... milik MwRuntime ikut aktif. Penempatannya dipatok untuk layout
   4 kolom yang lama -- Pages di grid-area 1/1/3/2 dan Contact di 3/1/4/4 --
   sehingga Pages tampil DI ATAS Contact (terbalik dari desktop) dan menyisakan
   ruang kosong lebar di kanan. grid-area:auto mengembalikannya ke urutan DOM.
   !important dipakai karena selektor #mw-node-... adalah ID (spesifisitas 100)
   dan tidak bisa dikalahkan selektor class biasa. */
.footer_links {
  flex: 0 1 auto;
  justify-content: flex-start;
}

.footer_top_wrapper {
  justify-content: space-between;
}

@media screen and (max-width: 991px) {
  .footer_links { grid-template-columns: 1fr 1fr; }
  .footer_links > .footer_link_col { grid-area: auto !important; }
}

@media screen and (max-width: 767px) {
  .footer_links { grid-template-columns: 1fr 1fr; }
}

@media screen and (max-width: 479px) {
  .footer_links { grid-template-columns: 1fr; }
}

/* === Hero: video scroll-scrub perakitan MacBook =========================
   videos/hero-assembly.mp4 (10 detik, generate ke-7 -- yang di-ACC client
   -- via xAI grok-imagine-video-1.5 dari images/hero-daynight-day.jpg
   sebagai reference frame, lihat riwayat percakapan kalau butuh prompt
   persisnya): mulai dari mound kosong di siang hari, RAM terbang masuk
   dari pojok kanan atas, motherboard nyusul dari kiri bawah dan nge-KLIK
   nyatu, lid ber-logo Apple menutup flush jadi satu laptop tertutup solid
   di atas mound, lalu lid membuka pelan di engsel belakang seperti orang
   membuka laptop beneran dan layar astronot berakhir menghadap lurus ke
   kamera (sama dengan images/macbook-3d-source-v2.jpg). Landscape/mound
   TETAP STATIS sepanjang video (reference image itu yang menjaganya).
   CATATAN: ada logo Apple asli di lid (permintaan client, resiko trademark
   sudah disampaikan); artefak minor sisiran hijau tepi motherboard sedikit
   nongol di kolong laptop -- client sudah lihat dan ACC.

   POSTER = images/hero-assembly-poster.jpg, frame TERAKHIR video ini
   (laptop sudah terbuka penuh, layar astronot terlihat) -- BUKAN foto
   mound kosong seperti sebelumnya. Alasannya: js/hero-scrub.js memang
   sengaja tidak memuat video sama sekali di <768px (lihat guard isDesktop
   di file itu), jadi di mobile poster INI yang PERMANEN tampil, bukan
   cuma placeholder sebentar -- kalau posternya foto mound kosong, mobile
   tidak akan pernah kelihatan laptopnya sama sekali. Di desktop dampaknya
   cuma sekilas (poster tampil sepersekian detik sebelum video ambil alih,
   dan itu pun ketutup preloader ~2.4 detik di awal -- lihat komentar
   stagger teks hero di bawah), jadi aman dipakai sama untuk kedua mode.

   Riwayat 7 percobaan (v1/v2/v3/v4 di backup/videos/): v1 komposisi paling
   disukai client tapi part ngambang tidak menempel & buka layar tidak
   fisikal; v2 warna body berubah-ubah + transisi buka teleport; v3
   geometri buka benar tapi slab dobel di bawah laptop; v4 = v1 + perbaikan
   tapi wording-nya dirombak kebanyakan sehingga gaya visualnya melenceng
   dari v1 yang disukai; v5/v6 choreography 3-part (base+motherboard satu
   piece) -- v5 posisi drift + warna geser, v6 hampir benar tapi client
   tetap prefer alur v1. v7 final = prompt v1 KATA-PER-KATA + sisipan
   minimal di dua titik saja ("snapping into it with a firm click...
   fused into one solid unified body" + "rotating slowly and gently on its
   rear hinge... facing directly toward the camera"). Pelajaran utama:
   wording prompt menentukan GAYA visual, bukan cuma isi instruksi --
   prompt yang hasilnya sudah disukai jangan pernah dirombak strukturnya,
   sisipkan frasa perbaikan sekecil mungkin di titik masalahnya saja.

   Konsep hero ini sendiri juga ganti dari 2 iterasi sebelumnya (lihat
   riwayat git/percakapan kalau butuh detail): (1) video siang-sore-malam
   murni tanpa laptop, (2) laptop dirakit lewat animasi CSS/JS dari
   potongan gambar 2D (W/A/S/D dst) -- client kurang suka hasil animasi
   CSS-nya, jadi diganti video AI utuh ini. Kode animasi CSS/JS itu
   DIPINDAH ke backup/js/hero-assembly.js (bukan dihapus, sewaktu-waktu
   bisa dipakai lagi) -- markup & <script> pemanggilnya sudah dicabut dari
   index.html, jadi tidak jalan lagi sekarang. Video 15 detik
   siang-sore-malam yang lama juga dipindah ke backup/videos/hero-daynight.mp4.

   Diputar lewat currentTime yang disetir posisi scroll (bukan autoplay),
   logic-nya di js/hero-scrub.js -- pola yang sama persis dengan video hero
   sebelumnya (seek serialization, resync tab visibility, dst), TANPA logic
   gating headline (video ini tidak punya "momen" narasi yang perlu ditunggu,
   jadi headline pakai reveal default situs seperti biasa).

   ENCODING: sumber asli 1280x720 h264 24fps dari xAI, di-upscale ke 1600x900
   (lanczos) lalu di-encode ulang all-intra (-g 1, crf 23) -- teknik yang
   sama dengan video hero sebelumnya, supaya seek pas discroll cepat tidak
   perlu dekode dari keyframe jauh sebelumnya.

   Latar section tetap midnight blue (#10192B) dengan radial-gradient gold
   tipis di bawah -- terlihat di balik video sebelum videonya termuat, dan
   di celah `cover` kalau rasio viewport tidak pas. */
.hero_section {
  background-color: #10192B;
  background-image:
    radial-gradient(120% 90% at 50% 100%, rgba(201, 166, 107, 0.28) 0%, rgba(16, 25, 43, 0) 70%);
}

.hero_image {
  background-image: none;
  overflow: clip;
}

/* Overlay gelap tipis MERATA di seluruh foto -- bukan band warna solid
   (itu yang bikin komposisi kepotong dan sudah ditolak sebelumnya), bukan
   juga gradient yang cuma nge-gelapin sebagian (foto kadang terang
   justru di area teks). Tint rata #10192B (warna dasar section sendiri)
   opacity rendah di ::after, di atas .hero_slides (DOM-nya duluan, jadi
   ::after otomatis nge-paint di atasnya) dan di bawah teks (yang punya
   z-index:1, .hero_image sendiri tidak). Efek sampingan yang disengaja:
   sekalian mempertegas kesan "cinematic" yang sudah jadi bagian brand. */
.hero_image::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(16, 25, 43, 0.32);
  pointer-events: none;
}

/* === Hero: Standbild statt Video, NICHT gepinnt =========================
   Kurzzeitig lief hier ein scroll-gescrubbtes Video (laptop-anim: alle
   Gegenstaende heben ab und schweben nach oben). Zurueckgebaut, weil die
   Quelle nur 784x384 gross war -- der Hero zeigt sie full-bleed auf rund
   1837px Breite, also 2,3x hochskaliert (auf Retina 4,7x). Das Ergebnis
   war sichtbar matschig, und das lag NICHT am Encoding: die Messung gegen
   einen verlustfreien Upscale ergab SSIM 0,985, der Encoder verliert also
   praktisch nichts. Es fehlten schlicht die Pixel.

   images/laptop.jpg ist mit 2000x992 gross genug -- im Hero wird es sogar
   leicht VERKLEINERT (0,92x) und ist damit garantiert scharf.

   Ein Standbild braucht keinen Scroll-Fortschritt, deshalb ist der Pin
   (.hero_track 300vh + sticky .hero_section) wieder raus: 200vh Scrollweg
   ohne jede Veraenderung waeren nur zaeh.

   Die Scrub-Mechanik ist nicht verloren -- js/hero-scrub.js liegt unter
   backup/js/. Zum Reaktivieren braucht es dreierlei: dieses <img> wieder
   durch das <video data-scroll-scrub> ersetzen, den Pin-Block hier
   zurueckholen (siehe git history) und das Script wieder einbinden.
   Voraussetzung dafuer ist aber eine Videoquelle mit mindestens 1920px
   Breite, sonst wiederholt sich exakt dasselbe Problem. */

/* === Hero-Showcase: drei Projekte, Wipe-Uebergang ======================
   1.jpg/2.jpg/3.jpg zeigen Wuestenrot, Mehragentur und Pecuria -- dieselben
   drei Projekte wie im Work-Deck weiter unten. Der Laptop steht in allen
   drei Aufnahmen an derselben Stelle, nur Bildschirminhalt und Farbwelt
   des Raums wechseln (orange / blau / gruen).

   Der Uebergang laeuft in WebGL (js/hero-showcase.js), nicht in CSS: die
   Bilder werden dabei pro Pixel entlang eines Rauschfeldes verzogen, das
   eine liesse sich mit clip-path/opacity nicht nachbauen. Gefahren wird
   er vom Scroll der gepinnten Section, nicht von einem Timer -- der
   Besucher steuert den Wechsel selbst.

   Hier stehen nur Ausgangs- und Fallback-Zustaende; alles Bewegte setzt
   das Script inline, damit sich beide Seiten nicht gegenseitig
   ueberschreiben. */
.hero_slides {
  position: absolute;
  inset: 0;
  overflow: clip;
}

.hero_slide {
  /* erbt position:absolute/inset:0/object-fit:cover von .hero_video */
  opacity: 0;
  will-change: opacity;
}

/* Ohne JS (und vor dem ersten Frame) ist das erste Projekt vollstaendig
   sichtbar -- sonst zeigt der Hero nur Leere. */
.hero_slide.is-active {
  opacity: 1;
}

.hero_slides_canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
}

/* Sobald WebGL laeuft, zeichnet die Canvas alle drei Projekte -- die
   <img> bleiben im DOM (Fallback, Alt-Texte, Ladequelle der Texturen),
   duerfen aber nicht mehr durchscheinen. */
.hero_slides.is-webgl .hero_slide {
  opacity: 0 !important;
}

.hero_slides:not(.is-webgl) .hero_slides_canvas {
  display: none;
}

/* === Hero: fuer den Scroll-Uebergang gepinnt ============================
   Der Bildwechsel haengt am Scroll-Fortschritt, also braucht die Section
   Strecke: .hero_track hoch + .hero_section sticky. 400vh = 300vh echter
   Scrollweg fuer zwei Uebergaenge plus drei Haltezonen (Fahrplan siehe
   WINDOWS in js/hero-showcase.js).

   Bewusst OHNE Breakpoint -- gilt fuer alle Groessen, auch Mobile. War
   vorher auf >=768px begrenzt (Performance-Vorsicht bei WebGL auf
   schwacher Hardware); auf expliziten Wunsch entfernt, siehe
   js/hero-showcase.js fuer den zugehoerigen Wegfall des Mobile-Guards.

   Nebenwirkung, die dabei bewusst in Kauf genommen wurde: height:100vh
   auf schmalen/hohen Handy-Viewports croppt die 2,02:1-Bilder haerter als
   am Desktop -- gemessen an einem 390x844-Viewport sinkt der sichtbare
   Bildausschnitt von ~31% (vorheriger Fixed-640px-Zustand ohne Pin) auf
   ~23% Bildbreite. Der Pin BRAUCHT aber eine Section mit fester,
   viewport-basierter Hoehe, sonst kann progressFor() in
   js/hero-showcase.js keinen sauberen 0..1-Scrollfortschritt berechnen. */
/* Preloader: Webflow 100vw/100vh verschiebt MEHRWEB auf iPhone
   (breiter/hoeher als der sichtbare Screen). 100svh = sichtbare Mitte. */
.preloader {
  inset: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  height: 100svh;
}

/* Kein Seitwaerts-Pan auf iPhone.
   Webflow setzt .canvas_menu auf 100vw (breiter als der sichtbare Screen)
   und html/body auf overflow sichtbar. Zusammen kann man die ganze Seite
   nach links/rechts schieben — auch dort, wo nichts Horizontales sein soll.
   overflow-x:clip statt hidden, damit position:sticky (Hero-Pin) bleibt. */
html {
  overflow-x: clip;
  overscroll-behavior-x: none;
}
.canvas_menu {
  width: auto;
  max-width: 100%;
}

.hero_track {
  position: relative;
  height: 400vh;
}

.hero_track .hero_section {
  position: sticky;
  top: 0;
  height: 100vh;
  /* Layout bleibt 100svh (Toolbar ausgeklappt, konstant). 100dvh wuerde
     der Safari-Leiste live folgen: sticky Section waechst/schrumpft,
     Pin und Scroll-Fortschritt springen. */
  height: 100svh;
}

/* iPhone-Streifen-Fix erst NACH dem Intro. Waehrend des Preloaders muss
   overflow:clip (Webflow) und normale Bildhoehe bleiben — sonst laeuft
   das 100lvh-Bild unter dem 100vh-Cover raus, besonders mobil. */
html.mw-preloader-ready .hero_track {
  padding-bottom: calc(100lvh - 100svh);
  background-color: #10192B;
}
html.mw-preloader-ready .hero_track .hero_section {
  overflow: visible;
}
html.mw-preloader-ready .hero_track .hero_image {
  top: 0;
  right: 0;
  left: 0;
  bottom: auto;
  height: 100%;
  height: 100lvh;
}

/* Das Ausblenden der Hero-Texte setzt das Script per inline-opacity; hier
   nur der weiche Uebergang, sonst wirkt es bei jedem Scroll-Tick
   gestuft. */
.hero_heading,
.hero_content_wrapper {
  transition: opacity 0.15s linear;
}

/* Die 100vh-Hoehe der Section steckt oben im Pin-Block und ist nicht nur
   Formsache: waechst .hero_section im normalen Fluss auf ~1270px, dann
   skaliert object-fit:cover die 2,02:1-Bilder auf die Breite und
   schneidet links/rechts so viel weg, dass vom Schreibtisch nur noch der
   Laptop-Bildschirm uebrig bleibt -- Pflanzen, Tasse, Lampe waeren aus
   dem Bild. Bei 100vh (1440x900 = 1,6:1) bleiben rund 90% der Bildbreite
   stehen. Dieselbe Rechnung macht der Shader in uv-Koordinaten nach. */

/* === Hero: Gap Headline → Subtitle knapper ==============================
   Webflow-Basis: .hero_heading { margin-bottom: 180px } (>=992px), zuerst
   auf 96px reduziert (kurze Laptop-Viewports, dritte Zeile "Agentur" ragte
   sonst unter den Viewport-Rand). .hero_content_wrapper blieb dabei
   unangetastet bei satten 250px.
   Runde 2: Nutzer-Feedback "posisinya jelek" -- Headline und Subtitle/
   Beschreibung wirkten wie zwei unabhaengige, zufaellig auf dem Bild
   verteilte Elemente statt EINER zusammenhaengenden Komposition. Beide
   Luecken nochmal deutlich verkleinert, damit der Textblock als Ganzes
   gelesen wird. Gilt jetzt auch fuer 768-991px (vorher dort sogar 230px --
   groesser als der alte Desktop-Wert, offensichtlich ein Ueberbleibsel). */
@media screen and (min-width: 768px) {
  .hero_heading {
    margin-bottom: 32px;
  }
  .hero_content_wrapper {
    margin-bottom: 48px;
  }

  /* Nur der Endtext: links oben. Subtitle bleibt unten links unangetastet. */
  .hero_section > .hero_info {
    position: absolute;
    top: clamp(5.5rem, 12vh, 8rem);
    left: var(--_layout---padding-global);
    z-index: 2;
    max-width: min(28rem, 40vw);
    margin: 0;
    text-align: left;
  }
}

/* === Hero: Subjudul + Beschreibung Font -- zurueckgesetzt ===============
   Kurzer Versuch: Body-Font (DM Sans) statt Heading-Font (Bebasneue) fuer
   .hero_sub_title/.hero_info, plus text-transform:none gegen die
   Grossbuchstaben. Nutzer wollte die alte Optik zurueck -- Basis-CSS
   (Bebasneue + uppercase) greift jetzt wieder unveraendert, keine
   Override-Regel mehr noetig. */

/* === Hero-Texte: Startzustand für Scroll-Scrub (Desktop) ==============
   Ein-/Ausblenden steuert js/hero-text-scrub.js am Video-Progress.
   Frühe Hide-Regel liegt auch inline in index.html <head> (gegen Flash
   sobald mw-mod-ix3 die globale visibility-Regel aufhebt).
   Wörter nowrap: SplitText-Chars sonst brechen mitten im Wort um. */
@media screen and (min-width: 768px) {
  html.mw-mod-js:not(.mw-hero-text-scrub-on) [data-hero-title],
  html.mw-mod-js:not(.mw-hero-text-scrub-on) [data-hero-subtitle],
  html.mw-mod-js:not(.mw-hero-text-scrub-on) [data-hero-text] {
    visibility: hidden !important;
  }

  html.mw-hero-text-scrub [data-hero-title],
  html.mw-hero-text-scrub [data-hero-subtitle],
  html.mw-hero-text-scrub [data-hero-text] {
    transition: none !important;
  }

  html.mw-hero-text-scrub [data-hero-title] .gsap_split_word,
  html.mw-hero-text-scrub [data-hero-subtitle] .gsap_split_word,
  html.mw-hero-text-scrub [data-hero-text] .gsap_split_word {
    display: inline-block;
    white-space: nowrap;
  }
}

.hero_video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* sumber 16:9, slot hero jauh lebih tinggi dari itu -- `cover` selalu
     dibatasi lebar (crop kiri-kanan), nyaris tidak ada slack vertikal buat
     digeser, jadi posisi tengah polos sudah pas (mound tetap di tengah
     frame sepanjang video) */
  object-position: center;
  pointer-events: none;
}

/* === [NONAKTIF] Perakitan MacBook dari potongan gambar 2D ===============
   TIDAK DIPAKAI LAGI -- client kurang suka hasilnya, diganti video AI utuh
   (lihat komentar videos/hero-assembly.mp4 di atas). js/hero-assembly.js
   yang memanggil class-class ini sudah dipindah ke backup/js/hero-assembly.js
   dan <script>-nya dicabut dari index.html, jadi aturan di bawah ini
   sekarang TIDAK PERNAH aktif (tidak ada elemen yang pakai class-nya lagi).
   Sengaja TIDAK dihapus dari sini -- disimpan siapa tahu perlu dipakai lagi.

   Catatan asli waktu masih dipakai: ganti pendekatan render 3D WebGL
   (dicoba lebih dulu, juga kurang sreg) dengan animasi "exploded assembly"
   murni CSS/JS -- badan bawah laptop naik dari bawah frame, tombol W/A/S/D
   masing-masing zoom ke tengah layar dulu baru terbang terpasang ke
   keyboard, lalu panel layar terbang terpasang terakhir, semua presisi
   karena dihitung angka (bukan ditebak AI video).

   .hero_assembly cuma wrapper inset:0 (z-index 2, di atas .hero_heading
   yang z-index:1) -- posisi & ukuran TIAP potongan diatur langsung lewat
   inline style dari JS (left/top/width dalam px, dihitung dari vh/vw viewport
   saat itu), bukan dari CSS, karena tiap potongan punya lintasan animasi
   sendiri-sendiri (diam di bawah -> naik; nge-zoom di tengah -> terbang ke
   posisi akhir; dst) yang tidak bisa diekspresikan sebagai satu aturan CSS
   statis. Baseline di sini cuma nilai AWAL sebelum JS sempat jalan. */
.hero_assembly {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.hero_assembly_piece {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  will-change: transform, opacity, left, top, width;
}

/* Belum ada versi mobile -- lihat guard di js/hero-assembly.js, animasi
   ini sengaja cuma jalan >=768px (WASD assembly ini murni dekoratif,
   sepadan dengan video-scrub yang juga desktop-only). Di mobile piece-piece
   ini permanen opacity:0 dari baseline di atas, tidak pernah dimunculkan. */

/* scrim gelap di atas video -- headline besar butuh kontras yang stabil di
   segala breakpoint dan segala titik scrub, bukan cuma satu frame. */
.hero_image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(16, 25, 43, 0.88) 0%, rgba(16, 25, 43, 0.62) 30%, rgba(16, 25, 43, 0.15) 50%, rgba(16, 25, 43, 0) 62%);
}


/* === Logo klien pada strip hitam ===
   images/logo/*.png adalah logo klien asli. Empat dari enam berwarna gelap
   (6.png hitam murni) sedangkan .brands_section berlatar #000, jadi tanpa
   penyesuaian keempatnya tidak terlihat sama sekali.

   Dinormalkan jadi siluet putih lewat filter, bukan dengan mengedit filenya,
   supaya berkas aslinya tetap utuh dan bisa dipakai di tempat lain. Ini juga
   yang dilakukan template aslinya, yang memakai logo SVG putih. */
.brand_logo {
  filter: brightness(0) invert(1);
  opacity: 0.72;
  object-fit: contain;
  transition: opacity 0.3s ease;
}

.brand_logo_wrapper:hover .brand_logo {
  opacity: 1;
}

/* Logo-Swap in brands-section.js: kurzes Fade statt hartem Bildwechsel */
.brand_logo_wrapper .brand_logo {
  will-change: opacity;
}

@media (prefers-reduced-motion: reduce) {
  .brand_logo_wrapper .brand_logo {
    will-change: auto;
  }
}

/* === Lingkaran logo klien "Vertraut von Marken" ===
   Kartu diputar GSAP ScrollTrigger dan sudutnya BERUBAH saat scroll (terukur
   102,9 / 138,9 / 174,9 ... dan terus naik), jadi rotasi tidak bisa dipanggang
   ke file gambar -- logo hanya akan tegak di satu posisi scroll.

   Geometri terukur: .leader_circle_item adalah batang 201x518 (padding-bottom
   menahan kartu di tepi lingkaran); kartu yang terlihat adalah <img> 201x201 di
   ujung atasnya. Karena itu warna digambar oleh ::before hanya seukuran kotak
   itu -- memberi warna ke batangnya akan mewarnai seluruh kelopak 518px.

   Logo lalu diputar balik oleh js/leader-upright.js mengikuti sudut kartunya.
   Kotak tetap miring, logo tetap tegak. */
.leader_circle_item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: var(--_spacing---border-radious--lg);
  z-index: 0;
}

.leader_circle_item::before { background-color: #1C1C1E; }
.leader_circle_item._2::before { background-color: #C9A66B; }
.leader_circle_item._3::before { background-color: #10192B; }
.leader_circle_item._4::before { background-color: #E4D9C3; }
.leader_circle_item._5::before { background-color: #8B6D3F; }
.leader_circle_item._6::before { background-color: #FAF7F0; }
.leader_circle_item._7::before { background-color: #232326; }
.leader_circle_item._8::before { background-color: #C9B98C; }
.leader_circle_item._9::before { background-color: #16233D; }
.leader_circle_item._10::before { background-color: #F0E6D2; }

.leader_circle_image {
  position: relative;
  z-index: 1;
  object-fit: contain !important;
  padding: 21%;
  background: transparent;
  will-change: transform;
}

@media screen and (max-width: 991px) {
  .leader_circle_image { padding: 19%; }
}

@media screen and (max-width: 767px) {
  .leader_circle_image { padding: 17%; }
}


/* === Kontras ticker projects ===
   Rebrand luxury: --vivid-orange sekarang #C9A66B (champagne gold), latar
   yang jauh lebih terang dari ungu lama. Putih di atasnya cuma ~2,3:1 --
   di bawah ambang 3,0. Hitam (--black-secondary) menghasilkan ~8,2:1, jadi
   teks dikembalikan ke gelap seperti versi oranye asli template. */
.project_ticker_title {
  color: var(--black-secondary);
}


/* === Teks showreel di atas video ===
   Rebrand luxury: video ungu diganti pita cahaya gold mengalir di ruang
   kaca anthracite (videos/showreel-gold.mp4/.webm, digenerate lewat xAI
   grok-imagine-video-1.5). Latar didominasi anthracite gelap, jadi kontras
   membaik dibanding versi ungu -- tapi pita gold tetap sesekali lewat
   tepat di belakang teks. Sampel piksel di area teks: putih menghasilkan
   ~13,9:1 saat latar gelap dan turun ke ~2,9:1 saat pita gold paling
   terang lewat -- masih di bawah ambang 3,0 untuk teks besar, tapi jauh
   lebih baik dari versi ungu (2,32:1) dan tetap opsi terbaik yang ada;
   warna gelap akan gagal total di 90%+ frame lainnya. */
.showreel_text {
  color: #ffffff;
}

/* === Rasio kartu proyek ===============================================
   Template aslinya memakai aspect-ratio:1 karena isinya render abstrak yang
   memang persegi. Isi sekarang adalah tangkapan layar situs -- 16:10. Memaksa
   bentuk itu ke dalam kotak berarti salah satu dari dua: memotong sepertiga
   lebar layout, atau menempelkan latar untuk mengisi sisa ruang.

   Slotnya disamakan dengan gambarnya, jadi tidak ada latar yang perlu diisi
   dan tidak ada bagian layout yang hilang. .image-cover tetap object-fit:cover,
   dan karena rasio kotak sama persis dengan rasio berkas, tidak ada pemotongan.

   Dua selektor: .project_image di halaman Projekte, .work_image_visual di deck
   beranda. Keduanya memakai berkas gambar yang sama. */
.project_image,
.work_image_visual {
  aspect-ratio: 8 / 5;
}

.work_image_visual {
  max-width: 640px;
  width: 100%;
}

/* Showcase-Screenshots: gleiches Slot-Verhaeltnis wie die anderen Work-Karten
   (sonst springt die Kartenhoehe im Deck). object-fit:contain haelt die volle
   Screenshot-Breite sichtbar; leere Raender fuellt die Kartenfarbe. */
.work_image_visual--screenshot {
  aspect-ratio: 8 / 5;
}

.work_image_visual--screenshot .image-showcase {
  object-fit: contain;
  object-position: center;
}

/* === "AUSGEWAEHLTE ARBEITEN": einheitliche Kartenhoehe ==================
   Absolute Stacking (inset:0 0 auto) liess jede Karte ihre eigene Content-
   Hoehe behalten — Textlaengen + abweichende Bild-Ratios wirkten unruhig.
   Ab Desktop liegen alle [data-deck-card] in derselben Grid-Zelle: die Zelle
   waechst auf die hoechste Karte, kuerzere strecken auf 100%. Button wandert
   per margin-top:auto nach unten. Mobile bleibt die normale Liste. */
@media screen and (min-width: 992px) {
  .work_items_wrapper {
    display: grid;
  }

  .work_collection_list_wrapper,
  .work_collection_list_wrapper._2,
  .work_collection_list_wrapper._3,
  .work_collection_list_wrapper._4,
  .work_collection_list_wrapper._5 {
    grid-area: 1 / 1;
    position: relative;
    inset: auto;
    width: 100%;
  }

  .work_collection_list_wrapper .mw-dyn-items,
  .work_collection_list_wrapper .work_item {
    height: 100%;
  }

  .work_left_content,
  .work_right_content {
    height: 100%;
    box-sizing: border-box;
  }

  .work_left_content {
    justify-content: flex-start;
  }

  .work_left_content .work_description_text {
    margin-bottom: var(--_spacing---spacing-semantics--spacing-md);
  }

  .work_left_content .button_primary.v2 {
    margin-top: auto;
  }
}

/* Service-Videos: Screencasts sind ~2:1 (nicht 4:3).
   Container + contain, damit nichts abgeschnitten wird. */
.service_item_video_wrap {
  aspect-ratio: 4 / 3;
  background: #fff;
}

.service_item_video_wrap--4x3 {
  aspect-ratio: 4 / 3;
}

.service_item_video_wrap video,
.service_item_video_wrap [data-mw-bgvideo-fallback-img] {
  object-fit: contain !important;
  object-position: center;
}

.service_item_video_wrap--screenshot {
  background: #fff;
}

.service_item_video_wrap--screenshot video,
.service_item_video_wrap--screenshot [data-mw-bgvideo-fallback-img] {
  object-fit: contain !important;
  object-position: center;
}

/* === Rasio kartu timeline "Über uns" ===================================
   .year_image tidak punya height sendiri ({width:100%; overflow:hidden}),
   jadi tanpa aspect-ratio eksplisit tingginya ikut rasio asli tiap gambar.
   6 foto material (2021-2026) hasil generate AI datang dengan rasio acak
   (sebagian 3:2 landscape, sebagian 3:4 portrait) karena API-nya tidak bisa
   diatur size/aspect-nya -- kartunya jadi tinggi-pendek nggak seragam.
   Semua file sudah di-crop ke 1:1 sebelum diunggah, dan aturan ini menjadi
   pengaman kalau salah satu diganti lagi nanti dengan rasio yang beda. */
.year_image {
  aspect-ratio: 1 / 1;
}

/* === Foto timeline "Über uns" beda posisi di mobile (2025/2026 vs 2021-2024)
   .year_item tingginya SAMA PERSIS di semua kartu (baris flex/grid horizontal
   yang sama), tapi .year_info_text (paragraf deskripsi) tinggi kontennya
   IKUT PANJANG TEKS -- paragraf 2021/2022/2023/2024 kebetulan sama-sama wrap
   jadi 4 baris (96px, line-height 24px), sementara 2025 & 2026 teksnya lebih
   pendek dan cuma wrap 3 baris (72px). .year_item pakai justify-content:flex-start
   (konten numpuk dari atas, bukan center/space-between), jadi begitu blok
   teks di atasnya 24px lebih pendek, .year_image ikut kegeser naik 24px --
   diukur langsung: top gambar 2021-2024 @ offset 239px dari atas kartu,
   punya 2025/2026 @ 215px. min-height di bawah ini mengunci tinggi paragraf
   ke skenario 4-baris (yang terpanjang dari 6 kartu) supaya gambar selalu
   mulai di offset yang sama, berapa pun panjang teksnya.

   DISCOPE ke <=991px, BUKAN cuma <=479px -- font-size/line-height paragraf
   ini (16px/24px) ternyata SAMA dari 390px sampai 991px (baru berubah ke
   20px/30px di breakpoint desktop besar), dan bug offset-nya diverifikasi
   nongol di semua titik itu (dicek manual 390/600/767px, tiga-tiganya
   kena, sempat cuma di-scope ke 479px dulu lalu ketauan masih kebobolan di
   600-767px). >=992px (desktop) tidak perlu -- kartu jauh lebih lega di
   sana, teks konsisten muat 1 baris. */
@media screen and (max-width: 991px) {
  .year_info_text {
    min-height: 96px;
  }
}

/* === Hero-Absatz auf Mobile ============================================
   War visibility:hidden, weil der Satz ueber dem alten Charakter-Foto lag.
   Jetzt derselbe Scroll-Reveal wie am Desktop (js/hero-text-reveal.js);
   nur die Hide-Regel ist weg. Position links oben, ausserhalb des Flex-Flows,
   damit der Absatz nicht in die Subtitle-Luecke laeuft. */
@media screen and (max-width: 767px) {
  .hero_section > .hero_info {
    position: absolute;
    top: clamp(5.25rem, 12vh, 7rem);
    left: var(--_layout---padding-global);
    right: 3.25rem;
    z-index: 2;
    max-width: none;
    margin: 0;
    text-align: left;
  }
}

/* === "100+ Projekte umgesetzt" auf Mobile ausgeblendet =================
   Auf Wunsch entfernt, gesamter .hero_stat-Block (Icon + Zahl + Label
   gehoeren zusammen -- nur den Text zu verstecken haette ein verwaistes
   Icon ohne Beschriftung hinterlassen).

   visibility statt display: das Template hat schon einmal reflow-
   Bugs gezeigt, wenn ein Kind aus einem Flex-Layout komplett entfernt
   wurde (Nachbarelement wuchs in die Luecke). Slot bleibt also reserviert,
   nur der Inhalt verschwindet. */
@media screen and (max-width: 767px) {
  .hero_stat {
    visibility: hidden;
  }
}

/* === Judul hero di layar mobile =======================================
   "MEHRWEBDESIGN" 13 huruf, sedangkan --font-sizes--heading--h1 19vw disetel
   untuk kata judul template yang lebih pendek. Terukur, sisanya cuma 4-9px
   di seluruh lebar mobile -- sekitar 1%:

     479px  teks 473 / wadah 479      390px  teks 385 / wadah 390
     360px  teks 356 / wadah 360      320px  teks 316 / wadah 320

   Selisih sekecil itu habis oleh perbedaan rasterisasi antar perangkat, dan
   huruf N terakhir jatuh ke baris bawah.

   Dua pengaman, karena satu saja tidak cukup:

   1. white-space:nowrap -- judulnya tidak boleh pecah, titik.
   2. 17,5vw memberi sisa ~9% alih-alih ~1%, sehingga nowrap tidak berubah
      jadi masalah baru berupa gulir mendatar.

   Penyebab utamanya sudah ditangani terpisah: @font-face Bebasneue diubah dari
   font-display:swap ke block. Dengan swap, browser menggambar dulu memakai
   font cadangan yang 1,75x lebih lebar (829px vs 473px pada 479px), dan di
   jendela itulah judulnya pecah. Tidak ada ukuran vw yang bisa memuat
   keduanya, jadi yang benar adalah tidak pernah menggambar font yang salah. */
@media screen and (max-width: 767px) {
  .hero_heading h1,
  [data-hero-title] {
    font-size: 17.5vw;
    white-space: nowrap;
  }
}

/* === Hero-Claim: 4-Zeilen-Leistungsstack ==============================
   Statt "Premium Webdesign Agentur": Webdesign + Brand + Content +
   Analytics. max-width:12ch (Webflow) wuerde "Analytics & Conversion"
   kaputt umbrechen — weg. Schrift kleiner als der alte 1–2-Zeiler,
   sonst sprengt der Stack den Viewport. */
.hero_sub_title,
[data-hero-subtitle] {
  max-width: none;
  font-size: clamp(2.25rem, 3.4vw, 3.5rem);
  line-height: 1.05;
}

@media screen and (min-width: 1920px) {
  .hero_sub_title,
  [data-hero-subtitle] {
    font-size: 3.5rem;
  }
}

@media screen and (max-width: 991px) {
  .hero_sub_title,
  [data-hero-subtitle] {
    font-size: clamp(1.75rem, 4.2vw, 2.75rem);
  }
}

/* === Hero-Subtitle auf Mobile: oben ==================================
   Vorher unten (Flex space-between + margin-bottom ueber Scroll-Hinweis).
   Soll oben stehen — dieselbe Zone wie MEHRWEBDESIGN, damit der
   Scroll-Crossfade (Titel raus / Claim rein) nicht von oben nach unten
   springt. Absolut, analog zu .hero_info; Scroll-Hint bleibt unten. */
@media screen and (max-width: 767px) {
  .hero_content_wrapper {
    position: absolute;
    top: clamp(5.25rem, 12vh, 7rem);
    left: var(--_layout---padding-global);
    right: var(--_layout---padding-global);
    z-index: 2;
    margin-bottom: 0;
    justify-content: center;
  }
  .hero_sub_title,
  [data-hero-subtitle] {
    font-size: clamp(1.45rem, 6.8vw, 1.9rem);
    line-height: 1.05;
    text-align: center;
    max-width: none;
  }
}

/* === CTA "Anfragen" -> quiz interaktif (js/quiz.js) ====================
   DOM-nya dibangun sepenuhnya oleh JS (bukan ditulis manual di 4 file
   HTML), jadi semua class di bawah ini ('.quiz_...') tidak akan pernah
   kelihatan dipakai di HTML manapun lewat pencarian teks biasa -- itu
   normal, cek js/quiz.js untuk lihat elemen mana pakai class mana.

   PALET & EASING disamakan sama sisa situs: layarnya cream (#F8F3E9 ->
   #EEE3CD, senada #E4D9C3 yang dipakai leader_circle_item lain) dengan
   teks midnight blue (#10192B) dan aksen gold (#C9A66B). cubic-bezier
   (0.16,1,0.3,1) ("expo-out", start cepat lalu mendarat pelan-pelan) --
   biar transisi modal ini kerasa satu keluarga sama transisi lain di
   situs, bukan komponen tempelan.

   BUKAN kartu dialog kecil mengambang di tengah backdrop blur (pola
   "modal AI generik" paling gampang dikenali) -- .quiz_overlay LANGSUNG
   jadi layar cream penuh (full-bleed) begitu dibuka, dengan .quiz_content
   di dalamnya membatasi lebar teks/opsi (max-width:720px) supaya tetap
   enak dibaca di layar lebar. Transisi masuknya curtain-reveal lewat
   clip-path (turun dari atas), bukan scale+fade kotak dialog. Field form
   kontak di step terakhir (.contact_form_input) dikasih border/fokus
   ring sendiri di bawah -- versi bawaannya (background #FAF7F0, border
   transparan) nyaris tak kelihatan di atas latar cream yang senada.

   z-index 5000: lebih tinggi dari nav (<=2000 di base CSS bawaan) tapi
   tidak menyentuh angka ekstrem 2147483647 yang dipakai elemen internal
   base CSS (badge/utility bawaan, di luar kendali kita, biar tetap paling
   atas kalau memang harus). */
.quiz_overlay {
  position: fixed;
  inset: 0;
  z-index: 5000;
  overflow: hidden;
  background: linear-gradient(180deg, #F8F3E9 0%, #EEE3CD 100%);
  opacity: 0;
  pointer-events: none;
  /* curtain-reveal (clip-path), bukan scale/fade kotak dialog di tengah
     backdrop blur -- overlay ini SENDIRI adalah layarnya, full-bleed,
     turun dari atas kayak tirai dibuka, senada kata "cinematisch" yang
     dipakai berulang di copy situs ini. */
  clip-path: inset(0 0 100% 0);
  transition: opacity 0.4s ease, clip-path 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_overlay[hidden] {
  display: none;
}

.quiz_overlay.is-open {
  opacity: 1;
  pointer-events: auto;
  clip-path: inset(0 0 0 0);
}

/* Bildmarke (gleicher Asset wie Side-Tab Anfragen): groß, halbtransparent,
   über den unteren linken Rand geschoben — overflow/clip-path schneidet ab.
   --quiz-spot-* / --quiz-wet: Wasser-Radius um den Cursor (js/quiz.js). */
.quiz_brand_mark_wrap {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 0;
  width: min(48vw, 560px);
  line-height: 0;
  pointer-events: none;
  user-select: none;
  transform: translate(calc(-36% + var(--quiz-mark-x, 0px)), calc(30% + var(--quiz-mark-y, 0px))) rotate(calc(18deg + var(--quiz-mark-r, 0deg)));
  will-change: transform;
}

.quiz_brand_mark {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  opacity: 0.11;
}

.quiz_brand_mark.is-spot {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: calc(0.82 * var(--quiz-wet, 0));
  filter: url(#quiz-mark-water) brightness(0.18);
  -webkit-mask-image: radial-gradient(
    circle var(--quiz-spot-r, 172px) at var(--quiz-local-x, 50%) var(--quiz-local-y, 50%),
    #000 0%,
    #000 18%,
    rgba(0, 0, 0, 0.78) 38%,
    rgba(0, 0, 0, 0.32) 58%,
    transparent 76%
  );
  mask-image: radial-gradient(
    circle var(--quiz-spot-r, 172px) at var(--quiz-local-x, 50%) var(--quiz-local-y, 50%),
    #000 0%,
    #000 18%,
    rgba(0, 0, 0, 0.78) 38%,
    rgba(0, 0, 0, 0.32) 58%,
    transparent 76%
  );
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.quiz_brand_mark_pool {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: var(--quiz-wet, 0);
  background: radial-gradient(
    circle var(--quiz-spot-r, 172px) at var(--quiz-spot-x, 50%) var(--quiz-spot-y, 50%),
    rgba(16, 25, 43, 0.22) 0%,
    rgba(16, 25, 43, 0.08) 40%,
    transparent 70%
  );
  mix-blend-mode: multiply;
}

.quiz_brand_mark_fx {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

/* Portrait: rundes Wasserzeichen oben rechts, leicht angeschnitten. */
.quiz_portrait_wrap {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  width: min(34vw, 260px);
  height: min(34vw, 260px);
  border-radius: 50%;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  transform: translate(calc(18% + var(--quiz-portrait-x, 0px)), calc(-8% + var(--quiz-portrait-y, 0px)));
  will-change: transform;
}

.quiz_portrait {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 22%;
  opacity: 0.16;
  mix-blend-mode: multiply;
  filter: contrast(1.08);
}

.quiz_portrait.is-spot {
  position: absolute;
  inset: 0;
  opacity: calc(0.7 * var(--quiz-portrait-wet, 0));
  mix-blend-mode: multiply;
  filter: url(#quiz-mark-water) brightness(0.28) contrast(1.18);
  -webkit-mask-image: radial-gradient(
    circle var(--quiz-spot-r, 172px) at var(--quiz-portrait-local-x, 50%) var(--quiz-portrait-local-y, 50%),
    #000 0%,
    #000 18%,
    rgba(0, 0, 0, 0.78) 38%,
    rgba(0, 0, 0, 0.32) 58%,
    transparent 76%
  );
  mask-image: radial-gradient(
    circle var(--quiz-spot-r, 172px) at var(--quiz-portrait-local-x, 50%) var(--quiz-portrait-local-y, 50%),
    #000 0%,
    #000 18%,
    rgba(0, 0, 0, 0.78) 38%,
    rgba(0, 0, 0, 0.32) 58%,
    transparent 76%
  );
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

@media screen and (max-width: 767px) {
  .quiz_portrait_wrap {
    width: min(40vw, 180px);
    height: min(40vw, 180px);
  }
}

@media screen and (max-width: 479px) {
  .quiz_portrait_wrap {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .quiz_overlay {
    clip-path: none;
    transition: opacity 0.25s ease;
  }

  .quiz_consent_mark::after {
    transition: none;
  }

  .quiz_brand_mark.is-spot,
  .quiz_brand_mark_pool,
  .quiz_portrait.is-spot {
    display: none;
  }

  .quiz_option_tip {
    transition: none;
  }
}

.quiz_close_button {
  position: absolute;
  top: 28px;
  right: 28px;
  z-index: 2;
  background: none;
  border: none;
  color: rgba(16, 25, 43, 0.55);
  font-family: var(--_typography---font-family--body-font);
  font-size: 13px;
  cursor: pointer;
  padding: 8px;
  flex-shrink: 0;
  transition: color 0.25s ease;
}

.quiz_close_button:hover {
  color: #10192B;
}

.quiz_panel {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  padding: 88px 24px 64px;
  /* scrollbar custom -- default-nya putih/abu polos, gak nyambung sama tema
     cream+gold panel ini. Firefox pakai scrollbar-color, Chromium/Safari
     pakai pseudo-element ::-webkit-scrollbar di bawah. */
  scrollbar-width: thin;
  scrollbar-color: rgba(201, 166, 107, 0.6) transparent;
}

.quiz_panel::-webkit-scrollbar {
  width: 8px;
}

.quiz_panel::-webkit-scrollbar-track {
  background: transparent;
}

.quiz_panel::-webkit-scrollbar-thumb {
  background-color: rgba(201, 166, 107, 0.5);
  border-radius: 8px;
}

.quiz_panel::-webkit-scrollbar-thumb:hover {
  background-color: rgba(201, 166, 107, 0.8);
}

.quiz_panel:focus {
  outline: none;
}

/* Latar cream-nya full-bleed sampai tepi layar, tapi teks/kartu dibatasi
   lebar di sini supaya tetap enak dibaca di layar lebar -- kombinasi
   "latar penuh + kolom fokus", bukan kartu kecil mengambang di tengah. */
.quiz_content {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
}

.quiz_panel_header {
  display: flex;
  align-items: center;
  margin-bottom: 56px;
  transition: opacity 0.25s ease;
}

.quiz_panel_header.is-hidden {
  opacity: 0;
  pointer-events: none;
}

.quiz_back_button.is-hidden,
.quiz_next_button.is-hidden,
.quiz_submit_button.is-hidden {
  display: none;
}

/* Ikon panah & close dipakai ulang di beberapa tempat (back button, kartu
   opsi, tombol submit) -- lihat ARROW_SVG/CHECK_SVG di js/quiz.js, path-nya
   sama persis dengan .cta_button_arrow yang sudah ada di index.html. */
.quiz_icon_arrow {
  display: inline-flex;
  flex-shrink: 0;
  width: 14px;
  height: 12px;
}

.quiz_icon_arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}

.quiz_icon_arrow.is-back {
  transform: rotate(180deg);
}

.quiz_close_icon {
  position: relative;
  display: block;
  width: 14px;
  height: 14px;
}

.quiz_close_bar {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transform: translateY(-50%) rotate(45deg);
}

.quiz_close_bar.is-second {
  transform: translateY(-50%) rotate(-45deg);
}

.quiz_progress_wrapper {
  flex: 1;
}

.quiz_progress_dashes {
  display: flex;
  gap: 6px;
}

.quiz_progress_dash {
  flex: 1;
  height: 4px;
  border-radius: 2px;
  background: rgba(16, 25, 43, 0.12);
  transition: background-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_progress_dash.is-active {
  background: #C9A66B;
}

.quiz_step_label {
  margin-top: 10px;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(16, 25, 43, 0.5);
}

.quiz_panel_body {
  transition: opacity 0.22s cubic-bezier(0.16, 1, 0.3, 1), transform 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_panel_body.is-leaving-forward,
.quiz_panel_body.is-entering-forward {
  opacity: 0;
  transform: translateX(16px);
}

.quiz_panel_body.is-leaving-back,
.quiz_panel_body.is-entering-back {
  opacity: 0;
  transform: translateX(-16px);
}

.quiz_question {
  font-family: var(--_typography---font-family--heading-font);
  color: #10192B;
  font-size: var(--_typography---font-sizes--heading--h3);
  line-height: 1;
  letter-spacing: 0.01em;
  margin: 0 0 48px;
}

.quiz_question:has(+ .quiz_multi_hint),
.quiz_question:has(+ .quiz_subquestion) {
  margin-bottom: 16px;
}

.quiz_subquestion {
  margin: 0 0 6px;
  font-family: var(--_typography---font-family--heading-font);
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 1.2;
  color: #10192B;
}

.quiz_multi_hint {
  margin: 0 0 28px;
  font-size: 13px;
  color: rgba(16, 25, 43, 0.5);
}

/* Opsi ditampilkan sebagai baris bergaris tipis (hairline), bukan kartu
   bulat berbingkai satu-satu -- lebih kerasa "daftar/menu editorial"
   ketimbang tumpukan card generik. Warna gold nyapu masuk dari kiri
   (::before, scaleX) pas hover/pilih, senada teknik button_line_mask yang
   sudah dipakai tombol lain di situs ini (bukan animasi baru yang asing). */
.quiz_options {
  display: flex;
  flex-direction: column;
}

.quiz_option {
  position: relative;
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  border-top: 1px solid rgba(16, 25, 43, 0.14);
  padding: 24px 6px;
  cursor: pointer;
  color: #10192B;
  overflow: hidden;
  transition: padding-left 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_options .quiz_option:last-child {
  border-bottom: 1px solid rgba(16, 25, 43, 0.14);
}

.quiz_option::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(201, 166, 107, 0.12);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_option:hover::before,
.quiz_option:focus-visible::before,
.quiz_option.is-selected::before {
  transform: scaleX(1);
}

.quiz_option:hover,
.quiz_option:focus-visible {
  padding-left: 18px;
}

.quiz_option_index,
.quiz_option_text,
.quiz_option_arrow {
  position: relative;
  z-index: 1;
}

.quiz_option.is-selected .quiz_option_index {
  color: #C9A66B;
}

.quiz_option_index {
  flex-shrink: 0;
  min-width: 30px;
  font-family: var(--_typography---font-family--heading-font);
  font-size: 15px;
  color: rgba(16, 25, 43, 0.35);
  transition: color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_option_text {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 4px;
}

.quiz_option_label {
  font-family: var(--_typography---font-family--heading-font);
  font-size: clamp(20px, 2.6vw, 27px);
  letter-spacing: 0.005em;
}

.quiz_option_hint {
  font-size: 13px;
  color: rgba(16, 25, 43, 0.55);
}

.quiz_option_row {
  position: relative;
  z-index: 0;
}

.quiz_option_row:hover,
.quiz_option_row:focus-within {
  z-index: 2;
}

.quiz_option_row .quiz_option {
  width: 100%;
  padding-right: 50px;
  border: none;
}

.quiz_option_row {
  border-top: 1px solid rgba(16, 25, 43, 0.14);
}

.quiz_options > .quiz_option_row:last-child {
  border-bottom: 1px solid rgba(16, 25, 43, 0.14);
}

.quiz_options > .quiz_option_row:last-child .quiz_option {
  border-bottom: none;
}

.quiz_option_info {
  position: absolute;
  top: 50%;
  right: 8px;
  z-index: 2;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 1px solid #10192B;
  border-radius: 50%;
  background: #10192B;
  color: #F8F3E9;
  cursor: help;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.25s ease, color 0.25s ease, background-color 0.25s ease;
}

.quiz_option_info_mark {
  font-family: var(--_typography---font-family--heading-font);
  font-size: 12px;
  font-style: italic;
  font-weight: 600;
  line-height: 1;
  pointer-events: none;
}

.quiz_option_info:hover,
.quiz_option_info:focus-visible,
.quiz_option_info[aria-expanded="true"] {
  border-color: #C9A66B;
  color: #F8F3E9;
  background: #10192B;
}

.quiz_option_info:focus-visible {
  outline: 2px solid #10192B;
  outline-offset: 2px;
}

.quiz_option_tip {
  position: fixed;
  left: -9999px;
  top: -9999px;
  z-index: 6;
  width: min(320px, calc(100vw - 24px));
  padding: 14px 16px 15px;
  background: #10192B;
  color: #F8F3E9;
  font-size: 13px;
  line-height: 1.45;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.quiz_option_tip::before {
  content: "";
  display: block;
  width: 28px;
  height: 1px;
  background: #C9A66B;
  margin-bottom: 10px;
}

.quiz_option_info:hover + .quiz_option_tip.is-placed,
.quiz_option_info:focus-visible + .quiz_option_tip.is-placed,
.quiz_option_tip.is-open {
  opacity: 1;
  visibility: visible;
}

.quiz_option_arrow {
  flex-shrink: 0;
  display: inline-flex;
  width: 18px;
  height: 15px;
  color: #C9A66B;
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 0.3s ease, transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_option_arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}

.quiz_option:hover .quiz_option_arrow,
.quiz_option.is-selected .quiz_option_arrow {
  opacity: 1;
  transform: translateX(0);
}

.quiz_option.is-multi .quiz_option_arrow {
  opacity: 0.22;
  transform: none;
  color: #10192B;
}

.quiz_option.is-multi.is-selected .quiz_option_arrow,
.quiz_option.is-multi:hover .quiz_option_arrow,
.quiz_option.is-multi:focus-visible .quiz_option_arrow {
  opacity: 1;
  color: #C9A66B;
}

.quiz_back_button,
.quiz_next_button,
.quiz_submit_button {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.quiz_back_button,
.quiz_next_button,
.quiz_overlay > .quiz_submit_button {
  position: absolute;
  bottom: 28px;
  z-index: 2;
  margin: 0;
}

.quiz_back_button {
  left: 28px;
}

.quiz_next_button,
.quiz_overlay > .quiz_submit_button {
  right: 28px;
}

.quiz_success .quiz_submit_button {
  margin-top: 20px;
}

.quiz_overlay.has-back .quiz_panel,
.quiz_overlay.has-next .quiz_panel,
.quiz_overlay.has-submit .quiz_panel {
  padding-bottom: 120px;
}

/* Cream statt Weiß, sonst sind die Line-Masks auf dem Overlay sichtbar. */
.quiz_overlay .button_line_mask {
  background-color: #F8F3E9;
}

.quiz_back_button .button_line_mask,
.quiz_next_button .button_line_mask,
.quiz_overlay > .quiz_submit_button .button_line_mask {
  background-color: #EEE3CD;
}

.quiz_overlay .button_text {
  display: block;
  margin: 0;
  transition: color 0.3s ease;
}

.quiz_overlay .quiz_btn_char {
  display: inline-block;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_overlay .button_primary {
  overflow: hidden;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.quiz_overlay .button_primary .button_line {
  transition: background-color 0.3s ease;
}

.quiz_overlay .button_primary:hover:not(:disabled),
.quiz_overlay .button_primary:focus-visible {
  background-color: var(--black-primary, #000);
}

.quiz_overlay .button_primary:hover:not(:disabled) .button_text,
.quiz_overlay .button_primary:focus-visible .button_text {
  color: var(--white, #fff);
}

.quiz_overlay .button_primary:hover:not(:disabled) .button_line,
.quiz_overlay .button_primary:focus-visible .button_line {
  background-color: var(--white, #fff);
}

.quiz_overlay .button_primary:hover:not(:disabled) .quiz_btn_char,
.quiz_overlay .button_primary:focus-visible .quiz_btn_char {
  transform: translateY(-100%);
}

.quiz_overlay .button_line_mask {
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1), width 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_overlay .button_primary:hover:not(:disabled) .button_line_mask:first-child,
.quiz_overlay .button_primary:focus-visible .button_line_mask:first-child {
  width: 0;
  transform: translateX(-20px);
}

.quiz_overlay .button_primary:hover:not(:disabled) .button_line_mask._2,
.quiz_overlay .button_primary:hover:not(:disabled) .button_line_mask._3,
.quiz_overlay .button_primary:focus-visible .button_line_mask._2,
.quiz_overlay .button_primary:focus-visible .button_line_mask._3 {
  width: 0;
  transform: translateX(20px);
}

.quiz_overlay .button_primary:focus-visible {
  outline: 2px solid #000;
  outline-offset: 3px;
}

.quiz_submit_button:disabled {
  opacity: 0.6;
  cursor: default;
}

.quiz_form_kicker {
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #10192B;
  margin: 0 0 14px;
}

.quiz_eyebrow {
  position: absolute;
  top: 28px;
  left: 28px;
  z-index: 2;
  margin: 0;
  height: 30px;
  max-width: calc(100% - 88px);
  pointer-events: none;
}

.quiz_overlay > .quiz_eyebrow .section_caption_circle {
  width: 12px;
  flex-shrink: 0;
}

.quiz_overlay > .quiz_eyebrow .section_caption_text {
  font-size: 15px;
  line-height: 1;
  white-space: nowrap;
}

.quiz_form_kicker::before {
  content: "";
  display: block;
  width: 36px;
  height: 1px;
  background: #C9A66B;
  margin-bottom: 14px;
}

.quiz_question--form {
  font-size: clamp(28px, 4.4vw, 46px);
  margin-bottom: 16px;
}

.quiz_recap {
  margin: 0 0 36px;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #10192B;
}

.quiz_contact_form .contact_form_input_wrapper {
  margin-bottom: 8px;
  grid-column-gap: 28px;
  grid-row-gap: 22px;
}

.quiz_contact_form .contact_form_input_item.is-full {
  grid-column: 1 / -1;
}

/* Linien-Felder (Pecuria-artig), scoped auf das Quiz — nicht contact-us.html. */
.quiz_contact_form .contact_form_input {
  width: 100%;
  background-color: transparent;
  border: none;
  border-bottom: 1px solid rgba(16, 25, 43, 0.22);
  border-radius: 0;
  height: 46px;
  padding: 6px 0 10px;
  color: #10192B;
  box-shadow: none;
  transition: border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_contact_form .contact_form_input.is-textarea {
  height: auto;
  min-height: 84px;
  padding-top: 8px;
  resize: vertical;
}

.quiz_contact_form .contact_form_input::placeholder {
  color: rgba(16, 25, 43, 0.32);
}

.quiz_contact_form .contact_form_input:focus {
  outline: none;
  border-color: #C9A66B;
  box-shadow: none;
}

.quiz_contact_form .contact_form_input.is-invalid {
  border-color: #C0574A;
}

.quiz_contact_form .contact_form_input.is-invalid:focus {
  border-color: #C0574A;
  box-shadow: none;
}

.quiz_field_hint {
  display: block;
  margin-top: 8px;
  font-family: var(--_typography---font-family--body-font);
  font-size: 12px;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
  color: #10192B;
}

.quiz_field_error {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: #C0574A;
}

.quiz_field_error:empty {
  display: none;
}

.quiz_form_error {
  margin-top: 12px;
}

.quiz_contact_form .contact_form_label {
  display: block;
  font-family: var(--_typography---font-family--heading-font);
  font-size: clamp(20px, 2.6vw, 27px);
  letter-spacing: 0.005em;
  line-height: 1.05;
  text-transform: uppercase;
  color: #10192B;
  margin-bottom: 8px;
}

.quiz_consent {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin: 28px 0 4px;
  cursor: pointer;
}

.quiz_consent_input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  pointer-events: none;
}

.quiz_consent_mark {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border: 1px solid rgba(16, 25, 43, 0.35);
  background: transparent;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.quiz_consent_mark::after {
  content: "";
  display: block;
  width: 5px;
  height: 9px;
  margin: 2px auto 0;
  border-right: 1.5px solid #F8F3E9;
  border-bottom: 1.5px solid #F8F3E9;
  transform: rotate(45deg) scale(0);
  transform-origin: center;
  transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1);
}

.quiz_consent_input:checked + .quiz_consent_mark {
  background: #10192B;
  border-color: #10192B;
}

.quiz_consent_input:checked + .quiz_consent_mark::after {
  transform: rotate(45deg) scale(1);
}

.quiz_consent_input:focus-visible + .quiz_consent_mark {
  outline: 2px solid #C9A66B;
  outline-offset: 2px;
}

.quiz_consent.is-invalid .quiz_consent_mark {
  border-color: #C0574A;
}

.quiz_consent_text {
  font-family: var(--_typography---font-family--body-font);
  font-size: 13px;
  line-height: 1.55;
  letter-spacing: 0;
  text-transform: none;
  color: #10192B;
}

.quiz_consent_text a {
  color: #10192B;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.quiz_consent_text a:hover {
  color: #C9A66B;
}


.quiz_success {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 4px;
  min-height: 45vh;
  padding: 24px 0 8px;
}

.quiz_success_icon {
  width: 64px;
  height: 64px;
  margin-bottom: 8px;
  border-radius: 50%;
  border: 1px solid rgba(201, 166, 107, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #C9A66B;
}

.quiz_success_icon svg {
  width: 26px;
  height: 26px;
}

.quiz_success .quiz_question {
  margin-bottom: 0;
  font-size: 22px;
}

.quiz_success_text {
  color: rgba(16, 25, 43, 0.6);
  margin-bottom: 12px;
}


html.quiz-scroll-lock {
  overflow: hidden;
}

/* === Side-Tab "Anfragen" (js/quiz.js, Pecuria-artig) ===================
   Vertikal am rechten Viewport-Rand, Desktop + Mobile. z-index 4000:
   über Nav (<=2000), unter .quiz_overlay (5000). Beim offenen Funnel
   unsichtbar (html.quiz-scroll-lock). */
.side_contact {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 4000;
  transform: translateY(-50%);
  pointer-events: none;
}

.side_contact_tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  margin: 0;
  padding: 12px 9px 14px;
  border: 0;
  border-radius: var(--_spacing---border-radious--sm) 0 0 var(--_spacing---border-radious--sm);
  overflow: visible;
  isolation: isolate;
  background: #C9A66B;
  color: #10192B;
  cursor: pointer;
  pointer-events: auto;
  font-family: var(--_typography---font-family--heading-font);
  font-size: 25px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
  transition: background-color 0.25s ease, color 0.25s ease;
}

.side_contact_tab:hover,
.side_contact_tab:focus-visible {
  background: #10192B;
  color: #F8F3E9;
  outline: none;
}

.side_contact_label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.side_contact_mark {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 25px;
  height: 25px;
  flex-shrink: 0;
  overflow: visible;
}

.side_contact_logo {
  display: block;
  width: 25px;
  height: 25px;
  object-fit: contain;
}

.side_contact_logo:not(.is-hover) {
  /* webp hat mehr Innenrand als logowhite.png — optisch angleichen */
  transform: scale(1.4);
  transform-origin: center;
}

.side_contact_logo.is-hover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  mix-blend-mode: screen;
}

.side_contact_tab:hover .side_contact_logo:not(.is-hover),
.side_contact_tab:focus-visible .side_contact_logo:not(.is-hover) {
  opacity: 0;
}

.side_contact_tab:hover .side_contact_logo.is-hover,
.side_contact_tab:focus-visible .side_contact_logo.is-hover {
  opacity: 1;
}

html.quiz-scroll-lock .side_contact {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@media screen and (max-width: 480px) {
  .side_contact_tab {
    padding: 9px 8px 12px;
    font-size: 21px;
    gap: 7px;
  }

  .side_contact_mark,
  .side_contact_logo {
    width: 21px;
    height: 21px;
  }
}

/* === Navbar <-> CTA-Rail Icon-Dock: "Zuhause"-Ankerpunkt in der Navbar ===
   Reiner DOM-Griff fuers spaetere appendChild()-Zurueckholen durch
   js/nav-icon-dock.js. display:contents, weil der Hamburger dort schon
   absolut positioniert ist (top/right, siehe .hamburger_menu_icon oben) --
   der Slot darf dessen Layout in keine Richtung beeinflussen. */
.navbar_icon_slot {
  display: contents;
}

/* === Side-Tab "Anfragen": leerer Dock-Slot fuer den Navbar-Menu-Toggle ====
   js/quiz.js legt hier nur einen LEEREN, reservierten Platz an
   (.cta_rail_icon_slot). Ob/wann der echte Hamburger ([data-menu-icon])
   dort andockt, entscheidet js/nav-icon-dock.js scroll-abhaengig
   (IntersectionObserver auf die Navbar) -- selber Knoten, kein Klon,
   Klick-Funktion "Vollbild-Menue oeffnen" bleibt dabei immer erhalten.
   Ohne dieses Skript (andere Seiten) bleibt der Slot leer und faellt
   dank :empty{display:none} nicht auf. .side_contact ist eine Flex-Column,
   damit Icon-Cap + Anfragen-Tab wie eine schwebende Einheit wirken. */
.side_contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.cta_rail_icon_slot:empty {
  display: none;
}

.cta_rail_icon_slot.is-reserved {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 47px;
  overflow: visible;
}

.side_contact .side_contact_menu_toggle {
  /* position/top/right etc bewusst mit !important: ein anderes,
     scroll-gebundenes Skript setzte auf dieses Element (noch von seiner
     alten reinen Navbar-Rolle her) offenbar Inline-Styles fuer diese
     Properties -- Inline-Styles schlagen jede Klassen-Regel unabhaengig
     von deren Spezifitaet, nur !important in der Stylesheet-Regel kommt
     dagegen an. "transform" bewusst OHNE !important gelassen -- das
     Dock-Skript animiert damit selbst den Andock-Uebergang (fromTo x/y/
     scale per GSAP) und raeumt den Inline-Wert danach wieder auf. */
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  z-index: auto !important;
  width: auto !important;
  border-bottom-width: 0;
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 11px 10px;
  border-radius: var(--_spacing---border-radious--sm) 0 0 var(--_spacing---border-radious--sm);
  background: #10192B;
  cursor: pointer;
  transition: background-color 0.25s ease;
}

.side_contact .side_contact_menu_toggle .hamburger_menu_inner {
  gap: 5px;
}

.side_contact .side_contact_menu_toggle .hamburger_menu_icon_line {
  background-color: #C9A66B;
  width: 14px;
  transition: background-color 0.25s ease;
}

.side_contact .side_contact_menu_toggle .hamburger_menu_icon_line.is-middle {
  width: 22px;
}

.side_contact .side_contact_menu_toggle:hover,
.side_contact .side_contact_menu_toggle:focus-visible {
  background: #C9A66B;
  outline: none;
}

.side_contact .side_contact_menu_toggle:hover .hamburger_menu_icon_line,
.side_contact .side_contact_menu_toggle:focus-visible .hamburger_menu_icon_line {
  background-color: #10192B;
}

html.quiz-scroll-lock .side_contact .side_contact_menu_toggle {
  pointer-events: none;
}

@media screen and (max-width: 480px) {
  .cta_rail_icon_slot.is-reserved {
    min-height: 40px;
  }

  .side_contact .side_contact_menu_toggle {
    padding: 9px 8px;
  }

  .side_contact .side_contact_menu_toggle .hamburger_menu_icon_line {
    width: 12px;
  }

  .side_contact .side_contact_menu_toggle .hamburger_menu_icon_line.is-middle {
    width: 19px;
  }
}

@media screen and (max-width: 480px) {
  .quiz_panel {
    padding: 76px 20px 40px;
  }

  .quiz_panel_header {
    margin-bottom: 36px;
  }

  .quiz_question {
    margin-bottom: 32px;
  }

  .quiz_question:has(+ .quiz_multi_hint),
  .quiz_question:has(+ .quiz_subquestion) {
    margin-bottom: 12px;
  }

  .quiz_next_button,
  .quiz_overlay > .quiz_submit_button {
    right: 18px;
    bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  }

  .quiz_question--form {
    margin-bottom: 12px;
  }

  .quiz_recap {
    margin-bottom: 28px;
  }

  .quiz_contact_form .contact_form_input_wrapper {
    grid-row-gap: 18px;
  }

  .quiz_option {
    padding: 18px 4px;
  }

  .quiz_option:hover,
  .quiz_option:focus-visible {
    padding-left: 12px;
  }

  .quiz_close_button {
    top: calc(18px + env(safe-area-inset-top, 0px));
    right: 18px;
  }

  .quiz_eyebrow {
    top: calc(18px + env(safe-area-inset-top, 0px));
    left: 18px;
  }

  .quiz_back_button {
    left: 18px;
    bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  }

  .quiz_brand_mark_wrap {
    width: min(87vw, 400px);
    transform: translate(calc(-34% + var(--quiz-mark-x, 0px)), calc(32% + var(--quiz-mark-y, 0px))) rotate(calc(16deg + var(--quiz-mark-r, 0deg)));
  }

  .quiz_brand_mark {
    opacity: 0.09;
  }

  /* Chrome oben (X) + unten (Zurück/Weiter) damit Content nicht
     unter den Buttons unlesbar wird. Soft-Fade, kein harter Balken. */
  .quiz_overlay::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    height: calc(72px + env(safe-area-inset-top, 0px));
    background: linear-gradient(
      180deg,
      #F8F3E9 0%,
      #F8F3E9 58%,
      rgba(248, 243, 233, 0) 100%
    );
    pointer-events: none;
  }

  .quiz_overlay.has-back::after,
  .quiz_overlay.has-next::after,
  .quiz_overlay.has-submit::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    height: calc(88px + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(
      0deg,
      #EEE3CD 0%,
      #EEE3CD 48%,
      rgba(238, 227, 205, 0) 100%
    );
    pointer-events: none;
  }
}

/* === Showreel: perbaikan pacing (client lapor "menghilang kecepetan") ==
   .showreel_section/.showreel_track/.showreel_sticky/.showreel_video_mask
   bawaan Webflow (bukan dibangun manual kayak hero_track kita) -- video
   pinned selama .showreel_track (250vh, base CSS line 1) discroll, dengan
   mask-nya membesar dari 50vw/40vh ke 100vw/100vh lewat animasi scroll
   IX2 bawaan (data JSON terobfuskasi di js/motion-home.js, actionList
   "a-17", trigger "e-16" tipe SCROLLING_IN_VIEW).

   DIUKUR LANGSUNG (bukan ditebak) di situs live mehrwebnew.vercel.app
   pakai Playwright headless, viewport 1440x900, scroll bertahap sambil
   log getBoundingClientRect() tiap elemen -- angka sebelum perbaikan:
     - .showreel_track tinggi 2250px (250vh), .showreel_sticky 900px (1vh
       viewport). position:sticky cuma "mentok" (dwell, stickyTop tetap 0)
       selama trackHeight-stickyHeight = 1350px (150vh) -- 100vh sisanya
       otomatis kepakai proses masuk/keluar sticky, bukan waktu tampil.
     - Mask baru mulai membesar di ~225px masuk track, dan SELESAI jadi
       1440x900 (fullscreen) di ~1102px -- itu 82% dari budget dwell
       150vh, nyisain cuma ~248px (~28% dari satu viewport) video diam
       sebelum unpin mulai (scrollY trackTop+1350px, PERSIS sesuai rumus
       sticky: release = trackBottom - stickyHeight).
   Kesimpulan: bukan ada "jeda aneh", budget dwell-nya sendiri kependekan
   secara keseluruhan -- video sempat fullscreen tapi cuma sekejap sebelum
   section-nya lanjut discroll pergi.

   FIX: naikkan track ke 400vh -- dwell jadi 400-100=300vh, PERSIS 2x
   lipat dari 150vh semula, dihitung bukan ditebak. Bukan ngedit animasi
   IX2 langsung (JSON-nya terobfuskasi/rapuh diedit manual) -- cukup kasih
   jarak scroll lebih panjang, progress animasinya otomatis kebaca ulang
   dari getBoundingClientRect elemen (sama seperti js/hero-scrub.js).
   Breakpoint min-width:992px disamakan persis dengan override mobile
   (height:auto, unpin) yang sudah ada di base CSS pada max-width:991px. */
@media screen and (min-width: 992px) {
  .showreel_track {
    height: 400vh;
  }
}

/* Showreel = Screencast (~2,02:1), kein object-fit:cover.
   Webflow-Default (.mw-background-video>video) croppt seitlich — hier contain,
   damit der volle Website-Frame sichtbar bleibt (wie .service_item_video_wrap). */
.showreel_video {
  background: #fff;
}

.showreel_video > video,
.showreel_video [data-mw-bgvideo-fallback-img] {
  object-fit: contain !important;
  object-position: center;
  background-size: contain !important;
  background-repeat: no-repeat;
  background-position: center;
}

/* === About-Pattern (Bildmarke neben "Einblick(in) mehrweb"): Reveal beim
   Scrollen ==============================================================
   Kompletter Umbau (js/about-reveal.js, ersetzt das vorherige
   js/about-pattern-glow.js): frueher ein einzelner ScrollTrigger.onEnter,
   der einmalig eine Klasse setzte und CSS-transition den Rest machen
   liess -- jetzt EIN gescrubbtes GSAP-Timeline, das Textreveal, drei
   goldene Schluesselwoerter (DESIGNSTUDIO/CINEMATISCHE/CONVERSIONLOGIK)
   und den Bildmarke-Reveal am selben Scroll-Fortschritt haengt, statt
   drei unabhaengige Animationen nebeneinander laufen zu lassen.

   Bildmarke ist seitdem noch mal ausgetauscht worden: statt eines
   statischen JPG (images/main.jpg) jetzt videos/logo-anim.mp4 -- die
   Wortmarke zeichnet sich selbst als Strich, Frame fuer Frame. Der
   Clip-Path-Wipe von vorher ist deshalb WEG: er wuerde eine bereits
   selbst-zeichnende Animation zusaetzlich verdecken, zwei Reveal-Effekte
   uebereinander, die sich gegenseitig im Weg stehen. Die Zeichnung SELBST
   ist jetzt der Reveal -- js/about-reveal.js scrubbt video.currentTime an
   derselben Timeline-Position, an der vorher der Wipe lief.

   Frueher gab es hier auch einen pulsierenden gruenen Glow hinter dem
   Bild (an die Kristall-Silhouette der alten rock-transparent.png
   angepasst) -- der ist raus, passte optisch nicht mehr.

   Start-State hier nur noch fuer die Ueberschrift relevant (opacity in
   [data-about-reveal], per Critical-CSS in index.html verdeckt bis JS
   bereit ist). Die Bildmarke braucht kein eigenes CSS-Verstecken mehr --
   Frame 0 des Videos (per poster= sofort sichtbar, noch bevor die Quelle
   ueberhaupt laedt) ist von sich aus schon nahezu leer/weiss, kein
   Flash-Risiko wie beim alten Clip-Path-Ansatz.

   prefers-reduced-motion: sofortiger Endzustand, keine Bewegung -- siehe
   js/about-reveal.js (setzt bei reduced-motion currentTime direkt auf
   video.duration statt zu scrubben). */
.about_section_pattern {
  position: relative;
}

/* Bildmarke auf Mobile: Basis-CSS blendet .about_section_pattern unter
   991px komplett aus (display:none, Zeile 1 -- alte Regel fuer das
   frühere main.jpg, als die Bildmarke auf schmalen Screens noch als
   verzichtbares Beiwerk galt). Jetzt wo sie eine sich selbst zeichnende
   Animation ist, lohnt sie sich auch auf Mobile.

   .about_section_pattern ist im Markup ein Sibling von .about_left_area
   (nicht darin verschachtelt), beide Kinder von .about_header_area
   (display:flex). display:contents auf .about_left_area loest dessen
   eigene Box auf, wodurch section_caption/Überschrift/Button als
   direkte Flex-Items neben .about_section_pattern landen -- so lässt
   sich die Bildmarke per order: zwischen Caption ("Einblick(in)
   mehrweb") und Überschrift einreihen, ohne das DOM anzufassen. */
@media screen and (max-width: 991px) {
  .about_header_area {
    flex-direction: column;
    align-items: stretch;
  }
  .about_left_area {
    display: contents;
  }
  .about_left_area .section_caption {
    order: 1;
  }
  .about_section_pattern {
    display: block;
    order: 2;
    max-width: 220px;
    margin: 16px 0 0;
    align-self: flex-start;
  }
  .about_left_area .about_section_title {
    order: 3;
    margin-top: 8px;
  }
  .about_left_area .button_primary {
    order: 4;
  }
}

/* === Roadmap 2021-2026 (.about_track_scrub): Akkordeon, volle Bildschirmhoehe
   Vierter Anlauf. V1: flaches translateX-Slide. V2: Coverflow mit
   Opacity-Dimming. V3: Wipe-Chapter, rechtsbuendig. V4: 3D-Faecher --
   Nutzer wollte danach Maus-Interaktion, aber Klick/Hover auf den
   staerker gedrehten Karten war unzuverlaessig (CSS-3D-Hit-Testing-
   Limitierung, siehe js/about-timeline.js). Referenz diesmal:
   Screenshot/GIF eines Akkordeon-Bildstreifens -- flache Panels
   nebeneinander, eins aufgeklappt (breit, mit Bildunterschrift), der
   Rest schmal zusammengeklappt (nur ein kleiner Kreis-Marker unten).
   Kein 3D mehr noetig -> Hover/Klick sind jetzt simple, zuverlaessige
   DOM-Events statt Distanz-Heuristik.

   Trigger-Klasse von Webflow IX2 abgekoppelt: die ORIGINAL-Klasse hiess
   "about_track" und war IX2s Scroll-Trigger fuer das allererste Slide
   (motion-home.js, Timelines t-e86c9ad4/t-83136257). Umbenannt zu
   "about_track_scrub", damit IX2 keine passende Klasse mehr findet.

   Alles hier steht hinter html.mw-year-track-on (von JS gesetzt, nur
   wenn GSAP/ScrollTrigger da sind und kein reduced-motion). Ohne JS
   bleibt die urspruengliche Webflow-Flex-Reihe als Fallback. */
.about_year_item_frame {
  position: relative;
  z-index: 1;
}
.about_track_glow {
  position: absolute;
  inset: 0;
  z-index: 0;
  color: transparent;
  background: radial-gradient(ellipse 60% 55% at 50% 50%, currentColor 0%, transparent 70%);
  opacity: 0.25;
  filter: blur(50px);
  pointer-events: none;
}
/* Kein Pin mehr (Kunden-Feedback: "user harus scroll terlalu panjang,
   terasa seperti scroll-tour yang kepanjangan") -- .about_sticky ist trotz
   des Klassennamens keine sticky Flaeche mehr, sondern ein normaler Block
   in normalem Dokumentfluss. Klassenname bewusst NICHT umbenannt, um den
   Diff klein zu halten -- js/about-timeline.js und der HTML-Markup
   referenzieren ihn weiterhin. */
html.mw-year-track-on .about_track_scrub {
  height: auto;
}
html.mw-year-track-on .about_sticky {
  position: static;
  height: auto;
  overflow: visible;
}
html.mw-year-track-on .about_year_item_frame {
  width: 100%;
  height: 88vh;
}
html.mw-year-track-on .year_wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  gap: 14px;
}
html.mw-year-track-on .year_item {
  position: relative;
  height: 100%;
  width: 120px;
  max-width: none;
  flex: none;
  overflow: hidden;
  display: flex;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  border-radius: var(--_spacing---border-radious--lg);
  background-color: #e7e2d8;
  box-shadow: 0 30px 70px -35px rgba(18, 18, 18, 0.5);
  cursor: pointer;
  will-change: width;
}
html.mw-year-track-on .year_item::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.92) 0%,
    rgba(0, 0, 0, 0.62) 18%,
    rgba(0, 0, 0, 0.28) 38%,
    rgba(0, 0, 0, 0.06) 58%,
    transparent 72%
  );
  pointer-events: none;
}
html.mw-year-track-on .year_image {
  position: absolute;
  inset: 0;
  z-index: 0;
  /* Ueberschreibt die aspect-ratio:1/1 von weiter oben (fuer die alte
     Flex-Reihe gedacht, wo .year_image keine eigene Hoehe hatte) -- hier
     MUSS es die Kartenform fuellen (inset:0), nicht quadratisch bleiben. */
  aspect-ratio: auto;
}
html.mw-year-track-on .year_text_wrapper {
  position: relative;
  z-index: 2;
  padding: 0 26px;
  display: flex;
  align-items: center;
}
html.mw-year-track-on .floating_text {
  display: none;
}
html.mw-year-track-on .year_text {
  color: #fff;
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1;
  opacity: 0;
  white-space: nowrap;
  transition: opacity 0.25s ease;
}
html.mw-year-track-on .year_item.is-active .year_text {
  opacity: 1;
  transition-delay: 0.2s;
}
html.mw-year-track-on .year_text_line {
  display: none;
}
html.mw-year-track-on .year_content {
  position: relative;
  z-index: 2;
  max-width: none;
  width: 100%;
  padding: 16px 26px 30px;
}
html.mw-year-track-on .year_divider {
  display: none;
}
html.mw-year-track-on .year_info_text {
  color: rgba(255, 255, 255, 0.88);
  font-size: 15px;
  line-height: 1.5;
  margin: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
  transition-delay: 0s;
}
html.mw-year-track-on .year_item.is-active .year_info_text {
  opacity: 1;
  transition-delay: 0.25s;
}

/* Unter 768px: KEIN Akkordeon mehr. Erster Versuch war ein vertikales
   Akkordeon (Streifen 27px hoch) -- Feedback: "jelek banget". Stimmt --
   ein zusammengeklapptes Panel hat auf einem Handy-Screen schlicht keinen
   Platz, um irgendwas Sinnvolles zu zeigen (kein Hover zum Vorschauen,
   kein Raum fuer erkennbaren Bildausschnitt). Jeder Versuch, das
   Aufklapp-Konzept auf so wenig Breite zu pressen, sieht kaputt aus.

   Stattdessen: ein simples Swipe-Karussell, ein volles Jahr pro Screen
   (scroll-snap, nativ vom Browser, kein GSAP/JS noetig) -- etabliertes
   Mobile-Pattern (wie Instagram Stories), jede Karte immer voll lesbar
   statt kollabiert. Das Pin/300vh-Scroll-Feeling vom Desktop wird hier
   bewusst nicht nachgebaut: js/about-timeline.js erzeugt auf diesem
   Breakpoint gar keinen ScrollTrigger/keine Groessen-Logik mehr (siehe
   dort), die Sektion scrollt normal, das Karussell darin ist reines CSS. */
@media screen and (max-width: 767px) {
  html.mw-year-track-on .about_track_scrub {
    height: auto;
  }
  html.mw-year-track-on .about_sticky {
    position: static;
    height: auto;
    display: block;
  }
  html.mw-year-track-on .about_year_item_frame {
    height: auto;
  }
  html.mw-year-track-on .year_wrapper {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding: 0 6%;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0 6%;
  }
  html.mw-year-track-on .year_wrapper::-webkit-scrollbar {
    display: none;
  }
  html.mw-year-track-on .year_item {
    flex: 0 0 88%;
    width: 88%;
    scroll-snap-stop: always;
    height: 74vh;
    scroll-snap-align: center;
  }
  html.mw-year-track-on .year_text,
  html.mw-year-track-on .year_info_text {
    opacity: 1;
  }
  html.mw-year-track-on .year_text_wrapper {
    padding: 0 20px;
  }
  html.mw-year-track-on .year_content {
    padding: 12px 20px 28px;
  }
  .year_track_dots {
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    display: flex;
  }
  .year_track_dot {
    width: 7px;
    height: 7px;
    border-radius: var(--_spacing---border-radious--999);
    border: none;
    background-color: var(--black-secondary-30, rgba(18, 18, 18, 0.3));
    padding: 0;
    cursor: pointer;
    transition: width 0.3s ease, background-color 0.3s ease;
  }
  .year_track_dot.is-active {
    width: 20px;
    background-color: var(--black-primary, #121212);
  }
}

/* === Schritte 01-04: eigener, unabhaengiger horizontaler Scroll-Scrub ===
   War vorher an die Roadmap gekoppelt (ein gemeinsamer 500vh-Track, damit
   der Uebergang nahtlos wirkt) -- die Roadmap ist jetzt klickbasiert und
   nicht mehr gepinnt, es gibt also nichts mehr, wozu nahtlos uebergegangen
   werden muesste. js/steps-scrub.js baut hier einen eigenen, simplen
   Pin-Track direkt hinter .step_section (.steps_pin_track als Scroll-
   Distanz, .steps_pin_sticky als sticky Flaeche -- exakt dieselbe
   Technik wie vorher bei der Roadmap: position:sticky + ScrollTrigger nur
   fuers Auslesen des Fortschritts, kein GSAP pin:true). Timing/Rhythmus
   bewusst in derselben Groessenordnung wie vorher gehalten (siehe Kommentar
   in js/steps-scrub.js). */
html.mw-steps-scrub-on .steps_line,
html.mw-steps-scrub-on .step_line_icon {
  display: none;
}
/* js/steps-scrub.js reisst Hintergrund-Stack + Titel + .steps_wrapper aus
   .step_section raus und haengt sie in .steps_pin_sticky ein -- die
   originale Section bleibt danach als leere Huelle im Dokumentfluss
   stehen (eigenes Padding + grauer Rounded-Background), sichtbar als
   leere graue Pille vor "AUSGEWÄHLTE ARBEITEN". Nur ausblenden, wenn das
   Reparenting tatsaechlich passiert ist (Klasse wird von steps-scrub.js
   exakt in dem Moment gesetzt) -- Mobile/reduced-motion/fehlendes GSAP
   reparentet nichts, dort muss die Section mit ihrem Original-Inhalt
   sichtbar bleiben. */
html.mw-steps-scrub-on .step_section {
  display: none;
}
.steps_pin_track {
  position: relative;
  /* 330vh = 70vh Handoff-Phase (2026 wischt raus, Titel+Filmstrip wischen
     rein, siehe js/steps-scrub.js HANDOFF_END) + 260vh Schritte-Filmstrip
     (minus 100vh Pin-Freigabe = ~160vh echte Scrub-Distanz fuer 4 Schritte
     -- unveraendert gegenueber vorher). Handoff bewusst kurz (70vh, keine
     "lange Tour") -- reicht fuer einen sauberen Wisch-Effekt, ist aber
     schnell durchgescrollt. */
  height: 330vh;
}
.steps_pin_sticky {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  /* Basisfarbe hinter .steps_bg_stack -- der Stack blendet erst zusammen mit
     dem Handoff ein (js/steps-scrub.js updateHandoff), davor liegt hier
     schlichtes Weiss, exakt wie body{background-color:#fff}, damit der
     Jahres-Streifen waehrend der Browsing-Phase vor demselben Weiss steht
     wie zuvor in .about_section. */
  background-color: #fff;
}
/* Hintergrund-Stack: vier uebereinanderliegende Layer, je Schritt einer,
   linear per Scroll-Fortschritt ein-/ausgeblendet (js/steps-scrub.js). Muss
   VOR dem Jahres-Frame/Titel/Filmstrip im Markup stehen -- als
   position:absolute-Element erzeugt es sonst einen eigenen Stacking-
   Context, der trotz DOM-Reihenfolge ueber dem normal fliessenden Text
   landen wuerde, wenn der nicht selbst positioniert waere (siehe
   .about_year_item_frame/.steps_content_reveal unten). */
.steps_bg_stack {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
/* js/steps-scrub.js reparentet den ECHTEN .about_year_item_frame (kein
   Klon) hierher -- Positionierung/Groesse innerhalb von .steps_pin_sticky
   muessen daher hier ueberschrieben werden, statt die volle Hoehe aus dem
   html.mw-year-track-on .about_year_item_frame-Grund-Regel weiter oben zu
   uebernehmen. Vertikal zentriert per top/bottom:0 + margin:auto statt
   transform:translateY(-50%) -- js/steps-scrub.js animiert xPercent auf
   demselben Element per GSAP, und GSAP liest beim ERSTEN Zugriff auf die
   transform-Eigenschaft eine bereits per CSS gesetzte Transform als
   Basiswert ein (addiert sich dann fehlerhaft zum xPercent dazu statt ihn
   zu ersetzen -- bereits an anderer Stelle in dieser Codebase so
   dokumentiert/gefixt, siehe js/about-timeline.js Historie). Deshalb hier
   bewusst KEIN transform in der Ruheposition. Selektor-Spezifitaet (html +
   2 Klassen + Kind-Kombinator) hoeher als die Grund-Regel, damit height
   zuverlaessig ueberschrieben wird. */
html.mw-year-track-on .steps_pin_sticky > .about_year_item_frame {
  position: absolute;
  left: 5%;
  right: 5%;
  top: 0;
  bottom: 0;
  margin: auto;
  z-index: 1;
  /* width:auto UEBERSCHREIBT bewusst die width:100% der Grund-Regel oben --
     mit position:absolute + explizitem left/right/width waere die Box
     ueberbestimmt (width gewinnt per Spezifikation, "right" wuerde ignoriert
     und der Frame liefe rechts aus dem Bild). auto laesst die Breite aus
     left+right entstehen (echte 90%-Zentrierung wie beim vertikalen
     top/bottom/margin:auto). */
  width: auto;
  height: 78vh;
}
/* .about_track_scrub bleibt nach dem Reparenting als leere Huelle
   (.about_sticky > .about_track_glow, ohne den Frame) im Dokumentfluss --
   ausblenden, damit keine leere Luecke zwischen der Roadmap-Ueberschrift
   und .steps_pin_track entsteht. Nur wenn das Reparenting tatsaechlich
   passiert ist (Mobile/reduced-motion/fehlendes GSAP reparentet nichts,
   dort bleibt der Frame an seiner Original-Stelle sichtbar). */
html.mw-steps-scrub-on .about_track_scrub {
  display: none;
}
.steps_bg_layer {
  position: absolute;
  inset: 0;
  opacity: 0;
  will-change: opacity, transform;
}
.steps_bg_layer:nth-child(1) {
  /* 01 Erstgespraech -- warmer Auftakt, weicher goldener Glow auf Creme. */
  background:
    radial-gradient(60% 60% at 30% 40%, rgba(201, 166, 107, 0.38), transparent 65%),
    linear-gradient(160deg, #f6efdd 0%, #e4d9c3 100%);
}
.steps_bg_layer:nth-child(2) {
  /* 02 Konzept -- strukturiert/blaupausenhaft, feines Rasterlinien-Muster auf Navy. */
  background:
    repeating-linear-gradient(0deg, rgba(201, 166, 107, 0.07) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, rgba(201, 166, 107, 0.07) 0 1px, transparent 1px 64px),
    linear-gradient(160deg, #16233d 0%, #10192b 100%);
}
.steps_bg_layer:nth-child(3) {
  /* 03 Design & Motion -- dynamischer diagonaler Lichtstreif auf Bronze/Gold. */
  background:
    linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, 0.35) 48%, transparent 62%),
    linear-gradient(150deg, #8b6d3f 0%, #c9a66b 60%, #e7c88a 100%);
}
.steps_bg_layer:nth-child(4) {
  /* 04 Launch -- dramatisch, aufsteigender goldener Beam von unten auf fast Schwarz. */
  background:
    radial-gradient(45% 70% at 50% 120%, rgba(201, 166, 107, 0.55), transparent 60%),
    linear-gradient(180deg, #05070c 0%, #10192b 100%);
}
/* .steps_content_reveal buendelt Titel + Filmstrip zu EINEM Ziel fuer den
   Wisch-von-rechts (js/steps-scrub.js, spiegelbildlich zum echten Jahres-
   Frame oben) -- der Hintergrund-Stack bleibt aussen vor und driftet nicht
   mit. position:absolute + eigenes inset statt Flex-Kind von
   .steps_pin_sticky, damit es exakt denselben Bildausschnitt wie der Frame
   belegt (deckungsgleicher Wisch). display:flex bleibt als INNERES Layout
   fuer Titel+Filmstrip erhalten. */
.steps_content_reveal {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 48px;
}
/* Titel/Subline-Kontrast gegen den wechselnden Hintergrund-Stack (siehe
   js/steps-scrub.js updateHeaderContrast) -- weicher Farbwechsel per CSS-
   transition statt hartem Sprung, plus ein gegenlaeufiger, grosszuegig
   weicher Text-Schatten als Kontrast-Polster fuer den kurzen
   Uebergangsmoment selbst (kein hartes Drop-Shadow, eher ein sanftes
   Glimmen/Vignette). */
.steps_pin_sticky .step_section_title,
.steps_pin_sticky .step_section_info {
  transition: color 0.5s ease, text-shadow 0.5s ease;
  text-shadow: 0 2px 20px rgba(255, 255, 255, 0.4);
}
.steps_pin_sticky.is-on-dark-bg .step_section_title {
  color: #f8f3e9;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);
}
.steps_pin_sticky.is-on-dark-bg .step_section_info {
  color: #d9d0bb;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);
}
html.mw-steps-scrub-on .steps_wrapper {
  display: flex;
  flex-wrap: nowrap;
  gap: 24px;
  will-change: transform;
}
html.mw-steps-scrub-on .step_item {
  flex: 0 0 min(560px, 84vw);
  width: min(560px, 84vw);
}

/* === "Vertraut von Marken" auf Mobile: haelt laenger im Scroll ==========
   Basis-CSS schrumpft .leader_section (min-height) an jedem Breakpoint
   mit: 150vh Desktop -> 120vh (<=991px) -> 90vh (<=767px) -> 70vh
   (<=479px). Bei 70vh ist die Section KUERZER als ein einzelner Mobile-
   Viewport (~100vh) -- sie ist also nie zur Gaenze fuer sich allein im
   Bild, sondern wird schon waehrend des Reinscrollens sofort wieder vom
   naechsten Abschnitt (Testimonials) verdraengt.

   Runde 1: min-height auf 110vh angehoben -- am Desktop-Browser (Maus/
   Trackpad-Scroll, kleine Schritte pro Tick) sah das behoben aus. Auf
   einem echten Handy per Touch-Flick nicht: ein einzelner entschlossener
   Swipe + Lenis-Momentum legt leicht 700-1000px zurueck (siehe Messung
   in js/about-reveal.js, Fix Runde 2 -- dort wurden ~900px pro Flick per
   Playwright nachgewiesen). Bei kleinen Handy-Viewports ist 110vh nur
   knapp darueber, ein einzelner harter Swipe reisst also weiterhin
   quer durch die ganze Section.

   Runde 2: min-height deutlich grosszuegiger auf 200vh -- soll auch
   einen harten Einzel-Flick sicher ueberstehen (deutlich mehr als die
   gemessenen ~900-1000px), nicht nur knapp drueber liegen. Ring
   (.leader_circle_item) bleibt unveraendert, ruecht in der jetzt
   hoeheren Section nur weiter unten.

   Runde 3 -- 200vh war zu weit: .leader_section hat keine eigene
   Hintergrundfarbe (nur zentrierter Inhalt + Ring am unteren Rand), bei
   200vh blieb dazwischen sehr viel leere weisse Flaeche stehen ("banyak
   gap bg putih" zwischen Showreel und Testimonials). Zurueck auf 140vh --
   liegt klar ueber den gemessenen ~900-1000px eines harten Flicks (bei
   ueblichen 700-850px Handy-Viewporthoehe sind 140vh ~980-1190px), aber
   ohne die Section unnoetig weit ueber den Desktop-Wert (150vh) hinaus
   aufzublasen.

   Runde 4 (auf Wunsch des Nutzers) -- 100vh probiert: genau eine
   Viewport-Hoehe, kein Puffer mehr gegen einen harten Einzel-Flick.
   Knapper als Runde 1 (110vh), die dafuer schon als zu knapp befunden
   wurde -- falls das Verschwinden dadurch wieder zu schnell wirkt, ist
   140vh (Runde 3) der zuletzt bestaetigt gute Kompromisswert. */
@media screen and (max-width: 767px) {
  .leader_section {
    min-height: 100vh;
  }
}
@media screen and (max-width: 479px) {
  .leader_section {
    min-height: 100vh;
  }
}

/* === Ring "Vertraut von Marken": nicht mehr einklappen beim Rausscrollen
   =========================================================================
   Die 10 .leader_circle_item sind per data-mw-id-Interaktion so gebaut:
   beim REINscrollen (SCROLL_INTO_VIEW) faechern sie sich von rotate(0)
   (alle uebereinander gestapelt, sehen aus wie 1 Logo) zu ihrem eigenen
   Winkel auf (36deg-Schritte, volle 360deg-Ring). Beim RAUSscrollen
   (SCROLL_OUT_OF_VIEW, sobald das erste Item nur noch 10% sichtbar ist)
   laeuft GENAU DAS RUECKWAERTS -- und zwar mit duration:0, also ohne
   jede Animation: alle Items springen instantan zurueck auf rotate(0),
   wieder komplett uebereinander. Fuehlt sich an wie "ploetzlich nur noch
   1 Logo" -- exakt das gemeldete Verhalten.

   Fix: jedes Item bekommt seinen "aufgefaecherten" Zielwinkel fest per
   CSS mit !important -- die Interaktion laeuft technisch weiter, kann das
   Rotate aber nicht mehr zuruecksetzen (inline style verliert gegen
   !important in der Stylesheet-Kaskade). Reinscroll-Animation bleibt
   optisch unveraendert (Zielwinkel ist identisch), nur das ploetzliche
   Wieder-Einklappen beim Rausscrollen ist weg -- der Ring bleibt offen,
   waehrend .leader_circle_wrapper (eigenes Element, hier nicht
   angefasst) sich weiter per Scroll-Rotation dreht. */
.leader_circle_item { transform: translate(-50%) rotate(0deg) !important; }
.leader_circle_item._2 { transform: translate(-50%) rotate(-324deg) !important; }
.leader_circle_item._3 { transform: translate(-50%) rotate(-288deg) !important; }
.leader_circle_item._4 { transform: translate(-50%) rotate(-252deg) !important; }
.leader_circle_item._5 { transform: translate(-50%) rotate(-216deg) !important; }
.leader_circle_item._6 { transform: translate(-50%) rotate(-180deg) !important; }
.leader_circle_item._7 { transform: translate(-50%) rotate(-144deg) !important; }
.leader_circle_item._8 { transform: translate(-50%) rotate(-108deg) !important; }
.leader_circle_item._9 { transform: translate(-50%) rotate(-72deg) !important; }
.leader_circle_item._10 { transform: translate(-50%) rotate(-36deg) !important; }

/* === "AUSGEWAEHLTE ARBEITEN"-Karte mehrlenstein: Farbpaar-Historie =======
   =========================================================================
   1) War auf ein flaches, einheitliches #002C2E fuer BEIDE Haelften gestellt
      -- keine Farbabstufung wie bei den anderen drei Karten (Wuestenrot,
      Mehragentur #70BCFF/#339FFF, Pecuria #99FFC1/#66FFA2, jeweils helle
      Textseite + gesaettigtere/dunklere Bildseite desselben Farbtons).
      #002C2E hat zudem KEINEN Rotanteil (R=0), zusammen mit dem echten
      Gruen im Foto (Rasenflaechen im Bildraster) kippte die Karte monoton
      ins Gruene.
   2) Erster Fix: helles Zwei-Ton-Paar (#C4E8E5, ~84% Lightness) -- laut
      Kunde zu hell/blass.
   3) Zweiter Fix: #7FC9CE (~62% Lightness) -- Kunde wollte stattdessen ganz
      nah am Original bleiben: "buat warna sebelah kirinya itu mirip kayak
      sebelah kanan cuma turunin 5%".
   4) Aktueller Stand: .work_item links #004447 (= #002C2E mit ca. +5
      Lightness-Punkten, gleicher Farbton/Saettigung, nur knapp heller),
      .work_right_content rechts unveraendert #002C2E. Beide Haelften sind
      damit wieder fast-schwarz -- .is-dark-card (Text/Button/Link auf Creme
      #F8F3E9 gekippt) ist deshalb WIEDER noetig, sonst ist der dunkle
      Standardtext auf #004447 praktisch unlesbar (identisches Problem wie
      beim urspruenglichen #002C2E-Bug). */
.work_item.is-dark-card .work_title,
.work_item.is-dark-card .work_description_text,
.work_item.is-dark-card .button_text_v2 {
  color: #F8F3E9;
}
.work_item.is-dark-card .button_primary.v2 {
  border-color: #F8F3E9;
}
.work_item.is-dark-card .button_line {
  background-color: #F8F3E9;
}
.work_item.is-dark-card .work_link:hover {
  -webkit-text-decoration-color: #F8F3E9;
  text-decoration-color: #F8F3E9;
}

/* === "AUSGEWAEHLTE ARBEITEN"-Deck: 5. Karte (B-DACH + mehrkwuerdig dazu)
   =========================================================================
   Basis-CSS hat den Kartenstapel nur bis ._4 durchdekliniert (z-index 4->1).
   Template war fuer 4 Karten; 5. Karte braucht nur z-index 0 (eine Stufe
   hinter ._4). Stacking/Hoehe: siehe "einheitliche Kartenhoehe" (Grid-Zelle,
   kein absolute mehr — sonst bricht Equal-Height). */
.work_item._5 {
  z-index: 0;
  background-color: var(--vivid-orange);
}
.work_collection_list_wrapper._5 {
  z-index: 0;
}

/* === Hero: Scroll-Hinweis (Pfeil unten) ==================================
   Client wollte einen kleinen visuellen Hinweis, dass der Hero scrollbar
   ist -- gerade jetzt wichtig, wo beim Laden nur die Navbar zu sehen ist
   (js/hero-text-reveal.js) und Titel/Untertitel/Text erst beim Scrollen
   einfallen. Ohne Hinweis wirkt der Hero sonst wie eine fertige, statische
   Seite ohne Grund weiterzuscrollen.
   Sitzt unten mittig in .hero_section (position:relative, siehe Basis-CSS),
   dezenter Bounce per Keyframe, pointer-events:none (rein dekorativ, sonst
   blockiert es Klicks auf darunterliegende Hero-Elemente). Ausblenden bei
   Scroll-Start uebernimmt js/hero-text-reveal.js per Opacity. */
.hero_scroll_hint {
  z-index: 1;
  position: absolute;
  left: 50%;
  bottom: 40px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: var(--white);
  pointer-events: none;
}
.hero_scroll_hint_arrow {
  width: 20px;
  height: 20px;
  animation: hero-scroll-hint-bounce 1.8s ease-in-out infinite;
}
.hero_scroll_hint_text {
  font-family: var(--_typography---font-family--body-font);
  font-size: var(--_typography---font-sizes--body--text-sm);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.85;
}
@keyframes hero-scroll-hint-bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(6px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero_scroll_hint_arrow {
    animation: none;
  }
}

/* ============================================================================
   iOS IN-APP BROWSER FALLBACK
   ============================================================================
   iOS In-App Browser (Telegram, Instagram, Facebook) haben einen Bug:
   Ihre Toolbar aendert beim Ein-/Ausblenden den Layout-Viewport, was alle
   vh-basierten Hoehen und sticky-Elemente zum Springen bringt.
   Android hat dieses Problem NICHT.
   
   Fuer iOS In-App Browser: Sticky-Sektionen auf normale Block-Darstellung
   umstellen, damit nichts springt. Die Seite scrollt dann einfach durch. */

/* --- Layout: Sticky zu Block --- */
html.ios-in-app-browser .hero_track {
  height: auto;
  padding-bottom: 0;
}
html.ios-in-app-browser .hero_track .hero_section {
  position: relative;
  height: auto;
  min-height: 100svh;
  overflow: clip;
}
html.ios-in-app-browser .hero_track .hero_image {
  bottom: 0;
  height: auto;
}
html.ios-in-app-browser .about_track_scrub {
  height: auto;
}
html.ios-in-app-browser .about_sticky {
  position: relative;
  height: auto;
}
html.ios-in-app-browser .showreel_track {
  height: auto;
}
html.ios-in-app-browser .showreel_sticky {
  position: relative;
  height: auto;
}

/* --- Hero: NUR Headline sichtbar, Rest ausblenden, Pfeil weg --- */
html.ios-in-app-browser [data-hero-title] {
  visibility: visible !important;
  opacity: 1 !important;
}
html.ios-in-app-browser [data-hero-subtitle],
html.ios-in-app-browser [data-hero-text] {
  display: none !important;
}
html.ios-in-app-browser .hero_scroll_hint {
  display: none;
}
/* Nur erstes Hero-Bild sichtbar */
html.ios-in-app-browser .hero_slide:first-child {
  opacity: 1;
}

/* --- About: Logo/Pattern sofort sichtbar --- */
html.ios-in-app-browser [data-about-reveal],
html.ios-in-app-browser [data-about-reveal] .char {
  visibility: visible !important;
  opacity: 1 !important;
}
html.ios-in-app-browser [data-pattern-reveal] {
  clip-path: none !important;
  opacity: 1 !important;
}
html.ios-in-app-browser [data-pattern-reveal] video {
  opacity: 1;
}

/* --- Jahrestimeline: Mobile-Karussell sicherstellen --- */
html.ios-in-app-browser .about_year_item_frame {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
html.ios-in-app-browser .year_wrapper {
  display: flex;
  flex-direction: row;
  width: max-content;
}
html.ios-in-app-browser .year_item {
  flex: 0 0 100vw;
  width: 100vw;
  scroll-snap-align: start;
  opacity: 1 !important;
}
html.ios-in-app-browser .year_image {
  opacity: 1 !important;
}
html.ios-in-app-browser .year_content {
  opacity: 1 !important;
}

/* --- Schritte-Section sichtbar --- */
html.ios-in-app-browser .steps_wrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
html.ios-in-app-browser .step_item {
  opacity: 1 !important;
}

/* === "Unsere Werte" (about-us.html): editorialer Werte-Block ===========
   Vorher: Webflow-IX2-Timeline (t-610354a5, js/motion-about.js) skalierte
   drei GLEICH grosse .why_choose_item-Karten beim Scrollen von voller
   Breite auf 32.5% -- klassischer "3 Feature Cards"-Look ohne Hierarchie.
   .why_choose_track/.why_choose_item existieren im neuen Markup nicht mehr
   (siehe about-us.html), IX2 findet also gar keinen Trigger mehr.

   Mehrere Anlaeufe: Ueberlappung + Versatz (zu unverbunden, 03 wirkte
   isoliert), dann ein "Bent Grid" mit Rotation (auf Wunsch verworfen) --
   jetzt ein klares Bento-Grid: alle Kacheln haben saubere, gemeinsame
   Kanten und einen einheitlichen Abstand (kein Overlap, keine Rotation),
   die Hierarchie kommt ausschliesslich aus unterschiedlichen Kachel-
   groessen und -Oberflaechen. 01 spannt beide Zeilen der linken Spalten
   (dominant), 02 und 03 stapeln sich rechts (sekundaer/leiser) -- reines
   Bento-Puzzle, keine Luecken. Tiefe/Premium-Gefuehl kommt aus der
   Oberflaechen-Behandlung, nicht aus Layout-Tricks: 01 bekommt eine weiche,
   atmosphaerische Mehrfach-Verlaufskomposition (Gold-Bloom oben links,
   Bronze-Bloom unten rechts, dunkle Vignette am Boden wo die grosse
   Headline sitzt) statt einer billig wirkenden Rasterlinien-Textur, 02 und
   03 unterscheiden sich klar in Farbtemperatur/Schatten/Typo-Groesse statt
   nur eingefaerbte Kopien voneinander zu sein. Eintritts-Animation
   unveraendert: js/values-reveal.js. */
.values_grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 20px;
  margin-top: 16px;
}
.value_block_primary {
  grid-column: 1 / 8;
  grid-row: 1 / 3;
}
.value_block_secondary {
  grid-column: 8 / 13;
  grid-row: 1 / 2;
}
.value_block_supporting {
  grid-column: 8 / 13;
  grid-row: 2 / 3;
}
.value_block_frame {
  position: relative;
  height: 100%;
  padding: 44px;
  border-radius: var(--_spacing---border-radious--lg);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s ease,
    border-color 0.4s ease;
}
.value_block_frame:hover {
  transform: translateY(-5px);
}
.value_block_primary .value_block_frame {
  min-height: 680px;
  /* Warmes Kohle-/Kaffeeschwarz statt Navy -- ein Blauton wirkte in diesem
     hellen, texturarmen Umfeld zu "blau" statt zu "dunkel-filmisch". */
  background-image:
    radial-gradient(52% 42% at 18% 12%, rgba(201, 166, 107, 0.32), transparent 70%),
    radial-gradient(46% 52% at 88% 78%, rgba(139, 109, 63, 0.24), transparent 65%),
    radial-gradient(72% 46% at 50% 102%, rgba(0, 0, 0, 0.4), transparent 70%),
    linear-gradient(165deg, #221a12 0%, #0d0905 100%);
  border: 1px solid rgba(201, 166, 107, 0.22);
  box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.3), 0 40px 90px -40px rgba(10, 7, 4, 0.6);
}
.value_block_primary .value_block_frame:hover {
  border-color: rgba(201, 166, 107, 0.45);
  box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.3), 0 46px 100px -40px rgba(10, 7, 4, 0.72);
}
.value_block_secondary .value_block_frame {
  min-height: 330px;
  background:
    radial-gradient(70% 60% at 15% 10%, rgba(255, 255, 255, 0.45), transparent 60%),
    radial-gradient(65% 65% at 85% 90%, rgba(139, 109, 63, 0.2), transparent 70%),
    linear-gradient(160deg, #f8f2df 0%, #e4d9c3 100%);
  border: 1px solid rgba(27, 20, 13, 0.1);
  box-shadow: 0 26px 60px -30px rgba(139, 109, 63, 0.34);
}
.value_block_secondary .value_block_frame:hover {
  border-color: rgba(27, 20, 13, 0.18);
  box-shadow: 0 32px 70px -30px rgba(139, 109, 63, 0.44);
}
.value_block_supporting .value_block_frame {
  min-height: 330px;
  background: linear-gradient(160deg, #f8f3e9 0%, #efe6d2 100%);
  border: 1px solid rgba(139, 109, 63, 0.16);
  box-shadow: 0 18px 44px -30px rgba(27, 20, 13, 0.24);
}
.value_block_supporting .value_block_frame:hover {
  border-color: rgba(139, 109, 63, 0.3);
  box-shadow: 0 22px 52px -30px rgba(27, 20, 13, 0.32);
}
.value_block_top {
  position: absolute;
  top: 44px;
  left: 44px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.value_block_index {
  font-family: var(--_typography---font-family--heading-font);
  font-size: 18px;
  letter-spacing: 0.08em;
}
.value_block_rule {
  display: block;
  width: 32px;
  height: 1px;
  transition: width 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.value_block_frame:hover .value_block_rule {
  width: 56px;
}
.value_block_primary .value_block_index {
  color: #c9a66b;
}
.value_block_primary .value_block_rule {
  background: linear-gradient(90deg, #c9a66b, transparent);
}
.value_block_secondary .value_block_index {
  color: #8b6d3f;
}
.value_block_secondary .value_block_rule {
  background: linear-gradient(90deg, #8b6d3f, transparent);
}
.value_block_supporting .value_block_index {
  color: #8b6d3f;
}
.value_block_supporting .value_block_rule {
  background: linear-gradient(90deg, rgba(139, 109, 63, 0.55), transparent);
}
.value_block_kicker {
  font-size: 16px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 4px;
}
.value_block_title {
  font-family: var(--_typography---font-family--heading-font);
  font-weight: 400;
  text-transform: uppercase;
  line-height: 0.92;
  letter-spacing: 0.01em;
  margin: 0 0 20px;
}
.value_block_text {
  font-size: 18px;
  line-height: 1.55;
  margin: 0;
}
.value_block_primary .value_block_kicker {
  color: #c9a66b;
  font-size: 26px;
  letter-spacing: 0.02em;
  text-transform: none;
}
.value_block_primary .value_block_title {
  color: #fdfaf3;
  font-size: clamp(64px, 7.6vw, 140px);
}
.value_block_primary .value_block_text {
  max-width: 34ch;
  font-size: 20px;
  color: rgba(248, 243, 233, 0.88);
}
.value_block_secondary .value_block_kicker {
  color: #8b6d3f;
}
.value_block_secondary .value_block_title {
  color: #14100b;
  font-size: clamp(36px, 3.6vw, 56px);
}
.value_block_secondary .value_block_text {
  max-width: 28ch;
  color: rgba(27, 20, 13, 0.82);
}
.value_block_supporting .value_block_kicker {
  color: #8b6d3f;
}
.value_block_supporting .value_block_title {
  color: #14100b;
  font-size: clamp(30px, 2.9vw, 44px);
}
.value_block_supporting .value_block_text {
  max-width: 28ch;
  font-size: 17px;
  color: rgba(27, 20, 13, 0.78);
}

@media screen and (max-width: 991px) {
  .values_grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .value_block_primary,
  .value_block_secondary,
  .value_block_supporting {
    grid-column: 1 / -1;
    grid-row: auto;
  }
  .value_block_primary .value_block_frame {
    min-height: 500px;
  }
  .value_block_secondary .value_block_frame,
  .value_block_supporting .value_block_frame {
    min-height: 320px;
  }
}
@media screen and (max-width: 479px) {
  .value_block_frame {
    padding: 28px;
  }
  .value_block_top {
    top: 28px;
    left: 28px;
  }
}

/* Über-uns Hero: echte Kunden-Avatare (gestapelt) */
.users_avatar--stack {
  display: flex;
  align-items: center;
  max-width: none;
}
.users_avatar--stack .users_avatar_item {
  width: 44px;
  height: 44px;
  border-radius: var(--_spacing---border-radious--999);
  object-fit: cover;
  border: 2px solid var(--background-secondary, #f3ede3);
  margin-left: -12px;
}
.users_avatar--stack .users_avatar_item:first-child {
  margin-left: 0;
}
