@import url('bootstrap/bootstrap.min.css');
@import url('edge-icons/style.css');
@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
  --edge-blue: #005ba5;
  --edge-blue-text: #2689D9;
  --bs-dark: #111;

  --edge-blue-switch: var(--edge-blue);
  --body-bg-switch: #F4F9FF;
  --bs-body-color-switch: var(--bs-dark);
  --bs-dark-switch: var(--bs-dark);
  --bs-light-switch: var(--bs-light);
  --bs-white-rgb-switch: var(--bs-white-rgb);
  --bs-light-rgb-switch: var(--bs-light-rgb);
  --body-bg-rgb-switch: var(--bs-white-rgb);

  --bs-body-color: var(--bs-body-color-switch);
  --bs-body-bg: var(--body-bg-switch);

  --bs-body-font-family: 'Montserrat', sans-serif;
  --bs-header-font-family: 'Poppins', sans-serif;
  --bs-body-font-size: clamp(16px, 1.7vw, 18px);
}

@media (prefers-color-scheme: dark) {
  :root {
    --edge-blue-switch: #fff;
    --body-bg-rgb-switch: 30, 33, 37;
    --body-bg-switch: #35393f;
    --bs-body-color-switch: #fff;
    --bs-dark-switch: #F4F9FF;
    --bs-white-rgb-switch: 33,37,41;
  }
}

/* Color */
::selection {
  background-color: var(--edge-blue);
  color: var(--bs-light-switch);
}
a {
  color: var(--edge-blue);
}

/* Font */
html {
  font-size: var(--bs-body-font-size);
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  font-family: var(--bs-header-font-family);
  font-weight: 500;
}
.h1, h1 {
  font-size: 3.7em;
  line-height: 95%;
  letter-spacing: -0.08em;
}
.h1.display, h1.display {
  font-size: 7em;
  line-height: 80%;
  letter-spacing: -0.115em;
  margin-bottom: 0;
  padding-bottom: 0.25em;
}
h1:focus {
  outline: none;
}
.h2, h2 {
  font-size: 2.6em;
  line-height: 99.5%;
  letter-spacing: -0.06em;
}
.h3, h3 {
  font-size: 2em;
  line-height: 98%;
  letter-spacing: -0.055em;
}
.h4, h4 {
  font-size: 1.6em;
  line-height: 93.5%;
  letter-spacing: -0.035em;
}
.h5, h5 {
  font-size: 1em;
  line-height: 30px;
  letter-spacing: -0.04em;
}
.h6, h6 {
  font-size: 0.8em;
  line-height: 24px;
  letter-spacing: -0.015em;
  text-transform: uppercase;
}
p {
  line-height: 150%;
}
.sm {
  font-size: 0.9em;
}
.xs {
  font-size: 0.75em;
}
@media (max-width: 800px) {
  .h1.display, h1.display {
    font-size: 6em;
  }
}

