body{background:#e9f8ff;background-position:center;background-repeat:no-repeat;background-attachment:fixed;background-size:cover;background-image:url('../img/bg.png');}
.navbar{padding:0 0 0 1em;}
.display-split,.display-full{margin:3em auto 1em auto;}
figure{margin:2em auto;width:100%;}
figure img{width:100%;}
figcaption{padding:0.6em;}

.vscroller,.flourish-chart{overflow:hidden;overflow-y:auto;}
.vscroller::-webkit-scrollbar,.flourish-chart::-webkit-scrollbar{width:6px;background-color:none;}
.vscroller::-webkit-scrollbar-track,.flourish-chart::-webkit-scrollbar-track{-webkit-background-color:none;border-radius:10px;}
.vscroller::-webkit-scrollbar-thumb,.flourish-chart:last-child::-webkit-scrollbar-thumb{border-radius:10px;background:var(--theme-ui-colors-light-grey);}
p{text-align:left;line-height:1.5;color:#666;}
a{text-decoration:none;}

h1,h2,h3{line-height:1.2;}
h2,.article-header{font-size:1.8em;font-weight:700;}
.article-header{color:var(--theme-ui-colors-secondary);}
h3,.article-subhead{font-size:1.4em;font-weight:700;}
.article-header,.article-subhead,.article-text{width:80%;margin:1em auto 0 auto;}
.article-header,.article-subhead{text-align:center;}
.display-split .article-text{margin:0 0 1em 0;width:100%;}

.align-center{text-align:center;}
#main-wrapper{outline:none;z-index:1000;position:relative;}
.sticky-header{position:relative;}
.cover-header{width:60%;min-height:60vh;margin:auto;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;transition:opacity 3s cubic-bezier(0.19, 1, 0.22, 1);transition-delay:1s;position:relative;z-index:4;opacity:0;}
.cover-header.visible{opacity:1;}
.cover-content{width:80%;margin:0 auto;text-align:center;color:#fff;}
.cover-content.align-bottom{top:80%;transform:translate(-50%,-80%);}
.cover-sub{font-size:1em;line-height:1.4;display:inline;margin-bottom:2em;font-weight:400;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:uppercase;position:relative;-webkit-animation:fadein 4s;-moz-animation:fadein 4s;animation:fadein 4s;}

.cover-headline{line-height:1.2;}
.cover-headline h1{text-shadow:0 2px 4px rgba(0,0,0,0.15);position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.cover-headline h1 span,.cover-headline h1 em{display:block;white-space:nowrap;}
.cover-headline h1 span{font-size:1em;margin:0.6em auto 0 auto;font-weight:500;-webkit-animation:fadein 4s;-moz-animation:fadein 4s;animation:fadein 4s;}
.cover-headline h1 em{font-size:1.6em;font-weight:900;-webkit-animation:fadein 8s;-moz-animation:fadein 8s;animation:fadein 8s;}
#program-label{padding:0.4em 0.8em;border-radius:0.3em;display:inline-block;color:var(--theme-ui-colors-white);background:var(--theme-ui-colors-main);}
#program-label:hover{background:var(--theme-ui-colors-secondary);}
.publish{font-size:0.9em;padding:1em 0;margin:1em auto 0 auto;border-top:1px solid rgba(255,255,255,0.4);}
.theme-light .publish{border-top:1px solid rgba(0,0,0,0.2);}

.intro{width:50%;margin:0 auto 20% auto;position:relative;z-index:2;display:flex;align-items:center;}
.intro-text{padding:2em;border-radius:0.4em;width:100%;font-size:1.1em;background:rgba(255,255,255,0.5);display:block;margin:auto;z-index:1000;text-align:center;box-shadow:0 0 30px 0 rgb(0 0 0 / 8%);border:1px solid rgba(255,255,255,0.3);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--theme-ui-colors-white);}
.intro-text p{margin:0 0 1.2em 0;}
.intro-text a{border-bottom:2px solid var(--theme-ui-colors-main);color:var(--theme-ui-colors-white);}

.wrapper{padding:2em;border:0.4em solid var(--theme-ui-colors-white);background:var(--theme-ui-colors-white);border-radius:1em;width:75%;margin:0 auto 4em auto;box-shadow: 4px 10px 20px 0 rgba(0,50,150,.08);}
.container{width:90%;margin:auto;}

.btn-link span{width:36px;height:36px;margin-left:0.6em;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;}
.btn-link{padding:0.1em 0.1em 0.1em 1em;border-radius:50px;margin:0.8em 0.4em;color:var(--theme-ui-colors-white);background:var(--theme-ui-colors-main);border:none!important;font-weight:500;line-height:1.2;display:inline-flex;align-items:center;display:inline-flex;}
.btn-link:last-child{background:var(--theme-ui-colors-secondary);}

.arrow-right,.arrow-left,.arrow-up,.arrow-down{display:block;width:12px;height:12px;border-top:2px solid #000;border-left:2px solid #000;}
.arrow-right{transform:rotate(135deg);margin-left:-0.2em;}
.arrow-left{transform:rotate(-45deg);}
.arrow-down{transform:rotate(-135deg);margin-top:-0.2em;}
.arrow-up{transform:rotate(45deg);margin-top:0.3em;}
.chart-container{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin:1.6em auto;}

.flourish-chart{flex-grow:1;width:100%;border:0.5em solid #f9f9f9;}
.flourish-chart iframe{display:block;border-radius:0.6em;border:2px solid #5c5c5c;}
.flourish-credit{display:none;}
#article-main .display-full:last-child .chart-container .flourish-chart{max-height:600px;overflow-y:scroll;}

h1,h2,h3{line-height:1.2;}
h2{font-size:1.8em;color:var(--theme-ui-colors-main);}

h2[id] {scroll-margin-top: 100px;}

.chart-container:has(.chartText:not(:empty)) .flourish-chart{flex-basis:60%;}
.chart-container:has(.chartText:not(:empty)) .chartText{flex-basis:35%;}

@media (min-width:900px) and (max-width:1280px) and (orientation:landscape){
.cover-header,.wrapper{width:80%;}
.intro{width:70%;}
.article-header, .article-subhead,.article-text{width:100%;}
}

@media (min-width:200px) and (max-width:900px){
body{background-size:auto 110%;}
.container{width:100%;}
.cover-header,.cover-content{width:90%;}
.cover-header{height:100%;}
.cover-content.align-bottom{top:65%;}
.cover-sub{width:100%;margin:0 auto 1em auto;display:block;}
.cover-headline h1{font-size:1.2em;}
.cover-headline h1 span,.cover-headline h1 em{-webkit-animation:none;-moz-animation:none;animation:none;}
.cover-headline h1 span{font-size:0.8em;}
.cover-headline h1 em{font-size:1.6em;}
#program-label{padding:0.2em 0.8em;font-size:0.9em;}
.intro{width:90%;margin:0 auto 2em auto;}
.intro-text{top:50%;padding:1em 1.6em;}
.intro .message{width:70%;padding:0.6em 1em 1.6em 1em;}
.intro h1 em,.intro h1 span{display:block;}
.intro h1 span{font-size:1.2em;}
h2{font-size:1.4em;}

.btn-link{margin:0.4em auto;font-size:0.85em;}
.btn-link span{width:26px;height:26px;}
.arrow-right,.arrow-left,.arrow-up,.arrow-down{width:10px;height:10px;}

.flourish-chart{border:0.3em solid #f9f9f9;}
.wrapper{width:90%;padding:0.6em;}
.article-header, .article-subhead, .article-text{width:100%;}
h2,.article-header{font-size:1.4em;text-align:left;}
h3,.article-subhead{font-size:1.2em;}
.chart-container:has(.chartText:not(:empty)) .chartText{flex-basis:100%;}
}


.nav-wrapper{padding:1em;width:14%;top:6%;float:left;background:rgba(255, 255, 255, 0.5);display:flex;z-index:100001;flex-flow:column nowrap;justify-content:flex-end;position:-webkit-sticky;position:sticky;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}

.nav{margin:0 0 80px 2em;}
.nav-counter{font-size:1em;transition:all 0.15s ease-out;}
.nav-title{font-weight:300;margin:0 0 0.25em;height:0;overflow:hidden;opacity:0;transition:height 0.3s ease-out, opacity 0.2s ease-out;}
.nav-body{font-weight:300;height:0;overflow:hidden;opacity:0;transition:height 0.3s ease-out, opacity 0.2s ease-out;}
.nav,.nav li{list-style-type:none;padding:0;margin:0;}
.nav li h3{padding:0.2em 0;margin:0;font-size:1em;}
.nav li h3 a{padding:0.4em;border:1px solid rgba(255, 255, 255, 0.4);color:rgba(0, 0, 0, 0.3);display:block;}
.nav li.active{background:rgba(255, 255, 255, 1);}
.nav li.active h3{pointer-events:none;padding-left:0;font-weight:bold;}
.nav li.active h3 a{border:none;}
.nav-sub{padding:0 0.4em 1em 0.4em;display:none;transition:all 0.3s ease-out;}
.nav li.active .nav-sub{display:block;}
.nav-sub li{border-bottom:1px solid rgba(0, 0, 0, 0.1);position:relative;transition:all 0.3s ease-out;}
.nav-sub li:after{display:none;content:"";border-left:1px solid grey;border-top:1px solid grey;height:250px;width:20px;position:absolute;left:-30px;top:30px;}
.nav-sub li a{display:block;line-height:1.2;padding:0.4em 0;color:#333333;font-weight:400;transition:all 0.15s ease-out;}
.nav-sub li a:hover{background-color:transparent;padding-left:1em;}
.nav-sub li a:focus{background-color:transparent;}
.nav-sub li.active{border-color:var(--theme-ui-colors-primary);pointer-events:none;background:none;font-weight:900;}
.nav-sub li.active:after{display:none;width:35px;height:400px;top:1.4em;}
.nav-sub li.active a{font-weight:500;background:none;}
.nav-sub li.active .nav-counter{color:var(--theme-ui-colors-primary);}
.nav-sub li.active .nav-title{height:40px;opacity:1;overflow:visible;}
.nav-sub li.active .nav-body{height:60px;opacity:1;overflow:visible;}
.nav-sub em{font-size:0.9em;}
.nav-sub li em{color:#aaa;}
.nav-sub li.segment,.nav-sub li.segment a{height:auto;padding:0;border:none;}
.nav li.shy,.nav li.shy a{width:0;height:0;opacity:0;}
.nav li.active h3 a,.nav-sub li.active em{color:#000;}

#profile-nav.is-visible .nav-wrapper {opacity: 1;transform: translateY(0);pointer-events: auto;}
#profile-nav .nav-wrapper{opacity: 0;transform: translateY(20px);pointer-events: none;width:140px;padding:2px;left:1em;bottom:14%;top:auto;background:var(--theme-ui-colors-white);color:var(--theme-ui-colors-grey);border-radius:0.6em;display:block;position:fixed;z-index:100000000;box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.1);transition:all 0.5s;line-height:1.2;}
#profile-nav .nav-wrapper span{font-size:0.9em;padding:0.5em;display:block;text-align:center;position:relative;}
#profile-nav .nav-wrapper ul{font-size:0.9em;margin:0;padding:0;list-style:none;background:transparent;}
#profile-nav .nav-wrapper ul li{margin:0.1em auto;display:inline-block;border-radius:50%;flex-grow:1;padding:0 0.2em;}
#profile-nav .nav-wrapper ul li a{width:auto;padding:0.4em;margin:0.1em auto;font-weight:400;display:flex;justify-content:center;align-items:center;text-align:center;text-decoration:none;border-radius:0.4em;border:1px solid var(--theme-ui-colors-grey);color:var(--theme-ui-colors-grey);background:transparent;}
#profile-nav .nav-wrapper ul li.active a{font-weight:700;color:var(--theme-ui-colors-black) !important;background:#ffd504 !important;border-color:transparent !important;}
#profile-nav .nav-wrapper .profile-logo{width:80%;margin:0.6em auto;display:block;}

@media (orientation:landscape){#profile-nav .nav-wrapper ul li a:hover{color:var(--theme-ui-colors-secondary);background:var(--theme-ui-colors-white);}
}

@media (min-width:768px) and (max-width:1300px){.case-study section{width:94%;margin:2em 1em 2em auto;}
.case-box{width:94%;}
}

@media (min-width:320px) and (max-width:767px) and (orientation:portrait){.nav-wrapper{display:flex;flex-flow:row;}
#profile-nav .nav-wrapper{left:0;bottom:auto;top:0;width:96%;margin:2%;padding:0.4em;border-radius:0.4em;display:flex;vertical-align:middle;}
#profile-nav .nav-wrapper span{width:20%;justify-content:center;align-items:center;display:flex;}
#profile-nav .nav-wrapper ul{width:100%;margin:auto;display:flex;vertical-align:middle;}
#profile-nav .nav-wrapper ul li a{padding:0.4em 0.8em 0.3em 0.8em;width:auto;height:auto;white-space:nowrap;border-radius:0.3em;}
#profile-nav .nav-wrapper ul li a br{display:none;}
#profile-nav .nav-wrapper .profile-logo{width:50px;margin:auto;display:inline-block;}
}

@media (min-width:769px) and (max-width:1100px) and (orientation:landscape){.nav-wrapper{padding:0.8em;width:280px;}
}

@media screen and (min-width:320px) and (max-width:1000px){.nav-wrapper{width:100%;padding:0;height:auto;bottom:auto;top:0;z-index:10000;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;}
.nav000{width:100%;padding:0 1em;margin:0;display:block;text-align:center;background:rgba(255, 255, 255, 0.9);box-shadow:0 0 20px 0 rgba(0, 0, 0, 1);overflow-y:hidden000;scroll-snap-type:x mandatory;}
.nav li{display:inline-block;}
.nav li h3{padding:0;font-size:0.9em;}
.nav li h3 a{padding:1em 0.6em 1em 0.6em;border:none;color:#84909c;}
.nav-counter{font-size:1em;}
.nav-body,.nav-body b,.nav-body em{font-weight:300;font-size:0.9em;}
.nav-body{font-size:0.8em;}
.nav li.active .nav-sub{width:100%;padding:0 1em;left:0;position:fixed;display:block;bottom:0;z-index:1000000000;background:#fff;-webkit-box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.1);-moz-box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.1);box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.1);overflow-x:scroll;scroll-snap-type:x mandatory;}
.nav-sub li{display:inline-block;width:auto;margin:0;padding:0 !important;opacity:0.6;}
.nav-sub li:after,.nav li.active:after{display:none;}
.nav-sub li a{padding:0.8em 0.4em 0.8em 0.4em;}
.nav-sub li a:hover{padding-left:0;}
.nav-sub li a:before{width:8px;height:8px;margin-right:0.4em;display:inline-block;border:1px solid var(--theme-ui-colors-main);border-radius:50%;content:"";}
.nav-sub li em.view-desktop{display:none !important;}
.nav-sub li.active a:before{background:var(--theme-ui-colors-main);border-color:transparent;}
.nav-sub li.active{padding-left:0;opacity:1;border:none;}
.nav-sub li.active .nav-counter{font-size:1em;}
.nav-sub li.active .nav-title,.nav-sub li.active .nav-body{height:auto;padding:0;margin:0 0 0.5em 0;}
.nav li.active h3 a,.nav-sub li.active em{color:var(--theme-ui-colors-main);}
}