:root{
  --expo-blue:#20138a;
  --expo-indigo:#3027a7;
  --expo-neon:#4ef21a;
  --expo-turquoise:#1fdfa8;
  --expo-green:#39e048;
  --expo-white:#f8f8fc;
  --expo-navy:#15106d;
}

.site-header{
  background:rgba(32,19,138,.94);
  border-bottom:1px solid rgba(248,248,252,.14);
}

.site-header__inner{
  min-height:84px;
  height:auto;
  padding-block:10px;
}

.brand{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  max-width:220px;
  height:auto;
  overflow:visible;
}

.brand img{
  display:block;
  width:200px;
  max-width:100%;
  height:auto;
  object-fit:contain;
  object-position:center;
  transform:none;
}

.main-nav a:hover,
.main-nav a:focus-visible{
  color:var(--expo-turquoise);
}

.button--small{
  background:var(--expo-neon);
  color:var(--expo-navy)!important;
}

@media(max-width:900px){
  .site-header__inner{
    min-height:76px;
    padding-block:9px;
  }

  .brand{
    max-width:180px;
  }

  .brand img{
    width:170px;
  }

  .main-nav{
    top:76px;
    background:var(--expo-blue);
  }
}

@media(max-width:640px){
  .brand{
    max-width:155px;
  }

  .brand img{
    width:150px;
  }
}