/* Buttons */
.btn {
  --dark-bg: linear-gradient(to bottom, #45484d 0%,#000 100%);
  --dark-bg-active: linear-gradient(to bottom, #595959 0%,#939393 100%);
  --dark-bg-flip: linear-gradient(to bottom, #000 0%,#45484d 100%);
  --light-bg: linear-gradient(to bottom, #fff 0%,#e5e5e5 100%);
  --light-bg-flip: linear-gradient(to bottom, #e5e5e5 0%,#fff 100%);
  --light-bg-active: linear-gradient(to bottom, #b2b2b2 0%,#dbdbdb 100%);
  --blue-bg: linear-gradient(to bottom, var(--edge-blue) 0%,#00478e 100%);
  --blue-bg-flip: linear-gradient(to bottom, #00478e 0%,var(--edge-blue) 100%);
  --blue-bg-active: linear-gradient(to bottom, #0066cc 0%,#0085f2 100%);

  border: 0;
  border-radius: 3em;
  font-family: var(--bs-header-font-family);
  font-size: 1em;
  padding: 0.75rem 1.75rem;
  text-transform: uppercase;
  transition: background 250ms, opacity 250ms;
}
.btn .edge-icon + span,
.btn span + .edge-icon {
  margin-left: 0.75em;
}
.btn .edge-arrow_forward_ios + span,
.btn span + .edge-arrow_forward_ios {
  display: inline-flex;
  justify-content: center;
  width: 0.6em;
}
.btn-light {
  background: var(--light-bg);
  box-shadow: 0 1rem 1.25rem 0 rgba(0,0,0,0.1), 0 -0.25rem 1.5rem rgb(176, 176, 176) inset, 0 0.75rem 0.5rem rgb(255, 255, 255) inset, 0 0.25rem 0.5rem 0 rgb(255, 255, 255) inset;
}
.btn-light:hover {
  background: var(--light-bg-flip);
}
.btn-light.active {
  background: var(--light-bg-active);
}
.btn-dark {
  background: var(--dark-bg);
  box-shadow: 0 1rem 1.25rem 0 rgba(0,0,0,0.1), 0 -0.25rem 1.5rem rgb(14, 14, 14) inset, 0 0.75rem 0.5rem rgba(163, 163, 163, 0.4) inset, 0 0.25rem 0.5rem 0 rgba(159, 159, 159, 1) inset;
}
.btn-dark:hover,
.biz-active .btn-dark {
  background: var(--dark-bg-flip);
  color: var(--bs-light);
}
.btn-dark.active {
  background: var(--dark-bg-active);
}
.btn-primary {
  background: var(--blue-bg);
  box-shadow: 0 1rem 1.25rem 0 rgba(0,0,0,0.1), 0 -0.25rem 1.5rem rgba(3, 23, 73, 0.5) inset, 0 0.75rem 0.5rem rgba(209, 217, 255, 0.08) inset, 0 0.25rem 0.5rem 0 rgba(230, 233, 255, 0.4) inset;
}
.btn-primary.active,
.btn-primary:hover,
.tek-active .btn-primary {
  background: var(--blue-bg-flip);
  color: var(--bs-light);
}
.biz-active .biz-toggle {
  background: var(--dark-bg-active);
}
.tek-active .tek-toggle {
  background: var(--blue-bg-active);
}
.expand-toggle .edge-icon {
  display: inline-block;
  transform: rotate(90deg);
  transform-origin: center;
  transition: transform 750ms;
}
.expand-toggle.active .edge-icon,
.biz-active .biz-toggle .edge-icon,
.tek-active .tek-toggle .edge-icon {
  transform: rotate(-90deg);
}

/* Layout */
body {
  overflow-x: hidden;
}
.site-main {
  min-height: calc(100vh - 35rem);
  scroll-margin-top: 3rem;
}
.container-fluid {
  max-width: 1320px;
  padding-left: max(0.75rem, env(safe-area-inset-left));
  padding-right: max(0.75rem, env(safe-area-inset-right));
}
.half-content {
  display: flex;
}
.half-content .content,
.half-content .image {
  flex: 50% 0 0;
}
.half-content .image {
  position: relative;
  z-index: 1;
}
.half-content .image::before {
  background: var(--bg-img) no-repeat 50%/cover;
  background-color: #555;
  content: '';
  height: 100%;
  right: 0;
  position: absolute;
  top: 0;
  width: 50vw;
  z-index: -1;
}
.half-content .content + .image::before {
  left: 0;
  right: auto;
}
.lead-in {
  background-color: var(--bs-dark);
  color: var(--bs-white);
  padding: 3.5rem 0;
}
@media (max-width: 650px) {
  .half-content {
    flex-direction: column;
  }
  .half-content .content,
  .half-content .image {
    flex-basis: auto;
  }
  .half-content .content {
    padding-left: 0;
    padding-right: 0;
  }
  .half-content .image {
    height: 100%;
    min-height: 50vw;
  }
  .half-content .image::before {
    left: auto;
    padding-right: 0;
    padding-left: 0;
    right: auto;
    width: 100vw;
    transform: translateX(-0.75rem);
  }
}

.content-box,
.content-box-dark {
  background-color: RGBA(var(--bs-light-rgb), 0.95);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0px 0.25rem 0.75rem 0.25rem rgba(255,255,255,0.15);
  color: var(--bs-dark);
  height: 100%;
  padding: 1rem;
}
.content-box-dark {
  background-color: RGBA(var(--bs-black-rgb), 0.75);
  color: var(--bs-light);
}
.page-header {
  background-color: #555;
  color: var(--bs-white);
  text-shadow: 0.1rem 0.1rem 0.5rem var(--bs-dark);
}
.page-header .row {
  min-height: clamp(11rem, 28vw, 20.5rem);
  padding: 3.5rem 0 2.5rem;
}
.bg-img {
  background: var(--bs-dark) var(--bg-img) no-repeat 50%/cover;
}
.active {
  scroll-margin-top: 3rem;
}

.grecaptcha-badge {
  visibility: hidden;
}

/* Services */
.services {
  margin: 4.5rem auto 6rem;
}
.service-list {
  color: var(--bs-dark);
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  position: relative;
  transition: padding-bottom 250ms;
}
.service-item {
  align-items: flex-start;
  background: var(--bg-img) no-repeat 0/115vw;
  display: flex;
  flex-direction: column;
  min-height: clamp(9rem, 18vw, 13.5rem);
  padding: 1rem;
  position: relative;
  justify-content: flex-end;
  width: calc(20% - 0.85rem);
}
.service-item .h4 {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  font-size: clamp(0.8em, 1.8vw, 1.5em);
}
.service-item .btn {
  margin-top: 0.5rem;
  font-size: clamp(0.55em, 1.2vw, 1em);
  padding-right: clamp(0.3em, 1.7vw, 1.5em);
  padding-left: clamp(0.3em, 1.7vw, 1.5em);
}
@media (min-width: 710.01px) {
  /* horizontal */
  .service-item:nth-child(5n+1) {
    background-position-x: 0%;
  }
  .service-item:nth-child(5n+2) {
    background-position-x: calc(20% - 1rem);
  }
  .service-item:nth-child(5n+3) {
    background-position-x: calc(40% - 2rem);
  }
  .service-item:nth-child(5n+4) {
    background-position-x: calc(60% - 3rem);
  }
  .service-item:nth-child(5n+5) {
    background-position-x: calc(80% - 4rem);
  }
  /* vertical */
  .service-item:nth-child(n+1):nth-child(n-5) {
    background-position-y: 0%;
  }
  .service-item:nth-child(n+6):nth-child(n-10) {
    background-position-y: calc(25% - 1rem);
  }
}
@media (min-width: 1320px) {
  .service-item {
    background-size: 84rem;
  }
}
@media (max-width: 710px) {
  .service-item {
    background-size: auto 1200px;
    font-size: clamp(0.8em, 5.5vw, 1.8em);
    max-width: 15rem;
    min-height: clamp(9rem, 34vw, 15rem);
    width: calc(50% - 0.75rem);
  }
  .service-item .btn {
    padding-right: clamp(0.5em, 4.8vw, 1.5em);
    padding-left: clamp(0.5em, 4.8vw, 1.5em);
  }
  /* horizontal */
  .service-item:nth-child(2n+1) {
    background-position-x: 0%;
  }
  .service-item:nth-child(2n+2) {
    background-position-x: 20%;
  }
  /* vertical */
  .service-item:nth-child(n+1):nth-child(n-2) {
    background-position-y: 0%;
  }
  .service-item:nth-child(n+3):nth-child(n-4) {
    background-position-y: calc(20% - 3rem);
  }
  .service-item:nth-child(n+5):nth-child(n-6) {
    background-position-y: calc(40% - 6rem);
  }
  .service-item:nth-child(n+7):nth-child(n-8) {
    background-position-y: calc(60% - 9rem);
  }
  .service-item:nth-child(n+9):nth-child(n-10) {
    background-position-y: calc(80% - 12rem);
  }
}

/* Case Studies */
.case-study .page-header .row {
  min-height: 11rem;
}
.case-study .section-content {
  margin: 5em auto;
}
.case-study .section-dark {
  background-color: var(--bs-dark);
  color: var(--bs-white)
}

/* 404 */
.page-404 {
  align-items: center;
  background: var(--bs-dark) var(--bg-img) no-repeat center bottom/cover;
  color: var(--bs-light);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  min-height: calc(100vh - 3rem);
}
.page-404 h2 {
  text-shadow: 0.1rem 0.1rem 0.5rem var(--bs-dark);
}

/* Default Blazor Stuff */
.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}
.invalid {
  outline: 1px solid red;
}
.validation-message {
  color: red;
}
#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}
#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}
.blazor-error-boundary {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
  padding: 1rem 1rem 1rem 3.7rem;
  color: white;
}
.blazor-error-boundary::after {
  content: "An error has occurred."
}