/* global reset and variables */
:root {
    --red: #ED6A60;
    --yellow: #EAB345;
    --blue: #2B6282;
    --smoke: #F8F8F8;
    --black: #000000;
    --hero-margin: 17em;
    --section-margin-internal: 1.5em;
    --section-margin: 5em;
    --section-margin-big: 8em;
    --section-margin-mega: 13em;
    --border-radius: 1.4em;
  }
  
  *, *::before, *::after {
    box-sizing: border-box;
  }
  
  * {
    margin: 0;
  }
  
  *{
    scroll-behavior: smooth !important;
  }
  
  html, body {
    height: 100%;
  }
  
  body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    font-family: 'Rubik', sans-serif;
    background-color: white;
    color: var(--blue);
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  
  body::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  
  img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
  }
  
  a {
    text-decoration: none;
    color: inherit;
  }
  
  input, button, textarea, select {
    font: inherit;
  }
  
  p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
    font-weight: normal;
  }
  
  #root, #__next {
    isolation: isolate;
  }
  
  /* utility */
  .container {
    width: 92%;
    max-width: 1300px;
    margin: 0 auto;
  }
  
  .container__banner-image{
    width: 92%;
    margin: 0 auto;
  }
  
  .container-mini {
    width: 80%;
    max-width: 1300px;
    margin: 0 auto;
  }
  
  .highlight-y {
    color: var(--yellow);
  }
  
  .highlight-b {
    color: var(--blue);
  }
  .highlight-id{
    cursor: pointer;
  }
  
  .highlight-r {
    color: var(--red);
  }
  .button1,
  .button {
    background-color: var(--yellow);
    color: white;
    border-radius: 50em;
    padding: 0.8em 1.5em;
    padding-right: 1.3em;
    display: flex;
    align-items: center;
    margin-bottom: 0.5em;
    position: relative;
    overflow: hidden;
  }
  .button1 .button-overlay{transition: all 0.4s;left:-100%}
  .button1:hover .button-overlay{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0%;
    z-index: 1;
    background: var(--blue);
    border-radius: 50em;
  }
  .button1:hover{
      color: #fff;
      text-decoration: none;
  }
  
  /* .button1:hover, a:hover {
      color: #fff;
      text-decoration: none;
  } */
  .button-red {
    background: var(--red);
    color: white;
  }
  
  .button-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: -100%;
    z-index: 1;
    background: var(--blue);
    border-radius: 50em;
  }
  
  .button-overlay-blue {
    background: var(--blue);
  }
  
  .button-text,
  .button-icon-wrapper {
    position: relative;
    z-index: 10;
  }
  
  .button-icon-wrapper {
    flex-shrink: 0;
    margin-left: 0.5em;
    width: 1.25em;
  }
  
  .nav-links__internal ul{list-style: none;}
  .nav-links__internal li	{    margin-left: 2em;
      padding: 0}
    .nav-links__internal ul li{ display: inline-block;
   transition: color 0.2s ease-out;}
    .nav-links__internal ul li a{cursor: pointer;}
    .nav-links__internal ul li a:hover,.nav-links__internal ul li a:focus { color: var(--yellow);}
  .footer-col__links ul li a:hover,.nav-links__internal ul li a:focus { color: var(--yellow);}
  .footer-col__links  a:hover,.nav-links__internal ul li a:focus { color: var(--yellow);}
  /*ul .sub-menu {
      display:none;
  }*/
  .menu-item-has-children.show .sub-menu {
      display: block; /* Show submenu when parent has 'show' class */
  }
  /* .current-menu-item a {
      color: #EAB345 !important;
  }
  */
  
  .cities-acc__text a{
      color:#EAB345;
  }
  .footer-col__links li{
          list-style: none;
  }
  .footer-col__item-legal p {
    max-width: 18ch;
    margin-bottom: 1.1em;
  }
  .footer-col__item-address p{
    max-width: 14ch;
    margin-bottom: 2.1em;
  }
  .footer-col__links p{
      margin-bottom: 0.7em;
    transition: color 0.2s ease-out;
  }
  .footer-col__links ul{
        margin: 0;
      padding: 0;
  }
  .footer-col__links ul li {
        margin: 0px 0px 0.7em 0px;
      padding: 0;
  }
  .article-para a {
          color:#EAB345;
  
  }
  .nav-panel__pagelinks ul{list-style: none;}
  .nav-panel__pagelinks ul li{display: inline-block;
    transition: color 0.2s ease-out;}
    .nav-panel__pagelinks ul li a{cursor: pointer;}
  
  
  @media only screen and (max-width: 767px) {
    .container-mini {
      width: 92%;
    }
  
    .button {
      padding: 0.6em 1.2em;
      padding-right: 1.3em;
      margin-bottom: 0.5em;
    }
  }
  
  /* typography */
  .text-d1 {
    font-size: 9rem;
    line-height: 1;
  }
  
  .text-d2 {
    font-size: 5rem;
    line-height: 1.1;
    letter-spacing: -2px;
  }
  
  .text-d3 {
    font-size: 4rem;
    line-height: 1.15;
    letter-spacing: -2px;
  }
  
  .text-h1 {
    font-size: 3rem;
    line-height: 1.2;
    letter-spacing: -1.5px;
  }
  
  .text-h2 {
    font-size: 2.5rem;
    line-height: 1.2;
    letter-spacing: -1px;
  }
  
  .text-h3 {
    font-size: 2.1rem;
    line-height: 1.3;
    letter-spacing: -0.8px;
  }
  
  .text-h4 {
    font-size: 1.5rem;
    line-height: 1.3;
    letter-spacing: -0.5px;
  }
  
  .text-h5 {
    font-size: 1.2rem;
    line-height: 1.5;
    letter-spacing: -0.3px;
  }
  
  .text-h6 {
    font-size: 1rem;
    line-height: 1.5;
  }
  
  .text-h6-caps {
    font-size: 0.9rem;
    line-height: 1.5;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1.5px;
  }
  
  .text-h6-mini {
    font-size: 0.8rem;
    line-height: 1.5;
  }
  
  @media only screen and (max-width: 991px) {
    .text-d1 {
      font-size: 9rem;
    }
  
    .text-d2 {
      font-size: 3.7rem;
    }
  
    .text-d3 {
      font-size: 2.8rem;
    }
  
    .text-h1 {
      font-size: 2.7rem;
    }
  
    .text-h2 {
      font-size: 2.4rem;
    }
  
    .text-h3 {
      font-size: 1.8rem;
    }
  
    .text-h4 {
      font-size: 1.5rem;
    }
  
    .text-h5 {
      font-size: 1.1rem;
    }
  
    .text-h6 {
      font-size: 0.9rem;
    }
  
    .text-h6-caps {
      font-size: 0.8rem;
    }
  
    .text-h6-mini {
      font-size: 0.8rem;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .text-d1 {
      font-size: 9rem;
    }
  
    .text-d2 {
      font-size: 3.2rem;
    }
  
    .text-d3 {
      font-size: 2.9rem;
    }
  
    .text-h1 {
      font-size: 2.7rem;
    }
  
    .text-h2 {
      font-size: 2.3rem;
    }
  
    .text-h3 {
      font-size: 1.7rem;
    }
  
    .text-h4 {
      font-size: 1.5rem;
    }
  
    .text-h5 {
      font-size: 1.1rem;
    }
  
    .text-h6 {
      font-size: 0.8rem;
    }
  
    .text-h6-caps {
      font-size: 0.8rem;
    }
  
    .text-h6-mini {
      font-size: 0.8rem;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .text-d1 {
      font-size: 9rem;
    }
  
    .text-d2 {
      font-size: 3rem;
    }
  
    .text-d3 {
      font-size: 2.3rem;
    }
  
    .text-h1 {
      font-size: 2.1rem;
    }
  
    .text-h2 {
      font-size: 2.1rem;
    }
  
    .text-h3 {
      font-size: 1.6rem;
    }
  
    .text-h4 {
      font-size: 1.4rem;
    }
  
    .text-h5 {
      font-size: 0.95rem;
    }
  
    .text-h6 {
      font-size: 0.9rem;
    }
  
    .text-h6-caps {
      font-size: 0.7rem;
    }
  
    .text-h6-mini {
      font-size: 0.7rem;
    }
  }
  
  
  
  /* loader */
  .loader{
    position: fixed;
    width: 100vw;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 120000;
  }
  
  .loader-bg{
    width: 100%;
    height: 100%;
    background: var(--smoke);
  }
  
  .loader-logo-wrapper{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .loader-logo{
    width: 10vw;
  }
  
  @media only screen and (max-width: 991px) {
    .loader-logo{
      width: 30vw;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .loader-logo{
      width: 40vw;
    }
  }
  
  
  
  /* nav */
  .nav {
    padding: 2em 0;
    margin: 0 4%;
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    position: fixed;
    top: 0;
    z-index: 9999;
    width: 92%;
    background: var(--smoke);
    box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 12px;
  }
  
  .nav-grid {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 96%;
    margin: 0 auto;
  }
  
  .nav-logo-wrapper {
    width: 12em;
  }
  
  .nav-links-wrapper,
  .nav-links__social {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .nav-links__social {
    margin-left: 1.5em;
  }
  
  .nav-links__social-item {
    width: 2em;
    padding: 0.4em;
    margin-left: 0.6em;
    color: var(--yellow);
    transition: color 0.2s ease-out;
  }
  
  .nav-links__social-item:hover,
  .nav-links__social-item:focus {
    color: var(--red);
  }
  
  .nav-link-item {
  /*   margin-left: 2em; */
    letter-spacing: -0.5px;
    transition: color 0.2s ease-out;
  /* 	line-height:2.5;	 */
  }
  
  .nav-link-item:hover,
  .nav-link-item:focus {
    color: var(--yellow);
  }
  
  @media only screen and (max-width: 900px) {
  
    .nav-links-wrapper,
    .nav-links__social {
      display: none;
    }
  
    .nav-logo-wrapper {
      width: 10em;
    }
  
    .nav {
      padding: 1.4em 0;
    }
  
    .nav-grid {
      width: 94%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .nav-logo-wrapper {
      width: 9em;
    }
  
    .nav {
      padding: 1.2em 0;
    }
  
    .nav-grid {
      width: 90%;
    }
  }
  
  /* nav panel */
  .nav-lottie-wrapper {
    display: none;
  }
  
  .nav-panel-wrapper {
    overflow: hidden;
    height: 0;
  }
  
  .nav-panel__divider {
    height: 3px;
    width: 90%;
    margin: 0 auto 1.7em;
    border-radius: 10em;
    background: var(--blue);
    opacity: 0.2;
  }
  
  .nav-panel__socials {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-left: 0.6em;
  }
  
  .nav-panel__content {
    padding: 3em 0 1em;
  }
  
  .nav-panel__pagelinks {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5em;
  }
  
  .link-on-nav-panel {
    margin-bottom: 1em;
    margin-left: 1em;
    font-size: 1.5rem !important;
  }
  
  .social-on-nav-panel {
    width: 2.3em;
    margin-right: 1em;
  }
  
  @media only screen and (max-width: 900px) {
    .nav-lottie-wrapper {
      display: block;
      width: 3em;
      cursor: pointer;
    }
  
    .nav-panel-wrapper {
      /* display; block; */
    }
  }
  
  .nav-panel__pagelinks ul{
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: flex-start;
  }
  #menu-header-menu .menu-item:last-child{
      background: var(--yellow);
  /* 	padding: 0.4em 1em; */
      border-radius: 500px;
      font-weight: 500;
  }
  #menu-item-1693.menu-item-1693 a{padding:0.5em 1.5em 0; display:block}
  #menu-header-menu .menu-item:last-child:hover{
      background: var(--blue);
      color: var(--yellow);
  }
  @media only screen and (max-width: 478px){
      #menu-header-menu .menu-item:last-child{
          padding: 0.3em 0.6em;
      }
  }
  #menu-header-menu-1 .menu-item:last-child{
      background: var(--yellow);
      padding: 0.4em 1em;
      border-radius: 500px;
      font-weight: 500;
      margin-top: 0.5em;
  }
  #menu-header-menu-1 .menu-item:last-child:hover{
      background: var(--blue);
      color: var(--yellow);
  }
  @media only screen and (max-width: 478px){
      #menu-header-menu-1 .menu-item:last-child{
          padding: 0.3em 0.6em;
      }
  }
  
  
  
  /* home page *******************************************************************/
  /* home hero banner */
  /* v1 */
  .home-hero {
    position: relative;
    margin-top: calc(var(--hero-margin)*0.85);
    margin-bottom: var(--section-margin-mega);
  }
  
  .home-hero__grid {
    display: grid;
    grid-template-columns: 0.4fr 1fr;
    grid-column-gap: 0em;
  }
  
  .home-hero__pitch-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin-top: -3.2em;
  }
  
  .home-hero__pitch {
    text-align: left;
    margin-bottom: 0.24em;	
  }
  
  .home-hero__banner-wrapper {
    width: 100%;
    position: relative;
    z-index: 1;
  }
  
  .home-hero__people-wrapper {
    width: 75%;
    margin: 0 auto;
    position: relative;
    z-index: 8;
  }
  
  .home-hero__shape-wrapper-1 {
    position: absolute;
    bottom: 1%;
    left: -20%;
    width: 30em;
    z-index: 10;
  }
  
  .home-hero__shape-wrapper-2 {
    position: absolute;
    bottom: 20%;
    right: -10%;
    width: 24em;
    z-index: 6;
  }
  
  .home-hero__shape-wrapper-3 {
    position: absolute;
    top: 20%;
    right: 17%;
    width: 6em;
    z-index: 6;
  }
  
  .home-hero__shape-wrapper-4 {
    position: absolute;
    top: 6%;
    left: 12%;
    width: 8em;
    z-index: 6;
  }
  
  .home-hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  @media only screen and (min-width: 992px) {}
  
  @media only screen and (max-width: 991px) {
    .home-hero__pitch-wrapper {
      align-items: center;
    }		
      
    .home-hero {
      --hero-margin: 20em;
      --section-margin-mega: 10em;
    }
  
    .home-hero__grid {
      grid-template-columns: 1fr;
      grid-row-gap: 2em;
    }
  
    .home-hero__pitch {
      max-width: 60%;
      text-align: center;
    }
  
    .home-hero__people-wrapper {
      width: 80%;
    }
  
    .home-hero__shape-wrapper-1 {
      bottom: -1%;
      left: -20%;
      width: 28em;
    }
  
    .home-hero__shape-wrapper-2 {
      bottom: 20%;
      right: -10%;
      width: 22em;
    }
  
    .home-hero__shape-wrapper-3 {
      top: 20%;
      right: 17%;
      width: 6em;
    }
  
    .home-hero__shape-wrapper-4 {
      top: 6%;
      left: 12%;
      width: 8em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .home-hero {
      --hero-margin: 14em;
      --section-margin-mega: 10em;
    }
  
    .home-hero__pitch {
      max-width: 70%;
    }
  
    .home-hero__people-wrapper {
      width: 80%;
    }
  
    .home-hero__shape-wrapper-1 {
      bottom: 0%;
      left: -20%;
      width: 26em;
    }
  
    .home-hero__shape-wrapper-2 {
      bottom: 20%;
      right: -10%;
      width: 22em;
    }
  
    .home-hero__shape-wrapper-3 {
      top: 20%;
      right: 17%;
      width: 6em;
    }
  
    .home-hero__shape-wrapper-4 {
      top: 6%;
      left: 12%;
      width: 8em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .home-hero {
      --hero-margin: 16em;
      --section-margin-mega: 8em;
    }
  
    .home-hero__grid {
      grid-row-gap: 1.5em;
    }
  
    .home-hero__pitch {
      max-width: 80%;
    }
  
    .home-hero__people-wrapper {
      width: 100%;
    }
  
    .home-hero__shape-wrapper-1 {
      bottom: 0%;
      left: -20%;
      width: 20em;
    }
  
    .home-hero__shape-wrapper-2 {
      bottom: 20%;
      right: -4%;
      width: 22em;
    }
  }
  
  /* big text */
  .big-text {
    margin-bottom: var(--section-margin);
  }
  
  /* story interactive */
  .story {
    margin-bottom: var(--section-margin);
  }
  
  .story-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 2em;
    height: 36em;
  }
  
  .story-grid-item {
    border-radius: var(--border-radius);
    background: var(--smoke);
    position: relative;
    overflow: hidden;
  }
  
  .story-grid-item__card1,
  .story-grid-item__card2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 10%;
    border-radius: var(--border-radius);
    overflow: hidden;
  }
  
  .story-grid-item__card2-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }
  
  .story-card1__main {
    margin-bottom: 0.5em;
  }
  
  .story-grid-item__card2 {
    background: var(--smoke);
    color: var(--blue);
    position: absolute;
    top: 0;
    left: -100%;
    z-index: 5;
  }
  
  .story-card2__main {
    margin-bottom: 1em;
  }
  
  .story-grid-item__right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 20%;
  }
  
  .story-toggle-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 5;
    cursor: pointer;
  }
  
  .story-toggle-wrapper {
    width: 12em;
    height: 6em;
    border-radius: 50em;
    background-color: var(--blue);
    position: relative;
    margin-bottom: 0.5em;
  }
  
  .story-toggle-ball {
    width: 5.6em;
    height: 5.6em;
    margin: 0 0.2em;
    border-radius: 50em;
    background-color: var(--yellow);
    position: absolute;
    top: 0.2em;
    left: 0%;
  }
  
  .story-toggle__info {
    text-transform: uppercase;
    opacity: 0.5;
  }
  
  .story-grid-item__bg {
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
  }
  
  .story-grid-item__bg-item1 {
    position: absolute;
    top: -10%;
    left: -10%;
    width: 14em;
    height: 14em;
    background-color: var(--red);
    border-radius: 50em;
  }
  
  .story-grid-item__bg-item2 {
    position: absolute;
    top: 25%;
    right: 10%;
    width: 5em;
    height: 5em;
    background-color: var(--red);
    border-radius: 50em;
  }
  
  .story-grid-item__bg-item3 {
    position: absolute;
    bottom: -40%;
    right: 15%;
    width: 24em;
    height: 24em;
    background-color: var(--red);
    border-radius: 50em;
  }
  
  @media only screen and (min-width: 1080px) {
    .story-grid {
      height: 36em;
    }
  
    .story-grid-item__card1,
    .story-grid-item__card2 {
      padding: 0 20%;
    }
  
    .story-toggle-wrapper {
      width: 9em;
      height: 4.5em;
    }
  
    .story-toggle-ball {
      width: 4.12em;
      height: 4.12em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .story-grid {
      grid-template-columns: 1fr;
      grid-row-gap: 2em;
      height: auto;
    }
  
    .story-grid-item__card1,
    .story-grid-item__card2 {
      padding: 6em 20%;
    }
  
    .story-toggle-area {
      margin: 3em 0 2.5em;
    }
  
    .story-toggle-wrapper {
      width: 7.4em;
      height: 3.7em;
    }
  
    .story-toggle-ball {
      width: 3.3em;
      height: 3.3em;
    }
  
    .story-grid-item__bg-item1 {
      top: -70%;
      left: -6%;
      opacity: 0.5
    }
  
    .story-grid-item__bg-item2 {
      top: 20%;
      right: 10%;
      opacity: 0.5
    }
  
    .story-grid-item__bg-item3 {
      bottom: -200%;
      right: 20%;
      opacity: 0.5
    }
  
    .story-card2__main {
      margin-bottom: 0.6em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .story-grid {
      grid-row-gap: 1.5em;
    }
  
    .story-grid-item__card1,
    .story-grid-item__card2 {
      padding: 6em 10%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .story-grid {
      grid-row-gap: 1.25em;
    }
  
    .story-toggle-area {
      margin: 2em 0 1.7em;
    }
  
    .story-toggle-wrapper {
      width: 6.2em;
      height: 3.1em;
    }
  
    .story-toggle-ball {
      width: 2.74em;
      height: 2.74em;
    }
  
    .story-grid-item__bg-item1 {
      top: -140%;
      left: -20%;
      opacity: 0.5;
      display: none;
    }
  
    .story-grid-item__bg-item2 {
      top: 20%;
      right: 6%;
      opacity: 0.5;
      display: none;
    }
  
    .story-grid-item__bg-item3 {
      bottom: -270%;
      right: -30%;
      opacity: 0.5;
      display: none;
    }
  }
  
  /* program introduction on homepage */
  .home-about {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 2em;
    margin-bottom: var(--section-margin-big);
  }
  
  .home-about__main {
    color: var(--yellow);
  }
  
  .home-about__sub {
    grid-column-start: 2;
    grid-column-gap: 2;
    grid-row-start: 2;
    grid-row-end: 2;
  }
  
  @media only screen and (min-width: 992px) {
    .home-about {
      --section-margin-big: 6em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .home-about {
      grid-template-columns: 1fr 0.4fr;
      grid-column-gap: 2em;
      --section-margin-big: 6em;
    }
  
    .home-about__main {
      margin-bottom: 1em;
    }
  
    .home-about__sub {
      grid-column-start: 1;
      grid-column-end: 3;
      grid-row-start: 2;
      grid-row-end: 2;
      margin-left: 6em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .home-about {
      grid-template-columns: 1fr;
    }
  
    .home-about__sub {
      margin-left: 10%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .home-about {
      --section-margin-big: 4em;
    }
  }
  
  /* grey bg */
  .separator-bg {
    padding: calc(var(--section-margin)*1) 0;
    background: rgb(248, 248, 248);
    background: -moz-linear-gradient(180deg, rgba(248, 248, 248, 1) 0%, rgba(255, 255, 255, 0) 40%);
    background: -webkit-linear-gradient(180deg, rgba(248, 248, 248, 1) 0%, rgba(255, 255, 255, 0) 40%);
    background: linear-gradient(180deg, rgba(248, 248, 248, 1) 0%, rgba(255, 255, 255, 0) 40%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f8f8f8", endColorstr="#ffffff", GradientType=1);
  }
  
  @media only screen and (min-width: 992px) {
    .separator-bg {
      --section-margin: 3em;
      padding-bottom: 6em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .separator-bg {
      --section-margin: 2em;
      padding-bottom: 4em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .separator-bg {
      padding-bottom: 5em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .separator-bg {
      padding-bottom: 3em;
    }
  }
  
  /* marquee plain */
  .marquee-plain {
    overflow: hidden;
    width: 100%;
    margin-bottom: var(--section-margin);
  }
  
  .marquee-plain__rotate {
    transform: rotateZ(-1.5deg);
    padding: 2em 0;
  }
  
  .marquee-plain__wide {
    display: flex;
    flex-wrap: nowrap;
    width: 2000%;
  }
  
  .marquee-plain__group {
    display: flex;
    flex-wrap: nowrap;
    animation: marquee-plain 20s linear infinite;
  }
  
  @keyframes marquee-plain {
    0% {
      transform: translateX(0%);
    }
  
    100% {
      transform: translateX(-100%);
    }
  }
  
  .marquee-plain__item {
    display: flex;
    align-items: center;
  }
  
  .marquee-plain__dot {
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    background: var(--blue);
    margin-right: 1.5em;
    margin-left: 1.5em;
  }
  
  .marquee-plain__text {
    color: var(--yellow);
  }
  
  @media only screen and (max-width: 991px) {
    .marquee-plain__dot {
      width: 1.25em;
      height: 1.25em;
      margin-right: 1.5em;
      margin-left: 1.5em;
    }
  }
  
  @media only screen and (max-width: 767px) {	
    .marquee-plain__dot {
      width: 1.15em;
      height: 1.15em;
      margin-right: 1.35em;
      margin-left: 1.35em;
    }
  }
  
  .marquee-item-blue{
    background: var(--blue) !important;
  }
  
  .marquee-item-yellow{
    background: var(--yellow) !important;
  }
  
  .marquee-item-red{
    background: var(--red) !important;
  }
  
  /* home approach - driving systemic change */
  .approach-intro {
    margin-bottom: calc(var(--section-margin)*0.6);
  }
  
  .approach-intro__title {
    margin-bottom: calc(var(--section-margin-internal)/2);
  }
  
  .approach-intro__main {
    margin-bottom: var(--section-margin-internal);
  }
  
  /* approach interactive */
  .approach {
    margin-bottom: calc(var(--section-margin)*1.4);
    position: relative;
    width: 100%;
  }
  
  .approach-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1em;
    cursor: url('../assets/images/clickButton.png'), pointer;
    position: relative;
  }
  
  .approach-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  
  .approach-left__title {
    margin-bottom: 1em;
    font-weight: 500;
  }
  
  .approach-titles {
    max-width: 24ch;
  }
  
  .approach-titles__main {
    margin-bottom: 0.2em;
  }
  
  .approach-allsteps {
    /* height: 23.25em; */
    position: relative;
  }
  
  .approach-step1 {
    opacity: 0;
  }
  
  .approach-step1,
  .approach-step2,
  .approach-step3,
  .approach-step4,
  .approach-step5{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
  }
  
  .approach-step1 {
    /* display: none; */
  }
  
  .approach-step2 {
    /* display: none; */
  }
  
  .approach-step3 {
    /* display: none; */
  }
  
  .approach-step4 {
    /* display: none; */
  }

  .approach-step5 {
    /* display: none; */
  }  
  
  .approach-step0 {
    /* display: none; */
  }
  
  .approach-step__title {
    margin-bottom: 0.05em;
    opacity: 0;
  }
  
  .approach-step__sub {
    margin-bottom: 1.1em;
    opacity: 0;
  }
  
  .approach-step__serial {
    background: var(--yellow);
    padding: 0.3em 0.6em;
    color: white;
    text-transform: uppercase;
    border-radius: 0.25em;
    margin-bottom: 0.5em;
    opacity: 0;
  }
  
  ul, li {
    margin-left: 0.25em;
    padding-left: 0.5em;
  }
  
  .approach-step__desc {
    max-width: 90%;
    margin-bottom: 2em;
    opacity: 0;
    font-size: 0.9rem !important;
  }
  
  .approach-step__tags-wrapper {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    opacity: 0;
  }
  
  .approach-step__tag {
    background-color: var(--smoke);
    padding: 0.4em 0.8em;
    border-radius: 0.25em;
    margin-right: 0.5em;
    margin-bottom: 0.5em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.7rem;
  }
  
  .approach-step__index-row {
    display: flex;
    align-items: center;
    margin-bottom: 1.8em;
  }
  
  .approach-step__row-icon-wrapper {
    width: 2.6em;
    margin-right: 1.5em;
  }
  
  .approach-step__row-title-sub {
    color: var(--yellow);
    text-transform: uppercase;
  }
  
  .approach-right {
    position: relative;
  }
  
  .approach-lottie {
    position: relative;
    z-index: 5;
  }
  
  .approach-mobile-popup {
    position: fixed;
    z-index: 10000;
    top: 0;
    width: 100vw;
    height: 100vh;
    display: none;
    align-items: center;
    justify-content: center;
    background: #00000030;
    top: 0;
    left: 0;
    backdrop-filter: blur(10px);
    opacity: 0;
  }
  
  .approach-mobile-popup__content {
    width: 70%;
    height: 70%;
    overflow: auto;
    background: white;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 4em 2em 2em;
    position: relative;
    border-radius: var(--border-radius);
    opacity: 0;
    transform: scale(0.8);
  }
  
  .approach-mobile-popup__icon-wrapper {
    position: absolute;
    top: 3%;
    right: 10%;
    width: 1.8em;
    transform: rotateZ(180deg);
    cursor: pointer;
  }
  
  .approach-mobile-popup__content::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  
  .approach-step-on-panel {
    position: static;
  }
  
  .approach-mobile-popup__content .approach-step1,
  .approach-mobile-popup__content .approach-step2,
  .approach-mobile-popup__content .approach-step3,
  .approach-mobile-popup__content .approach-step4,
  .approach-mobile-popup__content .approach-step5{
    opacity: 1 !important;
  }
  
  .approach-mobile-popup__content .approach-step1,
  .approach-mobile-popup__content .approach-step2,
  .approach-mobile-popup__content .approach-step3,
  .approach-mobile-popup__content .approach-step4{
    margin-bottom: 3.5em;
  }
  
  .approach-thing-on-panel {
    opacity: 1 !important;
  }
  
  .approach-right__text-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
  }
  
  .approach-right__text {
    max-width: 16ch;
    text-align: center;
    font-size: 1rem !important;
  }
  
  .approach-right__click-hint {
    background: var(--blue);
    padding: 0.4em 0.8em;
    color: white;
    border-radius: 50em;
    font-size: 0.7rem;
    display: none;
  }
  
  .approach-mobile__title-icon-wrapper {
    width: 4em;
    margin: 1em 0;
  }
  
  @media only screen and (max-width: 1080px) {
  
    .approach-mobile-popup__icon-wrapper {
      top: 9%;
      right: 16%;
      width: 1.8em;
    }
  
    .approach-content {
      display: block;
      cursor: pointer;
    }
  
    .approach-left {
      display: none;
    }
  
    .approach-right__click-hint {
      display: block;
      text-transform: uppercase;
    }
  
    .approach-right {
      width: 100%;
    }
  
    .approach-right__text {
      margin-bottom: 0.3em;
    }
  
    .approach-lottie {
      width: 70%;
      margin: 0 auto;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .approach-mobile-popup__content {
      width: 85%;
      height: 85%;
      padding: 3em 2em 2em;
    }
  
    .approach-lottie {
      width: 80%;
      margin: 0 auto;
    }
  
    .approach-right__text {
      margin-bottom: 0.5em;
    }
  
    .approach-mobile-popup__icon-wrapper {
      position: absolute;
      top: 3%;
      right: 10%;
      width: 1.8em;
      transform: rotateZ(180deg);
      cursor: pointer;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .approach-lottie {
      width: 100%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .approach-mobile__title-icon-wrapper {
      width: 3.2em;
      margin: 0.8em 0;
    }
  }
  
  /* approach additional */
  .approach-additional {
    /* margin-bottom: var(--section-margin); */
  }
  
  .approach-add__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 2em;
  }
  
  .approach-add__sub {
    max-width: 90%;
  }
  
  .approach-add__buttons {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  
  @media only screen and (max-width: 991px) {
    .approach-add__grid {
      grid-template-columns: 1fr;
      grid-row-gap: 2em;
    }
  
    .approach-add__buttons {
      grid-row-start: 2;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .approach-add__sub {
      max-width: 100%;
    }
  }
  
  /* cities */
  .cities {
    background: var(--blue);
    color: white;
    padding: 8em 0;
    margin-bottom: var(--section-margin);
  }
  
  .cities__title {
    color: var(--yellow);
    margin-bottom: 1.25em;
    font-weight: 500;
  }
  
  .cities-desc-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 3em;
    margin-bottom: calc(var(--section-margin)*1.2);
  }
  
  @media only screen and (min-width: 992px) {
    .cities {
      padding: 6em 0;
      --section-margin: 3em;
    }
  
    .cities-desc-grid {
      grid-template-columns: 1fr;
      grid-row-gap: 2.5em;
      --section-margin: 5em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .cities {
      padding: 6em 0;
      --section-margin: 3em;
    }
  
    .cities-desc-grid {
      grid-template-columns: 1fr;
      grid-row-gap: 2.5em;
      --section-margin: 5em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .cities {
      padding: 5em 0;
      margin-bottom: var(--section-margin);
    }
  
    .cities-desc-grid {
      --section-margin: 4em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .cities {
      padding: 4em 0 2.5em;
      margin-bottom: var(--section-margin);
    }
  
    .cities-desc-grid {
      --section-margin: 2.5em;
    }
  }
  
  /* citites accordion */
  .cities-acc__wrapper {
    margin-bottom: calc(var(--section-margin)*1.2);
  }
  
  .cities-acc {
    width: 50%;
    margin: 0 auto;
  }
  
  .cities-acc__item {
    background: var(--smoke);
    border-radius: 1em;
    margin-bottom: 1.5em;
    transform: scale(1);
    transition: transform 0.3s ease-out;
  }
  
  .cities-acc__item:hover,
  .cities-acc__item:focus {
    transform: scale(0.98);
  }
  
  .cities-acc__head {
    padding: 2em 2.5em 1.4em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
  }
  
  .cities-acc__country {
    color: var(--blue);
    text-transform: uppercase;
    letter-spacing: 1px;
  }
  
  .cities-acc__city {
    color: var(--yellow);
    margin-left: -0.1em;
  }
  
  .cities-acc__toggle-wrapper {
    height: 3em;
    width: 3em;
  }
  
  .cities-acc__body {
    padding: 0em 2.5em 0em;
    overflow: hidden;
    height: 0;
  }
  
  .cities-acc__divider {
    height: 3px;
    width: 100%;
    border-radius: 10em;
    width: 100%;
    background: var(--blue);
    opacity: 0.2;
  }
  
  .cities-acc__location-wrapper {
    padding: 1em 0;
  }
  
  .cities-acc__location-lottie {
    max-width: 50%;
    margin: 0 auto;
  }
  
  .cities-acc__text {
    color: var(--blue);
    margin-bottom: 2em;
  }
  
  @media only screen and (max-width: 1180px) {
    .cities-acc {
      width: 70%;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .cities-acc {
      width: 80%;
    }
  
    .cities-acc__toggle-wrapper {
      height: 2.4em;
      width: 2.4em;
      flex-shrink: 0;
    }
  
    .cities-acc__wrapper {
      --section-margin: 5em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .cities-acc {
      width: 80%;
    }
  
    .cities-acc__toggle-wrapper {
      height: 2em;
      width: 2em;
    }
  
    .cities-acc__wrapper {
      --section-margin: 4em;
    }
  
    .cities-acc__head {
      padding: 1.4em 1.8em 1.4em;
    }
  
    .cities-acc__body {
      padding: 0em 2em 0em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .cities-acc {
      width: 100%;
    }
  
    .cities-acc__head {
      padding: 1.3em 1.6em 1.3em;
    }
  
    .cities-acc__body {
      padding: 0em 1.7em 0em;
    }
  
    .cities-acc__location-lottie {
      max-width: 65%;
    }
  
    .cities-acc__wrapper {
      --section-margin: 2.5em;
    }
  }
  
  /* cities future */
  .cities-future-text {
    width: 50%;
    margin: 0 auto;
    margin-bottom: 2.5em;
  }
  
  .cities-map__wrapper {
    max-width: 80%;
    margin: 0 auto;
  }
  
  @media only screen and (max-width: 1180px) {
    .cities-future-text {
      width: 70%;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .cities-future-text {
      width: 80%;
    }
  
    .cities-map__wrapper {
      max-width: 95%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .cities-future-text {
      width: 100%;
      margin-bottom: 1.5em;
    }
  
    .cities-map__wrapper {
      max-width: 100%;
    }
  }
  
  /* spotlight */
  .spotlight {
    margin-bottom: var(--section-margin-big);
    width: 100%;
    overflow: hidden;
    padding: 2.5em 0;
    position: relative;
  }
  
  .spotlight-title {
    margin-bottom: 1em;
    font-weight: 500;
  }
  
  .spotlight-slider {
    width: 105%;
    margin-left: -2.5%;
    position: relative;
    display: flex;
    align-items: flex-start;
    overflow: hidden;
    transform: rotateZ(1.1deg);
  }
  
  .spotlight-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26%;
    padding: 0 1em;
    position: relative;
    flex-shrink: 0;
    cursor: pointer;
  }
  
  .spotlight__buttons-wrapper {
    position: absolute;
    z-index: 10;
    top: 3em;
    right: 10%;
  }
  
  .spotlight-prev__icon-wrapper,
  .spotlight-next__icon-wrapper {
    background: none;
    border: none;
    width: 4em;
    transition: transform 0.3s ease-out;
    cursor: pointer;
  }
  
  .spotlight-prev__icon-wrapper {
    margin-right: 0.3em;
  }
  
  .spotlight-prev__icon-wrapper:hover,
  .spotlight-next__icon-wrapper:hover {
    transform: scale(0.9);
  }
  
  .spotlight-prev__icon,
  .spotlight-next__icon {
    width: 100%;
    min-height: 100%;
    object-fit: cover;
  }
  
  @media only screen and (min-width: 992px) {
    .spotlight {
      --section-margin-big: 5em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .spotlight {
      --section-margin-big: 5em;
    }
  
    .spotlight-slide {
      width: 35%;
      padding: 0 0.7em;
    }
  
    .spotlight-prev__icon-wrapper,
    .spotlight-next__icon-wrapper {
      width: 3.7em;
    }
  
    .spotlight__buttons-wrapper {
      top: 2.7em;
      right: 10%;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .spotlight {
      --section-margin-big: 5em;
    }
  
    .spotlight-slide {
      width: 50%;
      padding: 0 0.5em;
    }
  
    .spotlight-prev__icon-wrapper,
    .spotlight-next__icon-wrapper {
      width: 3.6em;
    }
  
    .spotlight__buttons-wrapper {
      right: 4%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .spotlight {
      --section-margin-big: 4em;
      padding: 1em 0;
    }
  
    .spotlight-slider {
      width: 105%;
      margin-left: -1%;
    }
  
    .spotlight-slide {
      width: 70%;
      padding: 0 0.4em;
    }
  
    .spotlight-prev__icon-wrapper,
    .spotlight-next__icon-wrapper {
      width: auto;
    }
  
    .spotlight-prev__icon,
    .spotlight-next__icon {
      width: 2.6em;
      height: 2.6em;
    }
  
    .spotlight-title {
      margin-bottom: 2.5em;
    }
  
    .spotlight__buttons-wrapper {
      top: 4.5em;
      left: 2.4%;
      right: auto;
    }
  
    .spotlight-prev__icon-wrapper {
      margin-right: 0em;
    }
  }
  
  /* partners */
  .partners {
    margin-bottom: var(--section-margin-big);
  }
  
  .partners-intro {
    max-width: 60ch;
    margin-bottom: 4em;
  }
  
  .partners-intro__main {
    color: var(--yellow);
    margin-bottom: 0.3em;
    font-weight: 500;
  }
  
  .partners-acc {
    background: var(--smoke);
    border-radius: 1em;
    margin-bottom: 1.5em;
    transition: box-shadow 0.3s ease-out;
  }
  
  .partners-acc:hover,
  .partners-acc:focus {
    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
  }
  
  .partners-acc__head {
    padding: 1.5em 2.5em 1.5em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
  }
  
  .partners-acc__title {
    max-width: 88%;
  }
  
  .partners-acc__toggle-wrapper {
    height: 2.6em;
    width: 2.6em;
  }
  
  .partners-acc__body {
    padding: 0 2.5em;
    overflow: hidden;
    height: 0;
  }
  
  .partners-acc__divider {
    height: 3px;
    width: 100%;
    border-radius: 10em;
    width: 100%;
    background: var(--blue);
    opacity: 0.2;
  }
  
  @media only screen and (max-width: 991px) {
    .partners-acc__toggle-wrapper {
      height: 2.1em;
      width: 2.1em;
    }
  
    .partners-acc__head {
      padding: 1.5em 2em 1.5em;
    }
  
    .partners-acc__body {
      padding: 0 2em;
    }
  
    .partners {
      --section-margin-big: 6em;
    }
  
    .partners-intro {
      max-width: 70%;
      margin-bottom: 2.5em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .partners {
      --section-margin-big: 5em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .partners-acc__toggle-wrapper {
      height: 1.9em;
      width: 1.9em;
    }
  
    .partners-acc__head {
      padding: 1.3em 1.5em 1.3em;
    }
  
    .partners-acc__body {
      padding: 0 1.5em;
    }
  
    .partners-acc {
      margin-bottom: 1.25em;
    }
  
    .partners-intro {
      max-width: 90%;
      margin-bottom: 2em;
    }
  }
  
  .partners-grid {
    margin: 2.5em 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 2em;
    grid-row-gap: 1.5em;
  }
  
  .partners-grid__item {
    max-width: 14em;
    position: relative;
    z-index: 1;
    transition: transform 0.3s ease-out;
  }
  
  .partners-grid__item:hover,
  .partners-grid__item:focus {
    transform: scale(0.96);
  }
  
  .partners-grid__item-clickable {
    cursor: pointer;
  }
  
  .partners-grid-item__image-wrapper {
    padding: 0.1em 0.2em;
    background: white;
    border-radius: 0.7em;
    margin-bottom: 0.6em;
  }
  
  .partners-grid-item__title {
    text-transform: uppercase;
    margin: 0 0.5em 0em;
  }
  
  .partners-grid-item__subtitle {
    color: var(--red);
    margin: 0 0.5em 0.3em;
  }
  
  .partners-grid-item__icon-wrapper {
    width: 1.3em;
    margin: 0 0.5em;
  }
  
  @media only screen and (max-width: 1180px) {
    .partners-grid {
      margin: 2.3em 0;
      grid-template-columns: 1fr 1fr 1fr;
      grid-column-gap: 2.5em;
      grid-row-gap: 2em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .partners-grid {
      margin: 2.1em 0;
      grid-template-columns: 1fr 1fr 1fr;
      grid-column-gap: 2em;
      grid-row-gap: 1.7em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .partners-grid-item__icon-wrapper {
      width: 1em;
      margin: 0 0.5em;
    }
  }
  
  @media only screen and (max-width: 600px) {
    .partners-grid {
      margin: 1.7em 0;
      grid-template-columns: 1fr 1fr;
      grid-column-gap: 2em;
      grid-row-gap: 1.7em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .partners-grid {
      margin: 1.7em 0;
      grid-template-columns: 1fr 1fr;
      grid-column-gap: 1em;
      grid-row-gap: 1.2em;
    }
  
    .partners-grid__item {
      max-width: 10em;
    }
  }
  
  .partner-grid-item__overlay-parent {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    width: 100vw;
    height: 100vh;
    background: #00000030;
    top: 0;
    left: 0;
    backdrop-filter: blur(10px);
    opacity: 0;
    display: none;
  }
  
  .partners-grid-item__overlay {
    width: 45%;
    min-height: 20em;
    background: white;
    border-radius: 0.75em;
    padding: 2.4em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease-out;
  }
  
  .partners-grid-item__overlay:hover,
  .partners-grid-item__overlay:focus {
    transform: scale(0.98);
  }
  
  .partner-grid-item__overlay-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 2em;
  }
  
  .partners-grid-item__overlay-sub {
    text-transform: uppercase;
    max-width: 80%;
    color: var(--yellow);
  }
  
  .partners-grid-item__overlay-desc {
    grid-column-start: 2;
    grid-column-end: 2;
  }
  
  .partners-grid-item__link {
    margin-top: 0.5em;
    display: block;
    text-transform: uppercase;
    font-size: 0.8rem !important;
  }
  
  .partners-grid-item__overlay-icon-wrapper {
    position: absolute;
    top: 1.1em;
    right: 1.1em;
    width: 1.5em;
    transform: rotateZ(180deg);
  }
  
  .partners-grid-item__overlay-logo-wrapper {
    position: absolute;
    bottom: -6%;
    left: -12%;
    transform: rotateZ(-7deg);
    width: 26em;
    filter: blur(6px);
    -webkit-filter: blur(6px);
  }
  
  .partners-grid-item__overlay-logo {
    width: 100%;
    height: 100%;
  }
  
  @media only screen and (min-width: 1400px) {
    .partners-grid-item__overlay {
      width: 30%;
    }
  }
  
  @media only screen and (min-width: 1260px) {
    .partners-grid-item__overlay {
      width: 45%;
    }
  }
  
  @media only screen and (min-width: 1100px) {
    .partners-grid-item__overlay {
      width: 60%;
    }
  }
  
  @media only screen and (min-width: 992px) {
    .partners-grid-item__overlay {
      width: 50%;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .partners-grid-item__overlay {
      width: 65%;
      min-height: 20em;
      padding: 2.4em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .partners-grid-item__overlay {
      width: 70%;
      min-height: 20em;
    }
  
    .partner-grid-item__overlay-row {
      grid-template-columns: 0.6fr 1fr;
      grid-column-gap: 0.7em;
    }
  
    .partners-grid-item__overlay-logo-wrapper {
      opacity: 0.5;
      bottom: -20%;
      left: -12%;
    }
  
    .partners-grid-item__overlay-desc {
      margin-top: 1.7em;
    }
  }
  
  @media only screen and (max-width: 600px) {
    .partners-grid-item__overlay {
      width: 90%;
    }
  }
  
  @media only screen and (max-width: 500px) {
    .partners-grid-item__overlay {
      width: 90%;
      min-height: 10em;
    }
  
    .partner-grid-item__overlay-row {
      grid-template-columns: 1fr;
      grid-row-gap: 0.6em;
    }
  
    .partners-grid-item__overlay-desc {
      grid-column-start: 1;
      grid-column-end: 1;
    }
  
    .partners-grid-item__overlay-logo-wrapper {
      display: none;
    }
  }
  
  /* marquee-wlink */
  .marquee-wlink {
    overflow: hidden;
    width: 100%;
    margin-bottom: var(--section-margin-big);
  }
  
  .marquee-wlink__rotate {
    transform: rotateZ(-1.5deg);
    padding: 2em 0;
  }
  
  .marquee-wlink__wide {
    display: flex;
    flex-wrap: nowrap;
    width: 3000%;
  }
  
  .marquee-wlink__group {
    display: flex;
    flex-wrap: nowrap;
    color: white;
    animation: marquee-wlink 20s linear infinite;
  }
  
  @keyframes marquee-wlink {
    0% {
      transform: translateX(0%);
    }
  
    100% {
      transform: translateX(-100%);
    }
  }
  
  .marquee-wlink__group2 {
    display: flex;
    flex-wrap: nowrap;
    color: white;
    animation: marquee-wlink2 16s linear infinite;
  }
  
  @keyframes marquee-wlink2 {
    0% {
      transform: translateX(0%);
    }
  
    100% {
      transform: translateX(-100%);
    }
  }
  
  .marquee-wlink__item {
    background: var(--yellow);
    border-radius: 0.8em;
    display: flex;
    align-items: center;
    padding: 1em 1.6em;
    margin-right: 1em;
    transition: transform 0.3s ease-out;
  }
  
  .marquee-wlink__item:hover,
  .marquee-wlink__item:focus {
    transform: scale(0.97);
  }
  
  .marquee-wlink__text {
    font-weight: 500;
    margin-right: 0.5em;
  }
  
  .marquee-wlink__icon-wrapper {
    width: 2.3em;
    flex-shrink: 0;
  }
  
  @media only screen and (max-width: 991px) {
    .marquee-wlink {
      --section-margin-big: 6em;
    }
  
    .marquee-wlink__text {
      font-size: 2rem;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .marquee-wlink__icon-wrapper {
      width: 2em;
    }
  
    .marquee-wlink {
      --section-margin-big: 5em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .marquee-wlink__icon-wrapper {
      width: 1.8em;
    }
  }
  
  /* ctas  */
  .ctas {
    margin-bottom: var(--section-margin-big);
  }
  
  .cta-item {
    border-radius: 50em;
    display: grid;
    grid-template-columns: 1fr 0.8fr;
    grid-column-gap: 2em;
    padding: 3em 8% 3em 17%;
    margin: 0 auto;
    margin-bottom: 1.5em;
    align-items: center;
    transform: scale(1);
    transition: transform 0.3s ease-out;
  }
  
  .cta-item:hover,
  .cta-item:focus {
    transform: scale(0.97);
  }
  
  .cta-yellow {
    background: var(--yellow);
  }
  
  .cta-blue {
    background: var(--blue);
  }
  
  .cta-red {
    background: var(--red);
  }
  
  .cta-item__link{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    transition: color 0.3s ease-out;
  }
  
  .cta-item__link:hover,
  .cta-item__link:focus{
    color: var(--yellow);
  }
  
  .cta-item__link-icon-wrapper{
    width: 1.2em;
    padding-top: 0.25em;
    margin-right: 0.5em;
    color: var(--yellow);
    flex-shrink: 0;
  }
  
  .cta-item__links{ 
    display: flex;
    flex-direction: column;
    row-gap: 0.5em;
  }
  
  .cta-item__info {
    color: white;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  
  .cta-item__button {
    background: white;
    border-radius: 50em;
    color: var(--blue);
    text-transform: uppercase;
    padding: 0.3em 1em;
    margin-bottom: 1.5em;
    font-weight: 500;
  }
  
  .cta-item__button-menu {
    background: var(--blue);
    border-radius: 50em;
    color: white;
    padding: 0.3em 1em 0.4em;
    font-weight: 500;
    transition: background 0.2s ease-in-out;
  }
  
  .cta-item__button-menu:hover,
  .cta-item__button-menu:focus{
    background: var(--yellow);
  }
  
  .cta-item__image-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80%;
    margin-left: 0.5em;
  }
  
  .cta-item__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  @media only screen and (min-width: 992px) {
    .ctas {
      --section-margin-big: 5em;
    }
  
    .cta-item {
      border-radius: 50em;
      grid-template-columns: 1fr 0.8fr;
      grid-column-gap: 2em;
      padding: 3em 8% 3em 17%;
    }
  
    .cta-item__info {
      max-width: 85%;
    }
  
    .cta-item__image-wrapper {
      width: 70%;
    }
  
    .cta-item__text {
      font-size: 1.2rem !important;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .cta-item {
      border-radius: 1.5em;
      grid-template-columns: 1fr 1fr;
      grid-column-gap: 1em;
      padding: 1.2em 2em;
    }
  
    .cta-item__image-wrapper {
      width: 14em;
      margin-left: 3em;
    }
  
    .cta-item__text {
      font-size: 1rem !important;
    }
  
    .ctas {
      max-width: 92% !important;
    }
  
    .ctas {
      --section-margin-big: 4em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .cta-item {
      border-radius: 1.5em;
      grid-template-columns: 1fr 0.7fr;
      grid-column-gap: 1em;
      padding: 2em 2em;
    }
  
    .cta-item__image-wrapper {
      width: auto;
      margin-left: 2em;
    }
  
    .ctas {
      --section-margin-big: 4em;
    }
  }
  
  @media only screen and (max-width: 650px) {
    .cta-item {
      border-radius: 1.5em;
      grid-template-columns: 1fr;
      grid-column-gap: 1em;
      padding: 2em 2em;
      margin-bottom: 1.2em;
    }
  
    .cta-item__image-wrapper {
      width: 5em;
      margin-left: 0em;
      margin-bottom: 0.8em;
      grid-row-start: 1;
      grid-row-end: 1;
    }
  
    .ctas {
      --section-margin-big: 2em;
    }
  
    .cta-item__button {
      margin-bottom: 1.6em;
    }
  }
  
  /* footer */
  .footer {
    overflow: hidden;
    width: 100%;
    padding-top: 10em;
  }
  
  .footer-content__wrapper {
    position: relative;
  }
  
  .footer-gib {
    display: grid;
    grid-template-columns: 0.3fr 1fr;
    grid-column-gap: 2.4em;
    align-items: center;
    max-width: 50ch;
    position: absolute;
    top: -8em;
    right: -50%;
    background: white;
    border-top-left-radius: 50em;
    border-bottom-left-radius: 50em;
    padding-left: 2em;
    padding-top: 2.8em;
    padding-bottom: 2.8em;
    padding-right: 4%;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
  }
  
  .footer-gib__icon-wrapper {
    width: 10em;
  }
  
  /* footer main */
  .footer-main {
    background: var(--smoke);
  }
  
  .footer-main-flex {
    display: flex;
    justify-content: space-between;
    padding-top: 8em;
    padding-bottom: 3em;
    align-items: flex-start;
  }
  
  .footer-logo__col {
    max-width: 7.5em;
    margin-right: 6em;
  }
  
  .footer-logo-wrapper {
    width: 4em;
  }
  
  .footer-logo {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .footer-link-groups {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 80%;
  }
  
  .footer-col__title {
    margin-bottom: 1.1em;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: 0.5;
  }
  
  .footer-col__links {
    display: flex;
    flex-direction: column;
  }
  
  .footer-col__item {
    margin-bottom: 0.7em;
    transition: color 0.2s ease-out;
  }
  
  .footer-col__item:hover,
  .footer-col__item:focus {
    color: var(--yellow);
  }
  
  .footer-col__item-address {
    max-width: 14ch;
    margin-bottom: 2.1em;
  }
  
  .footer-col__item-legal {
    max-width: 18ch;
    margin-bottom: 1.1em;
  }
  
  /* colophon */
  .colophon {
    padding: 1.25em 0;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
  }
  
  .colophon-credits {
    display: flex;
    align-items: center;
  }
  
  .colophon-carbon {
    display: flex;
    align-items: center;
    margin-right: 0.6em;
  }
  
  .colophon-carbon__icon-wrapper {
    width: 1.5em;
    margin-top: -0.4em;
    margin-right: 0.5em;
  }
  
  .colophon-kasjmier {
    background: var(--blue);
    color: white;
    border-radius: 50em;
    padding: 0.2em 0.7em;
  }
  
  @media only screen and (max-width: 991px) {
    .footer-main__col {
      width: 33%;
      margin-bottom: 2em;
    }
  
    .footer-logo__col {
      max-width: 7.5em;
    }
  
    .footer-main-flex {
      padding-top: 8.5em;
      padding-bottom: 1em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .footer-gib {
      grid-template-columns: 0.4fr 1fr;
      grid-column-gap: 2em;
      max-width: 44ch;
      top: -6em;
      padding-left: 1.4em;
      padding-top: 1.7em;
      padding-bottom: 1.7em;
      padding-right: 4%;
    }
  
    .footer-main-flex {
      display: block;
      padding-top: 6em;
      padding-bottom: 0em;
    }
  
    .footer-gib__icon-wrapper {
      width: 8em;
    }
  
    .footer-main__col {
      width: 40%;
      margin-bottom: 2em;
    }
  
    .footer-logo__col {
      max-width: 7em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .footer-gib {
      grid-template-columns: 0.4fr 1fr;
      grid-column-gap: 1.6em;
      max-width: 35ch;
      top: -6em;
      padding-left: 1.2em;
      padding-top: 1.5em;
      padding-bottom: 1.5em;
      padding-right: 4%;
    }
  
    .footer-gib__icon-wrapper {
      width: 6em;
    }
  
    .footer-main-flex {
      display: block;
      padding-top: 6em;
      padding-bottom: 0em;
      padding-left: 1em;
      padding-right: 1em;
    }
  
    .footer-logo__col {
      max-width: 6.5em;
      margin-bottom: 3em;
    }
  
    .footer-link-groups {
      width: 100%;
    }
  
    .colophon-carbon__icon-wrapper {
      width: 1.3em;
      margin-top: -0.4em;
      margin-right: 0;
      margin-bottom: 0.25em;
    }
  
    .colophon {
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
  
    .colophon-carbon {
      flex-direction: column;
      align-items: center;
      justify-content: center;
      margin-bottom: 0.25em;
      margin-right: 0;
    }
  
    .colophon-credits {
      flex-direction: column;
    }
  }
  
  /* about page *******************************************************************/
  /* hero banner */
  .about-hero-banner {
    position: relative;
    margin-top: calc(var(--hero-margin)*0.55);
    margin-bottom: var(--section-margin);
  }
  
  .about-hero-banner__image-wrapper {
    overflow: hidden;
    width: 100%;
    object-fit: cover;
    border-radius: 20px;
    position: relative;
    z-index: 1;
  }
  
  .about-hero-banner__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .about-hero-banner__overlay {
      display: none;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(180deg, rgba(255,255,255,0) 68%, rgba(255,255,255,1) 86%);
    background: -webkit-linear-gradient(180deg, rgba(255,255,255,0) 68%, rgba(255,255,255,1) 86%);
    background: linear-gradient(180deg, rgba(255,255,255,0) 68%, rgba(255,255,255,1) 86%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
    position: absolute;
    z-index: 10;
    left: 0;
    bottom: -2em;
    width: 100%;
    height: 100%;
  }
  
  @media only screen and (max-width: 991px) {
    .about-hero-banner {
      --hero-margin: 20em;
      --section-margin: 4em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .about-hero-banner {
      --hero-margin: 18em;
      --section-margin: 4em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .about-hero-banner {
      --hero-margin: 17em;
      --section-margin: 4em;
    }
  }
  
  /* page introduction 2grid */
  .about-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 4em;
    margin-bottom: var(--section-margin-big);
  }
  
  .about-intro__sub {
    grid-column-start: 2;
    grid-column-end: 2;
    grid-row-start: 2;
    grid-row-end: 2;
  }
  
  @media only screen and (max-width: 991px) {
    .about-intro {
      grid-template-columns: 1fr 0.4fr;
      grid-column-gap: 2em;
      --section-margin-big: 8em;
    }
  
    .about-intro__main {
      margin-bottom: 1em;
    }
  
    .about-intro__sub {
      grid-column-start: 1;
      grid-column-end: 3;
      grid-row-start: 2;
      grid-row-end: 2;
      margin-left: 6em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .about-intro {
      grid-template-columns: 1fr;
      --section-margin-big: 8em;
    }
  
    .about-intro__main {
      margin-bottom: 0.7em;
    }
  
    .about-intro__sub {
      margin-left: 10%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .about-intro {
      --section-margin-big: 7em;
    }
  }
  
  /* about accordion section */
  .about-acc {
    background: var(--smoke);
    margin-bottom: var(--section-margin-mega);
    position: relative;
  }
  
  .about-acc__toggle-area {
    position: absolute;
    top: -3em;
    left: 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  
  .about-acc__toggle-wrapper {
    width: 12em;
    height: 6em;
    border-radius: 50em;
    background-color: var(--blue);
    position: relative;
    margin-bottom: 0.8em;
  }
  
  .about-acc__toggle-ball {
    width: 5.6em;
    height: 5.6em;
    margin: 0 0.2em;
    border-radius: 50em;
    background-color: var(--yellow);
    position: absolute;
    top: 0.2em;
    left: 0%;
  }
  
  .about-acc__toggle-info {
    text-transform: uppercase;
    opacity: 0.5;
  }
  
  .about-acc__text {
    /* max-width: 50ch; */
    margin: 0 30%;
    margin-top: 5em;
    margin-bottom: 5em;
  }
  
  .about-acc__text:first-child {
    margin-top: 7em;
  }
  
  .about-acc__body {
    overflow: hidden;
    height: 0;
    position: relative;
  }
  
  .about-acc__graphic-wrapper-1 {
    width: 24em;
    position: absolute;
    top: 2.2em;
    left: 5%;
    opacity: 0.5;
  }
  
  .about-acc__graphic-wrapper-2 {
    width: 20em;
    position: absolute;
    top: 25em;
    right: 10%;
    opacity: 0.5;
  }
  
  .about-acc__graphic-wrapper-3 {
    width: 30em;
    position: absolute;
    top: 42em;
    left: 4%;
    opacity: 0.5;
  }
  
  .about-acc__graphic {
    width: 100%;
    mix-blend-mode: multiply;
  }
  
  @media only screen and (max-width: 1080px) {
    .about-acc__text {
      margin: 0 20%;
      margin-top: 6em;
      margin-bottom: 6em;
    }
  
    .about-acc__graphic-wrapper-1 {
      width: 23em;
      position: absolute;
      top: 2.2em;
      left: -2%;
    }
  
    .about-acc__graphic-wrapper-2 {
      width: 18em;
      top: 32em;
      right: -4%;
    }
  
    .about-acc__graphic-wrapper-3 {
      width: 24em;
      top: 40em;
      left: -6%;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .about-acc {
      --section-margin-mega: 2em;
    }
  
    .about-acc__toggle-area {
      top: -2.5em;
      left: 10%;
    }
  
    .about-acc__toggle-wrapper {
      width: 10em;
      height: 5em;
    }
  
    .about-acc__toggle-ball {
      width: 4.58em;
      height: 4.58em;
      margin: 0 0.2em;
    }
  
    .about-acc__text {
      margin: 0 20%;
      margin-top: 6em;
      margin-bottom: 6em;
    }
  
    .about-acc__graphic-wrapper-1 {
      width: 20em;
      position: absolute;
      top: 2.2em;
      left: -4%;
    }
  
    .about-acc__graphic-wrapper-2 {
      width: 18em;
      top: 32em;
      right: -4%;
    }
  
    .about-acc__graphic-wrapper-3 {
      width: 28em;
      top: 47em;
      left: -13%;
    }
  
    .about-acc {
      --section-margin-mega: 10em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .about-acc__toggle-wrapper {
      width: 7em;
      height: 3.5em;
      margin-bottom: 0.6em;
    }
  
    .about-acc__toggle-area {
      top: -1.8em;
      left: 10%;
    }
  
    .about-acc__toggle-ball {
      width: 3.12em;
      height: 3.12em;
      margin: 0 0.2em;
    }
  
    .about-acc__toggle-info {
      max-width: 80%;
      text-align: center;
    }
  
    .about-acc__text {
      margin: 0 10%;
      margin-top: 7em;
      margin-bottom: 7em;
    }
  
    .about-acc__graphic-wrapper-1 {
      width: 17em;
      position: absolute;
      top: 3em;
      left: -4%;
    }
  
    .about-acc__graphic-wrapper-2 {
      width: 14em;
      top: 30em;
      right: -4%;
    }
  
    .about-acc__graphic-wrapper-3 {
      width: 24em;
      top: 55em;
      left: -10%;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .about-acc__text {
      margin: 0 6%;
      margin-top: 5em;
      margin-bottom: 5em;
    }
  
    .about-acc__graphic-wrapper-1 {
      width: 14em;
      position: absolute;
      top: 0.25em;
      left: -10%;
    }
  
    .about-acc__graphic-wrapper-2 {
      width: 13em;
      top: 15em;
      right: -4%;
    }
  
    .about-acc__graphic-wrapper-3 {
      width: 16em;
      top: 45em;
      left: -16%;
    }
  }
  
  /* princples */
  .principles {
    margin-bottom: var(--section-margin-big);
  }
  
  .principles-intro {
    color: var(--yellow);
    max-width: 14ch;
    margin-bottom: 1em;
    font-weight: 500;
  }
  
  .principles-acc__item {
    background: var(--smoke);
    border-radius: 1em;
    margin-bottom: 1.5em;
    transform: scale(1);
    transition: box-shadow 0.3s ease-out;
  }
  
  .principles-acc__item:hover,
  .principles-acc__item:focus {
    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
  }
  
  .principles-acc__head {
    padding: 1.6em 2.5em 1.7em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
  }
  
  .principles-acc__titles-sub {
    color: var(--yellow);
  }
  
  .principles-acc__toggle-wrapper {
    height: 3em;
    width: 3em;
  }
  
  .principles-acc__body {
    padding: 0em 2.5em 0em;
    overflow: hidden;
    height: 0;
  }
  
  .principles-acc__divider {
    height: 3px;
    width: 100%;
    border-radius: 10em;
    width: 100%;
    background: var(--blue);
    opacity: 0.2;
  }
  
  .principles-acc__text {
    margin: 2.3em 0;
  }
  
  @media only screen and (min-width: 992px) {
    .principles {
      --section-margin-big: 5em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .principles-acc__toggle-wrapper {
      height: 2.4em;
      width: 2.4em;
      flex-shrink: 0;
    }
  
    .principles-acc__titles-main {
      margin-right: 1em;
    }
  
    .principles {
      --section-margin-big: 5em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .principles-acc__toggle-wrapper {
      height: 2em;
      width: 2em;
    }
  
    .principles-acc__head {
      padding: 1.6em 2em 1.7em;
    }
  
    .principles-acc__body {
      padding: 0em 2em 0em;
    }
  
    .principles {
      --section-margin-big: 2em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .principles-acc__head {
      padding: 1.6em 1.7em 1.7em;
    }
  
    .principles-acc__body {
      padding: 0em 1.7em 0em;
    }
  
    .principles-acc__text {
      margin: 2em 0;
    }
  
    .principles-acc__item {
      margin-bottom: 1em;
    }
  
    .principles {
      --section-margin-big: 2em;
    }
  }
  
  /* blog page *******************************************************************/
  /* hero banner */
  .blog-hero {
    margin-top: calc(var(--hero-margin)*0.7);
    margin-bottom: var(--section-margin);
    position: relative;
    min-height: 44vh;
    padding: 4em 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .blog-subcription__wide {
    width: 100%;
  }
  
  .blog-subscription {
    width: 42ch;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .blog-form__titles {
    text-align: center;
  }
  
  .blog-form__titles-main {
    margin-bottom: 0.15em;
  }
  
  .blog-form__titles-sub {
    margin-bottom: calc(var(--border-radius)*0.6);
  }
  
  .blog-form {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .blog-form input[type="text"] {
    border: none;
    border-radius: 50em;
    padding: 0.85em 2em;
    margin-bottom: 0.5em;
    text-align: center;
    background: var(--blue);
    min-width: 30ch;
    color: white;
  }
  
  .blog-form input[type="text"]::placeholder {
    color: white;
    opacity: 1;
  }
  
  input:focus {
    outline: 0;
  }
  
  .blog-form input[type="submit"] {
    background: var(--yellow);
    color: white;
    border-radius: 50em;
    padding: 0.8em 2em;
    border: none;
    cursor: pointer;
    transition: transform 0.3s ease-out;
  }
  
  .blog-form input[type="submit"]:hover {
    transform: scale(0.97);
  }
  
  .form-thankyou{
    display: none;
  }
  
  .form-thankyou__message{
    text-align: center;
  }
  
  
  /* blog intro */
  .blog-intro {
    margin-bottom: var(--section-margin);
    width: 100%;
  }
  
  .blog-intro__main {
    margin-bottom: 0.3em;
  }
  
  .blog-intro__sub {
    max-width: 44ch;
  }
  
  @media only screen and (min-width: 992px) {
    .blogs-grid {
      --section-margin-mega: 4em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .blogs-grid {
      --section-margin-mega: 3em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .blog-subscription {
      width: 65%;
    }
  
    .blog-form input[type="text"] {
      min-width: auto;
    }
  
    .blogs-grid {
      --section-margin-mega: 3em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .blog-subscription {
      width: 85%;
    }
  
    .blogs-grid {
      --section-margin-mega: 1em;
    }
  }
  
  /* blogs grid */
  .blogs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 2em;
    grid-row-gap: 6em;
    margin-bottom: var(--section-margin-mega);
  }
  
  .blog-card {
    transition: transform 0.3s ease-out;
  }
  
  .blog-card:hover,
  .blog-card:focus {
    transform: scale(0.97);
  }
  
  .blog-card__top {
    position: relative;
    overflow: hidden;
    border-radius: var(--border-radius);
    margin-bottom: 1.3em;
  }
  
  .blog-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .blog-card__button {
    position: absolute;
    bottom: 1.9em;
    right: 2em;
    background: var(--blue);
    color: white;
    border-radius: 50em;
    padding: 0.5em 1em;
  }
  
  .blog-card__info {
    padding: 0 1.2em;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  
  .blog-card__title {
    margin-bottom: 0.5em;
  }
  
  .blog-card__tag-s1 {
    background: var(--yellow);
    padding: 0.3em 0.6em;
    color: white;
  }
  
  
  .blog-card__tag-s2 {
    background: var(--red);
    padding: 0.3em 0.6em;
    color: white;
  }
  .blog-card__tag-s3 {
    background:#E05518;
    padding: 0.3em 0.6em;
    color: white;
  }
  .blog-card__tag-s4 {
    background: #3F5337;
    padding: 0.3em 0.6em;
    color: white;
  }
  
  @media only screen and (max-width: 991px) {
    .blogs-grid {
      grid-template-columns: 1fr 1fr;
      grid-column-gap: 2em;
      grid-row-gap: 6em;
    }
  
    .blog-card__button {
      bottom: 1.5em;
      right: 1.5em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .blogs-grid {
      grid-template-columns: 1fr 1fr;
      grid-column-gap: 1em;
      grid-row-gap: 4em;
    }
  
    .blog-card__button {
      bottom: 1.3em;
      right: 1.3em;
    }
  
    .blog-card__top {
      margin-bottom: 1em;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .blogs-grid {
      grid-template-columns: 1fr;
      grid-row-gap: 4em;
    }
  
    .blog-card__button {
      bottom: 1.8em;
      right: 1.8em;
      padding: 0.5em 1em;
    }
  }
  
  
  
  /* blog article  */
  
  .blog-hero__article{
    margin-top: calc(var(--hero-margin)*0.4);
    margin-bottom: var(--section-margin-internal);
    position: relative;
    min-height: 44vh;
    padding: 4em 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .blog-article__banner{
    width: 100%;
    overflow: hidden;
    border-radius: var(--border-radius);
  }
  
  .blog-article__banner-image{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .article-backlink{
    width: 100%;
    display: flex;
    justify-content: flex-start;
    margin-bottom: 0.7em;
  }
  
  .article-main{
    width: 50%;
    margin: 0 auto;
    max-width: 1080px;
    margin-bottom: var(--section-margin-big);
  }
  
  .article-info{
    /* max-width: 90%;
    margin: 0 auto; */
    margin-bottom: 6em;
  }
  
  .article-titles{
    margin-bottom: 1.2em;
  }
  
  .article-title__main{
    margin-bottom: 0.2em;
  }
  
  .article-date{
    background: var(--yellow);
    padding: 0.3em 0.6em;
    color: white;
    display: inline-block;
    margin-bottom: 1.7em;
  }
  
  .article-tags-wrapper{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    max-width: 60%;
    flex-wrap: wrap;
  }
  
  .article-tag {
    background: var(--smoke);
    padding: 0.3em 0.6em;
    color: var(--blue);
    margin-right: 0.25em;
    margin-bottom: 0.25em;
  }
  
  .article-para,
  .article-h2,
  .article-h3,
  .article-h4,
  .article-h5{
    /* max-width: 90%;
    margin: 0 auto; */
  }
  
  .article-h4{
    font-size: 1.5rem;
    line-height: 1.2;
    margin-top: 2em;
    margin-bottom: 1em;
    font-weight: 500;
  }
  
  .article-para{
    font-size: 1.1rem;
    line-height: 1.4;
    margin-bottom: 1em;
  }
  
  .article-credits{
    margin-top: 2em;
    margin-bottom: 2em;
  }
  
  .article-bold{
    font-weight: 500;
  }
  
  .article-link{
    color: var(--yellow);
  }
  
  .article-image-wrapper{
    width: 100%;
    overflow: hidden;
    border-radius: var(--border-radius);
    margin-top: 3em;
    margin-bottom: 3em;
  }
  
  @media only screen and (max-width: 992px) {
    .article-main{
      width: 80%;
      max-width: 1080px;
      --section-margin-big: 4em;
    }
    .article-tags-wrapper{
      max-width: 90%;
    }
    .blog-hero__article{
      --hero-margin: 18.5em;
      margin-bottom: 0em;
      min-height: auto;
      padding: 3em 0 4em;
    }
    .article-info{
      margin-bottom: 3em;
    }
    .on-article-page {
      --section-margin-big: 0em !important;
    }
    .article-title__main{
      margin-bottom: 0.3em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .blog-hero__article{
      --hero-margin: 14.5em;
      padding: 3em 0 2.4em;
    }
    .article-main{
      width: 92%;
      max-width: 1080px;
      margin-bottom: var(--section-margin-big);
    }
    .article-tags-wrapper{
      max-width: 92%;
    }
      .nav-panel__pagelinks ul li{ line-height:2em;
      font-size:1.25rem;
          display:block}
      .nav-lottie-wrapper .nav-lottie svg:nth-last-child(2){display:none}
      
  }
  
  @media only screen and (max-width: 900px) {
      .nav-lottie-wrapper .nav-lottie svg:nth-last-child(2){display:none}
  }
  /* .article-para blockquote{
      background: #2b6282;
      color : white;
      border-radius : 1rem;
      padding : 2rem 2rem 2rem 2rem;
      margin-top: 2rem;
      margin-bottom: 2rem;
  } */ 
  .article-para ul{
      margin-top: 2rem;
      margin-bottom: 2rem;
  }
  .article-para blockquote {
      color: var(--yellow);
      padding: 2rem 2rem 2rem 2rem;
      margin-top: 2rem;
      margin-bottom: 2rem;
      border-left: var(--yellow) solid 0.3rem;
  }
  img.alignright { float: right; margin: 0 0 1em 1em; }
  img.alignleft { float: left; margin: 0 1em 1em 0; }
  img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
  .alignright { float: right; }
  .alignleft { float: left; }
  .aligncenter { display: block; margin-left: auto; margin-right: auto; }
  
  
  /* popup styles */
      .popup-wrapper{
        position: fixed;
        z-index: 10000;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #2B628240;
        display: none;
        opacity: 0;
        transition: opacity 2s ease-in-out;
      }
  
      .popup{
        width: 60ch;
        max-width: 50%;
        position: relative;
        background: white;
        border-radius: 1em;
        padding: 3em;
        opacity: 0;
        transition: opacity 1s ease-in-out;
      }
  
      .popup-content{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
      }
  
      .popup-sub{
        margin-bottom: 1em;
      }
  
      .popup-main{
        color: var(--yellow);
        margin-bottom: 1em;
      }
  
      .popup-close-icon-wrapper {
        position: absolute;
        top: 1.1em;
        right: 1.1em;
        width: 1.5em;
        transform: rotateZ(180deg);
        transition: transform 0.2s ease-in-out;
      }
  
      .popup-close-icon-wrapper:hover,
      .popup-close-icon-wrapper:focus {
        transform: scale(1.1) rotateZ(180deg);
      }
  
      @media only screen and (max-width: 991px) {
        .popup{
          max-width: 65%;
          padding: 2em;
        }
      }
  
      @media only screen and (max-width: 478px) {
        .popup{
          max-width: 90%;
          padding: 2em;
        }
        .popup-close-icon-wrapper {
          width: 1.25em;
        }
      }
  
  
      /* complaints page *******************************************************************/
  /* utility */
  .complaints-page-padding{
    padding-left: 4em;
    padding-right: 4em;
  }
  
  /* complaints hero */
  .complaints-hero{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: calc(var(--hero-margin)*0.85);
    margin-bottom: calc(var(--section-margin)*0.85);
  }
  
  .complaints-hero__dropdown-wrapper{
    position: relative;
  }
  
  .complaints-hero__dropdown-icon-wrapper{
    width: 0.8em;
    height: 0.8em;
    border-radius: 50%;
    position: absolute;
    z-index: 10;
    right: 1.1em;
    top: 1.55em;
  }
  
  .complaints-hero__dropdown-wrapper select {
    background-color: var(--blue);
    border: none;
    border-radius: 2em;
    box-sizing: border-box;
    color: white;
    display: block;
    font-size: 1em;
    font-family: 'Rubik', sans-serif;
    padding: 1em 2.75em 1em 1.5em;
    cursor: pointer;
  
    -moz-appearance:none; /* Firefox */
    -webkit-appearance:none; /* Safari and Chrome */
    appearance:none;
  }
  
  .complaints-hero__title{
    max-width: 34ch;
  }
  
  @media only screen and (max-width: 767px){
    .complaints-page-padding{
      padding-left: 0em;
      padding-right: 0em;
    }
    .complaints-hero{
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      gap: 1em;
      align-items: flex-start;
      margin-top: calc(var(--hero-margin)*0.75);
      margin-bottom: calc(var(--section-margin)*0.65);
    }  
  }
  
  /* complaints note */
  .complaints-note{
    background: var(--smoke);
    border-radius: 1em;
    padding-top: 3.5em;
    padding-bottom: 3.5em;
    margin-bottom: var(--section-margin);
  }
  
  .complaints-note__text{
    display: flex;
    flex-direction: column;
    gap: 1.5em;
  }
  
  @media only screen and (max-width: 767px){
    .complaints-note{
      padding: 2em;
    }
  }
  
  /* report */
  .report{
    margin-bottom: var(--section-margin);
  }
  
  .report-title{
    margin-bottom: calc(var(--section-margin)*0.1);
  }
  
  .report-subtitle{
    margin-bottom: calc(var(--section-margin)*0.5);
  }
  
  .report-acc__item{
    background: var(--smoke);
    border-radius: 1em;
  }
  
  .report-acc__item {
    background: var(--smoke);
    border-radius: 1em;
    margin-bottom: 1.5em;
    transform: scale(1);
    transition: box-shadow 0.3s ease-out;
  }
  
  .report-acc__item:hover,
  .report-acc__item:focus {
    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
  }
  
  .report-acc__head {
    padding: 1.6em 2.5em 1.7em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
  }
  
  .report-acc__toggle-wrapper {
    height: 2.6em;
    width: 2.6em;
  }
  
  .report-acc__body {
    padding: 0em 2.5em 0em;
    overflow: hidden;
    height: 0;
  }
  
  .report-acc__divider {
    height: 3px;
    width: 100%;
    border-radius: 10em;
    width: 100%;
    background: var(--blue);
    opacity: 0.2;
  }
  
  .report-acc-inner{
    display: flex;
    flex-direction: column;
    gap: 2em;
    padding: 2.5em 0;
  }
  
  .report-acc-inner__buttons{
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    align-items: flex-start;
  }
  
  .report-acc-inner__button{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0.8em 1.5em;
    color: white;
    background: var(--yellow);
    border-radius: 50em;
    transition: background 0.2s ease-in-out;
  }
  
  .report-acc-inner__button:hover,
  .report-acc-inner__button:focus{
    background: var(--blue);
  }
  
  .report-acc-inner__button-sub{
    overflow: hidden;
    width: 0;
    margin-left: 0.7em;
  }
  
  .report-acc-inner__note{
    display: flex;
    flex-direction: column;
    gap: 0.5em;
  }
  
  @media only screen and (min-width: 992px) {
    .report {
      --section-margin-big: 5em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    .report-acc__toggle-wrapper {
      height: 2.4em;
      width: 2.4em;
      flex-shrink: 0;
    }
  
    .report {
      --section-margin-big: 5em;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .report-acc__toggle-wrapper {
      height: 2em;
      width: 2em;
    }
  
    .report-acc__head {
      padding: 1.6em 2em 1.7em;
    }
  
    .report-acc__body {
      padding: 0em 2em 0em;
    }
  
    .report {
      --section-margin-big: 2em;
    }
  
    .report-acc-inner__button-sub{
      overflow: hidden;
      width: 100%;
      margin-left: 0em;
    }
  
    .report-acc-inner__button{
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      padding: 0.8em 1.5em;
      color: white;
      background: var(--yellow);
      border-radius: 0.5em;
      transition: background 0.2s ease-in-out;
    }
  
    .report-acc-inner__button-icon-wrapper{
      display: none;
    }
  }
  
  @media only screen and (max-width: 478px) {
    .report-acc__head {
      padding: 1.2em 1.4em 1.4em;
    }
  
    .report-acc__body {
      padding: 0em 1.4em 0em;
    }
  
    .report-acc__item {
      margin-bottom: 1em;
    }
  
    .report {
      --section-margin-big: 2em;
    }
    .report-acc-inner{
      display: flex;
      flex-direction: column;
      gap: 2em;
      padding: 2em 0;
    }
  }
  
  .report-form{
    border-radius: 1em;
    background: white;
    padding: 3em 2em 2em;
  }
  
  .field-row__top{
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 1em;
    padding: 0 1em;
    margin-bottom: 1em;
  }
  
  .form-row{
    margin-bottom: 3em;
    border-radius: 1em;
  }
  
  .form-row:last-child{
    margin-bottom: 1.5em;
  }
  
  .field-grey{
    background: var(--smoke);
  }
  
  .field-input{
    width: 100%;
    padding: 1em 1.2em;
    border-radius: 0.5em;
    border: 2px solid white;
  }
  
  .field-input:focus{
    border: 2px solid var(--blue);
  }
  
  .field-input:valid{
    background: var(--smoke);
  }
  
  .form-row-inner{
    padding: 2em;
  }
  
  .form-row-inner p{
    margin-bottom: 1.5em;
  }
  
  .personal-acc{
    background: white;
    border-radius: 1em;
    padding: 0em 2em;
  }
  
  .personal-acc__head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5em 0;
    cursor: pointer;
    gap: 1em;
  }
  
  .personal-acc__head-title{
    font-weight: 400;
  }
  
  .personal-acc__toggle-wrapper{
    height: 1.5em;
    width: 1.5em;
  }
  
  .personal-acc__body{
    overflow: hidden;
    height: 0;
  }
  
  .personal-acc__body-inner{
    display: flex;
    flex-direction: column;
    gap: 0.8em;
    padding-bottom: 2em;
  }
  
  .field-area{
    width: 100%;
    max-width: 100%;
    min-height: 10em;
    background: var(--smoke);
    border: 2px solid white;
    border-radius: 1em;
    overflow: hidden;
    padding: 1.2em 1.5em;
    outline: none;
  }
  
  .field-area:focus{
    border: 2px solid var(--blue);
  }
  
  .field-area:valid{
    background: var(--smoke);
  }
  
  .form-acknowledgement{
    padding: 0 2em;
  }
  
  .form-acknowledgement-top{
    display: flex;
    align-items: center;
    gap: 1em;
    margin-bottom: 1em;
  }
  
  .form-submit{
    padding: 0 2em;
  }
  
  .form-button{
    border: none;
    padding: 1em 3em;
    cursor: pointer;
    transition: background 0.2s ease-in-out;
    color: white;
    background: var(--yellow);
    border-radius: 50em;  
  }
  
  .form-button:hover,
  .form-button:focus{
    background: var(--blue);
  }
  
  @media only screen and (max-width: 991px){
    .report-form{
      padding: 2em 1em 2em;
    }
    .form-row-inner{
      padding: 1.5em;
    }
    .personal-acc{
      padding: 0em 1.25em;
    }
    .form-acknowledgement{
      padding: 0 0.5em;
    }
    .field-area{
      min-height: 17em;
      padding: 0.8em 1em;
    }
    .form-submit{
      padding: 0 1em;
    }
    .form-row:last-child{
      margin-bottom: 1em;
    }
    .field-row__top{
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      gap: 0.25em;
      margin-bottom: 0.4em;
    }
    .field-input{
      padding: 0.6em 0.8em;
    }
    
  }
  
  
  
  
  /* submissions page *******************************************************************/
  .submission{
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: calc(var(--section-margin)*0.85);
    margin-top: calc(var(--hero-margin)*0.85);
    display: flex;
    gap: 2em;
    flex-direction: column;
    text-align: center;
  }
  
  .submission-main{
    border-radius: 1em;
    overflow: hidden;
    position: relative;
    padding: 1em;
  }
  
  .submission-main__bg{
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  
  .submission-main__bg-image{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .submission-main-topLayer{
    position: relative;
    z-index: 5;
    background: white;
    border-radius: 0.8em;
    padding: 4em;
    display: flex;
    flex-direction: column;
    gap: 2em;
  }
  
  .submission-main-topLayer div{
    margin: 0 auto;
  }
  
  .submission-main__title{
    max-width: 16ch;
    line-height: 1.1;
  }
  
  .submission-main__subtitle{
    max-width: 40ch;
  }
  
  .submission-note{
    background: var(--smoke);
    padding: 3em;
    border-radius: 1em;
  }
  
  #submission-id{
    word-break: break-all;
  }
  
  @media only screen and (max-width: 991px){
    .submission{
      width: 80%;
    }
  }
  
  @media only screen and (max-width: 767px){
    .submission{
      width: 90%;
      gap: 1em;
      margin-bottom: calc(var(--section-margin)*0.25);
      margin-top: calc(var(--hero-margin)*0.65);
    }
    .submission-main-topLayer{
      padding: 3em;
      gap: 2em;
    }
  }
  
  @media only screen and (max-width: 478px){
    .submission-note{
      padding: 2em;
    }
  }
  /* resources page *******************************************************************/
  /* utility */
  .resources-page-padding {
    padding-left: 4em;
    padding-right: 4em;
  }
  
  /* resources hero */
  .resources-hero {
    display: flex;
    flex-direction: column;
    gap: 1em;
    align-items: flex-start;
    margin-top: calc(var(--hero-margin) * 0.85);
    margin-bottom: calc(var(--section-margin));
  }
  
  .resources-sub {
    max-width: 60ch;
    opacity: 0.6;
  }
  
  /* resources category */
  .resource-category {
    margin-bottom: calc(var(--section-margin) * 1.2);
  }
  /* 
    .resources-category-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      column-gap: 1.5em;
      row-gap: 2.5em;
      margin-bottom: var(--section-margin);
    } */
  
  .resource-category__title {
    margin-bottom: calc(var(--section-margin) * 0.1);
  }
  
  .resource-category__subtitle {
    margin-bottom: calc(var(--section-margin) * 0.5);
  }
  
  .resource-category__subtitle {
    max-width: 60ch;
    opacity: 0.6;
  }
  
  /* .resource-card {
      background: var(--smoke);
      border-radius: 1em;
      padding: 1.5em;
      transition: background 0.2s ease-out;
    }
    
    .resource-card:hover,
    .resource-card:focus {
      background: #ffda90;
    }
    
    .resource-card__head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 2em;
      margin-bottom: 1em;
    }
    
    .resource-card__icon-wrapper {
      width: 1.75em;
      margin-top: 0em;
      flex-shrink: 0;
    }
    
    .resource-card__separator {
      height: 2px;
      border-radius: 50em;
      width: 100%;
      background: #00000010;
    }
    
    .resource-card__desc {
      margin-top: 1em;
      opacity: 0.6; */
  
  @media only screen and (max-width: 1080px) {
    .resources-page-padding {
      padding-left: 0em;
      padding-right: 0em;
    }
  }
  
  @media only screen and (max-width: 991px) {
    /* .resources-category-grid {
        grid-template-columns: 1fr 1fr;
        column-gap: 1.5em;
        row-gap: 2em;
      } */
    .resources-page-padding {
      padding-left: 2em;
      padding-right: 2em;
    }
    .resources-sub {
      max-width: 90%;
    }
    .resource-category__subtitle {
      max-width: 90%;
    }
  }
  
  @media only screen and (max-width: 767px) {
    .resources-hero {
      margin-top: calc(var(--hero-margin) * 0.75);
      margin-bottom: calc(var(--section-margin) * 0.65);
    }
    .resources-page-padding {
      padding-left: 0em;
      padding-right: 0em;
    }
    .resources-sub {
      max-width: 100%;
    }
    .resource-category__subtitle {
      max-width: 100%;
    }
    .resource-category {
      margin-bottom: calc(var(--section-margin) * 0.8);
    }
  }
  
  @media only screen and (max-width: 478px) {
    /* .resources-category-grid {
        grid-template-columns: 1fr;
        row-gap: 2em;
        margin-bottom: var(--section-margin) * 0.2;
      } */
    .resource-category__title {
      max-width: 70%;
    }
    .resource-category:last-child {
      margin-bottom: 0;
    }
  }
  
  /* new styles */
  .principles-acc__links {
    display: flex;
    flex-direction: column;
    gap: 0.75em;
    align-items: flex-start;
  }
  .principles-acc__icon-wrapper {
    width: 1.3em;
    margin-top: 0.15em;
    flex-shrink: 0;
  }
  
  .principles-acc__link-wrapper {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.5em;
    transition: color 0.2s ease-in-out;
  }
  
  .principles-acc__link-wrapper:hover,
  .principles-acc__link-wrapper:focus {
    color: var(--red);
  }
  
  .principles-acc__head {
    gap: 0.5em;
  }
  
  .principles-acc__icon-wrapper {
    width: 1.3em;
    margin-top: 0.2em;
    flex-shrink: 0;
    order: -9999;
  }
  
  @media only screen and (max-width: 478px) {
    .principles-acc__icon-wrapper {
      width: 1.1em;
      margin-top: 0.2em;
    }
  }
  
  .principles-acc__toggle-lottie svg:nth-child(2){
      opacity: 0;
  }
  
  
  
  /* about page team banner */
  .team-banner{
      margin-top: 4em;
      margin-bottom: 6em;
      background: var(--smoke);
      position: relative;
      overflow: hidden;
  }
  
  .team-banner-inner{
      position: relative;
      z-index: 10;
  }
  
  .team-banner-content{
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 6em 0;
  }
  
  .team-banner__title {
      color: var(--yellow);
      max-width: 14ch;
      margin-bottom: 0.2em;
      font-weight: 500;
  }
  
  .team-banner__desc{
      max-width: 36ch;
      margin-bottom: 0.75em;
  }
  
  .team-banner__graphic-wrapper{
      position: absolute;
      height: 35em;
      width: 45em;
      right: -8em;
      top: -5em;
      z-index: 1;
  }
  
  .team-banner__graphic{
      width: 100%;
      height: 100%;
      object-fit: cover;
  }  
  
  @media only screen and (max-width: 991px){
      .team-banner__graphic-wrapper{
          height: 30em;
          width: 33em;
          right: -7em;
          top: -3em;
      }
  }
  
  @media only screen and (max-width: 767px){
      .team-banner__graphic-wrapper{
          height: 20em;
          width: 20em;
          right: -5em;
          top: 5em;
      }
  }
  
  @media only screen and (max-width: 478px){
      .team-banner__graphic-wrapper{
          height: 12em;
          width: 12em;
          right: -3em;
          top: 14em;
      }
  }
  
  
  
  
    /* global convening 2023 */
    .gc-intro-title{
      margin-bottom: 0.5em;
    }
    .gc-content-intro-desc {
        margin-bottom: 4em;
    }
    .gc-content-heading{
        font-weight: 500;
        margin-bottom: 0.25em;
    }
    .gc-content-group{
        margin: 3em 0;
    }
    .gc-content-italics {
        font-style: italic;
        margin-top: 2em;
    }
    .gc-date-banner{
      background: var(--smoke);
      border-radius: var(--border-radius);
      margin: 4em 0;
    }  
    .gc-date-banner-inner{
      padding: 3em;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2em;
    }
    .gc-date-banner-left{
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: space-between;
    }
    .gc-date-banner-icon-wrapper{
      width: 2em;
      color: var(--yellow);
      margin-bottom: 3em;
    }
    .gc-date-banner-right-text{
      color:rgba(0, 0, 0, 0.40);
    }
    .gc-date-banner-right{
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
    }
    @media screen and (max-width: 1080px){
      .gc-date-banner-inner{
        padding: 2.5em;
        grid-template-columns: 0.75fr 1fr;
      }
    }
    @media screen and (max-width: 800px){
      .gc-date-banner-inner{
        padding: 2em;
        grid-template-columns: 0.5fr 1fr;
      }
    }
  
  
  
  
  
  
  
  
  /* convening page *******************************************************************/
    .container-tiny {
      width: 66%;
      max-width: 1300px;
      margin: 0 auto;
    }
  
    .convening-hero-banner {
      margin-top: calc(var(--hero-margin)*0.55);
      margin-bottom: var(--section-margin);
    }
  
    .convening-hero-banner__inner{
      position: relative;
      width: 100%;
    }
    
    .convening-hero-banner__image-wrapper {
      overflow: hidden;
      width: 100%;
      object-fit: cover;
      border-radius: 1.5em;
      position: relative;
      z-index: 1;
    }
    
    .convening-hero-banner__image {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    @media only screen and (max-width: 991px) {
      .convening-hero-banner {
        --hero-margin: 20em;
        --section-margin: 4em;
        --border-radius: 0.8em;
      }
  
      .container-tiny{
        width: 90%;
      }
    }
    
    @media only screen and (max-width: 767px) {
      .convening-hero-banner {
        --hero-margin: 18em;
        --section-margin: 4em;
      }
    }
    
    @media only screen and (max-width: 478px) {
      .convening-hero-banner {
        --hero-margin: 17em;
        --section-margin: 4em;
      }
    }
  
    .convening-hero__cta-wrapper{
      position: relative;
      z-index: 10;
      margin-top: 2em;
    }
  
    .convening-hero__cta-base{
      width: 100%;
      height: 1.25em;
      border-radius: 500em;
      overflow: hidden;
      object-fit: cover;
    }
  
    .convening-hero__cta-image{
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(0);
    }
  
    .convening-hero__cta-button-wrapper-parent{
      position: absolute;
      z-index: 10;
      top: -1em;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
    }
  
    .convening-hero__cta-button-wrapper{
      margin-left: 4em;
    }
  
    @media only screen and (max-width: 991px) {
      .convening-hero__cta-button-wrapper{
        margin-left: 1.5em;
      }
    }  
  
    @media only screen and (max-width: 500px) {
      .convening-hero__cta-button-wrapper{
        margin-left: 0em;
      }
        .convening-button{
            padding: 1em 1.2em;
            padding-right: 1em;
        }
        
        .convening-hero__cta-base{
          opacity: 0;
        }	 
        
        .convening-hero__cta-button-wrapper-parent{
            justify-content: center;
        }
    } 
  
    .convening-button {
      background-color: var(--yellow);
      color: white;
      border-radius: 50em;
      padding: 1em 2em;
      padding-right: 1.3em;
      display: flex;
      align-items: center;
      margin-bottom: 0.5em;
      position: relative;
      overflow: hidden;
    }
    
    .convening-button-overlay {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: -100%;
      z-index: 1;
      background: var(--blue);
      border-radius: 50em;
    }
    
    .convening-button-text,
    .convening-button-icon-wrapper {
      position: relative;
      z-index: 10;
    }
    
    .convening-button-icon-wrapper {
      margin-left: 0.5em;
      width: 1.25em;
    }
  
    .convening-intro{
      margin-top: var(--section-margin);
      margin-bottom: var(--section-margin);
    }
  
    .convening-vr{
      margin-top: var(--section-margin);
      margin-bottom: var(--section-margin);
    }
  
    .convening-vr-title{
      margin-bottom: 0.5em;
    }
  
    .convening-vr-cta{
      border-radius: var(--border-radius);
      height: 20em;
      overflow: hidden;
      display: block;
      position: relative;
      transition: transform 0.3s ease-in-out; 
      cursor: pointer;
    }
  
    .convening-vr-cta:hover,
    .convening-vr-cta:focus{
      transform: scale(0.975);
    }
  
    .convening-vr-cta__image-wrapper{
      width: 100%;
      height: 100%;
      position: relative;
      z-index: 5;
    }
  
    .convening-vr-cta__image{
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(0);
    }
  
    .convening-vr-cta__button-parent{
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding-left: 4em;
      z-index: 10;
      transform-origin: left;
      transition: transform 0.3s ease-in-out; 
    }
    
    .convening-vr-cta:hover .convening-vr-cta__button-parent,
    .convening-vr-cta:focus .convening-vr-cta__button-parent{
      transform: scale(1.1);
    }
  
    @media only screen and (max-width: 991px) {
      .convening-vr-cta{
        height: 16em;
      }
      .convening-vr-cta__button-parent{
        padding-left: 2em;
      }    
    }    
  
    .convening-agenda{
      margin-top: var(--section-margin);
      margin-bottom: var(--section-margin);
    }
  
    .convening-agenda-title{
      margin-bottom: 0.5em;
    }
  
    .convening-agenda-buttons-wrapper{
  
    }
  
    .convening-agenda-buttons-wrapper{
      display: flex;
      align-items: flex-start;
      justify-content: flex-start;
      flex-wrap: wrap;
      gap: 1em; 
      row-gap: 0.5em;
    }
  
    .convening-agenda-button{
      display: flex;
      justify-content: flex-start;
    }
  
    .convening-agenda-button__inner{
      gap: 0.75em;
    }
  
    .convening-agenda-button__inner .button-text{
      line-height: 1 !important;
    }
  
    .convening-agenda-button__inner .button-text-main{
      font-weight: 500;
    }
  
    .speakers-slider-wrapper{
      margin-top: 2em;
      position: relative;
    }
  
    .speakers-card{
      border-radius: var(--border-radius);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      width: 24em;
    }
  
    .speakers-card__top{
      width: 100%;
    }
  
    .speakers-card__image-wrapper{
      width: 100%;
      height: 25em;
    }
  
    .speakers-card__image{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  
    .speakers-card__info{
      background: var(--yellow);
      padding: 1em 1.5em 1.5em;
      color: white;
      width: 100%;
    }
    
    .speakers-card__divider{
      height: 2px;
      background: white;
      border-radius: 500em;
      opacity: 0.2;
      margin: 1em 0;
    }
  
    .speakers {
      margin-bottom: var(--section-margin-big);
      width: 100%;
      overflow: hidden;
      padding: 2.5em 0;
      position: relative;
    }
    
    .speakers-title {
      margin-bottom: 1em;
      font-weight: 500;
    }
    
    .speakers-slider {
      width: 103%;
      margin-left: -2%;
      position: relative;
      display: flex;
      align-items: flex-start;
      overflow: hidden;
    }
    
    .speakers-slide {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 22%;
      padding: 0 0.5em;
      position: relative;
      flex-shrink: 0;
      cursor: pointer;
    }
  
    .speakers-slider-2 {
      width: 103%;
      margin-left: -2%;
      position: relative;
      display: flex;
      align-items: flex-start;
      overflow: hidden;
    }
    
    .speakers-slide-2 {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 22%;
      padding: 0 0.5em;
      position: relative;
      flex-shrink: 0;
      cursor: pointer;
    }
    
    .speakers__buttons-wrapper {
      margin-bottom: 1em;
    }
    
    .speakers-prev__icon-wrapper,
    .speakers-next__icon-wrapper {
      background: none;
      border: none;
      width: 4em;
      transition: transform 0.3s ease-out;
      cursor: pointer;
    }
    
    .speakers-prev__icon-wrapper {
      margin-right: 0.3em;
    }
    
    .speakers-prev__icon-wrapper:hover,
    .speakers-next__icon-wrapper:hover {
      transform: scale(0.9);
    }
  
    .speakers-prev__icon-wrapper-2,
    .speakers-next__icon-wrapper-2 {
      background: none;
      border: none;
      width: 4em;
      transition: transform 0.3s ease-out;
      cursor: pointer;
    }
    
    .speakers-prev__icon-wrapper-2 {
      margin-right: 0.3em;
    }
    
    .speakers-prev__icon-wrapper-2:hover,
    .speakers-next__icon-wrapper-2:hover {
      transform: scale(0.9);
    }
    
    .speakers-prev__icon,
    .speakers-next__icon {
      width: 100%;
      min-height: 100%;
      object-fit: cover;
    }
    
    @media only screen and (min-width: 992px) {
      .speakers {
        --section-margin-big: 5em;
      }
    }
    
    @media only screen and (max-width: 991px) {
      .speakers {
        --section-margin-big: 5em;
      }
    
      .speakers-slide {
        width: 35%;
        padding: 0 0.7em;
      }
    
      .speakers-prev__icon-wrapper,
      .speakers-next__icon-wrapper {
        width: 3.7em;
      }
        
      .speakers-prev__icon-wrapper-2,
      .speakers-next__icon-wrapper-2 {
        width: 3.7em;
      }	  
    
      .speakers__buttons-wrapper {
        top: 2.7em;
        right: 10%;
      }
    }
    
    @media only screen and (max-width: 767px) {
      .speakers {
        --section-margin-big: 5em;
      }
    
      .speakers-slide {
        width: 40%;
        padding: 0 0.5em;
      }
    
      .speakers-prev__icon-wrapper,
      .speakers-next__icon-wrapper {
        width: 3.6em;
      }
        
      .speakers-slide-2 {
        width: 40%;
        padding: 0 0.5em;
      }
    
      .speakers-prev__icon-wrapper-2,
      .speakers-next__icon-wrapper-2 {
        width: 3.6em;
      }	  
    
      .speakers__buttons-wrapper {
        right: 4%;
      }
    }
    
    @media only screen and (max-width: 478px) {
      .speakers {
        --section-margin-big: 4em;
        padding: 1em 0;
      }
    
      .speakers-slide {
        width: 60%;
        padding: 0 0.4em;
      }
    
      .speakers-prev__icon-wrapper,
      .speakers-next__icon-wrapper {
        width: auto;
      }
        
      .speakers-slide-2 {
        width: 60%;
        padding: 0 0.4em;
      }
    
      .speakers-prev__icon-wrapper-2,
      .speakers-next__icon-wrapper-2 {
        width: auto;
      }	  
    
      .speakers-prev__icon,
      .speakers-next__icon {
        width: 2.6em;
        height: 2.6em;
      }
    
      .speakers-title {
        margin-bottom: 2.5em;
      }
    
      .speakers__buttons-wrapper {
        top: 4.5em;
        left: 2.4%;
        right: auto;
      }
    
      .speakers-prev__icon-wrapper {
        margin-right: 0em;
      }
        
      .speakers-prev__icon-wrapper-2 {
        margin-right: 0em;
      }
  
        
    }
  
   @media only screen and (max-width: 600px) {
        .speakers-card__image-wrapper{
            height: 16em;
        }
  }
  
    .report-title{
      margin-bottom: 0.5em;
    }
  
    .report-video-block{
      margin-top: 2em;
      margin-bottom: 2em;
  /*     height: 36em; */
      width: 100%;
      border-radius: var(--border-radius);
      overflow: hidden;
      position: relative;
      cursor: pointer; 
      transition: transform 0.3s ease-in-out; 
    }
  
    .report-video-block:hover,
    .report-video-block:focus  {
      transform: scale(0.975);
    }
  
    .report-video-banner-wrapper{
      width: 100%;
      height: 100%;
  
    }
  
    .report-video-banner{
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(0);
    }
  
    .report-video-icon-wrapper{
      position: absolute;
      top: 0;
      left: 0;
      z-index: 10;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: transform 0.3s ease-in-out; 
    }
  
    .report-video-block:hover .report-video-icon-wrapper,
    .report-video-block:focus .report-video-icon-wrapper {
      transform: scale(1.1);
    }     
  
    .report-video-icon{
      width: 8em;
    }
  
    @media only screen and (max-width: 991px) {
      .report-video-icon{
        width: 4em;
      }
    }    
  
    .report-cta{
      height: 20em;
      display: block;
      position: relative;
      transition: transform 0.3s ease-in-out; 
      cursor: pointer;
      border-radius: var(--border-radius);
      overflow: hidden;
  
    }
  
    .report-cta:hover,
    .report-cta:focus{
      transform: scale(0.975);
    }
  
    .report-cta__image-wrapper{ 
      width: 100%;
      height: 100%;
      position: relative;
      z-index: 5;
    }
  
    .report-cta__image{
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: saturate(0);
    }
  
    .report-cta__button-parent{
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding-left: 4em;
      z-index: 10;
      transform-origin: left;
      transition: transform 0.3s ease-in-out; 
    }
  
    .report-cta:hover .report-cta__button-parent,
    .report-cta:focus .report-cta__button-parent{
      transform: scale(1.1);
    }
  
    @media only screen and (max-width: 991px) {
      .report-cta{
        height: 16em;
      }
      .report-cta__button-parent{
        padding-left: 2em;
        padding-right: 2em;
      }    
    }    
  
    .report-hh-cta{
      display: block;
      position: relative;
      transition: transform 0.3s ease-in-out; 
      cursor: pointer;
      margin-top: 2em;
    }
  
    .report-hh-cta:hover,
    .report-hh-cta:focus{
      transform: scale(0.975);
    }
  
    .report-hh-cta__bg{
      border-radius: var(--border-radius);
      width: 100%;
      height: 100%;
      background: var(--red);
      position: absolute;
      z-index: 2;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;	  
    }
  
    .report-hh-cta__top-layer{
      position: relative;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 4em;
      z-index: 10;
      width: 100%;
    }
  
    .report-hh-cta__top-left{
      color: white;
      padding-right: 4em;
    }
  
    .report-hh-cta__top-title{
      margin-bottom: 0.5em;
    }
  
    .report-hh-cta__top-desc{
      max-width: 50ch;
    }
  
    .report-hh-cta__icon-wrapper{
      width: 3em;
      color: white;
      flex-shrink: 0;
    }
  
  
    @media only screen and (max-width: 991px) {
      .report-hh-cta__bg{
  /*       height: 16em; */
      }
      .report-hh-cta__top-layer{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 2em 2em;
      }   
      .report-hh-cta__icon-wrapper{
        width: 2em;
      }       
    }
  
      @media screen and (max-width: 600px){
  
          .report-hh-cta__top-layer {
              display: flex;
              flex-direction: column;
              align-items: flex-start;
              gap: 1em;
              justify-content: center;
              padding: 2em 2em;
          }	
  
      }
  
  .button1 .button-icon-wrapper svg {
      margin-top: 0;
  }
  .speakers-card__title{color:#fff}
  @media(min-width:900px){
      ul.sub-menu li{border-bottom:1px solid #fff}
  .nav-links__internal ul .sub-menu{display:none}
      .nav-links__internal ul:hover .sub-menu:before{
          content:"";
          position:absolute;
          width:100%;
          min-height:30px;
          top:-18px
      }
  .nav-links__internal ul:hover .sub-menu:after{
      content:"";
      position:absolute;
      top:-8px;
      left:1rem;
      width: 0;
      height: 0;
      border-left: 8px solid transparent;
      border-right: 8px solid transparent;
      border-bottom: 8px solid #2d6284;
  }
  
  ul.sub-menu li a:hover{color:var(--yellow) !important;}
      .nav-links__internal ul li:focus .sub-menu,
  .nav-links__internal ul li:hover .sub-menu{position: absolute;
      margin-left: 0;
      display: block;
      margin-top: 0.5rem;
      top:91px;
      background: #2d6284;
      border-radius: 8px;}
      ul.sub-menu li a:last-child{}
  ul.sub-menu li{display:block;margin-left:0; padding: 0.5rem;}
      .nav-links__internal ul li{padding-bottom: 0.5rem;}
      #menu-item-1722 a,
      #menu-item-1721 a{padding: 0.25rem 1rem !important; font-weight:normal}
  }
  ul.sub-menu li:last-child{    
      background: transparent !important;
      border-radius: 0 !important;
      padding-left: 0.60rem !important;
      font-weight: normal !important}
  ul.sub-menu{padding-left:0}
  
  ul.sub-menu li a{color:#fff !important;padding:0.25rem 0.5rem; display: block;}
  ul.sub-menu li:last-child{border-bottom:0px}
  #menu-item-1720 a {padding-left: 0.5rem !important;}
  @media(max-width:900px){
      .sub-menu{position:relative;margin-left: 0;
      display: block;border-radius: 8px; margin-top:0.5rem}
       .sub-menu:after{	 
      content:"";
           display:none;
      position:absolute;
      top:-8px;
      left:1rem;
      width: 0;
      height: 0;
      border-left: 8px solid transparent;
      border-right: 8px solid transparent;
      border-bottom: 8px solid #2d6284;}
      .menu-item-1693,
       .menu-item-1723{position:relative}
      .menu-item-1693:before,
      .menu-item-1723:before{
          content: "";
          position: absolute;
          border-top: 2px solid #2d6284;
          border-left: 2px solid #2d6284;
          width: 10px;
          height: 10px;
          transform: rotate(225deg);
      }
      .menu-item-1723:before{ top: 12px; right: 1rem;}
      .menu-item-1693:before{top:28px; right: 2rem;}
      ul.sub-menu li {
         width: 100%;
      }
      ul.sub-menu li a {
          color: #2b6282 !important;
          padding: 0.25rem 1rem;
          display: block;
          background: transparent !important;
      }
      ul.sub-menu li:last-child {
      border-bottom: 0px;
      padding: 0px .50rem !important;
      margin-top: 0 !important;}
      #menu-header-menu-1 .menu-item:last-child{background:transparent !important;color: var(--blue) !important;}
      #menu-header-menu-1 .menu-item:last-child{ padding-left: 0.6rem; padding-right: 0;}
      li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-1721 {
      padding-left: 0;
      margin-left: -1.20rem;
     margin-top: -1rem !important;	
  }
      li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-1722 {
      margin-left: -1.35rem;
  }
      li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-has-children.menu-item-1693 a {
      background: var(--yellow);
      border-radius: 30px;
      display:block;	
      padding:0.5em 1.25em 0.5em 1.5em}
      ul.sub-menu {padding-bottom: 1rem;}
    li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-1719 {
      margin-bottom: -1rem;margin-left: 4px;}
  }
  .navmobile .sub-menu {
    display: none;
     width: 100%;
      border: 1px solid #000;
      padding-bottom: 0;
      background: #2d6284;
      color: #fff;
      margin-bottom: 0.5rem;
  }
      .navmobile .sub-menu:after{
   content:"";
    position:absolute;
    top:-8px;
    left:1rem;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #2d6284;
  }
  @media (max-width: 900px) {
      ul.sub-menu li a {
          color: #fff !important;
          padding:0.6rem 0.25rem;
          display: block;
          font-weight: normal;
          background: transparent !important;
      }
  }
      @media only screen and (max-width: 900px) {
      .nav-panel__pagelinks ul li {
          width: 95%;
      }
  }
  @media(min-width:901px) and (max-width:1024px){
      .nav-links__internal li{ margin-left: 1em}
  }
  @media(min-width:768px) and (max-width:900px){
      .menu-item-1693:before {top: 20px;}
  }