img:is([sizes=auto i],[sizes^="auto," i]){contain-intrinsic-size:3000px 1500px}
img.emoji{display:inline!important;border:none!important;box-shadow:none!important;height:1em!important;width:1em!important;margin:0 .07em!important;vertical-align:-.1em!important;background:0 0!important;padding:0!important}
ul{box-sizing:border-box}
:root:where(p.has-background){padding:1.25em 2.375em}
:where(p.has-text-color:not(.has-link-color)) a{color:inherit}
html:where(img[class*=wp-image-]){height:auto;max-width:100%}
:where(figure){margin:0 0 1em}
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
figcaption,figure,header,section{display:block}
canvas,progress,video{display:inline-block;vertical-align:baseline}
[hidden],template{display:none}
a{background-color:transparent}
a:active,a:hover{outline:0}
strong{font-weight:700}
img{border:0}
figure{margin:1em 40px}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
button{overflow:visible}
button,html input[type=button],input[type=submit]{-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]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;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:textfield;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}
legend{border:0;padding:0}
optgroup{font-weight:700}
table{border-collapse:collapse;border-spacing:0}
.glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.glyphicon-search:before{content:"\e003"}
.glyphicon-star:before{content:"\2605"}
.glyphicon-star{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;font-style:normal;font-size:inherit;color:inherit;width:auto!important;height:auto!important;overflow:visible!important;position:static!important;display:inline!important}
.glyphicon-remove:before{content:"\e014"}
.glyphicon-volume-up:before{content:"\e038"}
.glyphicon-play:before{content:"\e072"}
.glyphicon-chevron-left:before{content:"\e079"}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
html{font-size:10px;-webkit-tap-highlight-color:transparent}
body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff}
button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}
a{color:#337ab7;text-decoration:none}
a:focus,a:hover{color:#23527c;text-decoration:underline}
a:focus{outline:dotted thin;outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}
img{vertical-align:middle}
.img-responsive{display:block;max-width:100%;height:auto}
[role=button]{cursor:pointer}
h1,h2,h3,h4{font-family:inherit;font-weight:500;line-height:1.1;color:inherit}
h1,h2,h3{margin-top:20px;margin-bottom:10px}
h4{margin-top:10px;margin-bottom:10px}
h1{font-size:36px}
h2{font-size:30px}
h3{font-size:24px}
h4{font-size:18px}
p{margin:0 0 10px}
ul{margin-top:0;margin-bottom:10px}
ul ul{margin-bottom:0}
samp{font-family:Menlo,Monaco,Consolas,"Courier New",monospace}
table{background-color:transparent}
.table{width:100%;max-width:100%;margin-bottom:20px}
.table>tbody+tbody{border-top:2px solid #ddd}
.table .table{background-color:#fff}
fieldset{padding:0;margin:0;border:0;min-width:0}
legend{display:block;width:100%;padding:0;margin-bottom:20px;font-size:21px;line-height:inherit;color:#333;border:0;border-bottom:1px solid #e5e5e5}
label{display:inline-block;max-width:100%;margin-bottom:5px;font-weight:700}
input[type=search]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
input[type=checkbox],input[type=radio]{margin:4px 0 0;line-height:normal}
select[multiple],select[size]{height:auto}
input[type=checkbox]:focus,input[type=radio]:focus{outline:dotted thin;outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}
input[type=search]{-webkit-appearance:none}
.btn{display:inline-block;margin-bottom:0;font-weight:400;text-align:center;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid transparent;white-space:nowrap;padding:6px 12px;font-size:14px;line-height:1.42857143;border-radius:4px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus{outline:dotted thin;outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}
.btn.focus,.btn:focus,.btn:hover{color:#333;text-decoration:none}
.btn.active,.btn:active{outline:0;background-image:none;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}
.fade{opacity:0;-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear}
.collapsing{position:relative;height:0;overflow:hidden;-webkit-transition-property:height,visibility;-o-transition-property:height,visibility;transition-property:height,visibility;-webkit-transition-duration:.35s;-o-transition-duration:.35s;transition-duration:.35s;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}
.hide{display:none!important}
.show{display:block!important}
.hidden{display:none!important}
@-ms-viewport{width:device-width}
.visible-xs{display:none!important}
body{font-size:13px;line-height:1.7;color:#535353;background-color:#f5f5f5}
body,h1,h2,h3,h4{font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif}
h1,h2,h3,h4{font-weight:700}
p{margin:0 0 20px}
iframe{border:0}
a{color:#000}
a:hover{color:#cd2122}
a:focus,a:hover{text-decoration:none}
a:focus{outline:0;color:initial;text-shadow:none}
legend{padding-bottom:10px}
img{height:auto}
embed,iframe,img,object{max-width:100%}
.row.gutter-0{margin-right:0;margin-left:0}
.row.gutter-0>[class*=col-]{padding-right:0;padding-left:0}
.fade{opacity:0;transition:opacity .15s linear}
.fade.in{opacity:1}
.u-trans-all-2s{transition:all .2s ease-out}
.circled-icon{display:inline-block;border-radius:50%;width:46px;height:46px;box-sizing:content-box;text-align:center;position:relative;border:2px solid currentColor}
.circled-icon,.circled-icon:before{line-height:46px;vertical-align:middle}
.circled-icon:before{display:block}
.circled-icon.ci-xsmall{width:22px;height:22px;line-height:22px}
.circled-icon.ci-xsmall:before{line-height:23px}
.fw-bold{font-weight:700!important}
.uppercase{text-transform:uppercase}
.cover-fit-img{-o-object-fit:cover;object-fit:cover;overflow:hidden}
.u-mb-0{margin-bottom:0!important}
body[class*=span]{float:none;margin-left:0}
#page_wrapper{position:relative;overflow:hidden;min-height:100vh;z-index:0}
.hoverBorder:hover img{transition:all .2s ease-out}
.hoverBorder{position:relative;display:inline-block;margin-bottom:25px}
.hoverBorder img{max-width:100%;box-sizing:border-box;border-radius:2px;width:100%;position:relative}
.hoverBorder:hover img{border-radius:2px;opacity:.8}
.hoverBorder:after{content:"";position:absolute;left:0;top:0;bottom:0;right:0;border-radius:3px;box-shadow:inset 0 0 0 3px hsla(0,0%,100%,.15);transition:box-shadow .2s ease-out,background-color .2s ease-out}
.hoverBorder:hover:after{box-shadow:inset 0 0 0 5px #cd2122}
@media (max-width:991px){.btn{white-space:normal}}
.btn-lined{background:0 0;color:#fff;text-shadow:none;padding:7px 20px;line-height:1.6;box-shadow:none;font-size:14px;font-weight:700;border-radius:3px;border:2px solid #fff;transition:all .1s ease-in-out}
.btn-lined:focus,.btn-lined:hover{border-color:hsla(0,0%,100%,.7);color:#fff}
.btn.btn-fullcolor{text-shadow:none;padding:10px 20px;line-height:1.6;box-shadow:none;font-size:13px;font-weight:700;border-style:solid;border-radius:3px;transition:background-color .15s ease-out}
.btn.btn-md{padding:16px 25px;font-size:14px;line-height:1.3333333}
.btn.btn-md.btn-lined{padding:14px 25px}
.mfp-bg{z-index:1042;overflow:hidden;background:#0b0b0b;opacity:.8}
.mfp-bg,.mfp-wrap{top:0;left:0;width:100%;height:100%;position:fixed}
.mfp-wrap{z-index:1043;outline:0!important;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px}
.mfp-container:before{content:"";display:inline-block;height:100%;vertical-align:middle}
.mfp-align-top .mfp-container:before{display:none}
.mfp-ajax-cur{cursor:progress}
.mfp-zoom-out-cur{cursor:zoom-out}
.mfp-arrow,.mfp-close,.mfp-counter{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.mfp-loading.mfp-figure{display:none}
button.mfp-arrow,button.mfp-close{overflow:visible;cursor:pointer;background:0 0;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;outline:0;padding:0;z-index:1046;box-shadow:none}
button::-moz-focus-inner{padding:0;border:0}
.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:.65;padding:0 0 18px 10px;color:#fff;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace}
.mfp-close:focus,.mfp-close:hover{opacity:1}
.mfp-close:active{top:1px}
.mfp-close-btn-in .mfp-close{color:#fff}
.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px;white-space:nowrap}
.mfp-arrow{position:absolute;opacity:.65;margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}
.mfp-arrow:active{margin-top:-54px}
.mfp-arrow:focus,.mfp-arrow:hover{opacity:1}
.mfp-arrow:after,.mfp-arrow:before{content:"";display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:inset transparent}
.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}
.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:.7}
.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%}
.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,.6);background:#000}
img.mfp-img{width:auto;max-width:100%;height:auto;display:block;padding:40px 0;margin:0 auto}
.mfp-figure,img.mfp-img{line-height:0}
.mfp-figure:after{content:"";position:absolute;left:0;top:40px;bottom:40px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,.6);background:#444}
.mfp-figure figure{margin:0}
.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}
.mfp-title{text-align:left;line-height:18px;color:#f3f3f3;word-wrap:break-word;padding-right:36px}
.mfp-fade.mfp-bg{background:#333;opacity:0;transition:all .15s ease-out}
.mfp-fade.mfp-bg.mfp-ready{opacity:.94}
.mfp-fade.mfp-bg.mfp-removing{opacity:0}
@media (max-width:900px){.mfp-arrow{transform:scale(.75)}.mfp-container{padding-left:6px;padding-right:6px}}
#totop{height:9px;opacity:0;position:fixed;right:-60px;width:49px;z-index:999;display:block;top:85%;background-repeat:no-repeat;background-position:center 15px;background-color:#404040;font-size:9px;font-weight:900;color:#fff;text-align:center;line-height:1;border-radius:2px;padding:28px 0 21px}
#totop:before{position:absolute;content:"\e080";top:10px;left:50%;margin-left:-6px;font-size:11px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transform:rotate(-90deg)}
#totop:hover{opacity:1}
.zn-bgSource-overlay{position:absolute;top:0;left:0;bottom:0;right:0}
.fxb,.fxb-row{display:-ms-flexbox;display:flex}
.fxb-col{-ms-flex:1;flex:1}
.fxb{-ms-flex-wrap:wrap;flex-wrap:wrap}
.fxb-center-y{-ms-flex-align:center;align-items:center}
.fxb-start-x{-ms-flex-pack:start;justify-content:flex-start}
.fxb-center-x{-ms-flex-pack:center;justify-content:center}
.fxb-end-x{-ms-flex-pack:end;justify-content:flex-end}
.fxb-basis-auto{-ms-flex-preferred-size:auto;flex-basis:auto}
.fxb-grow-0{-ms-flex-positive:0;flex-grow:0}
.zn_section{position:relative}
.slick-slider{box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.slick-list,.slick-slider{position:relative;display:block}
.slick-list{overflow:hidden;margin:0;padding:0}
.slick-list:focus{outline:0}
.slick-list.dragging{cursor:pointer;cursor:hand}
.slick-slider .slick-list,.slick-slider .slick-track{transform:translateZ(0)}
.slick-track{position:relative;left:0;top:0;display:block}
.slick-track:after,.slick-track:before{content:"";display:table}
.slick-track:after{clear:both}
.slick-loading .slick-track{visibility:hidden}
.slick-slide{display:none;float:left;height:100%;min-height:1px}
.slick-slide:active,.slick-slide:focus{outline:0}
[dir=rtl] .slick-slide{float:right}
.slick-slide img{display:block}
.slick-slide.slick-loading img{display:none}
.slick-slide.dragging img{pointer-events:none}
.slick-initialized .slick-slide{display:block}
.slick-loading .slick-slide{visibility:hidden}
.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}
.slick-arrow.slick-hidden{display:none}
.slick--showOnMouseover .znSlickNav{opacity:0;transition:opacity .15s ease-out}
.slick--showOnMouseover:hover .znSlickNav{opacity:1}
.znSlickNav-arr,.znSlickNav-arr svg{width:18px;height:18px;cursor:pointer}
.znSlickNav-arr polyline{transition:all .15s ease-out;stroke:#141414}
.znSlickNav-arr:hover polyline{stroke-width:35}
.znSlickNav-arr:active polyline{stroke-width:50}
.znSlickNav-arr.znSlickNav-prev{text-align:left}
.znSlickNav-arr.znSlickNav-next{text-align:right}
.slick-dots,.slick-dots ul{margin:0;padding:0;list-style:none}
.slick-dots li{display:inline-block;margin:0}
.slick-dots li button{padding:5px;background-color:#000;opacity:.5;width:6px;height:6px;display:block;border-radius:50%;text-indent:200%;overflow:hidden;box-sizing:content-box;border:none;background-clip:content-box;transition:opacity .2s}
.slick-dots li button:active,.slick-dots li button:focus{outline:0}
.slick-dots li.slick-active button{opacity:.8}
.element-scheme--dark .slick-dots li button,.znSlickNav--light .slick-dots li button{background-color:#fff}
.u-slick-show1stOnly:not(.slick-slide)~.u-slick-show1stOnly{display:none}
img.is-loaded{opacity:1;transition:opacity .2s}
.site-header-top-wrapper{position:relative}
.sh-component{margin-left:10px;margin-right:10px}
.site-header .site-header-main-left .sh-component:first-child,.site-header .site-header-top-left .sh-component:first-child{margin-left:0!important}
.site-header .site-header-main-right .sh-component:last-child,.site-header .site-header-top-right .sh-component:last-child{margin-right:0!important}
.site-logo-img{max-width:100%!important}
.main-nav ul{list-style:none;padding:0;margin:0}
.main-nav>ul:after,.main-nav>ul:before{display:table;content:" "}
.main-nav>ul:after{clear:both}
.main-nav ul li{margin-bottom:0}
.main-nav ul .menu-item a{display:block;font-weight:400}
.main-nav .menu-item>a[href="#"]{cursor:default}
.main-nav>ul>.logo-menu-wrapper,.main-nav>ul>.menu-item{float:left;margin-top:0;margin-left:5px}
.main-nav>ul>.menu-item:not(.menu-item-mega-parent){position:relative}
.main-nav>ul>.menu-item:first-child{margin-left:0}
.main-nav>ul>.menu-item>a{position:relative;padding:6px 12px;font-size:14px;line-height:1;color:#fff;z-index:1;font-weight:600;transition:padding .2s ease-in-out,transform .2s ease-in-out;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.mainnav--pointer-dash.main-nav>ul>.menu-item.menu-item-has-children>a:after{content:"";opacity:1;position:absolute;height:1px;width:7px;bottom:3px;bottom:calc(50% - 12px);left:17px;background-color:hsla(0,0%,100%,.4);transition:opacity .2s ease-in-out}
.main-nav.mainnav--active-bg>ul>.menu-item>a:before{content:"";opacity:0;position:absolute;border-radius:2px;height:14px;width:100%;top:50%;left:0;background-color:#cd2122;transform:translateY(-50%);transition:height .2s ease-in-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:-1}
.main-nav>ul>.menu-item.active>a,.main-nav>ul>.menu-item:hover>a,.main-nav>ul>.menu-item>a:hover{text-decoration:none;color:#fff}
.main-nav.mainnav--active-bg>ul>.menu-item.active>a:before,.main-nav.mainnav--active-bg>ul>.menu-item:hover>a:before,.main-nav.mainnav--active-bg>ul>.menu-item>a:hover:before{height:30px;opacity:1}
.mainnav--pointer-dash.main-nav>ul>.menu-item.active.menu-item-has-children>a:after,.mainnav--pointer-dash.main-nav>ul>.menu-item.menu-item-has-children:hover>a:after,.mainnav--pointer-dash.main-nav>ul>.menu-item.menu-item-has-children>a:hover:after{opacity:.7}
@media screen and (min-width:992px) and (max-width:1199px){.main-nav>ul>.menu-item{margin-left:3px}.main-nav>ul>.menu-item:first-child{margin-left:0}.main-nav>ul>.menu-item>a{font-size:12px;padding:6px}}
.main-nav ul ul.sub-menu .menu-item{position:relative}
.main-nav ul ul.sub-menu ul{top:100%;margin-top:0}
.main-nav ul ul.sub-menu .menu-item a:not(:only-child):after{position:absolute;top:50%;margin-top:-1px;right:10px;content:"";opacity:.6;background-color:rgba(0,0,0,.3);width:10px;height:2px}
.main-nav ul ul.sub-menu .menu-item a{min-width:230px;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgba(0,0,0,.03);padding:10px 20px}
.main-nav ul ul.sub-menu .menu-item a:hover,.main-nav ul ul.sub-menu .menu-item.active>a{color:#323232;background:rgba(0,0,0,.04)}
.main-nav .zn_mega_container,.main-nav ul ul.sub-menu{position:absolute;border-radius:2px;border:1px solid hsla(0,0%,100%,.8);box-shadow:0 0 4px rgba(0,0,0,.4);padding:6px 0;background:#f5f5f5}
.main-nav>ul>.menu-item>ul.sub-menu:before{content:"";display:block;position:absolute;top:-12px;left:0;width:100%;height:12px}
.main-nav>ul>.menu-item>ul.sub-menu:after{content:"";display:block;position:absolute;top:-11px;left:14px;border:6px solid transparent;border-bottom-width:5px;border-bottom-color:#f5f5f5}
.main-nav ul ul.sub-menu .menu-item:hover>ul{left:100%;top:-3px;opacity:1}
.main-nav .zn_mega_container{border:1px solid hsla(0,0%,100%,.8);box-shadow:0 0 4px rgba(0,0,0,.4);background:#f5f5f5;padding:6px 0;background:hsla(0,0%,96%,.95);position:absolute;padding:20px 0;margin-top:10px}
.main-nav .zn_mega_container:before{content:"";display:block;position:absolute;top:-12px;left:0;width:100%;height:12px}
.main-nav .zn_mega_container .menu-item a{padding:10px 0}
.main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover,.main-nav .zn_mega_container .menu-item.active>a:not(.zn_mega_title){color:#323232}
.main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before{content:"";display:block;position:absolute;width:0;height:2px;background-color:#cd2122;bottom:0;transition:width .15s cubic-bezier(.68,0,.265,1)}
.main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,.main-nav .zn_mega_container .menu-item.active>a:not(.zn_mega_title):before{width:100%}
.main-nav .zn_mega_container .menu-item a.zn_mega_title,.main-nav div.zn_mega_container ul .menu-item:last-child>a.zn_mega_title{font-size:14px;padding-left:0;padding-right:0;border-bottom-width:1px;border-bottom-style:solid;padding:12px 0;margin-bottom:15px;font-weight:600;text-transform:uppercase;border-bottom-color:rgba(0,0,0,.1);color:#333}
.main-nav .zn_mega_container .menu-item a,.main-nav ul ul.sub-menu .menu-item a{font-size:12px;color:#757575;position:relative}
.main-nav .zn_mega_container,.main-nav ul ul.sub-menu{left:-9999px;opacity:0;visibility:hidden;transition:opacity .4s ease,top .45s ease}
.main-nav .zn_mega_container{margin-left:15px;margin-right:15px;width:calc(100% - 30px)}
.main-nav ul ul.sub-menu{top:120%}
.main-nav>ul>.menu-item>ul.sub-menu{transform:translateY(10px)}
.main-nav .zn_mega_container{margin-top:30px;transition:opacity .4s ease,top .45s ease,margin-top .4s ease}
.main-nav ul .menu-item:hover>.zn_mega_container,.main-nav ul .menu-item:hover>ul{left:0;opacity:1;visibility:visible;z-index:100}
.main-nav ul .menu-item:hover>ul{top:100%}
.main-nav ul .menu-item:hover>.zn_mega_container{margin-top:10px}
.main-nav ul>.menu-item:hover>ul.zn_menu_on_left{right:0;left:auto}
.main-nav>ul>.menu-item>ul.zn_menu_on_left.sub-menu:after{left:auto;right:14px}
.main-nav ul>.menu-item:hover>ul ul.zn_menu_on_left{right:100%;left:auto}
.main-nav ul ul .menu-item a{transition:padding-left .35s ease,border-right .35s ease}
.zn-res-menu-nav,.zn-res-menuwrapper{display:block}
.zn-res-menuwrapper{margin-top:10px;margin-bottom:10px}
.zn-res-menu-nav,.zn-res-menu-nav li,.zn-res-menu-nav ul{padding:0;margin:0;list-style:none}
.zn-res-menu-nav *{-webkit-backface-visibility:hidden;backface-visibility:hidden;border-color:rgba(0,0,0,.15)}
.zn_res_menu_visible{overflow-x:hidden}
.zn_res_menu_visible .zn-res-menu-nav,.zn_res_menu_visible .zn-res-menu-nav li div.zn_mega_container,.zn_res_menu_visible .zn-res-menu-nav li ul.sub-menu{display:block}
.zn-res-menu-nav,.zn-res-menu-nav li div.zn_mega_container,.zn-res-menu-nav li ul.sub-menu{right:0;top:0;position:absolute;width:100%;height:100%;background:#fff;overflow:hidden;z-index:10000;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-overflow-scrolling:touch;transform:translate3d(100%,0,0);transition:transform .5s ease;transform-style:preserve-3d;display:none;max-width:100%}
@media (min-width:767px){.zn-res-menu-nav,.zn-res-menu-nav li div.zn_mega_container,.zn-res-menu-nav li ul.sub-menu{max-width:400px}.zn-res-menu-nav li div.zn_mega_container.zn-menu-visible,.zn-res-menu-nav li ul.sub-menu.zn-menu-visible,.zn-res-menu-nav.zn-menu-visible{box-shadow:0 0 40px rgba(0,0,0,.3)}}
.zn-res-menu-nav li div.zn-menu-visible,.zn-res-menu-nav ul.zn-menu-visible.sub-menu,.zn-res-menu-nav.zn-menu-visible{transform:translateZ(0)}
.zn-res-menu-nav .zn_mega_container{padding-left:0;padding-right:0}
.zn-res-menu-nav .zn_mega_title{margin-right:0;text-align:left;font-weight:600;text-transform:uppercase;color:rgba(0,0,0,.75)}
.zn-res-menu-nav li{position:static;border-bottom:1px solid rgba(0,0,0,.15)}
.zn-res-menu-nav li.menu-item-has-children>a.zn_mega_title{border-bottom:1px solid rgba(0,0,0,.15)}
.zn-res-menu-nav .zn_mega_container{width:100%}
.zn-res-menu-nav .zn_mega_container li{width:100%;float:none}
.zn-res-menu-nav li a{padding:12px 28px 11px;display:block;font-weight:400;color:rgba(0,0,0,.45)}
.zn-res-menu-nav li .zn_res_submenu_trigger+a{margin-right:49px}
.zn-res-menu-nav li a:hover,.zn-res-menu-nav li.active>a{color:rgba(0,0,0,.85)}
.zn-res-menu-nav li.active>a{background-color:rgba(0,0,0,.05)}
.zn-res-menu-nav a{cursor:pointer}
.zn-res-menu-nav .zn_res_has_submenu>span{position:absolute;right:0;width:49px;height:45px;border-left:1px solid rgba(0,0,0,.15);line-height:45px;vertical-align:middle;text-align:center;cursor:pointer;color:rgba(0,0,0,.45);top:auto}
.main-nav .zn_mega_container.zn-megaMenuSmartArea{padding-top:0;padding-bottom:0;border:0}
.main-nav .zn_mega_container.zn-megaMenuSmartArea .container{width:100%}
.zn-menuBurger{vertical-align:middle;position:relative;display:inline-block;width:25px;height:22px;margin-right:10px;transform:rotate(0);transition:.2s ease-out;cursor:pointer;opacity:.8}
.zn-menuBurger.is-active,.zn-menuBurger:hover{opacity:1}
.zn-menuBurger span{display:block;position:absolute;width:100%;background:hsla(0,0%,100%,.85);border-radius:2px;opacity:1;left:0;transform:rotate(0);transition:.25s ease-in-out}
.zn-menuBurger[class*="--3--"] span{height:3px}
.zn-menuBurger[class*="--s"]{width:20px}
.zn-menuBurger[class*="--s"] span:first-child{top:0}
.zn-menuBurger[class*="--s"] span:nth-child(2){top:6px}
.zn-menuBurger[class*="--s"] span:nth-child(3){top:12px}
.zn-menuBurger[class*="--m"]{width:27px}
.zn-menuBurger[class*="--m"] span:first-child{top:0}
.zn-menuBurger[class*="--m"] span:nth-child(2){top:9px}
.zn-menuBurger[class*="--m"] span:nth-child(3){top:18px}
.zn-menuBurger--anim1.is-active span:first-child{transform:rotate(135deg)}
.zn-menuBurger--anim1.is-active span:nth-child(2){opacity:0;left:-60px}
.zn-menuBurger--anim1.is-active span:nth-child(3){transform:rotate(-135deg)}
.zn-menuBurger--anim1.is-active[class*="--s"] span:first-child,.zn-menuBurger--anim1.is-active[class*="--s"] span:nth-child(3){top:6px}
.zn-menuBurger--anim1.is-active[class*="--m"] span:first-child,.zn-menuBurger--anim1.is-active[class*="--m"] span:nth-child(3){top:8px}
.kl-header-toptext{font-size:12px;line-height:24px;position:relative}
.kl-cta-ribbon{position:relative;font-size:11px;font-weight:700;color:#fff;text-align:center;padding:10px 10px 5px;border-radius:2px;margin-left:20px;z-index:1}
.kl-cta-ribbon .trisvg{position:absolute;top:100%;left:0;width:100%;height:5px}
.kl-cta-ribbon .trisvg path{fill:#cd2122}
.kl-cta-ribbon:focus .trisvg path,.kl-cta-ribbon:hover .trisvg path{fill:#fff}
.kl-cta-ribbon{display:block;background:#cd2122}
.kl-cta-ribbon:focus,.kl-cta-ribbon:hover{background:#fff;color:#000;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.kl-cta-ribbon strong{font-size:17px;font-weight:900;display:block}
@media (max-width:767px){.fxb-sm-half{-ms-flex-preferred-size:50%;flex-basis:50%}.fxb-sm-full{-ms-flex-preferred-size:100%;flex-basis:100%}.kl-cta-ribbon{margin-top:3px}}
.mfp-bg.mfp-fade.mfp-bg-lighter{background:#000}
.mfp-bg.mfp-fade.mfp-bg-lighter.mfp-ready{opacity:.75}
.chaser{display:none}
@media screen and (min-width:992px){.chaser{display:block;background:rgba(0,0,0,.85);padding:4px 0;position:fixed;right:0;top:0;width:100%;z-index:99998;opacity:0;visibility:hidden;transform:translate3d(0,-30px,0);-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform;transition-property:opacity,visibility,transform;transition-duration:.3s;transition-timing-function:ease-out}.chaser.visible{opacity:1;visibility:visible;transform:translateZ(0)}.chaser-main-menu,.chaser-main-menu ul{float:none;display:block;list-style:none;margin:0;padding:0;position:relative}.chaser-main-menu li:not(.menu-item-mega-parent){position:relative}.chaser-main-menu li.logo-menu-wrapper{display:none}.chaser-main-menu>li{float:left;border-left:1px solid hsla(0,0%,100%,.1)}.chaser-main-menu>li:last-child{border-right:1px solid hsla(0,0%,100%,.1)}.chaser-main-menu .sub-menu,.chaser-main-menu .zn_mega_container{left:-2999px;position:absolute;transform:translateY(20px);opacity:0;transition:opacity .15s ease-in-out,transform .15s ease-in-out}.chaser-main-menu .zn_mega_container{left:-2999px!important}.chaser-main-menu li ul{background:rgba(0,0,0,.9);min-width:200px;padding:5px}.chaser-main-menu .zn_mega_container>ul{padding-top:0;padding-bottom:20px}.chaser-main-menu .zn_mega_container>ul:first-child{padding-top:20px}.chaser-main-menu .zn_mega_container>ul:last-child{padding-bottom:30px}.chaser-main-menu .zn_mega_container ul ul{background:0 0;padding:10px 0 0}.chaser-main-menu .zn_mega_container .zn_mega_title{border-bottom:1px solid #454545;background:0 0}.chaser-main-menu li a{display:block;color:#ddd;font-size:13px;line-height:1.4;padding:16px 15px;transition:all .15s ease-in-out;position:relative}.chaser-main-menu li:hover>a:not(:only-child)+.sub-menu,.chaser-main-menu li:hover>a:not(:only-child)+.zn_mega_container{left:0;opacity:1;transform:translateY(0)}.chaser-main-menu li:hover>a:not(:only-child)+.zn_mega_container{left:-15px!important}.chaser-main-menu li>a:not(:only-child){padding-right:25px}.chaser-main-menu li>a:not(:only-child):after{content:"";position:absolute;top:50%;right:9px;margin-top:-1px;height:2px;width:6px;background:#ccc;opacity:.5}.chaser-main-menu li li:hover>a:not(:only-child)+.sub-menu{left:100%;top:-4px}.chaser-main-menu li a:hover,.chaser-main-menu li:hover>a{color:#fff;background:#000}.chaser-main-menu li.active>a{background:#cd2122}}
.zn-res-menu-nav li.logo-menu-wrapper{display:none}
.site-header{position:absolute;width:100%;background:rgba(0,0,0,.5);z-index:3}
.siteheader-container{position:relative;margin-left:auto;margin-right:auto}
.site-header.site-header--absolute{position:absolute}
@media (max-width:767px){.site-header{position:relative;height:auto}#site-header-FixedRelativeFix{display:none}.sheader-sh--light{background-color:#333}}
.site-header-separator{height:1px;opacity:.2;margin-top:3px;margin-bottom:3px;width:100%}
.sh--gray .main-nav>ul>li>a{color:#8c8c8c}
.sh--gray .main-nav>ul>li.menu-item-has-children>a:after{background-color:hsla(0,0%,47%,.4)}
.sh--gray .kl-header-toptext,.sh--gray .kl-header-toptext a{color:#878787}
.sh--gray .site-header-separator{background:#878787}
.sh--gray .zn-menuBurger span{background:rgba(0,0,0,.5)}
.sh--light .main-nav>ul>li>a{color:#f5f5f5}
.sh--light .kl-header-toptext,.sh--light .kl-header-toptext a{color:#fff}
.sh--light .site-header-separator{background:#fff}
.sh--light .zn-menuBurger span{background:hsla(0,0%,100%,.85)}
.sh--dark .main-nav>ul>li>a{color:#252525}
.sh--dark .main-nav>ul>li.menu-item-has-children>a:after{background-color:rgba(0,0,0,.4)}
.sh--dark .main-nav>ul>li.active>a,.sh--dark .main-nav>ul>li:hover>a,.sh--dark .main-nav>ul>li>a:hover{color:#111}
.sh--dark .main-nav.mainnav--active-bg>ul>li.active>a,.sh--dark .main-nav.mainnav--active-bg>ul>li:hover>a,.sh--dark .main-nav.mainnav--active-bg>ul>li>a:hover{color:#fff}
.sh--dark .kl-header-toptext,.sh--dark .kl-header-toptext a{color:#333}
.sh--dark .site-header-separator{background:#333}
.sh--dark .zn-menuBurger span{background:rgba(0,0,0,.75)}
@media (min-width:768px){.header--is-sticked.site-header.sticky-resize{height:auto!important}.header--is-sticked.site-header.sticky-resize .sticky-top-area .site-header-top{opacity:0;height:0!important;overflow:hidden;padding-top:0;padding-bottom:0}.header--is-sticked.site-header.sticky-resize .site-header-wrapper:not(.sticky-main-area) .site-header-main{height:60px}.header--is-sticked.site-header .site-header-separator{display:none}.site-header.style7.headerstyle--default{background:0 0}.site-header-main-right .sh-component{margin-left:20px;margin-right:20px}}
.site-header.style7{height:122px}
.site-header.style7 .site-header-top{height:46px}
.site-header.style7 .site-header-main{height:69px}
.site-header.style7 .main-nav,.site-header.style7 .zn-res-menuwrapper{margin-left:20px;margin-right:auto}
.site-header.style7 .kl-cta-ribbon{margin-bottom:-5px;-ms-flex-item-align:end;align-self:flex-end}
.site-header.style7 .kl-header-bg{position:absolute;top:0;left:0;width:100%;height:170%;opacity:.6;pointer-events:none;background:linear-gradient(180deg,#000 0,transparent)}
@media (max-width:767px){.site-header.style7 .site-header-top{padding-top:5px;padding-bottom:5px}.site-header.style7 .site-header-main{-ms-flex-wrap:wrap;flex-wrap:wrap}.site-header.style7 .site-header-main-center{-ms-flex-pack:start;justify-content:flex-start}.site-header.style7 .main-nav,.site-header.style7 .zn-res-menuwrapper{margin-left:0}.site-header{position:relative!important}.site-header .sh-component{margin-left:13px;margin-right:13px}.site-header,.site-header .site-header-main,.site-header .site-header-top{height:auto!important;position:relative}.site-header .logo-container{width:100%;text-align:center}.site-header.style7 .kl-cta-ribbon{margin-bottom:-5px;margin-top:-10px;align-self:center}.kl-cta-ribbon .trisvg{top:calc(100% - 1px)}}
@media (max-width:480px){.site-header .sh-component{margin:10px}}
.kl-slideshow{margin-bottom:0}
.kl-slideshow ul{list-style:none;margin:0;padding:0}
.page-subheader{min-height:300px;background-color:#066fd9}
.page-subheader .container{padding:0 15px;z-index:1;position:relative}
.kl-slideshow,.page-subheader{position:relative;top:0;z-index:0;width:100%}
.shiny-spark1{width:20px;height:20px;opacity:.4}
.shiny-spark2{width:10px;height:10px;opacity:.7}
.shiny-spark3{width:30px;height:30px;opacity:.1}
.shiny-spark4{width:3px;height:3px;opacity:.9}
.shiny-spark5{width:15px;height:15px;opacity:.3}
.shiny-spark6{width:25px;height:25px;opacity:.5}
canvas,video{max-width:100%}
html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0}
header,section{display:block}
h1{font-size:2em;margin:.67em 0}
figcaption,figure{display:block}
figure{margin:0}
a{background-color:transparent;-webkit-text-decoration-skip:objects}
strong{font-weight:inherit}
strong{font-weight:bolder}
samp{font-family:monospace,monospace;font-size:1em}
video{display:inline-block}
img{border-style:none}
svg:not(:root){overflow:hidden}
button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}
button,input{overflow:visible}
button,select{text-transform:none}
[type=submit],button,html [type=button]{-webkit-appearance:button}
[type=button]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}
[type=button]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}
fieldset{padding:.35em .75em .625em}
legend{-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}
progress{display:inline-block;vertical-align:baseline}
textarea{overflow:auto}
[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
canvas{display:inline-block}
template{display:none}
[hidden]{display:none}
.text-left{text-align:left}
.text-center{text-align:center}
.collapse{display:none}
.collapse.in{display:block}
tr.collapse.in{display:table-row}
tbody.collapse.in{display:table-row-group}
.collapsing{position:relative;height:0;overflow:hidden;-webkit-transition-property:height,visibility;transition-property:height,visibility;-webkit-transition-duration:.35s;transition-duration:.35s;-webkit-transition-timing-function:ease;transition-timing-function:ease}
.btn-lined{border-width:2px;background:0 0;color:#fff;text-shadow:none;padding:7px 20px;line-height:1.6;-webkit-box-shadow:none;box-shadow:none;font-size:14px;font-weight:700;border-style:solid;border-radius:3px;border-color:#fff;-webkit-transition:.1s ease-in-out;transition:all .1s ease-in-out}
.btn-lined:focus,.btn-lined:hover{border-color:rgba(255,255,255,.7);color:#fff}
.btn.btn--rounded{border-radius:3px!important}
.btn.btn--square{border-radius:0!important}
.btn.btn-fullcolor{border-width:0}
.btn.btn-fullcolor{text-shadow:none;padding:10px 20px;line-height:1.6;-webkit-box-shadow:none;box-shadow:none;font-size:13px;font-weight:700;border-style:solid;border-radius:3px;-webkit-transition:background-color .15s ease-out;transition:background-color .15s ease-out}
.btn.btn-fullcolor,.btn.btn-fullcolor:focus{background-color:#cd2122;color:#fff}
.btn.btn-fullcolor:hover{color:#fff}
.container{margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px}
@media (min-width:768px){.container{width:750px}}
@media (min-width:992px){.container{width:970px}}
@media (min-width:1200px){.container{width:1170px}}
.row{margin-left:-15px;margin-right:-15px}
@media (min-width:1200px){.col-lg-offset-3{margin-left:25%}}
.clearfix:after,.clearfix:before,.container:after,.container:before,.row:after,.row:before{content:" ";display:table}
.clearfix:after,.container:after,.row:after{clear:both}
.is-animating{visibility:visible;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
.is-animating.zn-anim-duration--1000{-webkit-animation-duration:1s;animation-duration:1s}
.zn-animateInViewport{visibility:hidden;-webkit-animation-name:none;animation-name:none}
.zn-bgSource,.zn-bgSource-image,.zn-bgSource-overlay{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;overflow:hidden}
.zn-bgSource-image{background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed}
.zn-bgSource-overlay{pointer-events:none}
.zn-videoBg{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;overflow:hidden;z-index:0}
.zn-videoBg iframe,.zn-videoBg video{display:block;max-width:none}
.zn-videoBg video{width:auto!important;height:auto!important;min-width:100%;min-height:100%}
@media (max-width:767px){.zn-videoBg:not(:only-child){display:none}}
.zn-bgSource-imageParallax{top:0;left:0;right:0;bottom:0;height:100%;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute;will-change:transform}
.zn-bgSource-imageParallax .zn-bgSource-image{top:0;left:0;position:relative;min-width:100%;min-height:100%;background-repeat:no-repeat;background-position:50%;background-size:cover;-webkit-backface-visibility:hidden;backface-visibility:hidden;background-attachment:initial}
.zn-bgSource-imageParallax.is-fixed{left:-100vw;position:fixed}
.zn-bgSource-imageParallax.is-fixed.is-visible{left:0}
.zn-bgSource-imageParallax.is-fixed .zn-bgSource-image{height:100vh}
.object-fit__cover{-o-object-fit:cover;object-fit:cover}
.kl-title-block{padding-top:35;padding-bottom:35px}
.tbk__title{margin-top:0;margin-bottom:10px;font-size:24px;line-height:30px;font-weight:400;font-style:normal}
.tbk__subtitle{margin-top:0;font-size:20px;font-size:20px;line-height:26px;font-weight:400;font-style:normal}
.znColumnElement-innerWrapper{width:100%}
.znColumnElement-innerContent{width:100%}
.zn_section{padding-top:35px;padding-bottom:35px;position:relative}
@media screen and (max-width:991px){.section-sidemargins .zn_section_size.full_width{margin-left:15px;margin-right:15px}}
.image-boxes{margin-bottom:30px;border-radius:2px}
.image-boxes-img{width:100%;height:auto}
.image-boxes-link{display:block;margin-bottom:20px;position:relative}
.image-boxes-img-wrapper{display:block}
.image-boxes-img.cover-fit-img{height:100%}
.image-boxes.image-boxes--1{overflow:visible}
.image-boxes.image-boxes--1 .image-boxes-img{box-shadow:0 1px 1px rgba(0,0,0,.22)}
.image-boxes.image-boxes--4 .image-boxes-img{-webkit-transition:opacity .2s ease-out;transition:opacity .2s ease-out;-webkit-backface-visibility:hidden}
.image-boxes.image-boxes--4:hover .image-boxes-img{opacity:.8}
.media-container{position:relative}
.media-container:hover>i{opacity:1}
.media-container.media-container--type-pb{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}
.media-container-pb{width:calc(100% - 50px);margin:10px 25px}
.media-container-pb.media-container-pb--alg-center{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}
@media screen and (min-width:1200px){.media-container{min-height:300px}}
@media screen and (min-width:992px) and (max-width:1199px){.media-container{min-height:300px}}
@media screen and (min-width:768px) and (max-width:991px){.media-container{min-height:300px}}
@media screen and (max-width:767px){.media-container{min-height:400px}}
.btn-element>i,.btn-element>span{vertical-align:middle;display:inline-block}
.btn-element>span+i{margin-left:10px}
.btn-element>i+span{margin-left:10px}
.kl-iconbox{margin-bottom:30px}
.kl-iconbox__desc-wrapper,.kl-iconbox__icon-wrapper,.kl-iconbox__title-wrapper{margin-top:0;margin-bottom:15px}
.kl-iconbox__content-wrapper{overflow:hidden}
.kl-iconbox__desc,.kl-iconbox__title{margin:0}
.kl-iconbox__icon{line-height:1;font-size:42px;-webkit-transition:color .2s cubic-bezier(.215,.61,.355,1);transition:color .2s cubic-bezier(.215,.61,.355,1)}
span.kl-iconbox__icon{font-size:42px}
img.kl-iconbox__icon{width:100px}
.kl-iconbox--theme-light,.kl-iconbox--theme-light a{color:#fff}
.ts-pt-testimonials{margin-left:-50px}
.ts-pt-testimonials__item{float:left;margin-left:50px;margin-bottom:50px;color:#fff}
.ts-pt-testimonials__item--size-4{width:calc(100% - 50px)}
.ts-pt-testimonials__text{background:rgba(0,0,0,.2);border-radius:3px;padding:50px 25px 40px;font-size:16px;font-weight:400;font-style:italic;line-height:1.7;position:relative}
.ts-pt-testimonials__text:after{content:'';position:absolute;left:55px;border:13px solid transparent}
.ts-pt-testimonials__item--normal .ts-pt-testimonials__text:after{top:100%;border-top-color:rgba(0,0,0,.2)}
.ts-pt-testimonials__item--normal .ts-pt-testimonials__infos{margin-top:15px}
.ts-pt-testimonials__item--normal .ts-pt-testimonials__infos--noimg{margin-top:25px;margin-left:20px}
.ts-pt-testimonials__name{font-size:16px;line-height:1.4;font-weight:700;text-transform:uppercase;margin-bottom:0;margin-top:0}
.ts-pt-testimonials__position{font-size:13px;line-height:1.4;font-weight:300;opacity:.5;margin-bottom:5px}
.ts-pt-testimonials__stars span{opacity:.6;font-size:14px;width:auto;height:auto;overflow:visible}
.slick-initialized .ts-pt-partners__img{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%);-webkit-transition:opacity .3s,-webkit-transform .2s;transition:opacity .3s ease 0s,-webkit-transform .2s ease 0s;transition:opacity .3s ease 0s,transform .2s ease 0s;transition:opacity .3s ease 0s,transform .2s ease 0s,-webkit-transform .2s ease 0s}
.slickSlider--activated .slick-active .ts-pt-partners__img{-webkit-transform:translateY(0);transform:translateY(0);opacity:1;-webkit-transition:opacity .6s .1s,-webkit-transform .6s;transition:opacity .6s ease .1s,-webkit-transform .6s ease 0s;transition:opacity .6s ease .1s,transform .6s ease 0s;transition:opacity .6s ease .1s,transform .6s ease 0s,-webkit-transform .6s ease 0s}
.slickSlider--activated .slick-active~.slick-active .ts-pt-partners__img{-webkit-transition-delay:0.2s,0.1s;transition-delay:0.2s,0.1s}
.slickSlider--activated .slick-active~.slick-active~.slick-active .ts-pt-partners__img{-webkit-transition-delay:0.3s,0.2s;transition-delay:0.3s,0.2s}
.slickSlider--activated .slick-active~.slick-active~.slick-active~.slick-active .ts-pt-partners__img{-webkit-transition-delay:0.4s,0.3s;transition-delay:0.4s,0.3s}
.slickSlider--activated .slick-active~.slick-active~.slick-active~.slick-active~.slick-active .ts-pt-partners__img{-webkit-transition-delay:0.5s,0.4s;transition-delay:0.5s,0.4s}
@-webkit-keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}to{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}
@keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}to{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}
.swing{-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}
h1{font-family:"",Helvetica,Arial,sans-serif;font-size:36px;line-height:40px;font-weight:400;font-style:normal}
h2{font-family:"",Helvetica,Arial,sans-serif;font-size:30px;line-height:40px;font-weight:400;font-style:normal}
h3{font-family:"",Helvetica,Arial,sans-serif;font-size:24px;line-height:40px;font-weight:400;font-style:normal}
h4{font-family:"",Helvetica,Arial,sans-serif;font-size:18px;line-height:28px;font-weight:400;font-style:normal}
body{font-size:14px;line-height:22px}
a{color:#3bbfad}
a:focus,a:hover{color:#fc0}
.element-scheme--light{color:#535353}
.element-scheme--light a{color:#3bbfad}
.element-scheme--light a:hover{color:#fc0}
.element-scheme--light .element-scheme__hdg1{color:#323232}
@media (max-width:992px){#main-menu{display:none!important}.site-header.style7 .main-menu-wrapper{margin-right:auto}}
@media (min-width:993px){.zn-res-menuwrapper{display:none}}
.site-header .siteheader-container{width:1421px}
@media (min-width:992px) and (max-width:1199px){.site-header .siteheader-container{width:100%}}
@media (min-width:768px) and (max-width:991px){.site-header .siteheader-container{width:100%}}
@media (max-width:767px){.site-header .siteheader-container{width:100%}}
@media (min-width:1200px) and (max-width:1420px){.site-header .siteheader-container{width:100%}}
.chaser-main-menu li.active>a,.kl-cta-ribbon,.main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before,.main-nav.mainnav--active-bg>ul>.menu-item>a:before{background-color:#3bbfad}
.btn.btn-fullcolor:hover{background-color:#2f998a}
.nivo-caption{border-left-color:#3bbfad}
.hoverBorder:hover:after{box-shadow:0 0 0 5px #3bbfad inset}
.kl-cta-ribbon{background-color:#3bbfad}
.kl-cta-ribbon .trisvg path{fill:#3bbfad}
.main-nav>ul>.menu-item>a{font-family:Arial,sans-serif;line-height:14px;font-weight:400;font-style:normal}
.main-nav>ul>.menu-item>a{font-size:13px}
.main-nav.mainnav--active-bg>ul>.menu-item>a:before{height:13px}
.main-nav.mainnav--active-bg>ul>.menu-item.active>a:before,.main-nav.mainnav--active-bg>ul>.menu-item:hover>a:before,.main-nav.mainnav--active-bg>ul>.menu-item>a:hover:before{height:calc(13 + 16px)}
.mainnav--pointer-dash.main-nav>ul>li.menu-item-has-children>a:after{bottom:calc(52% - 11px)}
.main-nav.mainnav--active-bg>ul>.menu-item.active>a:before,.main-nav.mainnav--active-bg>ul>.menu-item:hover>a:before,.main-nav.mainnav--active-bg>ul>.menu-item>a:hover:before{background-color:#3bbfad}
.main-nav .zn_mega_container .menu-item a,.main-nav ul ul.sub-menu .menu-item a{font-family:arial;font-size:13px;line-height:14px;font-weight:400;font-style:normal}
.main-nav .zn_mega_container .menu-item a.zn_mega_title,.main-nav div.zn_mega_container ul .menu-item:last-child>a.zn_mega_title{font-size:15px}
.kl-header-toptext{font-size:14px!important}
.glyphicon-chevron-left,.glyphicon-chevron-right,.zn_res_back_icon.glyphicon,.zn_res_submenu_trigger.glyphicon{font-family:inherit!important;display:inline-block;position:relative;width:1.1em;height:1.1em;line-height:1;vertical-align:-.125em}
.glyphicon-chevron-left::before,.glyphicon-chevron-right::before,.zn_res_back_icon.glyphicon::before,.zn_res_submenu_trigger.glyphicon::before{content:""!important;position:absolute;left:50%;top:50%;width:.62em;height:.62em;transform:translate(-50%,-50%);border-right:3px solid currentColor;border-bottom:3px solid currentColor;box-sizing:border-box}
.glyphicon.glyphicon-chevron-left::before{transform:translate(-50%,-50%) rotate(135deg)}
.glyphicon.glyphicon-chevron-right::before{transform:translate(-50%,-50%) rotate(-45deg)}
.zn_res_back_icon.glyphicon,.zn_res_submenu_trigger.glyphicon{width:1.1em;height:1.1em;vertical-align:middle}
li.only-mobile{display:none!important}
li.only-desktop{display:list-item!important}
@media (max-width:1024px){li.only-desktop{display:none!important}li.only-mobile{display:list-item!important}.zn-res-menu-nav li.only-desktop{display:none!important}.zn-res-menu-nav li.only-mobile{display:list-item!important}}
.fluid-width-video-wrapper{width:100%;position:relative;padding:0}
.fluid-width-video-wrapper embed,.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object{position:absolute;top:0;left:0;width:100%;height:100%}
.ca-content-wrapper{box-shadow:none}
.tbk__subtitle,.tbk__title,body,h1,h2,h3,h4{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important}
@font-face{font-display:swap;font-family:'Glyphicons Halflings';src:url('/static/fonts/glyphicons_halflingsregular.eot');src:url('/static/fonts/glyphicons_halflingsregular.eot?#iefix') format('embedded-opentype'),url('/static/fonts/glyphicons_halflingsregular.woff2') format('woff2'),url('/static/fonts/glyphicons_halflingsregular.woff') format('woff'),url('/static/fonts/glyphicons_halflingsregular.ttf') format('truetype'),url('/static/fonts/glyphicons_halflingsregular.svg#glyphicons_halflingsregular') format('svg')}
img[data-echo]{background:url(/static/images/ring-alt.svg) 50% no-repeat;opacity:.3}
#eluid0c01a02b .btn-custom-color.btn-element-0,#eluid27331c7e .btn-custom-color.btn-element-0,#eluid5d969941 .btn-custom-color.btn-element-0,#eluid8adaf242 .btn-custom-color.btn-element-0,#eluid934cb020 .btn-custom-color.btn-element-0,#eluidb34a9d43 .btn-custom-color.btn-element-0,#eluidbade4d4c .btn-custom-color.btn-element-0{background-color:#2591ea}
#eluid0c01a02b .btn-custom-color.btn-element-0:hover,#eluid27331c7e .btn-custom-color.btn-element-0:hover,#eluid5d969941 .btn-custom-color.btn-element-0:hover,#eluid8adaf242 .btn-custom-color.btn-element-0:hover,#eluid934cb020 .btn-custom-color.btn-element-0:hover,#eluidb34a9d43 .btn-custom-color.btn-element-0:hover,#eluidbade4d4c .btn-custom-color.btn-element-0:hover{background-color:#1e74bb}
#eluid4d755bb0 .btn-custom-color.btn-element-0,#eluid5cf15cbf .btn-custom-color.btn-element-0,#eluid67bb6d7e .btn-custom-color.btn-element-0,#eluid6c5df935 .btn-custom-color.btn-element-0,#eluid90b58547 .btn-custom-color.btn-element-0,#eluidcf82c233 .btn-custom-color.btn-element-0,#eluiddb83a581 .btn-custom-color.btn-element-0,#eluidef349f85 .btn-custom-color.btn-element-0,#eluidff24cc7f .btn-custom-color.btn-element-0{background-color:#3bbfad}
#eluid4d755bb0 .btn-custom-color.btn-element-0:hover,#eluid5cf15cbf .btn-custom-color.btn-element-0:hover,#eluid67bb6d7e .btn-custom-color.btn-element-0:hover,#eluid6c5df935 .btn-custom-color.btn-element-0:hover,#eluid90b58547 .btn-custom-color.btn-element-0:hover,#eluidcf82c233 .btn-custom-color.btn-element-0:hover,#eluiddb83a581 .btn-custom-color.btn-element-0:hover,#eluidef349f85 .btn-custom-color.btn-element-0:hover,#eluidff24cc7f .btn-custom-color.btn-element-0:hover{background-color:#2f998a}
#eluid4d755bb0 .btn-element-0,#eluid67bb6d7e .btn-element-0,#eluid6c5df935 .btn-element-0,#eluiddb83a581 .btn-element-0{color:#fff!important}
#eluidefac58e2 .znColumnElement-innerWrapper-eluid2764e428,#eluidefac58e2 .znColumnElement-innerWrapper-eluid2be30b4d,#eluidefac58e2 .znColumnElement-innerWrapper-eluid42e46462,#eluidefac58e2 .znColumnElement-innerWrapper-eluid6368f1a3,#eluidefac58e2 .znColumnElement-innerWrapper-eluidb23cd7be,#eluidefac58e2 .znColumnElement-innerWrapper-eluidb317de4e{height:px}
.eluid0042ff3a .tbk__subtitle,.eluid0ae83af1 .tbk__subtitle,.eluid0e75ebd9 .tbk__subtitle,.eluid113f4201 .tbk__subtitle,.eluid142b8718 .tbk__subtitle,.eluid1bf182b6 .tbk__subtitle,.eluid1e530c9c .tbk__subtitle,.eluid24930141 .tbk__subtitle,.eluid27f1fadc .tbk__subtitle,.eluid2823a408 .tbk__subtitle,.eluid28f34fd7 .tbk__subtitle,.eluid317a53dd .tbk__subtitle,.eluid38d2157d .tbk__subtitle,.eluid39d74467 .tbk__subtitle,.eluid3d95afce .tbk__subtitle,.eluid3f961be6 .tbk__subtitle,.eluid40a29f0e .tbk__subtitle,.eluid4bb6b5d5 .tbk__subtitle,.eluid4d9a2b20 .tbk__subtitle,.eluid4e6802bd .tbk__subtitle,.eluid5fb5abd8 .tbk__subtitle,.eluid63b8dd51 .tbk__subtitle,.eluid68e012ef .tbk__subtitle,.eluid690236b2 .tbk__subtitle,.eluid6ba7bd1e .tbk__subtitle,.eluid786aa6d8 .tbk__subtitle,.eluid78fff9fa .tbk__subtitle,.eluid7ab1fc77 .tbk__subtitle,.eluid87d18b0c .tbk__subtitle,.eluid9dfdc314 .tbk__subtitle,.eluida488e58f .tbk__subtitle,.eluida4a3daa0 .tbk__subtitle,.eluida97de8b2 .tbk__subtitle,.eluidb3f4bcb5 .tbk__subtitle,.eluidb46c1155 .tbk__subtitle,.eluidb91e945b .tbk__subtitle,.eluidc8664f75 .tbk__subtitle,.eluidca1a3ea7 .tbk__subtitle,.eluidd43ded62 .tbk__subtitle,.eluidd55623a9 .tbk__subtitle,.eluide0fc9480 .tbk__subtitle,.eluide2373318 .tbk__subtitle,.eluided8a1b50 .tbk__subtitle,.eluidef990846 .tbk__subtitle,.eluidf38cbd47 .tbk__subtitle,.eluidf5aeebf0 .tbk__subtitle,.eluidf9b28e9d .tbk__subtitle,.eluidffa25bbd .tbk__subtitle{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:16px;line-height:26px;font-weight:400;font-style:normal}
.eluid0042ff3a .tbk__title,.eluid00d9bd1a .tbk__title,.eluid05db2b63 .tbk__title,.eluid09d4e291 .tbk__title,.eluid0ae83af1 .tbk__title,.eluid0bbecc38 .tbk__title,.eluid0c3db861 .tbk__title,.eluid0e75ebd9 .tbk__title,.eluid0fe54425 .tbk__title,.eluid113f4201 .tbk__title,.eluid12420f83 .tbk__title,.eluid142b8718 .tbk__title,.eluid172ee7a4 .tbk__title,.eluid17484e69 .tbk__title,.eluid1ba693dc .tbk__title,.eluid1bf182b6 .tbk__title,.eluid1d8d842a .tbk__title,.eluid1e530c9c .tbk__title,.eluid1ef18bcd .tbk__title,.eluid1f874779 .tbk__title,.eluid1fc329c9 .tbk__title,.eluid23dc7402 .tbk__title,.eluid24930141 .tbk__title,.eluid27f1fadc .tbk__title,.eluid2823a408 .tbk__title,.eluid28f34fd7 .tbk__title,.eluid29f5a52f .tbk__title,.eluid2a2beb3e .tbk__title,.eluid2bb5e99e .tbk__title,.eluid2c0c99a5 .tbk__title,.eluid2e245f09 .tbk__title,.eluid313c9498 .tbk__title,.eluid317a53dd .tbk__title,.eluid36e627de .tbk__title,.eluid37d719dd .tbk__title,.eluid38d2157d .tbk__title,.eluid39d74467 .tbk__title,.eluid3bbcd083 .tbk__title,.eluid3d95afce .tbk__title,.eluid3f961be6 .tbk__title,.eluid40a29f0e .tbk__title,.eluid4104d0b1 .tbk__title,.eluid43d11a43 .tbk__title,.eluid446c1b45 .tbk__title,.eluid4bb6b5d5 .tbk__title,.eluid4d281bd4 .tbk__title,.eluid4d331711 .tbk__title,.eluid4d9a2b20 .tbk__title,.eluid4e6802bd .tbk__title,.eluid51901d2f .tbk__title,.eluid5243d651 .tbk__title,.eluid5251a6b9 .tbk__title,.eluid55a486af .tbk__title,.eluid55da2fed .tbk__title,.eluid5a8501de .tbk__title,.eluid5a92cfd0 .tbk__title,.eluid5aa361df .tbk__title,.eluid5b31783b .tbk__title,.eluid5c03b52f .tbk__title,.eluid5e9c77a9 .tbk__title,.eluid5f44c559 .tbk__title,.eluid5fb5abd8 .tbk__title,.eluid5fc99cb6 .tbk__title,.eluid61ad3a99 .tbk__title,.eluid62e4fc19 .tbk__title,.eluid63b8dd51 .tbk__title,.eluid6608abf8 .tbk__title,.eluid6672b620 .tbk__title,.eluid67b1ac9a .tbk__title,.eluid68251e6a .tbk__title,.eluid68e012ef .tbk__title,.eluid690236b2 .tbk__title,.eluid6ba48d84 .tbk__title,.eluid6ba7bd1e .tbk__title,.eluid6c4930e4 .tbk__title,.eluid70c28238 .tbk__title,.eluid72460dbd .tbk__title,.eluid726e52b0 .tbk__title,.eluid738ed99c .tbk__title,.eluid74bb90fd .tbk__title,.eluid768657d1 .tbk__title,.eluid7742ece1 .tbk__title,.eluid77f7bae5 .tbk__title,.eluid786aa6d8 .tbk__title,.eluid78b11baa .tbk__title,.eluid78fff9fa .tbk__title,.eluid795a4d23 .tbk__title,.eluid7ab1fc77 .tbk__title,.eluid7c6a89b8 .tbk__title,.eluid7d2b4b86 .tbk__title,.eluid7edace8e .tbk__title,.eluid7f7ae0ad .tbk__title,.eluid839cb81f .tbk__title,.eluid87d18b0c .tbk__title,.eluid8bd50732 .tbk__title,.eluid90c87a5b .tbk__title,.eluid9170afe8 .tbk__title,.eluid9215e283 .tbk__title,.eluid93543ce6 .tbk__title,.eluid94357ad9 .tbk__title,.eluid97c232f7 .tbk__title,.eluid9d2ac5be .tbk__title,.eluid9dfdc314 .tbk__title,.eluida488e58f .tbk__title,.eluida4a3daa0 .tbk__title,.eluida5fa6a2c .tbk__title,.eluida60b51aa .tbk__title,.eluida6c0a347 .tbk__title,.eluida97de8b2 .tbk__title,.eluidaaac8a48 .tbk__title,.eluidab52881e .tbk__title,.eluidab9d04d3 .tbk__title,.eluidb027a08c .tbk__title,.eluidb3f4bcb5 .tbk__title,.eluidb46c1155 .tbk__title,.eluidb4bf89e8 .tbk__title,.eluidb72a2406 .tbk__title,.eluidb7abab54 .tbk__title,.eluidb91e945b .tbk__title,.eluidb9236f50 .tbk__title,.eluidbe30ac3a .tbk__title,.eluidc1dcf061 .tbk__title,.eluidc5cacae8 .tbk__title,.eluidc60e5444 .tbk__title,.eluidc76ef42f .tbk__title,.eluidc796a714 .tbk__title,.eluidc81f54c0 .tbk__title,.eluidc8664f75 .tbk__title,.eluidca1a3ea7 .tbk__title,.eluidca5836ab .tbk__title,.eluidce716855 .tbk__title,.eluidd43ded62 .tbk__title,.eluidd4dea9fe .tbk__title,.eluidd55623a9 .tbk__title,.eluidd837ed12 .tbk__title,.eluidd8b1189e .tbk__title,.eluidd8c9d856 .tbk__title,.eluidd916cb30 .tbk__title,.eluidda8ffe48 .tbk__title,.eluiddb83184f .tbk__title,.eluiddc28ae18 .tbk__title,.eluiddc41a05c .tbk__title,.eluide0ee757c .tbk__title,.eluide0fc9480 .tbk__title,.eluide2373318 .tbk__title,.eluide2ddf357 .tbk__title,.eluide9cae321 .tbk__title,.eluide9ccd9bc .tbk__title,.eluided8a1b50 .tbk__title,.eluidef990846 .tbk__title,.eluidf06eecf5 .tbk__title,.eluidf3717263 .tbk__title,.eluidf38cbd47 .tbk__title,.eluidf5aeebf0 .tbk__title,.eluidf9b28e9d .tbk__title,.eluidf9f46979 .tbk__title,.eluidfa133c9f .tbk__title,.eluidff812e47 .tbk__title,.eluidffa25bbd .tbk__title{margin-bottom:10px}
.eluid0042ff3a .tbk__title,.eluid09d4e291 .tbk__title,.eluid0ae83af1 .tbk__title,.eluid0e75ebd9 .tbk__title,.eluid113f4201 .tbk__title,.eluid142b8718 .tbk__title,.eluid1bf182b6 .tbk__title,.eluid1fc329c9 .tbk__title,.eluid24930141 .tbk__title,.eluid2823a408 .tbk__title,.eluid28f34fd7 .tbk__title,.eluid313c9498 .tbk__title,.eluid317a53dd .tbk__title,.eluid39d74467 .tbk__title,.eluid3bbcd083 .tbk__title,.eluid3d95afce .tbk__title,.eluid3f961be6 .tbk__title,.eluid4bb6b5d5 .tbk__title,.eluid4e6802bd .tbk__title,.eluid5fb5abd8 .tbk__title,.eluid68e012ef .tbk__title,.eluid690236b2 .tbk__title,.eluid6ba48d84 .tbk__title,.eluid6ba7bd1e .tbk__title,.eluid786aa6d8 .tbk__title,.eluid78fff9fa .tbk__title,.eluid7ab1fc77 .tbk__title,.eluid7c6a89b8 .tbk__title,.eluid9dfdc314 .tbk__title,.eluida488e58f .tbk__title,.eluida4a3daa0 .tbk__title,.eluida97de8b2 .tbk__title,.eluidb3f4bcb5 .tbk__title,.eluidb46c1155 .tbk__title,.eluidd43ded62 .tbk__title,.eluidd55623a9 .tbk__title,.eluidd8c9d856 .tbk__title,.eluidda8ffe48 .tbk__title,.eluide0fc9480 .tbk__title,.eluide2373318 .tbk__title,.eluidef990846 .tbk__title,.eluidf38cbd47 .tbk__title,.eluidf9b28e9d .tbk__title,.eluidffa25bbd .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:30px;line-height:30px;font-weight:400;color:#222;font-style:normal}
.eluid0042ff3a,.eluid03b07ad4,.eluid06a4c705,.eluid0a3033cf,.eluid0ae83af1,.eluid0bbecc38,.eluid0c3db861,.eluid0e75ebd9,.eluid10fd5997,.eluid113f4201,.eluid142b8718,.eluid172ee7a4,.eluid17484e69,.eluid19541284,.eluid1b7f23f9,.eluid1bf182b6,.eluid1ef18bcd,.eluid1f874779,.eluid2060494f,.eluid23999337,.eluid23ba63d5,.eluid24930141,.eluid274a2062,.eluid2823a408,.eluid28f34fd7,.eluid2b493881,.eluid2e5391a6,.eluid2ea035c5,.eluid2f2da767,.eluid31223b02,.eluid317a53dd,.eluid3393a3d5,.eluid39d74467,.eluid3d95afce,.eluid3f961be6,.eluid3fa79353,.eluid426e9ad0,.eluid43d11a43,.eluid45bbc2bd,.eluid464012d8,.eluid48036e6a,.eluid480e70d2,.eluid48edeeb3,.eluid4bab4a81,.eluid4bb6b5d5,.eluid4e6802bd,.eluid50d8a6e3,.eluid51901d2f,.eluid5243d651,.eluid53070a22,.eluid55da2fed,.eluid56f9871e,.eluid5897f69e,.eluid5a92cfd0,.eluid5afc2eee,.eluid5c03b52f,.eluid5e087f0b,.eluid5fa8964f,.eluid5fb5abd8,.eluid68e012ef,.eluid690236b2,.eluid6ba7bd1e,.eluid7240f393,.eluid72460dbd,.eluid72eb984f,.eluid73c4e1ba,.eluid7742ece1,.eluid786aa6d8,.eluid78fff9fa,.eluid7ab1fc77,.eluid7edace8e,.eluid80547cff,.eluid82d6fc4f,.eluid8380c29a,.eluid839cb81f,.eluid85f3723e,.eluid860f4ea4,.eluid93543ce6,.eluid9572ec24,.eluid957a61bd,.eluid98e79939,.eluid9c1ec28a,.eluid9d2ac5be,.eluid9dfdc314,.eluida488e58f,.eluida4a3daa0,.eluida55b236f,.eluida5d43519,.eluida97de8b2,.eluidaf59538b,.eluidb3f4bcb5,.eluidb46c1155,.eluidb4bf89e8,.eluidb65b8d55,.eluidb6a8a74c,.eluidb9236f50,.eluidba66709d,.eluidc76ef42f,.eluidc81f54c0,.eluidc8527d36,.eluidcdf8a9b0,.eluidd437f401,.eluidd43ded62,.eluidd55623a9,.eluidd837ed12,.eluidd8b1189e,.eluiddae40180,.eluide0ee757c,.eluide0fc9480,.eluide2373318,.eluide272155a,.eluide28d64bb,.eluide4621624,.eluide861deb7,.eluide9ccd9bc,.eluidef419005,.eluidef990846,.eluidf06eecf5,.eluidf38cbd47,.eluidf9b28e9d,.eluidf9f46979,.eluidfbb09935,.eluidfc403585,.eluidfe702423,.eluidffa25bbd,.eluidffb14ba7{padding-top:0;padding-bottom:0}
.eluid00ad8386,.eluid08a32c36,.eluid0c0bcb48,.eluid104978a7,.eluid1b20af19,.eluid29761b98,.eluid2c041a3b,.eluid2f12334a,.eluid31322c8c,.eluid3aa0fac3,.eluid3fb9bbd9,.eluid420d98e5,.eluid4274bac7,.eluid4747d27a,.eluid47dbd0b0,.eluid4ab5aa30,.eluid4d5c6e80,.eluid53c50b4c,.eluid6ab40eed,.eluid6acaedbb,.eluid6c283b96,.eluid6f3b67e2,.eluid70dddc9e,.eluid732d9e1f,.eluid7fe78277,.eluid801a351c,.eluid80c1b8ed,.eluid8556b149,.eluid87ecaf3d,.eluid8a43e32f,.eluid90f326d4,.eluid9579ec7e,.eluid9a021e46,.eluid9e0e358d,.eluida4a4ed94,.eluida77e9656,.eluida836b83c,.eluidab505bbe,.eluidab8f8ff0,.eluidac6709e8,.eluidb2cd0197,.eluidb68df336,.eluidb8a9a46c,.eluidbd0c2ba9,.eluidc44ff451,.eluidc45a0128,.eluidc7f919c7,.eluidcea7062c,.eluidd4aabd64,.eluidd4eec359,.eluidd594782a,.eluidd7dbd931,.eluidd9548eb9,.eluiddc788125,.eluide4ef38d6,.eluide53f3b6c,.eluide9330035,.eluidf44c8e81,.eluidf710be2d,.eluidfe0241cf{margin-bottom:0}
.eluid00ad8386.image-boxes .image-boxes-img-wrapper,.eluid29761b98.image-boxes .image-boxes-img-wrapper,.eluid2c041a3b.image-boxes .image-boxes-img-wrapper,.eluid801a351c.image-boxes .image-boxes-img-wrapper,.eluid8556b149.image-boxes .image-boxes-img-wrapper,.eluid8a43e32f.image-boxes .image-boxes-img-wrapper,.eluida77e9656.image-boxes .image-boxes-img-wrapper,.eluidab505bbe.image-boxes .image-boxes-img-wrapper,.eluidcea7062c.image-boxes .image-boxes-img-wrapper,.eluidd4aabd64.image-boxes .image-boxes-img-wrapper,.eluide4ef38d6.image-boxes .image-boxes-img-wrapper,.eluidf710be2d.image-boxes .image-boxes-img-wrapper{height:593px}
.eluid00d9bd1a .tbk__subtitle,.eluid05db2b63 .tbk__subtitle,.eluid12420f83 .tbk__subtitle,.eluid2a2beb3e .tbk__subtitle,.eluid2c0c99a5 .tbk__subtitle,.eluid62e4fc19 .tbk__subtitle,.eluid6672b620 .tbk__subtitle,.eluid67b1ac9a .tbk__subtitle,.eluid726e52b0 .tbk__subtitle,.eluid77f7bae5 .tbk__subtitle,.eluid78b11baa .tbk__subtitle,.eluid7d2b4b86 .tbk__subtitle,.eluid9215e283 .tbk__subtitle,.eluida5fa6a2c .tbk__subtitle,.eluidb7abab54 .tbk__subtitle{font-size:18px;color:#666}
.eluid00d9bd1a .tbk__title,.eluid05db2b63 .tbk__title,.eluid12420f83 .tbk__title,.eluid2a2beb3e .tbk__title,.eluid2c0c99a5 .tbk__title,.eluid62e4fc19 .tbk__title,.eluid6672b620 .tbk__title,.eluid67b1ac9a .tbk__title,.eluid726e52b0 .tbk__title,.eluid768657d1 .tbk__title,.eluid77f7bae5 .tbk__title,.eluid78b11baa .tbk__title,.eluid7d2b4b86 .tbk__title,.eluid9215e283 .tbk__title,.eluida5fa6a2c .tbk__title,.eluidb7abab54 .tbk__title,.eluiddc28ae18 .tbk__title,.eluiddc41a05c .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:30px;line-height:30px;color:#222}
.eluid00d9bd1a,.eluid05db2b63,.eluid12420f83,.eluid1d8d842a,.eluid1fc329c9,.eluid2a2beb3e,.eluid2c0c99a5,.eluid313c9498,.eluid36e627de,.eluid3bbcd083,.eluid4d281bd4,.eluid5e9c77a9,.eluid5fc99cb6,.eluid61ad3a99,.eluid62e4fc19,.eluid6608abf8,.eluid6672b620,.eluid67b1ac9a,.eluid68251e6a,.eluid6ba48d84,.eluid6c4930e4,.eluid726e52b0,.eluid74bb90fd,.eluid768657d1,.eluid77f7bae5,.eluid78b11baa,.eluid7d2b4b86,.eluid9215e283,.eluida5fa6a2c,.eluidb7abab54,.eluidbe30ac3a,.eluidd4dea9fe,.eluidd8c9d856,.eluiddc28ae18,.eluiddc41a05c{padding-top:0;padding-bottom:35px}
.eluid02008032,.eluid0410d2d7,.eluid0d76a63b,.eluid1d7e6cfe,.eluid99da8d86{padding-top:108px;padding-bottom:145px}
.eluid043fd076,.eluid08eab70c,.eluid15cc80ac,.eluid5af2b4cd,.eluid7bd5e0b6,.eluid8a16ccca,.eluid8ab0893e,.eluid9a867cd7,.eluidbf2c3dbf,.eluidcc422674,.eluidd74d112e,.eluidd8803b0d,.eluide5d433f6{margin-top:-50px}
.eluid043fd076,.eluid08eab70c,.eluid15cc80ac,.eluid5af2b4cd,.eluid7bd5e0b6,.eluid8a16ccca,.eluid8ab0893e,.eluidbf2c3dbf,.eluidcc422674,.eluidd74d112e,.eluidd8803b0d,.eluide5d433f6{padding-right:5%;padding-left:5%}
.eluid05e18b27,.eluid087fcae8,.eluid4317896d,.eluid4b64fca9,.eluid549bdb0e,.eluid92b0ec8a,.eluida12149ed,.eluidcd4a41ca,.eluidd69fe5c0,.eluidd6a5f760,.eluide27006d6,.eluide2cddf6f{margin-top:0}
.eluid05e18b27,.eluid087fcae8,.eluid4317896d,.eluid4b64fca9,.eluid549bdb0e,.eluid92b0ec8a,.eluida12149ed,.eluidcd4a41ca,.eluidd69fe5c0,.eluidd6a5f760,.eluide27006d6{padding-right:5%;padding-left:0}
.eluid074eaf11,.eluid8b2a7410,.eluid8c112b50,.eluidd681a01f,.eluiddb68b50b{padding-top:1%;padding-right:50px}
.eluid08a32c36.image-boxes .image-boxes-img-wrapper,.eluid104978a7.image-boxes .image-boxes-img-wrapper,.eluid3fb9bbd9.image-boxes .image-boxes-img-wrapper,.eluid420d98e5.image-boxes .image-boxes-img-wrapper,.eluid6ab40eed.image-boxes .image-boxes-img-wrapper,.eluid90f326d4.image-boxes .image-boxes-img-wrapper,.eluid9a021e46.image-boxes .image-boxes-img-wrapper,.eluidab8f8ff0.image-boxes .image-boxes-img-wrapper,.eluidb2cd0197.image-boxes .image-boxes-img-wrapper,.eluidbd0c2ba9.image-boxes .image-boxes-img-wrapper,.eluidd4eec359.image-boxes .image-boxes-img-wrapper,.eluide9330035.image-boxes .image-boxes-img-wrapper{height:400px}
.eluid08a32c36.image-boxes .image-boxes-title,.eluid104978a7.image-boxes .image-boxes-title,.eluid420d98e5.image-boxes .image-boxes-title,.eluid6ab40eed.image-boxes .image-boxes-title,.eluid90f326d4.image-boxes .image-boxes-title,.eluid9a021e46.image-boxes .image-boxes-title,.eluidab8f8ff0.image-boxes .image-boxes-title,.eluidbd0c2ba9.image-boxes .image-boxes-title,.eluidd4eec359.image-boxes .image-boxes-title,.eluide9330035.image-boxes .image-boxes-title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:18px;color:#fff}
.eluid09ac1065,.eluid186ad93e,.eluid192fac67,.eluid2476b2f9,.eluid2703fb81,.eluid2a092f45,.eluid40ce0ea2,.eluid52c28535,.eluid52d0d586,.eluid56fb2362,.eluid5d31d776,.eluid7307aa9d,.eluid78031b7a,.eluid7c1a86f3,.eluid84aa0456,.eluid89ff1636,.eluid94ec9331,.eluida7b6f37a,.eluidb62e793f,.eluidbe098144,.eluidcaaedb92,.eluidd53c7b29{padding-top:1%}
.eluid09d4e291 .tbk__subtitle,.eluid1d8d842a .tbk__subtitle,.eluid1fc329c9 .tbk__subtitle,.eluid2bb5e99e .tbk__subtitle,.eluid313c9498 .tbk__subtitle,.eluid36e627de .tbk__subtitle,.eluid3bbcd083 .tbk__subtitle,.eluid61ad3a99 .tbk__subtitle,.eluid6608abf8 .tbk__subtitle,.eluid68251e6a .tbk__subtitle,.eluid6ba48d84 .tbk__subtitle,.eluid74bb90fd .tbk__subtitle,.eluid7c6a89b8 .tbk__subtitle,.eluidaaac8a48 .tbk__subtitle,.eluidbe30ac3a .tbk__subtitle,.eluidd8c9d856 .tbk__subtitle,.eluidda8ffe48 .tbk__subtitle{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:20px;line-height:26px;font-weight:400;font-style:normal}
.eluid09d4e291,.eluid7c6a89b8,.eluidda8ffe48{padding-top:14px;padding-bottom:14px}
.eluid0a8cc04d,.eluid0ab2af17,.eluid2071c1be,.eluid4ce4bca0,.eluid66619181,.eluid74cfb954,.eluid872277c2,.eluidac94e3e5,.eluidbaefd220,.eluidc1ab4745,.eluidcb5b7c6b,.eluiddc363305{min-height:555px}
.eluid0bbecc38 .tbk__title,.eluid1f874779 .tbk__title,.eluid43d11a43 .tbk__title,.eluid4d281bd4 .tbk__title,.eluid51901d2f .tbk__title,.eluid5c03b52f .tbk__title,.eluid5e9c77a9 .tbk__title,.eluid5fc99cb6 .tbk__title,.eluid6c4930e4 .tbk__title,.eluidb9236f50 .tbk__title,.eluidd4dea9fe .tbk__title,.eluidf06eecf5 .tbk__title,.eluidf9f46979 .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:60px;line-height:60px;font-weight:300;color:#fff}
.eluid0bfb566d,.eluid41e57d40,.eluidae0f5ec9{padding-top:100px;padding-bottom:54px}
.eluid0c0bcb48.image-boxes .image-boxes-img-wrapper,.eluid1b20af19.image-boxes .image-boxes-img-wrapper,.eluid53c50b4c.image-boxes .image-boxes-img-wrapper,.eluid6f3b67e2.image-boxes .image-boxes-img-wrapper,.eluid70dddc9e.image-boxes .image-boxes-img-wrapper,.eluid80c1b8ed.image-boxes .image-boxes-img-wrapper,.eluid9579ec7e.image-boxes .image-boxes-img-wrapper,.eluid9e0e358d.image-boxes .image-boxes-img-wrapper,.eluidb8a9a46c.image-boxes .image-boxes-img-wrapper,.eluidd9548eb9.image-boxes .image-boxes-img-wrapper,.eluiddc788125.image-boxes .image-boxes-img-wrapper{height:698px}
.eluid0c3db861 .tbk__title,.eluid172ee7a4 .tbk__title,.eluid23dc7402 .tbk__title,.eluid5aa361df .tbk__title,.eluid795a4d23 .tbk__title,.eluid94357ad9 .tbk__title,.eluidb027a08c .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:36px;line-height:36px;color:#fff}
.eluid0e9a3dce .kl-iconbox__inner .kl-iconbox__desc,.eluid34b003e4 .kl-iconbox__inner .kl-iconbox__desc,.eluid43f3bf05 .kl-iconbox__inner .kl-iconbox__desc,.eluida0302d40 .kl-iconbox__inner .kl-iconbox__desc{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:18px;line-height:24px;font-weight:400;color:#999;font-style:normal}
.eluid0e9a3dce .kl-iconbox__inner .kl-iconbox__title,.eluid34b003e4 .kl-iconbox__inner .kl-iconbox__title,.eluid43f3bf05 .kl-iconbox__inner .kl-iconbox__title,.eluida0302d40 .kl-iconbox__inner .kl-iconbox__title{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:18px;line-height:30px;font-weight:700;font-style:normal}
.eluid0f265094,.eluid39af9b7c,.eluid6e9efb37,.eluidfa269eb0{padding-top:255px;padding-bottom:230px}
.eluid0fe54425 .tbk__subtitle,.eluid1ba693dc .tbk__subtitle,.eluid2e245f09 .tbk__subtitle,.eluid37d719dd .tbk__subtitle,.eluid4104d0b1 .tbk__subtitle,.eluid446c1b45 .tbk__subtitle,.eluid4d331711 .tbk__subtitle,.eluid5251a6b9 .tbk__subtitle,.eluid55a486af .tbk__subtitle,.eluid5a8501de .tbk__subtitle,.eluid5b31783b .tbk__subtitle,.eluid5f44c559 .tbk__subtitle,.eluid70c28238 .tbk__subtitle,.eluid768657d1 .tbk__subtitle,.eluid7f7ae0ad .tbk__subtitle,.eluid8bd50732 .tbk__subtitle,.eluid9170afe8 .tbk__subtitle,.eluida6c0a347 .tbk__subtitle,.eluidab52881e .tbk__subtitle,.eluidab9d04d3 .tbk__subtitle,.eluidc1dcf061 .tbk__subtitle,.eluidc5cacae8 .tbk__subtitle,.eluidc60e5444 .tbk__subtitle,.eluidca5836ab .tbk__subtitle,.eluidce716855 .tbk__subtitle,.eluidd916cb30 .tbk__subtitle,.eluiddc28ae18 .tbk__subtitle,.eluiddc41a05c .tbk__subtitle,.eluide9cae321 .tbk__subtitle,.eluidf3717263 .tbk__subtitle,.eluidfa133c9f .tbk__subtitle{font-size:18px;color:#999}
.eluid0fe54425 .tbk__title,.eluid1ba693dc .tbk__title,.eluid2e245f09 .tbk__title,.eluid37d719dd .tbk__title,.eluid4104d0b1 .tbk__title,.eluid446c1b45 .tbk__title,.eluid4d331711 .tbk__title,.eluid5251a6b9 .tbk__title,.eluid55a486af .tbk__title,.eluid5a8501de .tbk__title,.eluid5b31783b .tbk__title,.eluid5f44c559 .tbk__title,.eluid70c28238 .tbk__title,.eluid7f7ae0ad .tbk__title,.eluid8bd50732 .tbk__title,.eluid9170afe8 .tbk__title,.eluida6c0a347 .tbk__title,.eluidab52881e .tbk__title,.eluidab9d04d3 .tbk__title,.eluidc1dcf061 .tbk__title,.eluidc5cacae8 .tbk__title,.eluidc60e5444 .tbk__title,.eluidca5836ab .tbk__title,.eluidce716855 .tbk__title,.eluidd916cb30 .tbk__title,.eluide9cae321 .tbk__title,.eluidf3717263 .tbk__title,.eluidfa133c9f .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:20px;color:#3bbfad}
.eluid0fe54425,.eluid1ba693dc,.eluid23dc7402,.eluid2e245f09,.eluid37d719dd,.eluid4104d0b1,.eluid446c1b45,.eluid4d331711,.eluid5251a6b9,.eluid55a486af,.eluid5a8501de,.eluid5aa361df,.eluid5b31783b,.eluid5f44c559,.eluid70c28238,.eluid795a4d23,.eluid7f7ae0ad,.eluid8bd50732,.eluid9170afe8,.eluid94357ad9,.eluida6c0a347,.eluidab52881e,.eluidab9d04d3,.eluidb027a08c,.eluidc1dcf061,.eluidc5cacae8,.eluidc60e5444,.eluidca5836ab,.eluidce716855,.eluidd916cb30,.eluide9cae321,.eluidf3717263,.eluidfa133c9f{padding-top:0;padding-bottom:8px}
.eluid105e3251 .kl-iconbox__inner .kl-iconbox__desc,.eluid27477389 .kl-iconbox__inner .kl-iconbox__desc,.eluid5062b447 .kl-iconbox__inner .kl-iconbox__desc,.eluid630a900e .kl-iconbox__inner .kl-iconbox__desc,.eluid72789e6e .kl-iconbox__inner .kl-iconbox__desc,.eluid8af1905e .kl-iconbox__inner .kl-iconbox__desc,.eluid8b6c0860 .kl-iconbox__inner .kl-iconbox__desc,.eluid93a415a3 .kl-iconbox__inner .kl-iconbox__desc,.eluid9917d494 .kl-iconbox__inner .kl-iconbox__desc,.eluidb0307a02 .kl-iconbox__inner .kl-iconbox__desc,.eluidd718ecb5 .kl-iconbox__inner .kl-iconbox__desc,.eluidd894f4ae .kl-iconbox__inner .kl-iconbox__desc,.eluidf6329966 .kl-iconbox__inner .kl-iconbox__desc,.eluidfe38b31d .kl-iconbox__inner .kl-iconbox__desc{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:14px;line-height:24px;font-weight:400;font-style:normal}
.eluid105e3251 .kl-iconbox__inner .kl-iconbox__icon,.eluid27477389 .kl-iconbox__inner .kl-iconbox__icon,.eluid5062b447 .kl-iconbox__inner .kl-iconbox__icon,.eluid630a900e .kl-iconbox__inner .kl-iconbox__icon,.eluid72789e6e .kl-iconbox__inner .kl-iconbox__icon,.eluid8af1905e .kl-iconbox__inner .kl-iconbox__icon,.eluid8b6c0860 .kl-iconbox__inner .kl-iconbox__icon,.eluid93a415a3 .kl-iconbox__inner .kl-iconbox__icon,.eluid9917d494 .kl-iconbox__inner .kl-iconbox__icon,.eluidb0307a02 .kl-iconbox__inner .kl-iconbox__icon,.eluidbde7bfc6 .kl-iconbox__inner .kl-iconbox__icon,.eluidcfa6441a .kl-iconbox__inner .kl-iconbox__icon,.eluidd718ecb5 .kl-iconbox__inner .kl-iconbox__icon,.eluidd894f4ae .kl-iconbox__inner .kl-iconbox__icon,.eluidf6329966 .kl-iconbox__inner .kl-iconbox__icon,.eluidfe38b31d .kl-iconbox__inner .kl-iconbox__icon{padding:24px}
.eluid105e3251 .kl-iconbox__inner .kl-iconbox__title,.eluid27477389 .kl-iconbox__inner .kl-iconbox__title,.eluid5062b447 .kl-iconbox__inner .kl-iconbox__title,.eluid630a900e .kl-iconbox__inner .kl-iconbox__title,.eluid72789e6e .kl-iconbox__inner .kl-iconbox__title,.eluid8af1905e .kl-iconbox__inner .kl-iconbox__title,.eluid8b6c0860 .kl-iconbox__inner .kl-iconbox__title,.eluid93a415a3 .kl-iconbox__inner .kl-iconbox__title,.eluid9917d494 .kl-iconbox__inner .kl-iconbox__title,.eluidb0307a02 .kl-iconbox__inner .kl-iconbox__title,.eluidd718ecb5 .kl-iconbox__inner .kl-iconbox__title,.eluidd894f4ae .kl-iconbox__inner .kl-iconbox__title,.eluidf6329966 .kl-iconbox__inner .kl-iconbox__title,.eluidfe38b31d .kl-iconbox__inner .kl-iconbox__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:20px;line-height:30px;font-weight:400;font-style:normal}
.eluid105e3251.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid27477389.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid5062b447.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid630a900e.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid72789e6e.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid8af1905e.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid8b6c0860.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid93a415a3.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluid9917d494.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluidb0307a02.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluidbde7bfc6.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluidcfa6441a.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluidd718ecb5.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluidd894f4ae.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluidf6329966.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon,.eluidfe38b31d.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon{background-color:#fff}
.eluid105e3251.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid105e3251.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid27477389.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid27477389.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid5062b447.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid5062b447.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid630a900e.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid630a900e.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid72789e6e.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid72789e6e.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid8af1905e.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid8af1905e.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid8b6c0860.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid8b6c0860.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid93a415a3.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid93a415a3.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluid9917d494.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluid9917d494.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluidb0307a02.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluidb0307a02.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluidbde7bfc6.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluidbde7bfc6.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluidcfa6441a.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluidcfa6441a.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluidd718ecb5.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluidd718ecb5.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluidd894f4ae.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluidd894f4ae.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluidf6329966.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluidf6329966.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon,.eluidfe38b31d.kl-iconbox--sh .kl-iconbox__inner .kl-iconbox__icon:after,.eluidfe38b31d.kl-iconbox--sh:hover .kl-iconbox__inner img.kl-iconbox__icon{background-color:#1bb56d}
.eluid121cf623,.eluid13e4ccf7,.eluid2a438052,.eluid34a92f86,.eluid61044eda,.eluid7d979a06,.eluid7e326ec7,.eluidbf70d4ae{padding-top:82px;padding-bottom:0}
.eluid12940be8,.eluid9bc1748a,.eluidb295aef3,.eluidf81622e4{padding-top:217px;padding-bottom:218px}
.eluid13bf25f9,.eluid33cfc5e2,.eluid5ab53478,.eluid5f3569ce,.eluid6a1598a3,.eluid7be97a38,.eluid90978b11,.eluidba039b8e,.eluidbfa4931a,.eluidcf2cf211,.eluiddaa9fddf,.eluide50b7f7a{padding-top:0;padding-bottom:20px}
.eluid13d9816d,.eluid186f6a68,.eluid264902db,.eluid32e2f480,.eluid41b1a45c,.eluid460b5085,.eluid62666a5e,.eluid68e80975,.eluid746caf2d,.eluid7d0c5ee2,.eluidc7c4d313,.eluidce95b51e,.eluidce9c591f,.eluidd1e182b9,.eluiddebe3f6d,.eluide5e466e0{min-height:655px}
.eluid140c630d,.eluid220cd59c,.eluid3fb5913e,.eluid58625070,.eluid6abc41b2,.eluid751e7442,.eluid9aaae96b,.eluida6974910,.eluidaca40444,.eluidcd1989b2{padding-top:0;padding-right:8%;padding-left:8%}
.eluid145c0268,.eluid23474057,.eluid25324424,.eluid34a8f454,.eluid700319f4,.eluid7e7e7841,.eluid8c830dbe,.eluid91530283,.eluid97f381c3,.eluida3eee633,.eluidc59af1cb,.eluide9f0e61d{padding-top:120px;padding-bottom:120px}
.eluid1578f152,.eluid2993ddc5,.eluid63ed0d9f,.eluid65a43ab9,.eluid6f4f487a,.eluida474ff6d,.eluida7bdd20e,.eluidf1cd6db2,.eluidf813a3b0{min-height:475px}
.eluid15cc543d,.eluid242a7baf,.eluid45978b4c,.eluid66dd70ef,.eluid9ecafe7e,.eluida052026e,.eluiddcf2f044,.eluidf38afcc8{padding-top:0;padding-right:10%;padding-left:10%}
.eluid17484e69 .tbk__title,.eluid55da2fed .tbk__title,.eluid5a92cfd0 .tbk__title,.eluid839cb81f .tbk__title,.eluid9d2ac5be .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:36px;line-height:36px;color:#222}
.eluid18ed875c,.eluid1e1f687d,.eluid635da935,.eluid88a757ec,.eluid9127cd79,.eluidab78fd03,.eluidb27ae761,.eluidb78ac8de,.eluidd152a53d,.eluidddbc1d56,.eluide20a0fa9,.eluidf43c2828,.eluidfb60f92c{min-height:626px}
.eluid192fac67,.eluid2476b2f9,.eluid2703fb81,.eluid52c28535,.eluid52d0d586,.eluid56fb2362,.eluid5d31d776,.eluid7307aa9d,.eluid78031b7a,.eluid84aa0456,.eluida7b6f37a,.eluidd53c7b29{margin-top:-110px}
.eluid1d6755f5,.eluid4daf4505,.eluidfd24868c{padding-top:115px;padding-bottom:109px}
.eluid1d8d842a .tbk__title,.eluid1ef18bcd .tbk__title,.eluid36e627de .tbk__title,.eluid5243d651 .tbk__title,.eluid61ad3a99 .tbk__title,.eluid6608abf8 .tbk__title,.eluid68251e6a .tbk__title,.eluid72460dbd .tbk__title,.eluid74bb90fd .tbk__title,.eluid7742ece1 .tbk__title,.eluid7edace8e .tbk__title,.eluid93543ce6 .tbk__title,.eluidb4bf89e8 .tbk__title,.eluidbe30ac3a .tbk__title,.eluidc76ef42f .tbk__title,.eluidc81f54c0 .tbk__title,.eluidd8b1189e .tbk__title,.eluide0ee757c .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:30px;line-height:30px;font-weight:400;color:#fff;font-style:normal}
.eluid1e530c9c .tbk__title,.eluid27f1fadc .tbk__title,.eluid38d2157d .tbk__title,.eluid40a29f0e .tbk__title,.eluid4d9a2b20 .tbk__title,.eluid63b8dd51 .tbk__title,.eluid87d18b0c .tbk__title,.eluidb91e945b .tbk__title,.eluidc8664f75 .tbk__title,.eluidca1a3ea7 .tbk__title,.eluided8a1b50 .tbk__title,.eluidf5aeebf0 .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:30px;line-height:30px;font-weight:100;color:#222;font-style:normal}
.eluid1e530c9c,.eluid27f1fadc,.eluid38d2157d,.eluid40a29f0e,.eluid4d9a2b20,.eluid63b8dd51,.eluid87d18b0c,.eluidb91e945b,.eluidc8664f75,.eluidca1a3ea7,.eluided8a1b50,.eluidf5aeebf0{padding-top:0;padding-bottom:9px}
.eluid1e530c9c.tbk--colored .tbk__symbol span,.eluid1fc329c9.tbk--colored .tbk__symbol span,.eluid27f1fadc.tbk--colored .tbk__symbol span,.eluid313c9498.tbk--colored .tbk__symbol span,.eluid38d2157d.tbk--colored .tbk__symbol span,.eluid3bbcd083.tbk--colored .tbk__symbol span,.eluid40a29f0e.tbk--colored .tbk__symbol span,.eluid4d9a2b20.tbk--colored .tbk__symbol span,.eluid63b8dd51.tbk--colored .tbk__symbol span,.eluid6ba48d84.tbk--colored .tbk__symbol span,.eluid87d18b0c.tbk--colored .tbk__symbol span,.eluidb91e945b.tbk--colored .tbk__symbol span,.eluidc8664f75.tbk--colored .tbk__symbol span,.eluidca1a3ea7.tbk--colored .tbk__symbol span,.eluidd8c9d856.tbk--colored .tbk__symbol span,.eluided8a1b50.tbk--colored .tbk__symbol span,.eluidf5aeebf0.tbk--colored .tbk__symbol span{background-color:#cd2122}
.eluid1ef18bcd .tbk__subtitle,.eluid5243d651 .tbk__subtitle,.eluid72460dbd .tbk__subtitle,.eluid7742ece1 .tbk__subtitle,.eluid7edace8e .tbk__subtitle,.eluid93543ce6 .tbk__subtitle,.eluidb4bf89e8 .tbk__subtitle,.eluidc76ef42f .tbk__subtitle,.eluidc81f54c0 .tbk__subtitle,.eluidd8b1189e .tbk__subtitle,.eluide0ee757c .tbk__subtitle{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:20px;line-height:26px;font-weight:400;color:#fff;font-style:normal}
.eluid2136e0d5,.eluidbe35d0dd,.eluidc27bd4c8{padding-top:287px;padding-bottom:283px}
.eluid21c2e673,.eluid93b05943,.eluid9d46262f,.eluidb76774df,.eluidbcfd66ee{min-height:472px}
.eluid23dc7402 .tbk__subtitle,.eluid5aa361df .tbk__subtitle,.eluid795a4d23 .tbk__subtitle,.eluid94357ad9 .tbk__subtitle,.eluidb027a08c .tbk__subtitle{font-size:24px;line-height:24px;color:#fff}
.eluid29f5a52f .tbk__subtitle,.eluid738ed99c .tbk__subtitle,.eluid90c87a5b .tbk__subtitle,.eluida60b51aa .tbk__subtitle,.eluidb72a2406 .tbk__subtitle,.eluidc796a714 .tbk__subtitle,.eluiddb83184f .tbk__subtitle,.eluide2ddf357 .tbk__subtitle,.eluidff812e47 .tbk__subtitle{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:18px;line-height:26px;font-weight:400;color:#fff;font-style:normal}
.eluid29f5a52f .tbk__title,.eluid738ed99c .tbk__title,.eluid90c87a5b .tbk__title,.eluida60b51aa .tbk__title,.eluidb72a2406 .tbk__title,.eluidc796a714 .tbk__title,.eluiddb83184f .tbk__title,.eluide2ddf357 .tbk__title,.eluidff812e47 .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:24px;line-height:30px;font-weight:400;color:#fff;font-style:normal}
.eluid29f5a52f,.eluid738ed99c,.eluid90c87a5b,.eluida60b51aa,.eluidb72a2406,.eluidc796a714,.eluiddb83184f,.eluide2ddf357,.eluidff812e47{padding-top:0;padding-bottom:15px}
.eluid29f5a52f.tbk--colored .tbk__symbol span,.eluid738ed99c.tbk--colored .tbk__symbol span,.eluid90c87a5b.tbk--colored .tbk__symbol span,.eluida60b51aa.tbk--colored .tbk__symbol span,.eluidb72a2406.tbk--colored .tbk__symbol span,.eluidc796a714.tbk--colored .tbk__symbol span,.eluiddb83184f.tbk--colored .tbk__symbol span,.eluide2ddf357.tbk--colored .tbk__symbol span,.eluidff812e47.tbk--colored .tbk__symbol span{background-color:#fff}
.eluid2bb5e99e .tbk__title,.eluidaaac8a48 .tbk__title{font-family:Montserrat,Helvetica,Arial,sans-serif;font-size:30px;line-height:42px;font-weight:300;color:#fff;font-style:normal}
.eluid2bb5e99e,.eluid97c232f7,.eluidaaac8a48{padding-top:11px;padding-bottom:26px}
.eluid2e32f0a2,.eluide17b83b8{min-height:685px}
.eluid2f12334a.image-boxes .image-boxes-img-wrapper,.eluid31322c8c.image-boxes .image-boxes-img-wrapper,.eluid3aa0fac3.image-boxes .image-boxes-img-wrapper,.eluid4274bac7.image-boxes .image-boxes-img-wrapper,.eluid4747d27a.image-boxes .image-boxes-img-wrapper,.eluid47dbd0b0.image-boxes .image-boxes-img-wrapper,.eluid6acaedbb.image-boxes .image-boxes-img-wrapper,.eluid6c283b96.image-boxes .image-boxes-img-wrapper,.eluidadbb0711.image-boxes .image-boxes-img-wrapper,.eluidb68df336.image-boxes .image-boxes-img-wrapper,.eluidc7f919c7.image-boxes .image-boxes-img-wrapper,.eluidd594782a.image-boxes .image-boxes-img-wrapper{height:556px}
.eluid3165899a,.eluid8ee541a2,.eluidbb215723{padding-top:77px;padding-bottom:160px}
.eluid3a73a9de,.eluid60751b62,.eluidd433c9d8,.eluidfc8e1a76{min-height:479px}
.eluid3fb9bbd9.image-boxes .image-boxes-title,.eluidb2cd0197.image-boxes .image-boxes-title{font-size:18px;color:#fff}
.eluid41f79335,.eluid4b91ec8a,.eluid8404c6bd,.eluid9462cf3e,.eluida47669b0{padding-top:125px;padding-bottom:87px}
.eluid4ab5aa30.image-boxes .image-boxes-img-wrapper,.eluid4d5c6e80.image-boxes .image-boxes-img-wrapper,.eluid732d9e1f.image-boxes .image-boxes-img-wrapper,.eluid7fe78277.image-boxes .image-boxes-img-wrapper,.eluid87ecaf3d.image-boxes .image-boxes-img-wrapper,.eluida4a4ed94.image-boxes .image-boxes-img-wrapper,.eluida836b83c.image-boxes .image-boxes-img-wrapper,.eluidac6709e8.image-boxes .image-boxes-img-wrapper,.eluidc44ff451.image-boxes .image-boxes-img-wrapper,.eluidc45a0128.image-boxes .image-boxes-img-wrapper,.eluide53f3b6c.image-boxes .image-boxes-img-wrapper,.eluidf44c8e81.image-boxes .image-boxes-img-wrapper,.eluidfe0241cf.image-boxes .image-boxes-img-wrapper{height:626px}
.eluid55a1aa9c,.eluid7012f758,.eluid727177eb{padding-top:0;padding-right:5%;padding-left:5%}
.eluid592aa51e,.eluid65247104,.eluid6e82cbb3,.eluid82b24278,.eluid8735f33e,.eluid9a609ddc,.eluidb1a772b4{padding-top:100px;padding-bottom:100px}
.eluid7c4cdf9b,.eluidca61f7b8{min-height:340px}
.eluid8e45550e .ca-container,.eluid8e45550e .ca-item,.eluidbb588c36 .ca-container,.eluidbb588c36 .ca-item{min-height:450px}
.eluid9d3bdddd,.eluide97bb58b{margin-top:-150px;margin-left:-80px}
.eluid9d3bdddd,.eluide97bb58b{padding-right:60%}
.eluidb12cbe1e,.eluidcb86c34b,.eluidf1547c34{padding-top:15%;padding-right:10%;padding-bottom:0;padding-left:10%}
.eluidbde7bfc6 .kl-iconbox__inner .kl-iconbox__desc,.eluidcfa6441a .kl-iconbox__inner .kl-iconbox__desc{font-size:14px;line-height:24px;font-weight:400;font-style:normal}
.eluidbde7bfc6 .kl-iconbox__inner .kl-iconbox__title,.eluidcfa6441a .kl-iconbox__inner .kl-iconbox__title{font-size:20px;line-height:30px;font-weight:400;font-style:normal}
.zn_section.eluid06a4c705,.zn_section.eluid10fd5997,.zn_section.eluid1d6755f5,.zn_section.eluid2b493881,.zn_section.eluid2ea035c5,.zn_section.eluid2f2da767,.zn_section.eluid3393a3d5,.zn_section.eluid3fa79353,.zn_section.eluid426e9ad0,.zn_section.eluid45bbc2bd,.zn_section.eluid48edeeb3,.zn_section.eluid4daf4505,.zn_section.eluid50d8a6e3,.zn_section.eluid53070a22,.zn_section.eluid56f9871e,.zn_section.eluid5897f69e,.zn_section.eluid5afc2eee,.zn_section.eluid5fa8964f,.zn_section.eluid72eb984f,.zn_section.eluid73c4e1ba,.zn_section.eluid80547cff,.zn_section.eluid8380c29a,.zn_section.eluid85f3723e,.zn_section.eluid9572ec24,.zn_section.eluid957a61bd,.zn_section.eluid98e79939,.zn_section.eluid9c1ec28a,.zn_section.eluida55b236f,.zn_section.eluidaf59538b,.zn_section.eluidb65b8d55,.zn_section.eluidb6a8a74c,.zn_section.eluidba66709d,.zn_section.eluidc8527d36,.zn_section.eluiddae40180,.zn_section.eluide272155a,.zn_section.eluide28d64bb,.zn_section.eluide4621624,.zn_section.eluide861deb7,.zn_section.eluidef419005,.zn_section.eluidfbb09935,.zn_section.eluidfc403585,.zn_section.eluidfd24868c,.zn_section.eluidffb14ba7{background-color:#fff}
.zn_section.eluid0bfb566d,.zn_section.eluid121cf623,.zn_section.eluid13e4ccf7,.zn_section.eluid145c0268,.zn_section.eluid23474057,.zn_section.eluid25324424,.zn_section.eluid2a438052,.zn_section.eluid34a8f454,.zn_section.eluid34a92f86,.zn_section.eluid41e57d40,.zn_section.eluid61044eda,.zn_section.eluid700319f4,.zn_section.eluid7d979a06,.zn_section.eluid7e326ec7,.zn_section.eluid7e7e7841,.zn_section.eluid8c830dbe,.zn_section.eluid91530283,.zn_section.eluid97f381c3,.zn_section.eluida3eee633,.zn_section.eluidae0f5ec9,.zn_section.eluidbf70d4ae,.zn_section.eluidc59af1cb,.zn_section.eluide9f0e61d{background-color:#3bbfad}
.zn_section.eluid3165899a,.zn_section.eluid8ee541a2,.zn_section.eluidbb215723{background-color:#f5f5f5}
.zn_section.eluid41f79335,.zn_section.eluid4b91ec8a,.zn_section.eluid8404c6bd,.zn_section.eluid9462cf3e,.zn_section.eluida47669b0{background-color:#efefef}
.zn_section.eluid592aa51e,.zn_section.eluid65247104,.zn_section.eluid6e82cbb3,.zn_section.eluid82b24278,.zn_section.eluid8735f33e,.zn_section.eluid9a609ddc,.zn_section.eluidb1a772b4{background-color:#0a0a0a}
.acc--style4 .acc-tgg-button.collapsed .acc-icon{right:5px!important;width:32px!important;height:32px!important;border-width:2px!important;border-color:#8bb8cc!important;top:50%!important;margin-top:-16px!important}.acc--style4 .acc-tgg-button.collapsed .acc-icon:before{width:12px!important;height:2px!important;margin-left:-6px!important;margin-top:-1px!important;background-color:#8bb8cc!important}.acc--style4 .acc-tgg-button.collapsed .acc-icon:after{width:2px!important;height:12px!important;margin-left:-1px!important;margin-top:-6px!important;background-color:#8bb8cc!important}.acc--style4 .acc-tgg-button .acc-icon{right:5px!important;width:32px!important;height:32px!important;border-width:2px!important;top:50%!important;margin-top:-16px!important;opacity:.5!important}.acc--style4 .acc-tgg-button .acc-icon:before{width:12px!important;height:2px!important;margin-left:-6px!important;margin-top:-1px!important}.acc--style4 .acc-tgg-button:hover .acc-icon{opacity:.8!important}.acc--style4 .acc-tgg-button.collapsed:hover .acc-icon{border-color:#5a9ab5!important}.acc--style4 .acc-tgg-button.collapsed:hover .acc-icon:before,.acc--style4 .acc-tgg-button.collapsed:hover .acc-icon:after{background-color:#5a9ab5!important}
}
.flag-svg{width:auto;height:20px;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.1)}.flt-a{display:inline-flex;text-decoration:none;line-height:1;transition:opacity .2s}.flt-a:hover{opacity:.9!important}
.x13-lang{display:flex;align-items:center;gap:0;background:rgba(255,255,255,.12);border-radius:999px;padding:2px;border:1px solid rgba(255,255,255,.3);flex-shrink:0;white-space:nowrap}.x13-t{display:flex;align-items:center;justify-content:center;padding:3px 10px;font-size:14px;font-weight:700;letter-spacing:.03em;color:rgba(255,255,255,.6);text-decoration:none;border-radius:999px;transition:color .2s,background .2s;line-height:1;white-space:nowrap}.x13-t:hover{color:#fff}.x13-t.x13-active{color:#fff;background:rgba(255,255,255,.22)}.chaser .x13-lang{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);margin-left:auto}.chaser .x13-t{color:rgba(255,255,255,.5)}.chaser .x13-t:hover{color:rgba(255,255,255,.9)}.chaser .x13-t.x13-active{color:#fff;background:rgba(255,255,255,.18)}@media(max-width:767px){.x13-t{font-size:12px;padding:2px 7px}}
/* ============================================================
   MABUL DESIGN-FIX PASS — 2026-08-19
   Shared by EN (/static/style-en.css) and CN (/cn/static/style.css).
   Appended last so it wins on specificity/order without editing
   any upstream Kallyas rule.
   ============================================================ */

/* --- A1  Desktop dropdown + mega submenu items: 12/13px -> 14px ---------
   was: .main-nav .zn_mega_container .menu-item a,
        .main-nav ul ul.sub-menu .menu-item a { font-size:12px }
        (+ a later arial 13px override)
   Contrast also raised: #323232 on the #f5f5f5 panel = 10.6:1 (AAA).       */
@media (min-width: 992px) {
  .main-nav ul ul.sub-menu .menu-item a,
  .main-nav .zn_mega_container .menu-item a,
  .main-nav .zn_mega_container li a,
  .site-header.style10 .main-nav ul ul.sub-menu li a {
    font-size: 14px !important;
    line-height: 1.45 !important;
    letter-spacing: .01em;
    color: #323232;
  }
  .main-nav ul ul.sub-menu .menu-item a:hover,
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover {
    color: #cd2122;
  }
  /* mega column headings stay a step above the items */
  .main-nav .zn_mega_container .menu-item a.zn_mega_title {
    font-size: 15px !important;
    line-height: 1.4 !important;
    color: #1f1f1f;
  }
}

/* --- A2  "WHERE TO STAY" mega dropdown: kill the dead white space -------
   Scoped to the mega container only; ordinary sub-menus untouched.
   Columns shrink-to-fit instead of stretching to a fixed grid width.      */
@media (min-width: 992px) {
  .main-nav .zn_mega_container {
    width: auto !important;
    min-width: 0 !important;
    max-width: min(92vw, 900px);
    padding: 14px 6px !important;
    left: auto;
  }
  .main-nav .zn_mega_container > ul,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper {
    display: flex !important;
    flex-wrap: nowrap;
    width: auto !important;
    margin: 0 !important;
  }
  /* each mega column: content-width, not a 25% grid cell */
  .main-nav .zn_mega_container > ul > li,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > li,
  .main-nav .zn_mega_container [class*="col-"] {
    float: none !important;
    width: max-content !important;
    max-width: 260px;
    flex: 0 0 auto !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .main-nav .zn_mega_container .menu-item a {
    white-space: nowrap;
    padding-right: 0 !important;
  }
}

/* --- A3  Top-bar phone number: hover affordance ------------------------- */
.kl-header-toptext a {
  position: relative;
  text-decoration: none;
  transition: color .18s ease-out, opacity .18s ease-out;
}
.kl-header-toptext a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 0; height: 1px;
  background: currentColor;
  transition: width .18s cubic-bezier(.68,0,.265,1);
}
.kl-header-toptext a:hover::after,
.kl-header-toptext a:focus-visible::after { width: 100%; }
.sh--light .kl-header-toptext a:hover { color: #ffd34d; }
.sh--gray  .kl-header-toptext a:hover,
.sh--dark  .kl-header-toptext a:hover { color: #cd2122; }

/* --- A4  "Book Now" CTA hover: no more near-white inversion -------------
   was: .kl-cta-ribbon:hover{background:#fff;color:#000}
        .kl-cta-ribbon:hover .trisvg path{fill:#fff}
   now: same red, slightly brightened + lift. Text stays white.            */
.kl-cta-ribbon {
  transition: background-color .18s ease-out, box-shadow .18s ease-out, transform .18s ease-out;
}
.kl-cta-ribbon:focus,
.kl-cta-ribbon:hover {
  background: #e02c2d !important;      /* #cd2122 brightened ~8% */
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(205,33,34,.38) !important;
  transform: translateY(-1px);
}
.kl-cta-ribbon:focus .trisvg path,
.kl-cta-ribbon:hover .trisvg path { fill: #e02c2d !important; }
.kl-cta-ribbon:active { transform: translateY(0); }

/* --- A5  Footer flags: force both flags to an identical rectangle -------
   Markup in both trees is already width=30 height=20 viewBox="0 0 30 20";
   this pins the rendered box so no renderer/aspect quirk can differ.      */
.footer-lang-flags { align-items: center; }
.footer-lang-flags .flag-svg,
.flag-svg {
  width: 30px !important;
  height: 20px !important;
  display: block;
  flex: 0 0 30px;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0,0,0,.12);
}
.footer-lang-flags .flt-a { line-height: 0 !important; display: inline-flex; }

/* --- A6  Slideshow / carousel prev-next arrows on blue hero ------------- */
.kl-slideshow .sldr_arrow,
.kl-slideshow .sldr_arrow_prev,
.kl-slideshow .sldr_arrow_next,
.slick-prev, .slick-next,
.kl-slideshow [class*="arrow"] {
  color: #fff !important;
  opacity: 1 !important;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.55));
  transition: transform .18s ease-out, filter .18s ease-out;
}
.kl-slideshow .sldr_arrow svg,
.kl-slideshow [class*="arrow"] svg,
.slick-prev svg, .slick-next svg {
  stroke: #fff !important;
  fill: #fff !important;
  stroke-width: 2.2;
}
.kl-slideshow .sldr_arrow:before,
.kl-slideshow [class*="arrow"]:before,
.slick-prev:before, .slick-next:before {
  color: #fff !important;
  opacity: 1 !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.55);
}
.kl-slideshow .sldr_arrow:hover,
.slick-prev:hover, .slick-next:hover {
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.75));
  transform: scale(1.08);
}

/* ============================================================
   B — CONTACT PAGES
   ============================================================ */

/* --- B7  Resort heading: was color:#ffffff on a #ffffff section ---------
   Readable colour + one-line fluid sizing. clamp() shrinks the type as the
   name grows, so KAPALAI is large and SIPADAN WATER VILLAGE still fits.
   Desktop range is deliberately above the mobile range.                   */
.mb-resort-heading .tbk__title,
.zn_section .tbk__title.mb-resort-title {
  color: #1f2d3d !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 1.12 !important;
}
/* length-driven steps: set data-len on the heading (JS or build-time) */
.mb-resort-heading[data-len="s"]  .tbk__title { font-size: clamp(30px, 7.4vw, 56px) !important; }
.mb-resort-heading[data-len="m"]  .tbk__title { font-size: clamp(24px, 5.6vw, 44px) !important; }
.mb-resort-heading[data-len="l"]  .tbk__title { font-size: clamp(19px, 4.2vw, 34px) !important; }
.mb-resort-heading[data-len="xl"] .tbk__title { font-size: clamp(16px, 3.4vw, 28px) !important; }
@media (max-width: 767px) {
  .mb-resort-heading .tbk__title { line-height: 1.18 !important; }
  .mb-resort-heading[data-len="s"]  .tbk__title { font-size: clamp(26px, 8.2vw, 38px) !important; }
  .mb-resort-heading[data-len="m"]  .tbk__title { font-size: clamp(20px, 6.4vw, 30px) !important; }
  .mb-resort-heading[data-len="l"]  .tbk__title { font-size: clamp(16px, 5.0vw, 24px) !important; }
  .mb-resort-heading[data-len="xl"] .tbk__title { font-size: clamp(14px, 4.2vw, 20px) !important; }
}

/* --- B8  Right-hand contact column: force readable text ----------------- */
.mb-contact-info,
.mb-contact-info .kl-iconbox,
.mb-contact-info .kl-iconbox__inner,
.mb-contact-info .kl-iconbox__desc,
.mb-contact-info .kl-iconbox__desc *,
.mb-contact-info p,
.mb-contact-info span,
.mb-contact-info strong,
.mb-contact-info nobr {
  color: #3d3d3d !important;
}
.mb-contact-info .kl-iconbox__title {
  color: #1f2d3d !important;
  font-weight: 700 !important;
}
.mb-contact-info a { color: #0f7f72 !important; text-decoration: none; }
.mb-contact-info a:hover,
.mb-contact-info a:focus-visible { color: #cd2122 !important; text-decoration: underline; }
.mb-contact-info .kl-iconbox__icon { color: #cd2122 !important; }

/* ============================================================
   C — INQUIRY FORM (mabul variant)
   ============================================================ */
.mb-form { margin-top: 6px; }
.mb-form .mb-row { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.mb-form .mb-f { padding: 0 8px 14px; box-sizing: border-box; flex: 0 0 100%; max-width: 100%; }
@media (min-width: 768px) {
  .mb-form .mb-f--half  { flex: 0 0 50%;  max-width: 50%; }
  .mb-form .mb-f--third { flex: 0 0 33.3333%; max-width: 33.3333%; }
}
.mb-form label.mb-lab {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #56606b;
  margin: 0 0 5px;
}
.mb-form .mb-req { color: #cd2122; margin-left: 2px; }
.mb-form input[type="text"],
.mb-form input[type="email"],
.mb-form input[type="tel"],
.mb-form input[type="date"],
.mb-form input[type="number"],
.mb-form select,
.mb-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 11px 13px;
  font-size: 15px;
  line-height: 1.4;
  color: #23303d;
  background: #fff;
  border: 1px solid #cfd6dd;
  border-radius: 4px;
  transition: border-color .15s ease-out, box-shadow .15s ease-out;
  -webkit-appearance: none;
  appearance: none;
}
.mb-form select {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2356606b' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 34px;
}
.mb-form textarea { min-height: 128px; resize: vertical; }
.mb-form input:focus, .mb-form select:focus, .mb-form textarea:focus {
  outline: none;
  border-color: #3bbfad;
  box-shadow: 0 0 0 3px rgba(59,191,173,.18);
}
.mb-form input::placeholder, .mb-form textarea::placeholder { color: #9aa4ae; }
.mb-form .mb-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important; height: 1px !important;
  overflow: hidden !important;
}
.mb-form .mb-actions { padding: 4px 8px 0; }
.mb-form .mb-submit {
  display: inline-block;
  padding: 12px 34px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #fff;
  background: #cd2122;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color .18s ease-out, box-shadow .18s ease-out, transform .18s ease-out;
}
.mb-form .mb-submit:hover:not(:disabled) {
  background: #e02c2d;
  box-shadow: 0 4px 14px rgba(205,33,34,.38);
  transform: translateY(-1px);
}
.mb-form .mb-submit:disabled { opacity: .6; cursor: default; }
.mb-form .mb-note { font-size: 12.5px; color: #6b7480; margin: 10px 8px 0; }
.mb-form .mb-msg { margin: 0 8px 12px; padding: 12px 14px; border-radius: 4px; font-size: 14.5px; }
.mb-form .mb-msg--ok   { background: #e8f6f3; border: 1px solid #3bbfad; color: #14584f; }
.mb-form .mb-msg--err  { background: #fdecec; border: 1px solid #cd2122; color: #8d1516; }
.mb-form .mb-msg--info { background: #eef2f6; border: 1px solid #cfd6dd; color: #46515c; }
.mb-form .mb-invalid { border-color: #cd2122 !important; box-shadow: 0 0 0 3px rgba(205,33,34,.14) !important; }

/* --- B7 addendum: hook applied directly to the <h1> ---------------------- */
h1.mb-resort-title, .tbk__title.mb-resort-title {
  color: #1f2d3d !important;
  white-space: nowrap; overflow: hidden;
  font-weight: 600; letter-spacing: .01em; line-height: 1.12 !important;
}
.mb-resort-title[data-len="s"]  { font-size: clamp(30px, 7.4vw, 56px) !important; }
.mb-resort-title[data-len="m"]  { font-size: clamp(24px, 5.6vw, 44px) !important; }
.mb-resort-title[data-len="l"]  { font-size: clamp(19px, 4.2vw, 34px) !important; }
.mb-resort-title[data-len="xl"] { font-size: clamp(16px, 3.4vw, 28px) !important; }
@media (max-width: 767px) {
  .mb-resort-title[data-len="s"]  { font-size: clamp(26px, 8.2vw, 38px) !important; }
  .mb-resort-title[data-len="m"]  { font-size: clamp(20px, 6.4vw, 30px) !important; }
  .mb-resort-title[data-len="l"]  { font-size: clamp(16px, 5.0vw, 24px) !important; }
  .mb-resort-title[data-len="xl"] { font-size: clamp(14px, 4.2vw, 20px) !important; }
}

/* ============================================================
   MABUL DESIGN ROUND 2 — 2026-08-19
   Appended after the round-1 fixes; shared by EN and CN.
   ============================================================ */

/* --- 1  Contact icons: theme grey, not red -----------------------------
   Round 1 forced .mb-contact-info .kl-iconbox__icon to #cd2122. The page's
   own eluid rules already set #343434 (theme default) with #cd2122 on hover,
   which is what the archived design shows. Hand it back.                  */
.mb-contact-info .kl-iconbox__icon,
.mb-contact-info .kl-iconbox__inner .kl-iconbox__icon,
.mb-contact-info span.kl-iconbox__icon {
  color: #343434 !important;
}
.mb-contact-info:hover .kl-iconbox__icon,
.mb-contact-info .kl-iconbox:hover .kl-iconbox__icon {
  color: #cd2122 !important;
}

/* --- 2  "CONTACT US" heading: light over the hero ----------------------
   Only the general contact page (data-page="contact"); per-resort headings
   keep the round-1 dark-on-white treatment.                               */
[data-page="contact"] h1.mb-resort-title,
[data-page="contact"] .mb-resort-title {
  color: #ffffff !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .45), 0 1px 2px rgba(0, 0, 0, .3);
}

/* --- 3  Right column top alignment with the first field ---------------- */
@media (min-width: 992px) {
  .mb-contact-info-col { padding-top: 34px; }
}

/* --- 4  Right column text +2px ----------------------------------------- */
.mb-contact-info .kl-iconbox__desc,
.mb-contact-info .kl-iconbox__desc p,
.mb-contact-info p,
.mb-contact-info li,
.mb-contact-info span:not(.kl-iconbox__icon),
.mb-contact-info nobr { font-size: 15px !important; line-height: 1.72 !important; }
.mb-contact-info .kl-iconbox__title { font-size: 16px !important; }

/* --- 5  Form labels + intro +2px (desktop) ----------------------------- */
@media (min-width: 768px) {
  .mb-form label.mb-lab { font-size: 14px !important; letter-spacing: .045em; }
  .mb-form-intro,
  .mb-form-intro p { font-size: 17px !important; line-height: 1.6 !important; }
}

/* --- 6  Two-up rows: arrival+nights, then divers+non-divers ------------ */
@media (min-width: 768px) {
  .mb-form .mb-f--half2 { flex: 0 0 50% !important; max-width: 50% !important; }
}

/* --- 8  Select placeholder matches input placeholder colour ------------ */
.mb-form select { color: #23303d; }
.mb-form select.mb-empty,
.mb-form select:invalid,
.mb-form select option[value=""] { color: #9aa4ae; }
.mb-form select.mb-empty { font-style: normal; }

/* --- 11  Below-form block: breathing room, left-aligned with fields ----- */
.mb-form .mb-actions { padding: 22px 8px 0 !important; }
.mb-below {
  margin: 18px 8px 0;
  padding-top: 4px;
  text-align: left;
  max-width: 680px;
}
.mb-below p { margin: 0 0 9px; font-size: 14px; line-height: 1.62; color: #6b7480; }
.mb-below p.mb-below-lead { color: #46515c; font-size: 14.5px; }
.mb-below .kl-iconbox,
.mb-below .kl-iconbox__icon { display: none !important; }   /* stray shuffle icon */

/* --- 12  Success/error banner aligned with the field column ------------ */
.mb-form .mb-msg {
  margin-left: 8px !important;
  margin-right: 8px !important;
  box-sizing: border-box;
}

/* --- 13/19  Submit button states (never a dead control) ---------------- */
.mb-form .mb-submit[disabled],
.mb-form .mb-submit:disabled {
  opacity: .55;
  cursor: not-allowed;
  background: #b8b8b8;
  box-shadow: none;
  transform: none;
}

/* --- 14  CTA "Book Now": kill every red hover, box + triangle together -- */
.kl-cta-ribbon,
.kl-cta-ribbon .trisvg path {
  transition: background-color .18s ease-out, fill .18s ease-out,
              box-shadow .18s ease-out, transform .18s ease-out;
}
.kl-cta-ribbon { background: #3bbfad !important; }
.kl-cta-ribbon .trisvg path { fill: #3bbfad !important; }
.kl-cta-ribbon:hover,
.kl-cta-ribbon:focus,
.kl-cta-ribbon:active,
.site-header .kl-cta-ribbon:hover,
.chaser .kl-cta-ribbon:hover {
  background: #4fd3c1 !important;          /* turquoise, ~10% lighter */
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(59, 191, 173, .38) !important;
  transform: translateY(-1px);
}
.kl-cta-ribbon:hover .trisvg path,
.kl-cta-ribbon:focus .trisvg path,
.kl-cta-ribbon:active .trisvg path,
.site-header .kl-cta-ribbon:hover .trisvg path,
.chaser .kl-cta-ribbon:hover .trisvg path {
  fill: #4fd3c1 !important;                /* same colour, same duration */
}

/* --- 15  WHERE TO STAY mega menu: 3 columns, moderate gutters ---------- */
@media (min-width: 992px) {
  .main-nav .zn_mega_container {
    width: auto !important;
    max-width: min(94vw, 860px);
    padding: 16px 10px !important;
  }
  .main-nav .zn_mega_container > ul,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start;
    width: auto !important;
  }
  .main-nav .zn_mega_container > ul > li,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > li,
  .main-nav .zn_mega_container [class*="col-"] {
    float: none !important;
    flex: 0 0 auto !important;
    width: max-content !important;
    min-width: 172px;
    max-width: 250px;
    padding-left: 22px !important;     /* moderate gutter */
    padding-right: 22px !important;
  }
  .main-nav .zn_mega_container > ul > li + li,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > li + li {
    border-left: 1px solid rgba(0, 0, 0, .07);
  }
  .main-nav .zn_mega_container .menu-item a { white-space: nowrap; }
}

/* --- 16  WITHDRAWN by round 4 — it broke every non-mega dropdown --------
   This block wrote a caret onto .main-nav ul ul.sub-menu::before and
   .main-nav .zn_mega_container::after. Kallyas ALREADY owns both pseudo-
   elements on ordinary dropdowns, at a HIGHER specificity:
     .main-nav>ul>.menu-item>ul.sub-menu:before  (0,3,3) = the hover bridge
        top:-12px; left:0; width:100%; height:12px
     .main-nav>ul>.menu-item>ul.sub-menu:after   (0,3,3) = the caret
        top:-11px; left:14px; border:6px solid transparent;
        border-bottom:5px solid #f5f5f5
   This rule was only (0,2,3), so it could not move them — it merely ADDED
   its borders to boxes the theme had already sized. Measured result on
   /contact/ DIVING before the fix:
     ::after  216 x 14 px  (a border triangle needs a 0 x 0 box) -> caret GONE
     ::before 230 x 12 px with an 8px #f5f5f5 bottom border -> a full-width
              grey slab across the panel's top edge -> "corners clipped"
   The mega menu now carries its caret on the TRIGGER (round 4, item 2);
   ordinary dropdowns are handed back to the theme untouched.
   Only the overflow relaxation is kept.                                    */
@media (min-width: 992px) {
  .main-nav ul ul.sub-menu,
  .main-nav .zn_mega_container { overflow: visible; }
}

/* --- 17  Hover-intent: let the pointer cross the gap ------------------- */
@media (min-width: 992px) {
  .main-nav ul ul.sub-menu,
  .main-nav .zn_mega_container {
    transition: opacity .18s ease-out, visibility 0s linear .26s;
  }
  .main-nav li:hover > ul.sub-menu,
  .main-nav li:hover > .zn_mega_container,
  .main-nav ul.sub-menu:hover,
  .main-nav .zn_mega_container:hover {
    transition-delay: 0s;               /* opening is immediate */
    visibility: visible;
    opacity: 1;
  }
  /* invisible bridge across the header gap.
     round 4: the ".main-nav ul ul.sub-menu::after" half was REMOVED — it
     collided with the theme's caret (see item 16 above). Ordinary dropdowns
     already have the theme's own 12px bridge on ::before, so nothing is lost.
     The mega container keeps its bridge: theme and override tie at (0,2,1)
     and this rule is later, so it replaces rather than merges.             */
  .main-nav .zn_mega_container::before {
    content: "";
    position: absolute;
    top: -14px; left: 0; right: 0;
    height: 14px;
    display: block;
  }
}

/* --- 18  Primary menu items +1px vs dropdown items --------------------- */
@media (min-width: 992px) {
  .main-nav > ul > li > a,
  .main-nav ul.main-menu > li > a,
  .main-menu-link-top {
    font-size: 15px !important;
    line-height: 1.45 !important;
  }
}

/* ============================================================
   MABUL DESIGN ROUND 3 — 2026-08-19  (regression fixes)
   ============================================================ */

/* --- 1  MEGA MENU: real 3 columns ---------------------------------------
   ROOT CAUSE of the round-2 failure: the real chain is
     .zn_mega_container > .zn_mega_menu_container_wrapper > ul.clearfix > li.col-sm-4
   Rounds 1-2 targeted ".zn_mega_container > ul" and ".wrapper > li", neither
   of which exists, so the flex never applied — while "[class*=col-]" DID match
   and killed Bootstrap's float:left, collapsing the columns into one stack.
   The markup is already correct (3 li.col-sm-4 with the 3 titles); this makes
   the CSS match it.                                                        */
@media (min-width: 992px) {
  .main-nav .zn_mega_container {
    width: auto !important;
    min-width: 0 !important;
    max-width: min(94vw, 820px) !important;
    padding: 14px 6px !important;
  }
  .main-nav .zn_mega_container > .zn_mega_menu_container_wrapper {
    display: block !important;
    width: auto !important;
  }
  .main-nav .zn_mega_container > .zn_mega_menu_container_wrapper > ul,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul.clearfix {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
  }
  /* the three columns */
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li {
    float: none !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 150px;
    max-width: 240px;
    padding: 0 14px !important;      /* reduced inter-column padding */
    margin: 0 !important;
  }
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li + li {
    border-left: 1px solid rgba(0, 0, 0, .08);
  }
  /* nested lists inside each column stay vertical */
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li > ul {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li > ul > li {
    float: none !important;
    display: block !important;
    width: auto !important;
    padding: 0 !important;
  }
  .main-nav .zn_mega_container .menu-item a { white-space: nowrap; }
}

/* --- 2  "CONTACT US" heading: white --------------------------------------
   ROOT CAUSE: round 2 used [data-page="contact"] h1.mb-resort-title
   (specificity 0,0,2,1 = 21). Round 1 already had
   .zn_section .tbk__title.mb-resort-title (0,0,3,0 = 30) forcing #1f2d3d.
   Both !important, so the higher specificity won and the heading stayed dark.
   This selector outranks it (0,0,4,1).                                     */
body[data-page="contact"] .zn_section .tbk__title.mb-resort-title,
body[data-page="contact"] .zn_section h1.tbk__title.mb-resort-title,
html body[data-page="contact"] h1.mb-resort-title {
  color: #ffffff !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, .5), 0 1px 2px rgba(0, 0, 0, .35) !important;
}

/* --- 3  Right column aligned with the FULL NAME label row ---------------
   Was 34px, which lined it up with the intro line instead. The intro block
   plus its margin measures ~72px, so the column starts there.              */
@media (min-width: 992px) {
  .mb-contact-info-col { padding-top: 72px !important; }
}

/* --- 4  Sticky (chaser) menu: larger type, primary +1px over dropdown --- */
@media (min-width: 992px) {
  .chaser .main-nav > ul > li > a,
  .chaser .main-menu-link-top,
  .chaser .main-nav ul.main-menu > li > a {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
  .chaser .main-nav ul ul.sub-menu .menu-item a,
  .chaser .main-nav .zn_mega_container .menu-item a {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }
  .chaser .x13-t { font-size: 14px !important; }
}

/* --- 5  Footer flags: thin border instead of the shadow ring ------------
   Variant B (rgba(0,0,0,.35)) is the shipped default: pure #000 reads harsh
   against the CN flag's red field. Variant A kept below, commented, so the
   swap is one line if you prefer it.                                       */
.footer-lang-flags .flag-svg,
.flag-svg {
  box-shadow: none !important;
  border: 1px solid rgba(0, 0, 0, .35) !important;
  border-radius: 2px;
  box-sizing: content-box;
}
/* Variant A — pure black:
.footer-lang-flags .flag-svg, .flag-svg { border:1px solid #000 !important; }
*/

/* --- 6  "Please Complete the Form Below:" bigger still ------------------ */
@media (min-width: 768px) {
  .mb-form-intro,
  .mb-form-intro p,
  .zn_section .mb-form-intro { font-size: 19px !important; line-height: 1.55 !important; }
}
.mb-form-intro, .mb-form-intro p { font-size: 17px; }

/* --- 7  Date input placeholder greyed like the others ------------------- */
.mb-form input[type="date"] { color: #23303d; }
.mb-form input[type="date"].mb-empty,
.mb-form input[type="date"]:not(.mb-filled) {
  color: #9aa4ae;
}
.mb-form input[type="date"].mb-filled { color: #23303d; }
.mb-form input[type="date"]::-webkit-datetime-edit-text,
.mb-form input[type="date"]::-webkit-datetime-edit-month-field,
.mb-form input[type="date"]::-webkit-datetime-edit-day-field,
.mb-form input[type="date"]::-webkit-datetime-edit-year-field { color: inherit; }
.mb-form input[type="date"].mb-filled::-webkit-datetime-edit-text,
.mb-form input[type="date"].mb-filled::-webkit-datetime-edit-month-field,
.mb-form input[type="date"].mb-filled::-webkit-datetime-edit-day-field,
.mb-form input[type="date"].mb-filled::-webkit-datetime-edit-year-field { color: #23303d; }

/* --- 10  Field rows: the 4-field group owns its own row -----------------
   ROOT CAUSE: pairing depended on how many half-width fields preceded it.
   /contact/ has 6 (even, so pairs aligned); resort pages have 5 (odd), which
   pushed every following field half a row across. The group is now its own
   flex row, so it pairs identically on every page.                         */
.mb-form .mb-rowgroup {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100%;
  margin: 0 -8px !important;
}
@media (min-width: 768px) {
  .mb-form .mb-rowgroup > .mb-f--half2 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

/* --- 11  CN WeChat label: plain, not required -------------------------- */
.mb-form label[for="mbq-weixin"] .mb-req { display: none !important; }

/* --- 3 (corrected)  measured: column sat 52px above the FULL NAME label --- */
@media (min-width: 992px) {
  .mb-contact-info-col { padding-top: 124px !important; }
}

/* --- 6 (corrected)  the intro is .zn_description, not .mb-form-intro -----
   ROOT CAUSE: round 2 item 5 and round 3 item 6 both targeted .mb-form-intro,
   a class that does not exist in the markup, so the text never grew.        */
.zn_contact_form_container .zn_description,
.zn_contact_form_container .zn_description p,
.zn_contact_form_container .zn_description strong,
.mb-form-intro, .mb-form-intro p {
  font-size: 17px !important;
  line-height: 1.55 !important;
}
@media (min-width: 768px) {
  .zn_contact_form_container .zn_description,
  .zn_contact_form_container .zn_description p,
  .zn_contact_form_container .zn_description strong,
  .mb-form-intro, .mb-form-intro p {
    font-size: 19px !important;
    line-height: 1.55 !important;
  }
}

/* --- 3 (final)  padding-top does not move the element's own top edge -----
   The hook class sits on the first iconbox, so the measured top only shifts
   with margin. Measured gap to the FULL NAME label: 59px.                   */
@media (min-width: 992px) {
  .mb-contact-info-col { padding-top: 0 !important; margin-top: 59px !important; }
}

/* ============================================================
   MABUL DESIGN ROUND 4 — 2026-08-19
   Shared by EN (/static/style-en.css) and CN (/cn/static/style.css).
   ============================================================ */

/* --- 1 + 2  WHERE TO STAY mega menu -------------------------------------
   ROOT CAUSE (item 2): .menu-item-mega-parent is the one top-level item the
   theme deliberately leaves UNPOSITIONED —
     .main-nav>ul>.menu-item:not(.menu-item-mega-parent){position:relative}
   so the panel's `left:0` resolves against .container.siteheader-container
   instead of its own trigger. Measured on /contact/ at 1440px, hovered:
     trigger centre x = 324.5   panel x = 24.5   round-2 caret centre = 66.5
   i.e. the panel and its caret sat 258px to the LEFT of the item they belong
   to. Positioning the trigger re-anchors the panel under it, and the caret
   is drawn on the trigger itself so it can never drift again.             */
@media (min-width: 992px) {
  .main-nav > ul > .menu-item.menu-item-mega-parent,
  .chaser-main-menu li.menu-item-mega-parent { position: relative !important; }

  .main-nav .zn_mega_container {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: min(94vw, 900px) !important;
  }

  /* 1 — inter-column padding doubled: 14px -> 28px a side (gap 28 -> 56) */
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li {
    padding: 0 28px !important;
  }

  /* 2 — caret owned by the trigger, centred under it */
  .main-nav > ul > .menu-item.menu-item-mega-parent::after {
    content: "";
    position: absolute;
    top: 100%;
    margin-top: 2px;
    left: 50%;
    transform: translateX(-50%);
    width: 0; height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #f5f5f5;
    filter: drop-shadow(0 -1px 1px rgba(0, 0, 0, .12));
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 101;
    transition: opacity .18s ease-out;
  }
  .main-nav > ul > .menu-item.menu-item-mega-parent:hover::after {
    opacity: 1;
    visibility: visible;
  }
}

/* --- 3  Non-mega dropdowns: restored, see the ROUND 2 item 16 note ------
   Nothing is declared here on purpose. The restore is the REMOVAL of the two
   round-2 rules that were overwriting the theme's ::before / ::after on
   .main-nav ul ul.sub-menu. Every mega rule in rounds 1-4 is scoped to
   .zn_mega_container or .menu-item-mega-parent, so it cannot reach them.   */

/* --- 4  "CONTACT US" heading (/contact/ only) ---------------------------
   Single flat colour, no gradient, no drop shadow: near-white with a faint
   blue tint, ringed by a 1px very-dark-navy text-shadow so it stays legible
   wherever the hero image is pale. Outranks round 3's (0,4,2) rule at
   (0,4,3); -webkit-text-fill-color kills any inherited gradient clip.      */
html body[data-page="contact"] .zn_section h1.tbk__title.mb-resort-title,
html body[data-page="contact"] .zn_section .tbk__title.mb-resort-title,
html body[data-page="contact"] h1.tbk__title.mb-resort-title {
  color: #f2f7fc !important;
  -webkit-text-fill-color: #f2f7fc !important;
  background: none !important;
  -webkit-text-stroke: 0 !important;
  text-shadow:
    -1px -1px 0 #0a1a30,  0   -1px 0 #0a1a30,  1px -1px 0 #0a1a30,
     1px  0   0 #0a1a30,  1px  1px 0 #0a1a30,  0    1px 0 #0a1a30,
    -1px  1px 0 #0a1a30, -1px  0   0 #0a1a30 !important;
}

/* --- 5 + 6  Right contact column: one container, one left edge ----------
   ROOT CAUSE (item 5): every block is a .kl-iconbox--fleft, and the theme
   lays it out with
     .kl-iconbox--fleft .kl-iconbox__icon-wrapper { float:left; margin-right:20px }
     .kl-iconbox__content-wrapper { overflow:hidden }
   so each block's text starts at (glyph advance width + 20px). The four
   glyphs measure 11.7 / 19.8 / 15.6 / 11.7 px, which put the text at
   x = 945 / 953.2 / 948.9 / 945 — four different left edges.
   Fix: the float is replaced by a grid with a FIXED 34px icon slot, so the
   text column starts at the same x in every block regardless of glyph.

   ROOT CAUSE (item 6): the .mb-contact-info-col hook was on the wrong
   element on /contact/ and /cn/contact/ — it sat on the disclaimer iconbox
   in the LEFT column, so round 3's margin-top moved that box and the right
   column was never aligned at all (measured 59.5px too high). Round 4 moves
   the hook onto the column wrapper, where it also becomes the single flex
   container item 5 asks for.                                               */
.mb-contact-info-col {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
}
@media (min-width: 992px) {
  .mb-contact-info-col {
    padding-top: 0 !important;
    margin-top: 59px !important;
  }
}

.mb-contact-info .kl-iconbox__inner {
  display: grid !important;
  grid-template-columns: 34px 1fr;
  column-gap: 14px;
  align-items: start;
}
.mb-contact-info .kl-iconbox__inner::after,
.mb-contact-info .kl-iconbox__inner::before { display: none !important; }
.mb-contact-info .kl-iconbox__icon-wrapper {
  grid-column: 1;
  float: none !important;
  margin: 0 !important;
  width: 34px;
  text-align: left;
}
.mb-contact-info .kl-iconbox__content-wrapper {
  grid-column: 2;
  overflow: visible;
  padding-left: 0 !important;
  margin-left: 0 !important;
}
.mb-contact-info .kl-iconbox__title-wrapper { margin-bottom: 8px !important; }
.mb-contact-info .kl-iconbox__desc-wrapper  { margin-bottom: 0 !important; }

/* --- 7  Right column: every hover turquoise, never red ------------------ */
.mb-contact-info a { color: #0f7f72 !important; text-decoration: none; }
.mb-contact-info a:hover,
.mb-contact-info a:focus-visible { color: #3bbfad !important; text-decoration: underline; }
.mb-contact-info .kl-iconbox__icon,
.mb-contact-info .kl-iconbox__inner .kl-iconbox__icon,
.mb-contact-info span.kl-iconbox__icon { color: #343434 !important; }
.mb-contact-info:hover .kl-iconbox__icon,
.mb-contact-info .kl-iconbox:hover .kl-iconbox__icon,
.mb-contact-info:hover span.kl-iconbox__icon { color: #3bbfad !important; }

/* --- 8  SEND ENQUIRY: turquoise, matching Book Now ---------------------- */
.mb-form .mb-submit:not(:disabled) {
  background: #3bbfad !important;
  color: #fff !important;
}
.mb-form .mb-submit:not(:disabled):hover,
.mb-form .mb-submit:not(:disabled):focus {
  background: #4fd3c1 !important;
  box-shadow: 0 4px 14px rgba(59, 191, 173, .38) !important;
  transform: translateY(-1px);
}
.mb-form .mb-submit[disabled],
.mb-form .mb-submit:disabled {
  background: #b8b8b8 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* --- 9  Disclaimer block under the form (/contact/, /cn/contact/) -------
   The arrows glyph floated above the text because the block is a
   .kl-iconbox--fleft whose <h3> title is empty — the float cleared a blank
   heading line before the paragraph started. It also carried the misplaced
   .mb-contact-info-col hook, so round 3 pushed it 59px down as well.
   Now: empty title removed from flow, icon in a fixed slot to the LEFT of
   the text, its line box matched to the first text line so the two centre
   on each other, turquoise.                                               */
.mb-disclaimer-box .kl-iconbox__inner {
  display: grid !important;
  grid-template-columns: 26px 1fr;
  column-gap: 10px;
  align-items: start;
}
.mb-disclaimer-box .kl-iconbox__title-wrapper { display: none !important; }
.mb-disclaimer-box .kl-iconbox__content-wrapper { grid-column: 2; overflow: visible; }
.mb-disclaimer-box .kl-iconbox__icon-wrapper {
  grid-column: 1;
  float: none !important;
  margin: 0 !important;
}
.mb-disclaimer-box .kl-iconbox__icon,
.mb-disclaimer-box span.kl-iconbox__icon,
.mb-disclaimer-box .kl-iconbox__inner .kl-iconbox__icon,
.mb-disclaimer-box .kl-iconbox__inner span.kl-iconbox__icon {
  color: #3bbfad !important;                 /* must outrank round 2's
                                                .mb-contact-info .kl-iconbox__inner
                                                .kl-iconbox__icon (0,3,0) */
  font-size: 20px !important;
  line-height: 25.8px !important;
  display: block;
}
.mb-disclaimer-box:hover .kl-iconbox__inner .kl-iconbox__icon { color: #4fd3c1 !important; }

/* --- 11  Resort / Country select: options grey on first open ------------
   ROOT CAUSE: round 2 greyed the placeholder by colouring the CONTROL —
     .mb-form select.mb-empty { color:#9aa4ae }
   and <option> inherits colour from <select>. On the first open the select
   is still .mb-empty, so the whole native option list rendered at #9aa4ae;
   after a choice the class was dropped and the second open looked normal.
   Measured before the fix: select colour and option colour both
   rgb(154,164,174).
   The fix is the non-inheritance, not per-option cosmetics: options declare
   their own colour, so the control's placeholder grey can never reach them
   in any browser that lets CSS touch the list at all.                      */
.mb-form select { color: #222; }
.mb-form select.mb-empty { color: #9aa4ae; }
.mb-form select option,
.mb-form select option[value=""],
.mb-form select.mb-empty option,
.mb-form select:invalid option {
  color: #222 !important;
  background-color: #fff;
}

/* --- 12  Success banner: three lines, mailto links visible -------------- */
.mb-form .mb-msg--ok .mbq-l1 { display: block; font-weight: 700; margin-bottom: 6px; }
.mb-form .mb-msg--ok .mbq-l2,
.mb-form .mb-msg--ok .mbq-l3 { display: block; margin-top: 5px; }
.mb-form .mb-msg--ok a { color: #0b6d61; font-weight: 700; text-decoration: underline; }
.mb-form .mb-msg--ok a:hover { color: #3bbfad; }

/* ============================================================
   MABUL DESIGN ROUND 5 — 2026-08-19
   Shared by EN (/static/style-en.css) and CN (/cn/static/style.css).
   ============================================================ */

/* --- A1  ICON FONT 404 — fixed at the source, not here ------------------
   ROOT CAUSE: the static build concatenated the Kallyas theme CSS from
     /wp-content/themes/kallyas/kallyas/css/
   into /static/style-en.css WITHOUT rewriting its relative url() references.
   `url(../template_helpers/icons/...)` resolved to the theme folder from the
   old location; from /static/ it resolves to the DOCROOT, so every one of
   them 404'd. Measured live before the fix:

     /template_helpers/icons/glyphicons_halflingsregular/*.woff2|woff|ttf|eot|svg
        -> 404 (a 53 KB WordPress 404 page)
     /wp-content/themes/kallyas/kallyas/template_helpers/.../*.woff2
        -> 200 font/woff2, 18028 B          (the files were always there)

   16 of the EN sheet's 20 url() references were dead: 6 font files and 10
   theme images (bottom_mask, say_hi, shadow-up/down, select-arrow, ...).
   Symptoms: the TOP back-to-top button (.glyphicon uses 'Glyphicons
   Halflings'), every .glyphicon in the page body, and the theme's decorative
   images.

   FIX: the fonts and images now ship inside the deployment at
   /static/fonts/ and /static/images/, and every url() in BOTH stylesheets
   points at those absolute paths. The CSS is now independent of the
   WordPress theme directory entirely — nothing here to declare.
   The CN sheet's references were absolute and already 200; they were
   repointed at the same shared /static/ copies so the two trees cannot
   drift apart again.                                                       */

/* --- A2  Accordion "+" circle clipped on mobile -------------------------
   ROOT CAUSE: .acc--style4 .acc-tgg-button .acc-icon is a 58x58 circle with
   `position:absolute; right:-21px` — it deliberately straddles the panel's
   right edge. Measured at 390px: button right edge 374, circle right edge
   395 -> 5px past the 390px viewport, so the ring is sliced.
   Desktop is unaffected (button right 704 inside a 1440 viewport).
   Keeps the straddle, bounded so it always lands inside the viewport.      */
@media (max-width: 767px) {
  .acc--style4 .acc-tgg-button .acc-icon,
  .acc--style4 .acc-tgg-button.collapsed .acc-icon {
    right: -8px !important;
    width: 50px !important;
    height: 50px !important;
    border-width: 6px !important;
    top: -3px !important;
  }
}

/* --- A3  Carousel arrows push the page sideways on mobile ---------------
   ROOT CAUSE: .ca-container .znSlickNav .znSlickNav-arr.znSlickNav-next
   sits at `right:-50px` (and .prev at `left:-50px`) — 50px OUTSIDE the
   gallery on both sides. On a 390px screen the next arrow lands at
   x 390..440, which is what made /cn/sipadan-water-village/ report
   document.scrollWidth 440 vs clientWidth 390: the page could be dragged
   sideways and the gallery read as cut off.
   Arrows move inside the gallery on small screens.                         */
@media (max-width: 767px) {
  .ca-container .znSlickNav .znSlickNav-arr.znSlickNav-prev { left: 0 !important; }
  .ca-container .znSlickNav .znSlickNav-arr.znSlickNav-next { right: 0 !important; }
  .ca-container .znSlickNav .znSlickNav-arr {
    background: rgba(0, 0, 0, .35);
    border-radius: 3px;
  }
  .elm-phg-galleryNav .znSlickNav-arr.znSlickNav-prev { left: 8px !important; }
  .elm-phg-galleryNav .znSlickNav-arr.znSlickNav-next { right: 8px !important; }
  .kl-ptfcarousel-carousel .znSlickNav-arr { left: 4px !important; }
  .kl-ptfcarousel-carousel .znSlickNav-arr.znSlickNav-next { left: auto !important; right: 4px !important; }
  img, figure, iframe, video { max-width: 100%; }
  img { height: auto; }
}

/* --- 4  Mega menu: 50px of padding each side of every column ------------ */
@media (min-width: 992px) {
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li {
    padding: 0 50px !important;
  }
  .main-nav .zn_mega_container { max-width: min(96vw, 1000px) !important; }
}

/* --- 5 + 6 + 7  THE CHASER HAS NO .main-nav -----------------------------
   ROOT CAUSE for all three, and for why rounds 3 and 4 could not fix item 6:
   the sticky header clones the menu as

     ul.main-menu.main-menu-nav.zn_mega_menu.chaser-main-menu

   directly inside a .col-md-12 — there is NO .main-nav wrapper anywhere in
   .chaser (verified: chaser.querySelector('.main-nav') === null). Every
   theme rule and every round-1..4 rule scoped to `.main-nav ...` is therefore
   INERT in the scrolled state. Round 3 item 4 shipped three selectors; only
   `.chaser .main-menu-link-top` (which does not need .main-nav) ever matched,
   which is exactly why the primary link grew to 15px and the dropdown items
   stayed at the theme's 12px through two rounds.

   Measured in the scrolled state before this fix:
     chaser primary link          15px
     chaser dropdown item         12px      <- item 6
     chaser sub-menu background   rgba(0,0,0,0.9)   <- item 5, translucent
     chaser mega panel background rgba(0,0,0,0)     <- item 5, INVISIBLE
     top-state mega panel         rgba(245,245,245,0.95) <- item 5, translucent

   Everything below is addressed to .chaser-main-menu, so it actually lands. */
@media (min-width: 992px) {
  /* 6 — dropdown items = primary (15px) minus 1 */
  .chaser-main-menu > li > a,
  .chaser .main-menu-link-top { font-size: 15px !important; line-height: 1.5 !important; }
  .chaser-main-menu .sub-menu .menu-item a,
  .chaser-main-menu .zn_mega_container .menu-item a,
  .chaser-main-menu .sub-menu li a,
  .chaser-main-menu .zn_mega_container li a,
  .chaser .main-menu-link-sub {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }
  .chaser-main-menu .zn_mega_container .menu-item a.zn_mega_title,
  .chaser-main-menu a.zn_mega_title { font-size: 15px !important; }

  /* 5 — every dropdown fully opaque, scrolled state */
  .chaser-main-menu .sub-menu,
  .chaser-main-menu .zn_mega_container {
    background-color: #0d0d0d !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, .10) !important;
    box-shadow: 0 8px 26px rgba(0, 0, 0, .55) !important;
    border-radius: 2px;
  }
  .chaser-main-menu .sub-menu .menu-item a,
  .chaser-main-menu .zn_mega_container .menu-item a { color: #dcdcdc !important; }
  .chaser-main-menu .sub-menu .menu-item a:hover,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, .06);
  }
  .chaser-main-menu .zn_mega_container a.zn_mega_title { color: #ffffff !important; }

  /* 5 — every dropdown fully opaque, top state (was 0.95 alpha on the mega) */
  .main-nav .zn_mega_container,
  .main-nav ul ul.sub-menu {
    background-color: #f5f5f5 !important;
    background-image: none !important;
  }

  /* 7 — the trigger hover treatment is already identical for the mega and
     the plain items (both: 30px turquoise pill #3bbfad + the 7x1 dash,
     measured). What actually differed was the PANEL: translucent, and a
     caret centred under the trigger while every theme dropdown puts its
     caret 20px from the panel's left edge. Both are unified here.          */
  .main-nav > ul > .menu-item.menu-item-mega-parent::after {
    left: 20px !important;
    transform: none !important;
  }
}

/* --- 8  Contact right column: gap, separator, aligned to the INPUTS -----
   Measured at 1440: column top sat 27.5px above the first input's top edge
   (it was aligned to the LABEL row). 59 + 27.5 -> 86px puts the column's
   first line level with the "Your name" box. Gap form->column was 30px flat;
   a 26px inset plus a hairline rule gives the column its own edge.          */
@media (min-width: 992px) {
  .mb-contact-info-col {
    margin-top: 86px !important;
    padding-left: 26px !important;
    border-left: 1px solid #e6e9ec;
  }
}

/* --- 9  CONTACT US heading: lighter ring -------------------------------
   Round 4 used a solid 1px 8-stop #0a1a30 ring. Same 8 stops, same colour,
   but at 45% alpha plus one soft 3px halo — separation without the weight. */
html body[data-page="contact"] .zn_section h1.tbk__title.mb-resort-title,
html body[data-page="contact"] .zn_section .tbk__title.mb-resort-title,
html body[data-page="contact"] h1.tbk__title.mb-resort-title {
  text-shadow:
    -1px -1px 0 rgba(30, 60, 90, .32),  0   -1px 0 rgba(30, 60, 90, .32),
     1px -1px 0 rgba(30, 60, 90, .32),  1px  0   0 rgba(30, 60, 90, .32),
     1px  1px 0 rgba(30, 60, 90, .32),  0    1px 0 rgba(30, 60, 90, .32),
    -1px  1px 0 rgba(30, 60, 90, .32), -1px  0   0 rgba(30, 60, 90, .32),
     0    1px 4px rgba(30, 60, 90, .22) !important;
}

/* --- 10  Phone links in the right column: no link styling --------------- */
.mb-contact-info a[href^="tel:"],
.mb-contact-info a[href^="tel:"]:hover,
.mb-contact-info a[href^="tel:"]:focus,
.mb-contact-info a[href^="tel:"]:visited {
  color: inherit !important;
  text-decoration: none !important;
  border: 0;
}

/* --- 13  Breathing space under the "We reply within 24 hours" line ------ */
.mb-form .mb-below { padding-bottom: 28px !important; }
@media (max-width: 767px) {
  .mb-form .mb-below { padding-bottom: 38px !important; }
}

/* --- 14  Date + select go dark the moment they are being edited ---------
   Round 3 only darkened the date once .mb-filled was set by the change
   handler, so the field stayed grey while the picker was open. Focus now
   counts as "being edited" for both controls.                              */
.mb-form input[type="date"]:focus,
.mb-form input[type="date"]:not(.mb-filled):focus,
.mb-form input[type="date"].mb-empty:focus { color: #23303d !important; }
.mb-form input[type="date"]:focus::-webkit-datetime-edit-text,
.mb-form input[type="date"]:focus::-webkit-datetime-edit-month-field,
.mb-form input[type="date"]:focus::-webkit-datetime-edit-day-field,
.mb-form input[type="date"]:focus::-webkit-datetime-edit-year-field { color: #23303d !important; }
.mb-form select:focus,
.mb-form select.mb-empty:focus { color: #222 !important; }

/* --- 15 + 16 + 17  Mobile menu: bigger targets, single-open accordion ---
   The theme ships the responsive menu as sliding full-screen panels with
   "go back" links; with 53 items that is a lot of travel. The pages now load
   mb-mobilemenu.js, which converts it to one-open-at-a-time accordions in
   place; this styles the result and enlarges the touch targets.            */
.zn-res-menu-nav .main-menu-item > a,
.zn-res-menu-nav li > a {
  font-size: 16px !important;
  line-height: 1.45 !important;
  padding-top: 15px !important;
  padding-bottom: 15px !important;
  min-height: 52px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}
.zn-res-menu-nav .zn_mega_title,
.zn-res-menu-nav li.menu-item-has-children > a { font-weight: 600; }

/* the accordion, driven by .mb-acc-open on the <li> */
.zn-res-menu-nav li.mb-acc > ul.sub-menu,
.zn-res-menu-nav li.mb-acc > .zn_mega_container {
  position: static !important;
  display: none !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  transform: none !important;
  background: rgba(0, 0, 0, .035) !important;
  box-shadow: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 !important;
}
.zn-res-menu-nav li.mb-acc.mb-acc-open > ul.sub-menu,
.zn-res-menu-nav li.mb-acc.mb-acc-open > .zn_mega_container { display: block !important; }
.zn-res-menu-nav li.mb-acc > ul.sub-menu li > a,
.zn-res-menu-nav li.mb-acc > .zn_mega_container li > a {
  padding-left: 34px !important;
  font-size: 15px !important;
  min-height: 46px;
}
.zn-res-menu-nav li.mb-acc > .zn_mega_container ul { padding: 0 !important; margin: 0 !important; }
.zn-res-menu-nav li.mb-acc > .zn_mega_container li { width: 100% !important; float: none !important; }

/* the twisty */
.zn-res-menu-nav li.mb-acc > a { position: relative; padding-right: 46px !important; }
.zn-res-menu-nav li.mb-acc > a .mb-acc-caret {
  position: absolute;
  right: 16px;
  top: 50%;
  width: 9px; height: 9px;
  margin-top: -6px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: .55;
  transform: rotate(45deg);
  transition: transform .18s ease-out;
}
.zn-res-menu-nav li.mb-acc.mb-acc-open > a .mb-acc-caret {
  transform: rotate(-135deg);
  margin-top: -2px;
}

/* 17 — the panel itself must scroll once a section is open */
.zn-res-menu-nav {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
}
.zn-res-menu-nav.mb-acc-ready { height: 100% !important; }
.zn-res-menu-nav.mb-acc-ready .zn_res_menu_go_back { display: none !important; }


/* --- 24  CONTACT US ring, third pass: subtle separation only -------------
   Round 4 shipped a solid 1px #0a1a30 ring; round 5's first pass took it to
   45% alpha. Still read as heavy on live, so this is a 32% tight ring in a
   softer blue plus one 4px halo at 22% — enough to hold the glyph edges apart
   from a bright hero, nothing more. Proven at three hero brightnesses.      */

/* --- 26  Disclaimer block: breathing space above it ----------------------
   Round 5 item 13 padded the BOTTOM of .mb-below; the gap the operator means
   is the one ABOVE the disclaimer card, which nothing set. Measured before:
   the block started 36.4px below .mb-below's box on /contact/ but only
   because .mb-below has no bottom padding on live v4 - with item 13's 28px
   the two nearly touch. Both halves are now explicit and the total is >= 32px. */
.mb-disclaimer-box {
  margin-top: 34px !important;
  padding-top: 4px;
}
@media (max-width: 767px) {
  .mb-disclaimer-box { margin-top: 40px !important; }
}
/* resort contact pages carry no disclaimer card - the same breathing space is
   the bottom padding under the reply line, item 13 */

/* ============================================================
   MABUL DESIGN ROUND 6 — 2026-08-19
   Shared by EN (/static/style-en.css) and CN (/cn/static/style.css).
   ============================================================ */

/* --- R6-1  Mobile menu: one indicator, darker type, clean rows -----------
   ROOT CAUSE of the stray ">": Kallyas puts its own submenu opener in the
   responsive menu as a SIBLING of the link -
     <span class="zn_res_submenu_trigger glyphicon glyphicon-chevron-right">
   It was invisible until now only because the glyphicon font was 404ing; round
   5 fixed the font, so the theme's chevron-right started rendering next to the
   accordion chevron round 5 added. Measured live at 390px: the theme span sits
   at x=731 w=49, the round-5 caret at x=704 w=13 - two indicators on one row.
   The theme span is not the accordion's hit target (mb-menu.js binds the <a> in
   the capture phase), so hiding it costs nothing.

   Type was rgba(0,0,0,.45) on every row except the current one at .85 - that
   is the grey the operator means.                                           */
.zn-res-menu-nav .zn_res_submenu_trigger,
.zn-res-menu-nav .glyphicon-chevron-right,
.zn-res-menu-nav .glyphicon-chevron-left { display: none !important; }

.zn-res-menu-nav li > a,
.zn-res-menu-nav .main-menu-item > a,
.zn-res-menu-nav li.mb-acc > a {
  color: #16181b !important;
  font-weight: 500;
}
.zn-res-menu-nav li.mb-acc > a { font-weight: 600; }
.zn-res-menu-nav li.mb-acc > ul.sub-menu li > a,
.zn-res-menu-nav li.mb-acc > .zn_mega_container li > a {
  color: #2b2f34 !important;
  font-weight: 400;
}
/* clean rows: one hairline between items, none doubled at the ends */
.zn-res-menu-nav > ul > li,
.zn-res-menu-nav ul.main-menu > li { border-bottom: 1px solid rgba(0, 0, 0, .07); }
.zn-res-menu-nav ul.main-menu > li:last-child { border-bottom: 0; }
.zn-res-menu-nav li.mb-acc.mb-acc-open > a { background: rgba(0, 0, 0, .035); }
.zn-res-menu-nav li.mb-acc > a .mb-acc-caret { opacity: .75; }

/* --- R6-4  ONE hover treatment for every dropdown, every state -----------
   (a) The mega items carried Kallyas' link hover: red text from round 1
         .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover
           { color:#cd2122 }
       plus the theme's animated 2px underline
         ...a:not(.zn_mega_title):before { height:2px; background:#cd2122 }
         ...a:hover:before { width:100% }
       while the regular dropdowns had the theme's cell hover
         .main-nav ul ul.sub-menu .menu-item a:hover
           { color:#323232; background:rgba(0,0,0,.04) }
       - two different treatments in the same menu.
   (b) Both now use the cell hover, and every red hover colour becomes the CTA
       turquoise.
   (c) Scoped for BOTH DOMs: .main-nav (top state) and .chaser-main-menu
       (scrolled state), which share no ancestor - the lesson from rounds 2-4. */
@media (min-width: 992px) {

  /* kill the underline in both states */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    background-color: transparent !important;
  }

  /* the whole row is the target, in the mega as well as the sub-menus */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title),
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title) {
    display: block !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-left: -10px;
    margin-right: -10px;
    border-radius: 2px;
  }

  /* --- TOP STATE: light-grey cell, turquoise text, no red, no underline --- */
  .main-nav ul ul.sub-menu .menu-item > a:hover,
  .main-nav ul ul.sub-menu .menu-item.active > a,
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover,
  .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title) {
    background: rgba(0, 0, 0, .06) !important;
    color: #2f998a !important;
    text-decoration: none !important;
  }
  /* li-level tint so the highlight spans the column row, not just the text box */
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li > ul > li:hover,
  .main-nav ul ul.sub-menu .menu-item:hover { background: rgba(0, 0, 0, .04); }

  /* --- SCROLLED (chaser) STATE: same treatment, dark-surface equivalent --- */
  .chaser-main-menu .sub-menu .menu-item > a:hover,
  .chaser-main-menu .sub-menu .menu-item.active > a,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title) {
    background: rgba(255, 255, 255, .10) !important;
    color: #4fd3c1 !important;
    text-decoration: none !important;
  }
  .chaser-main-menu .sub-menu .menu-item:hover,
  .chaser-main-menu .zn_mega_container .menu-item:hover { background: transparent !important; }
  /* the theme blacks the whole cell out on hover - withdraw that */
  .chaser-main-menu li:hover > a,
  .chaser-main-menu li a:hover { background: transparent; }
  .chaser-main-menu .sub-menu li:hover > a,
  .chaser-main-menu .zn_mega_container li:hover > a {
    background: rgba(255, 255, 255, .10) !important;
  }

  /* mega column headings never take the item hover */
  .main-nav .zn_mega_container a.zn_mega_title:hover,
  .chaser-main-menu .zn_mega_container a.zn_mega_title:hover {
    background: transparent !important;
    text-decoration: none !important;
  }
}

/* ============================================================
   MABUL DESIGN ROUND 7 — 2026-08-19
   Shared by EN (/static/style-en.css) and CN (/cn/static/style.css).
   Three taste adjustments on the verified v6 base.
   ============================================================ */

/* --- R7-1  Mega menu hover: underline back, in turquoise ----------------
   Reverses R6-4(a) for the MEGA PANEL ONLY. The regular dropdowns keep the
   grey-cell hover from R6-4(b) untouched.
     mega     -> no cell background, turquoise 2px underline, turquoise text
     regular  -> grey cell, turquoise text, no underline   (unchanged)
   Both menu DOMs again: .main-nav (top state) and .chaser-main-menu (scrolled),
   which share no ancestor.                                                  */
@media (min-width: 992px) {

  /* undo round 6's cell preparation on the mega links only */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title),
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title) {
    display: inline-block !important;
    padding: 10px 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 0;
    position: relative;
  }

  /* no cell background anywhere in the mega, hover or active, either state */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover,
  .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title),
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li > ul > li:hover,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title),
  .chaser-main-menu .zn_mega_container .menu-item:hover,
  .chaser-main-menu .zn_mega_container li:hover > a {
    background: transparent !important;
    background-color: transparent !important;
  }

  /* the underline is back — turquoise, never the theme's #cd2122 */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 0;
    bottom: 4px;
    width: 0 !important;
    height: 2px !important;
    background: #3bbfad !important;
    background-color: #3bbfad !important;
    transition: width .15s cubic-bezier(.68, 0, .265, 1);
  }
  /* round 6 killed the underline with a MORE specific ":hover:before" rule
     (display:none !important), so restating display/height/background here is
     required - a plain ":before" restore loses to it while hovering.          */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 2px !important;
    background: #3bbfad !important;
    background-color: #3bbfad !important;
  }
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before {
    background: #4fd3c1 !important;
    background-color: #4fd3c1 !important;
  }

  /* text colour on hover: turquoise in both states, no red */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover {
    color: #2f998a !important;
  }
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover {
    color: #4fd3c1 !important;
  }

  /* --- R7-2  Mega columns: 100px each side (~200px between text edges) ---
     Not a bug fix: R6-2 proved the 50px rule was being served and measured
     100px between text edges on live. This is a spec increase, 50 -> 100.   */
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li {
    padding: 0 100px !important;
  }
  .main-nav .zn_mega_container { max-width: min(96vw, 1320px) !important; }
}

/* --- R7-3  CONTACT US ring = the text colour, 20% darker -----------------
   Measured on live: the heading renders rgb(242, 247, 252).
   Ring = that x 0.8 -> rgb(194, 198, 202). Same tight 1px eight-stop ring and
   the low-spread halo from v5; only the colour changes.
   Ring history: round 4 solid #0a1a30 (alpha 1.0) -> round 5 rgba(10,26,48,.45)
   -> round 5 shipped rgba(30,60,90,.32) -> round 7 rgb(194,198,202).        */
html body[data-page="contact"] .zn_section h1.tbk__title.mb-resort-title,
html body[data-page="contact"] .zn_section .tbk__title.mb-resort-title,
html body[data-page="contact"] h1.tbk__title.mb-resort-title {
  text-shadow:
    -1px -1px 0 rgb(194, 198, 202),  0   -1px 0 rgb(194, 198, 202),
     1px -1px 0 rgb(194, 198, 202),  1px  0   0 rgb(194, 198, 202),
     1px  1px 0 rgb(194, 198, 202),  0    1px 0 rgb(194, 198, 202),
    -1px  1px 0 rgb(194, 198, 202), -1px  0   0 rgb(194, 198, 202),
     0    1px 3px rgba(194, 198, 202, .55) !important;
}

/* ============================================================
   MABUL DESIGN ROUND 8 — MEGA MENU FINAL
   Supersedes all mega geometry/hover from R2–R7 by cascade order.
   Root cause fixed: R3's li max-width:240px cap (never raised) made
   every later padding increase eat the text column — R7's 100px/side
   left 40px for nowrap text, overflowing the panel by up to +4.8px.
   Columns now size to content; the panel grows with them.
   Scope: .zn_mega_container / .menu-item-mega-parent only.
   Regular dropdowns keep their R6 grey-cell hover untouched.
   Two DOMs: .main-nav (top) and .chaser-main-menu (scrolled).
   ============================================================ */
@media (min-width: 992px) {

  /* --- PANEL: grows with content; R4's left-under-trigger anchor kept --- */
  .main-nav .zn_mega_container {
    width: max-content !important;
    min-width: 0 !important;
    max-width: min(96vw, 1400px) !important;
    padding: 18px 10px !important;
    background: #f5f5f5 !important;
  }

  /* --- COLUMNS: 240px cap dead, even 44px gutters, centered hairline --- */
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li {
    flex: 0 0 auto !important;
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 44px !important;
    margin: 0 !important;
  }
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li + li {
    border-left: 1px solid rgba(0, 0, 0, .08) !important;
  }

  /* --- links: text-width boxes (kills R6's negative-margin residue) --- */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title),
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title) {
    display: inline-block !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border-radius: 0;
    position: relative;
  }
  .main-nav .zn_mega_container .menu-item:hover,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li > ul > li:hover,
  .chaser-main-menu .zn_mega_container .menu-item:hover {
    background: transparent !important;
  }

  /* --- ONE underline: 2px turquoise, text-width, both states --- */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 0; bottom: 4px;
    height: 2px !important;
    width: 0 !important;
    background: #3bbfad !important;
    transition: width .18s ease-out;
  }
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before {
    width: 100% !important;
    height: 2px !important;
    background: #3bbfad !important;
  }
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover { color: #2f998a !important; }
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover { color: #4fd3c1 !important; }
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before {
    background: #4fd3c1 !important;
  }

  /* --- column titles never hover-treated --- */
  .main-nav .zn_mega_container a.zn_mega_title:hover,
  .chaser-main-menu .zn_mega_container a.zn_mega_title:hover {
    background: transparent !important;
    text-decoration: none !important;
  }

  /* --- CHASER panel: same growth, dark surface --- */
  .chaser-main-menu .zn_mega_container {
    width: max-content !important;
    min-width: 0 !important;
    max-width: min(96vw, 1400px) !important;
    padding: 18px 10px !important;
    background: #0f1113 !important;
  }
  .chaser-main-menu .zn_mega_container .zn_mega_menu_container_wrapper > ul > li + li {
    border-left: 1px solid rgba(255, 255, 255, .12) !important;
  }
}

/* narrow desktop: slimmer gutters so the left-anchored panel stays on-screen */
@media (min-width: 992px) and (max-width: 1199px) {
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li,
  .chaser-main-menu .zn_mega_container .zn_mega_menu_container_wrapper > ul > li {
    padding: 0 28px !important;
  }
}

/* ============================================================
   MABUL DESIGN ROUND 8a — CHASER PARITY (added by the build, not authored
   in chat). The round-8 block scopes its column-geometry rule to
     .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li
   only, so in the scrolled state the columns kept Bootstrap's .col-sm-4
   padding. Measured before this patch, chaser at 1920:
     padding 15px/15px, text-edge gap 30px (spec 88), columns still floated.
   Assertion (5) of the round-8 order requires the chaser to show the SAME
   numbers, so the same declarations are mirrored to .chaser-main-menu.
   Nothing from the authored block is removed or altered.
   ============================================================ */
@media (min-width: 992px) {
  .chaser-main-menu .zn_mega_container .zn_mega_menu_container_wrapper > ul > li {
    flex: 0 0 auto !important;
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 44px !important;
    margin: 0 !important;
  }
  .chaser-main-menu .zn_mega_container .zn_mega_menu_container_wrapper > ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
  }
}

/* ============================================================
   MABUL DESIGN ROUND 9 — 2026-08-20
   Two precision fixes on the green v8 base.
   ============================================================ */

/* --- R9-1  Mega underline: one painter, pinned -------------------------
   MEASURED FIRST, on 4 viewport widths (1100/1280/1440/1920) x 2 menu DOMs
   x all 11 mega items, on the current build AND on the pre-round-8 build:

     multi/odd painters = 0 everywhere.
     The only box painting under any mega item is a::before,
     height 2px, width = the link's text width, rgb(59,191,173)
     (rgb(79,211,193) in the chaser).

   So no second, thicker painter exists to remove. What DOES paint a second
   bar is the .active rule: on /pom-pom-island/ the item "Pom Pom Island
   Resort" carries current-menu-item, so its underline is PERMANENT and shows
   next to whichever item is being hovered - two bars at once, the static one
   under a shorter word. Measured identical though: 2px, 150.78px = its own
   text width. See reports/design-round9.md; whether the active item should
   carry a permanent bar at all is a design call, not a bug, and is flagged
   there with the one line that removes it.

   This block does not change the geometry. It PINS it, so no future layer can
   reintroduce a second or thicker painter: the underline is declared once for
   hover and active together, and every other box that could draw under a mega
   item is explicitly denied.                                                */
@media (min-width: 992px) {
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before {
    height: 2px !important;
    max-height: 2px !important;
    bottom: 4px !important;
    top: auto !important;
    left: 0 !important;
    right: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  /* nothing else in the mega may draw a line under an item */
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):after,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):after {
    content: none !important;
    display: none !important;
  }
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title),
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title) span,
  .main-nav .zn_mega_container .zn_mega_menu_container_wrapper > ul > li > ul > li,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title),
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title) span,
  .chaser-main-menu .zn_mega_container .zn_mega_menu_container_wrapper > ul > li > ul > li {
    border-bottom: 0 !important;
    text-decoration: none !important;
  }
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title) span:before,
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title) span:after,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title) span:before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title) span:after {
    content: none !important;
    display: none !important;
  }
}

/* --- R9-2  Mobile accordion: the light square at the row's right --------
   ROOT CAUSE, measured at 390px on an OPEN row:
     li   x 0    w 390   right 390
     a    x 0    w 341   right 341      margin-right 49px
   Kallyas reserves 49px on the parent <a> for its own
   .zn_res_submenu_trigger span. Round 6 hid that span but left the reserved
   margin, so the open-row tint (background on the <a>) stops 49px short of
   the row edge - the light square. The same margin pushed the accordion
   caret in with it: its right edge measured 63.1px from the row edge instead
   of 16.

   (a) reserved margin removed - the row and its tint span the full width
   (b) caret pinned to the ROW's right edge, vertically centred by transform
       (the old top/margin-top juggling shifted it when the row opened)
   (c) the theme span stays display:none; the tap target is the <a>, which now
       spans the full row, so the hit area only grows.                       */
.zn-res-menu-nav li > a,
.zn-res-menu-nav li.mb-acc > a,
.zn-res-menu-nav .main-menu-item > a {
  margin-right: 0 !important;
  margin-left: 0 !important;
  width: auto !important;
}
.zn-res-menu-nav li.mb-acc > a { position: relative; padding-right: 46px !important; }

.zn-res-menu-nav li.mb-acc > a .mb-acc-caret {
  position: absolute;
  right: 16px;
  left: auto;
  top: 50%;
  margin-top: 0 !important;
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: .55;
  transform: translateY(-70%) rotate(45deg);
  transition: transform .18s ease-out;
}
.zn-res-menu-nav li.mb-acc.mb-acc-open > a .mb-acc-caret {
  transform: translateY(-30%) rotate(-135deg);
  margin-top: 0 !important;
}

/* ============================================================
   MABUL DESIGN ROUND 10 — 2026-08-20
   ============================================================ */

/* --- R10-1  Uniform THIN underline --------------------------------------
   MEASURED CAUSE of the perceived thickness difference (R9 had already proved
   there is only ONE painter, 2px, per item):

     line-height 20.3px  +  padding 8px 0   ->  item height 36.297px
     items stack, so each underline lands at a DIFFERENT subpixel phase:
       .672  .969  .266  .563  .859
     "Sipadan-Mabul Resort" sits at .672 and "Mabul Water Bungalows" at .969 -
     exactly the pair reported. At a non-integer device pixel ratio a line at
     .672 rasterises across a different number of device rows than one at .969,
     so identical CSS renders visibly thicker or thinner.

   Two changes, both needed:
   (a) the line is 1px in every state and both DOMs, as ordered;
   (b) the item box is made a WHOLE number of CSS pixels - line-height 20px
       with the existing 8px padding gives exactly 36px - so every item in the
       stack shares one subpixel phase and therefore one rasterisation. Without
       (b), 1px still straddles two device rows at phase .969 and the operator
       would see the same complaint at a thinner weight.                      */
@media (min-width: 992px) {
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title),
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title) {
    line-height: 20px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .main-nav .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .main-nav .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):before,
  .chaser-main-menu .zn_mega_container .menu-item a:not(.zn_mega_title):hover:before,
  .chaser-main-menu .zn_mega_container .menu-item.active > a:not(.zn_mega_title):before {
    height: 1px !important;
    max-height: 1px !important;
    bottom: 4px !important;
  }
}

/* ============================================================
   MABUL DESIGN ROUND 11 — 2026-08-20  (shared: EN + CN)
   ============================================================ */

/* --- R11-6  CONTACT US: letters near-white light blue, ring 10% darker ----
   Derived, not eyeballed:
     fill = hsl(195, 70%, 96%)  ->  rgb(238, 248, 252)
     ring = same hue and saturation, lightness -10%
          = hsl(195, 70%, 86%)  ->  rgb(194, 232, 244)
   Same tight 1px eight-stop ring plus one low-spread halo, as since v5.
   Ring history: R4 #0a1a30 solid -> R5 rgba(30,60,90,.32)
                 -> R7 rgb(194,198,202) -> R11 rgb(194,232,244).            */
html body[data-page="contact"] .zn_section h1.tbk__title.mb-resort-title,
html body[data-page="contact"] .zn_section .tbk__title.mb-resort-title,
html body[data-page="contact"] h1.tbk__title.mb-resort-title {
  color: rgb(238, 248, 252) !important;
  -webkit-text-fill-color: rgb(238, 248, 252) !important;
  text-shadow:
    -1px -1px 0 rgb(194, 232, 244),  0   -1px 0 rgb(194, 232, 244),
     1px -1px 0 rgb(194, 232, 244),  1px  0   0 rgb(194, 232, 244),
     1px  1px 0 rgb(194, 232, 244),  0    1px 0 rgb(194, 232, 244),
    -1px  1px 0 rgb(194, 232, 244), -1px  0   0 rgb(194, 232, 244),
     0    1px 3px rgba(194, 232, 244, .55) !important;
}

/* --- R11-7  Mega column titles: align with their items, no trailing dash --
   MEASURED in the scrolled (chaser) state, CN, 1600px:
     title padding  16px 25px 16px 15px   <- 15px left inset
     item  padding  8px 0px               <- none
   so the title TEXT sat 15px right of the item text. The top state has no
   such inset, which is why only the chaser looked wrong.
   The trailing dash is the theme's title ::after, present in the chaser only:
     content "" | display block | 6px x 2px | rgb(204,204,204) | right: 9px    */
@media (min-width: 992px) {
  .main-nav .zn_mega_container a.zn_mega_title,
  .chaser-main-menu .zn_mega_container a.zn_mega_title {
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-indent: 0 !important;
  }
  .main-nav .zn_mega_container a.zn_mega_title:after,
  .main-nav .zn_mega_container a.zn_mega_title:before,
  .chaser-main-menu .zn_mega_container a.zn_mega_title:after,
  .chaser-main-menu .zn_mega_container a.zn_mega_title:before {
    content: none !important;
    display: none !important;
    background: none !important;
  }
}

/* --- R11-8  Mobile popup menu: booking row, icons ------------------------
   Mobile only. The icons are inline SVG injected by mb-menu.js, so nothing
   depends on the glyphicon font. Desktop is untouched: every rule here is
   inside .zn-res-menu-nav, which only exists in the responsive menu.        */
.zn-res-menu-nav li.mb-book > a {
  background: rgba(59, 191, 173, .12) !important;
  font-weight: 700 !important;
}
.zn-res-menu-nav .mb-mi {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin-right: 12px;
  opacity: .75;
  display: inline-block;
  vertical-align: middle;
}
.zn-res-menu-nav .mb-mi svg { width: 22px; height: 22px; display: block; }
.zn-res-menu-nav li.mb-book > a .mb-mi { opacity: 1; }
.zn-res-menu-nav li.mb-acc > ul.sub-menu li > a .mb-mi,
.zn-res-menu-nav li.mb-acc > .zn_mega_container li > a .mb-mi {
  flex: 0 0 18px; width: 18px; height: 18px; margin-right: 10px;
}
.zn-res-menu-nav li.mb-acc > ul.sub-menu li > a .mb-mi svg,
.zn-res-menu-nav li.mb-acc > .zn_mega_container li > a .mb-mi svg {
  width: 18px; height: 18px;
}
@media (min-width: 992px) {
  /* belt and braces: never let a menu icon appear on desktop */
  .main-nav .mb-mi, .chaser-main-menu .mb-mi { display: none !important; }
}

/* ============================================================
   MABUL DESIGN ROUND 11 — CN ONLY
   Appended to /cn/static/style.css only. The EN sheet already carries the
   full Bootstrap grid (158 col-* rules); the CN sheet carries none, which is
   why /cn/contact* stacked the info column under the form and the page read
   as "empty" at a glance. Measured before: .col-md-8 computed width 1100px,
   float none - the class had no rule at all.

   Scoped to the contact pages (every CN contact page carries
   body[data-page^="contact"] and exactly one .row.zn_col_container-smart_container
   holding one .col-md-8 and one .col-md-4) so no other CN page's layout can
   shift. Flex rather than float: no clearfix dependency, and the columns
   stack by themselves below 992px because the rule lives in a media query.
   ============================================================ */
@media (min-width: 992px) {
  body[data-page^="contact"] .row.zn_col_container-smart_container {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    margin-left: -15px;
    margin-right: -15px;
  }
  body[data-page^="contact"] .row.zn_col_container-smart_container > .col-md-8 {
    flex: 0 0 66.6667% !important;
    max-width: 66.6667% !important;
    width: auto !important;
    float: none !important;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
  }
  body[data-page^="contact"] .row.zn_col_container-smart_container > .col-md-4 {
    flex: 0 0 33.3333% !important;
    max-width: 33.3333% !important;
    width: auto !important;
    float: none !important;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
  }
}

/* ============================================================
   MABUL DESIGN ROUND 13 — CN ONLY  (2026-08-20)
   WeChat QR block replacing the Facebook contact route, plus the
   "English speaking numbers" group label in the phone block.
   CN-only markup, so CN-only CSS: the EN sheet gets nothing.
   ============================================================ */
.mb-contact-info .mb-wechat-qr {
  display: block;
  width: 154px;          /* the file's natural size - never upscaled, a blurred */
  height: 154px;         /* QR is an unscannable QR                             */
  max-width: 100%;
  margin: 4px 0 10px;
  border: 1px solid #e2e8ec;
  border-radius: 4px;
  background: #fff;
}
.mb-contact-info .mb-en-group {
  display: inline-block;
  margin-top: 2px;
  font-size: 13px;
  letter-spacing: .02em;
  text-transform: none;
  color: #6b7a88;
}
@media (max-width: 480px) {
  /* the info column is ~320px at 390px viewport, so 154px still fits and
     stays crisp; only the gutter tightens */
  .mb-contact-info .mb-wechat-qr { margin: 4px 0 8px; }
}


/* ============================================================
   MABUL DESIGN ROUND 14 - CN ONLY  (2026-08-20)
   R14-1  Contact content must stack ABOVE the parallax layer.

   .zn-bgSource is position:fixed, z-index:auto and taller than the viewport, so
   it paints above every non-positioned in-flow box. The EN tree escapes because
   Bootstrap gives .col-* position:relative and the theme gives
   .zn_contact_form_container the same; the CN sheet has neither, and the grid
   added in R11-3 reproduced the sizing without the position.

   NOT inside a media query on purpose - the fixed layer covers the content at
   every width, narrow layouts included.
   ============================================================ */
/* SUPERSEDED BY R17-1. This enumerated four elements by name to lift them above
   the parallax; R17-1 restores Bootstrap's own .col-* rule, which is what the EN
   tree has and which covers every column including the white card's col-md-12
   wrapper. Keeping both would leave .mb-contact-info-col positioned on CN and
   static on EN - a parity difference with no purpose. */


/* ============================================================
   MABUL DESIGN ROUND 17 - CN ONLY  (2026-08-20)
   R17-1  Bootstrap's .col-* declaration, restored on contact pages.

   The CN sheet has never carried Bootstrap's grid. R11-3 added the sizing,
   v16 added position:relative to .col-md-8 / .col-md-4 by name - but the white
   card's own wrapper is a col-md-12, so the card stayed BEHIND the fixed
   parallax layer while its contents sat in front of it. That is the transparent
   look: content visible, card invisible.

   Measured, live:  EN card top band -> zn_custom_container
                    CN card top band -> zn-bgSource-image

   This is Bootstrap's own rule, enumerated the way Bootstrap enumerates it so
   offset/push/pull classes are not caught by accident.
   ============================================================ */
body[data-page^="contact"] .col-xs-1, body[data-page^="contact"] .col-xs-2,
body[data-page^="contact"] .col-xs-3, body[data-page^="contact"] .col-xs-4,
body[data-page^="contact"] .col-xs-5, body[data-page^="contact"] .col-xs-6,
body[data-page^="contact"] .col-xs-7, body[data-page^="contact"] .col-xs-8,
body[data-page^="contact"] .col-xs-9, body[data-page^="contact"] .col-xs-10,
body[data-page^="contact"] .col-xs-11, body[data-page^="contact"] .col-xs-12,
body[data-page^="contact"] .col-sm-1, body[data-page^="contact"] .col-sm-2,
body[data-page^="contact"] .col-sm-3, body[data-page^="contact"] .col-sm-4,
body[data-page^="contact"] .col-sm-5, body[data-page^="contact"] .col-sm-6,
body[data-page^="contact"] .col-sm-7, body[data-page^="contact"] .col-sm-8,
body[data-page^="contact"] .col-sm-9, body[data-page^="contact"] .col-sm-10,
body[data-page^="contact"] .col-sm-11, body[data-page^="contact"] .col-sm-12,
body[data-page^="contact"] .col-md-1, body[data-page^="contact"] .col-md-2,
body[data-page^="contact"] .col-md-3, body[data-page^="contact"] .col-md-4,
body[data-page^="contact"] .col-md-5, body[data-page^="contact"] .col-md-6,
body[data-page^="contact"] .col-md-7, body[data-page^="contact"] .col-md-8,
body[data-page^="contact"] .col-md-9, body[data-page^="contact"] .col-md-10,
body[data-page^="contact"] .col-md-11, body[data-page^="contact"] .col-md-12,
body[data-page^="contact"] .col-lg-1, body[data-page^="contact"] .col-lg-2,
body[data-page^="contact"] .col-lg-3, body[data-page^="contact"] .col-lg-4,
body[data-page^="contact"] .col-lg-5, body[data-page^="contact"] .col-lg-6,
body[data-page^="contact"] .col-lg-7, body[data-page^="contact"] .col-lg-8,
body[data-page^="contact"] .col-lg-9, body[data-page^="contact"] .col-lg-10,
body[data-page^="contact"] .col-lg-11, body[data-page^="contact"] .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}

/* the one other computed difference the EN/CN diff turned up */
body[data-page^="contact"] .zn_contact_form_container {
  position: relative;   /* EN has this from a theme rule; CN never did */
  padding-top: 10px;
}


/* ============================================================
   MABUL DESIGN ROUND 18  (2026-08-21)
   R18-5  No black lettering above the form on any contact page.

   Measured on LIVE before writing a line:
     /contact/                       color rgb(238,248,252)  56px / 62.72  ls 0.56px
                                     text-shadow: the 9-stop rgb(194,232,244) ring
     /contact-sipadan-mabul-resort/  color rgb(31,45,61)     44px / 49.28  ls 0.44px
                                     text-shadow: none          <- the defect

   rgb(31,45,61) is near-black. The reference is /contact/, so every contact-page
   title in both trees is given its exact computed values. /contact/ and
   /cn/contact/ already compute these, so the rule is a no-op there.
   ============================================================ */
html body[data-page^="contact"] .zn_section h1.tbk__title.mb-resort-title,
html body[data-page^="contact"] .zn_section .tbk__title.mb-resort-title,
html body[data-page^="contact"] h1.tbk__title.mb-resort-title {
  color: rgb(238, 248, 252) !important;
  -webkit-text-fill-color: rgb(238, 248, 252) !important;
  font-size: 56px !important;
  line-height: 62.72px !important;
  letter-spacing: 0.56px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  border: 0 none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 0 3px !important;
  background-color: rgba(0, 0, 0, 0) !important;
  background-image: none !important;
  text-align: center !important;
  text-shadow:
    -1px -1px 0 rgb(194, 232, 244),  0   -1px 0 rgb(194, 232, 244),
     1px -1px 0 rgb(194, 232, 244),  1px  0   0 rgb(194, 232, 244),
     1px  1px 0 rgb(194, 232, 244),  0    1px 0 rgb(194, 232, 244),
    -1px  1px 0 rgb(194, 232, 244), -1px  0   0 rgb(194, 232, 244),
     0    1px 3px rgba(194, 232, 244, .55) !important;
}


/* ============================================================
   MABUL DESIGN ROUND 18 - CN ONLY
   R18-1  arrival-date composite. The visible field must keep the EXACT box the
   native input had, so the row geometry does not move: the wrapper is the sizing
   element and the input fills it. The calendar button sits inside on the right,
   drawn in the turquoise accent - never black - and vertically centred.
   ============================================================ */
.mb-form .mb-date { position: relative; display: block; width: 100%; }
.mb-form .mb-date > input[type="text"] { width: 100%; padding-right: 42px; box-sizing: border-box; }
.mb-form .mb-date__btn {
  position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
  width: 32px; height: 32px; padding: 0; margin: 0;
  display: flex; align-items: center; justify-content: center;
  background: none; border: 0; cursor: pointer;
  color: #3bbfad;                     /* the accent - explicitly not black */
  -webkit-text-fill-color: #3bbfad;
}
.mb-form .mb-date__btn:hover, .mb-form .mb-date__btn:focus { color: #2aa294; }
.mb-form .mb-date__btn svg { display: block; width: 20px; height: 20px; stroke: currentColor; }
.mb-form .mb-date__native {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; opacity: 0; pointer-events: none; border: 0; padding: 0;
}
.mb-form .mb-date-hint { margin: 4px 0 0; font-size: 12px; color: #6b7a88; }


/* ============================================================
   MABUL DESIGN ROUND 19  (2026-08-21)
   R19-2  contact title: whiter, and one line on mobile.

   Colour: rgb(238,248,252) read grey against the ring. Now rgb(248,252,254) -
   almost white with a slight blue tint, relative luminance 0.985. The thin
   light-blue ring rgb(194,232,244) is unchanged.

   Size: desktop UNCHANGED at 56px. clamp's vw term only bites below ~875px
   (6.4vw = 56px there), so 1920 and 1280 still compute exactly 56px. At 390 it
   resolves to ~25px: the longest title on any of the 20 pages is 21 characters
   ("SIPADAN WATER VILLAGE"), and 21 chars at 25px fits the ~320px card column.
   nowrap is the guarantee, the clamp is what makes it fit.
   ============================================================ */
html body[data-page^="contact"] .zn_section h1.tbk__title.mb-resort-title,
html body[data-page^="contact"] .zn_section .tbk__title.mb-resort-title,
html body[data-page^="contact"] h1.tbk__title.mb-resort-title {
  color: rgb(248, 252, 254) !important;
  -webkit-text-fill-color: rgb(248, 252, 254) !important;
  font-size: clamp(18px, 6.4vw, 56px) !important;
  line-height: 1.12 !important;
  white-space: nowrap !important;
  max-width: 100% !important;
}

/* R19-4  CN top phone bar: breathing room before the WeChat run. */
.mb-bar-wechat { margin-left: 22px; }


/* ============================================================
   MABUL DESIGN ROUND 20  (2026-08-21)
   R20-1  contact + error page titles: NO ring below the mobile breakpoint.

   The ring is eight 1px offset shadow stops. At 56px they read as a crisp
   outline; at the ~25px the clamp produces on a phone the eight offsets land
   inside a fraction of a glyph stroke and the letters look blurred rather than
   outlined. Below 875px the ring is removed entirely - no text-shadow, no
   -webkit-text-stroke, no border - leaving sharp near-white rgb(248,252,254).

   875px is not arbitrary: it is exactly where the clamp's vw term stops winning
   (6.4vw = 56px), so the ring disappears at precisely the width the type starts
   shrinking. Desktop is untouched - 1280 and 1920 still compute 56px with the
   full rgb(194,232,244) ring.

   The error pages are clones of the contact page and carry data-page="contact",
   so this one rule covers them too and keeps them identical at every width.
   ============================================================ */
@media (max-width: 874px) {
  html body[data-page^="contact"] .zn_section h1.tbk__title.mb-resort-title,
  html body[data-page^="contact"] .zn_section .tbk__title.mb-resort-title,
  html body[data-page^="contact"] h1.tbk__title.mb-resort-title {
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
    -webkit-text-stroke-width: 0 !important;
    text-stroke: 0 !important;
    border: 0 none !important;
    filter: none !important;
  }
}

/* ============================================================
   MABUL DESIGN ROUND 24  (2026-08-23)
   Mobile fixes from the operator's iPhone test. Every rule below answers a
   defect COUNTED by static-build/tools/mobile_defect_sweep.js at 390px, and the
   count is stated so a later round can tell whether it is still needed.
   ============================================================ */

/* ---- item 1: the date field box ---------------------------------------
   The native <input type="date"> measured 244px in WebKit - the full width of
   the text field - because input[type=date] has an intrinsic size that plain
   `width` does not beat. An invisible full-width date input over a text input is
   how you get "tapping the field opens the picker". It is now clamped into the
   button's 44x44 box with appearance:none, which is what defeats the intrinsic
   sizing, and it is only a FALLBACK: where showPicker() exists it is never used.
   44px is the iOS minimum tap target; the button was 32px. */
.mb-form .mb-date__btn {
  width: 44px; height: 44px; right: 2px;
  -webkit-tap-highlight-color: transparent;
}
.mb-form .mb-date > input[type="text"] { padding-right: 52px; }
.mb-form .mb-date__native {
  position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px;
  min-width: 0; max-width: 44px; max-height: 44px;
  box-sizing: border-box; overflow: hidden;
  -webkit-appearance: none; appearance: none;
  opacity: 0; pointer-events: none; border: 0; padding: 0; margin: 0;
}
.mb-form .mb-date__native::-webkit-date-and-time-value { margin: 0; }
.mb-form .mb-date__native::-webkit-calendar-picker-indicator { opacity: 0; }

/* ---- (a) contact-page title too close to the top on mobile -------------
   24 instances / 24 pages: the 20 contact pages plus the 4 error pages, which
   carry data-page="contact" and must keep matching them. */
@media (max-width: 874px) {
  html body[data-page^="contact"] .kl-title-block { padding-top: 26px; }
}

/* ---- (b) list bullets cut in half at the left edge ---------------------
   96 orphan <li> across 18 pages (the 9 resort pages, both trees). The markup
   puts <li> directly inside an <h4> with no <ul>, so there is no padding-left to
   hold the marker and it is drawn outside the content box. Fixed in CSS on the
   operator's ruling - rewriting 18 pages to insert <ul> wrappers would disturb
   the itemprop schema on those headings for no visible gain. */
.tbk__subtitle li,
h1 > li, h2 > li, h3 > li, h4 > li, h5 > li, h6 > li, p > li, div > li {
  margin-left: 1.35em;
  padding-left: 2px;
  list-style-position: outside;
}
@media (max-width: 874px) {
  .tbk__subtitle li,
  h1 > li, h2 > li, h3 > li, h4 > li, h5 > li, h6 > li, p > li, div > li {
    margin-left: 1.15em;
  }
}

/* ---- (d) carousel arrows invisible on blue ----------------------------
   72 arrows across 18 pages, light grey on a blue backdrop. White plus a soft
   shadow so they hold on light images too. */
/* The arrows are .znSlickNav-arr with an inline <svg><polyline>, and the paint
   comes from `.znSlickNav-arr polyline{stroke:#141414}` - near-black - with
   `.znSlickNav--light polyline{stroke:#ececec}` on light carousels. Neither
   survives a photographic backdrop. My first attempt targeted .slick-prev /
   .slick-next / .kl-arrow, which match NOTHING on this theme, so it changed
   nothing; the class is .znSlickNav-arr (with .slick-arrow alongside it). */
.znSlickNav-arr polyline,
.znSlickNav-arr:hover polyline,
.znSlickNav--light .znSlickNav-arr polyline,
.znSlickNav--light polyline,
.slick-prev svg polyline, .slick-next svg polyline {
  stroke: #ffffff !important;
}
.znSlickNav-arr svg {
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .55));
}
.slick-prev, .slick-next, .zn-carousel-arrow, .kl-arrow {
  color: #fff !important; opacity: 1 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
}

/* ---- (e) EN review stars rendered as a chevron -------------------------
   ~20 star elements on 90 pages. The CN sheet already sets a literal star; the
   EN sheet left the Glyphicons Private-Use codepoint U+E006, and the icon font
   is not applied to those elements, so the fallback font drew whatever it had
   at that codepoint. A literal U+2605 renders in any font. */
.glyphicon-star:before,
.glyphicon.glyphicon-star:before { content: "\2605" !important; }

/* ---- (f) CTA button with no breathing space before the next image ------
   11 instances on 9 pages. */
.zn_section a.btn, .zn_section a[class*="button"], .zn_section .zn_button,
.znColumnElement-innerContent a.btn,
.znColumnElement-innerContent a[class*="button"] { margin-bottom: 26px; }

/* ---- (g) sub-heading sitting flush on the image above it ---------------
   53 instances on 21 pages. Scoped to in-content headings so the hero title,
   the menus and the footer are untouched. */
.znColumnElement-innerContent h2,
.znColumnElement-innerContent h3,
.znColumnElement-innerContent h4,
.zn_text_box h2, .zn_text_box h3, .zn_text_box h4 { margin-top: 22px; }
.znColumnElement-innerContent > h2:first-child,
.znColumnElement-innerContent > h3:first-child,
.znColumnElement-innerContent > h4:first-child { margin-top: 0; }

/* ============================================================
   MABUL DESIGN ROUND 27  (2026-08-24)
   CN resort hero titles are two lines: Chinese, then the English booking name.
   One H1 with two spans - the English name stays INSIDE the H1 because it is
   what guests search and book with, and tbk__subtitle is already spoken for on
   these pages by the "Dive Package Includes" list.
   No brackets: this is the operator-approved override of ROOM-NAMES-LAW's
   bracket form, for the 9 resort PAGE titles only. Room/product names keep it.
   ============================================================ */
.mb-h1-cn { display: block; }
.mb-h1-en {
  display: block;
  font-size: .52em;
  line-height: 1.25;
  letter-spacing: .06em;
  font-weight: 400;
  opacity: .92;
  margin-top: .18em;
}
@media (max-width: 874px) {
  /* Each line must fit on ONE line at 390px. These resort H1s render at 60px and
     have no mobile clamp of their own - R20-1's clamp is scoped to
     body[data-page^="contact"] - so 8-12 CJK characters at 60px wrapped on six of
     the nine pages. The spans are clamped explicitly rather than inheriting an em
     scale, because the English span sizes off the H1, not off the Chinese span.
     Desktop is untouched: this only exists below the mobile breakpoint. */
  h1.tbk__title .mb-h1-cn { font-size: clamp(18px, 5.6vw, 34px); line-height: 1.28; }
  h1.tbk__title .mb-h1-en { font-size: clamp(11px, 3.1vw, 18px); letter-spacing: .03em; }
}

/* ============================================================
   MABUL DESIGN ROUND 29  (2026-08-25)
   Contact-page polish from the operator's iPhone review.
   ============================================================ */

/* ---- (1) mobile top bar: the WeChat line starts at the SAME x as the line above.
   R13 gave .mb-bar-wechat margin-left:22px to separate it on ONE desktop line. On a
   phone the bar wraps and that 22px became a stray indent - measured x=37 against
   the bar's own x=15. Below the breakpoint it becomes its own block at x=0. */
@media (max-width: 874px) {
  .kl-header-toptext .mb-bar-wechat,
  .kl-header-toptext nobr.mb-bar-wechat {
    display: block;
    margin-left: 0 !important;
    text-indent: 0;
  }
  .kl-header-toptext { text-align: left; }
}

/* ---- (2) contact-page title: equal breathing space above and below, ~20% less
   in total. Measured before: 26px above, 3px below (h1 margin) = 29px combined.
   After: 11.5px above, 11.5px below = 23px, a 21% reduction, and symmetric.
   Desktop is untouched - this lives inside the mobile breakpoint. */
@media (max-width: 874px) {
  /* The h1 keeps its own 3px margin-bottom - the v18 rule that sets it wins on
     specificity and a later round may depend on it - so the padding COMPENSATES
     instead of fighting it: 11.5 above, 8.5 + 3 = 11.5 below. Measured equal. */
  html body[data-page^="contact"] .kl-title-block {
    padding-top: 11.5px;
    padding-bottom: 8.5px;
  }
}

/* ---- (5) 英语服务号码 is a <strong class="mb-en-group"> inside the description,
   not a heading, so it did not pick up the 700 the section headings carry. */
.mb-en-group {
  font-weight: 700;
  display: inline-block;
  margin-top: 2px;
}

/* ---- (6) the footer disclaimer is wrapped in <strong>. On a phone a fully bold
   four-line legal sentence shouts; desktop keeps it as it is. */
@media (max-width: 874px) {
  .zn_text_box p strong,
  .zn_text_box strong.mb-disclaimer,
  p.mb-disclaimer strong { font-weight: 400; }
}

/* ---- (3)+(4) the CN sheet never had the icon or separator rules.
   Ported verbatim from style-en.css; the font URLs are absolute so they
   resolve from /cn/static/. Without these the icons render 0x0 and the
   column text sits where the icon should be. */
@font-face {font-family:'glyphicons_halflingsregular'; font-weight:normal; font-style:normal;src:url('/static/fonts/glyphicons_halflingsregular.eot');src:url('/static/fonts/glyphicons_halflingsregular.eot#iefix') format('embedded-opentype'),url('/static/fonts/glyphicons_halflingsregular.woff') format('woff'),url('/static/fonts/glyphicons_halflingsregular.ttf') format('truetype'),url('/static/fonts/glyphicons_halflingsregular.svg#glyphicons_halflingsregular') format('svg');}
@font-face {font-family:'kl-social-icons'; font-weight:normal; font-style:normal;src:url('/static/fonts/kl-social-icons.eot');src:url('/static/fonts/kl-social-icons.eot#iefix') format('embedded-opentype'),url('/static/fonts/kl-social-icons.woff') format('woff'),url('/static/fonts/kl-social-icons.ttf') format('truetype'),url('/static/fonts/kl-social-icons.svg#kl-social-icons') format('svg');}
[data-zn_icon]:before {content:attr(data-zn_icon)}
[data-zniconfam],[data-zniconfam]:before{font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
[data-zniconfam='glyphicons_halflingsregular']:before , [data-zniconfam='glyphicons_halflingsregular'] {font-family:'glyphicons_halflingsregular' !important;}
[data-zniconfam='kl-social-icons']:before , [data-zniconfam='kl-social-icons'] {font-family:'kl-social-icons' !important;}
.zn_separator.zn_separator--icon-no {border-top-style:solid;}
.zn_separator--icon-yes .zn_separator__icon {display:inline-block; color:#cd2122; vertical-align:middle; margin-left:20px; margin-right:20px; font-size:20px; }
.zn_separator--icon-yes .zn_separator__line {content:''; display:inline-block; border-top-style:solid; width:calc(50% - 50px); vertical-align:middle; }

/* ============================================================
   MABUL DESIGN ROUND 30  (2026-08-25)
   The VISIBLE rhythm around the contact-page title on mobile.

   v29 equalised the H1's own padding, which is not what the eye measures. The two
   distances that matter are:
       a = bottom of the sticky header -> top of the title TEXT
       b = bottom of the title TEXT    -> top of the white card
   Measured at 390 before this round: a = 68-99, b = 9. The hero section carries
   padding-top:110px, and three EN pages additionally carry a 30px margin on the
   hero column wrapper, which is where the 99s came from.
   ============================================================ */
@media (max-width: 874px) {
  /* Three per-page values made (a) differ across otherwise identical pages, and
     all three are neutralised here so the hero geometry is one shape on mobile:
        .zn_section margin-top      -50px on the resort contact pages,
                                     -1px on /contact/ and the error pages  (49px)
        .znColumnElement-innerWrapper margin-top 30px on 3 EN pages
        .kl-title-block margin-top   20px on 2 pages
     With margin-top:0 the hero starts exactly at the header's bottom edge, so
     (a) = padding-top + the 9px the title block contributes = 22 + 9 = 31. */
  html body[data-page^="contact"] .zn_section {
    margin-top: 0 !important;
    padding-top: 22px;
  }
  html body[data-page^="contact"] .zn_section .znColumnElement-innerWrapper,
  html body[data-page^="contact"] .zn_section .kl-title-block {
    margin-top: 0 !important;
  }
  /* (b) is raised to meet (a) via the CARD's offset, not the H1's padding */
  html body[data-page^="contact"] .zn_custom_container { margin-top: 22px; }
}
