@charset "UTF-8";
/**
 * BASE SIZE
 * All calculations are based on this. It’s recommended that
 * you keep it at 1rem because that is the root font size. You
 * can set it to whatever you like and whatever unit you like.
 */
/**
 * SIZE SCALE
 * This is a Perfect Fourth scale that powers all the utilities that
 * it is relevant for (font-size, margin, padding). All items are
 * calcuated off the base size, so change that and cascade across
 * your whole project.
 */
/**
 * COLORS
 * Colors are shared between backgrounds and text by default. 
 * You can also use them to power borders, fills or shadows, for example.
 */
/**
 * CORE CONFIG
 * This powers everything from utility class generation to breakpoints
 * to enabling/disabling pre-built components/utilities.
 */
/**
 * DESIGN TOKENS
 * Named values for consistent sizing across the codebase
 */
/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS */
body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin-block-end: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role=list],
ol[role=list] {
  list-style: none;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  line-height: 1.5;
}

/* Set shorter line heights on headings and interactive elements */
h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

/* Balance text wrapping on headings */
h1, h2,
h3, h4 {
  text-wrap: balance;
  text-transform: lowercase;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
  color: currentColor;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input, button,
textarea, select {
  font-family: inherit;
  font-size: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}

.radius, .frame::before, .dot-shadow::before {
  border-radius: 0.25rem;
}

.dot-shadow {
  --dot-shadow-size: 0.75rem;
  position: relative;
}
.dot-shadow::before {
  content: "";
  display: block;
  width: calc(100% + var(--dot-shadow-size) * 2);
  height: calc(100% + var(--dot-shadow-size) * 2);
  background-image: url("data:image/svg+xml,%3Csvg width='6px' height='6px' viewBox='0 0 6 6' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle fill='%23CAC6B8' cx='1' cy='5' r='1'%3E%3C/circle%3E%3Ccircle fill='%23CAC6B8' cx='4' cy='2' r='1'%3E%3C/circle%3E%3C/svg%3E%0A");
  position: absolute;
  top: calc(var(--dot-shadow-size) * -1);
  left: calc(var(--dot-shadow-size) * -1);
  z-index: -1;
}

/**
 * FLOW
 * Applies a margin to sibling elements based on a --flow-space custom property.
 */
.flow > * + * {
  margin-top: var(--flow-space, 1.77rem);
}

.section-flow > * + * {
  margin-block: var(--flow-space, 1.77rem);
}
@media (min-width: 37em) {
  .section-flow > * + * {
    margin-block: 5.6rem;
  }
}

.frame {
  position: relative;
}
.frame::before {
  content: "";
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: -0.25rem;
  left: -0.25rem;
  border: 0.125rem solid #333333;
  z-index: 1;
}
@media (min-width: 37em) {
  .frame::before {
    top: -0.5rem;
    left: -0.5rem;
    border-width: 0.25rem;
  }
}
.frame[data-frame=primary]::before {
  border-color: #552e84;
}
.frame[data-frame=secondary]::before {
  border-color: #0061ab;
}
.frame[data-frame=quaternary]::before {
  border-color: #ff7f5c;
}
.frame[data-frame=quinary]::before {
  border-color: #fa576e;
}

.panel {
  margin: 2.36rem 0;
  padding: 2.36rem 0;
}
@media (min-width: 37em) {
  .panel {
    margin: 3.15rem 0;
    padding: 3.15rem 0;
  }
}

.section {
  padding-block: 1.33rem;
}
@media (min-width: 37em) {
  .section {
    padding-block: 2.36rem;
  }
}

.section--compact {
  padding-block: 1rem;
}
@media (min-width: 37em) {
  .section--compact {
    padding-block: 1.77rem;
  }
}

.section--hero {
  padding-block: 3.15rem;
}
@media (min-width: 37em) {
  .section--hero {
    padding-block: 4.2rem;
  }
}

.site-wrap {
  overflow-x: hidden;
  position: relative;
}

.visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: auto;
  margin: 0;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

/**
 * WRAPPER
 * Sets a max width, adds a consisten gutter and horizontally
 * centers the contents
 */
.wrapper {
  max-width: 70rem;
  padding-inline: 1.33rem;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.button {
  display: inline-block;
  padding: 0.75rem 1rem;
  border: none;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  font-size: 1rem;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
}
.button--primary {
  background: #552e84;
  color: white;
}
.button--primary:hover {
  background: #45246b;
  transform: translateY(-2px);
}
.button--secondary {
  background: #0061ab;
  color: white;
}
.button--secondary:hover {
  background: #004c84;
  transform: translateY(-2px);
}

.card {
  background: #ffffff;
  border-radius: 1rem;
  padding: 1.33rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  height: 100%;
  display: flex;
  flex-direction: column;
}
html.dark .card {
  background: #1f1f1f;
}
@media (min-width: 37em) {
  .card {
    padding: 1.77rem;
  }
}
.card:hover {
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  transform: translateY(-4px);
}
.card__title {
  font-size: 1.33rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1rem;
  color: #552e84;
}
html.dark .card__title {
  color: #1a7fc0;
}
@media (min-width: 37em) {
  .card__title {
    font-size: 1.77rem;
  }
}
.card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.carousel {
  position: relative;
  overflow: hidden;
}
.carousel__container {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding-inline: 1rem;
}
.carousel__track {
  position: relative;
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
  min-height: 300px;
}
.carousel__track:active {
  cursor: grabbing;
}
.carousel__slide {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 500ms;
}
.carousel__slide[data-position=active] {
  opacity: 1;
  transform: translateX(0) scale(1);
  pointer-events: auto;
  position: relative;
  z-index: 2;
}
.carousel__slide[data-position=prev] {
  opacity: 0;
  transform: translateX(-100%) scale(0.95);
  z-index: 1;
}
.carousel__slide[data-position=next] {
  opacity: 0;
  transform: translateX(100%) scale(0.95);
  z-index: 1;
}
.carousel__slide[data-position=hidden] {
  opacity: 0;
  transform: translateX(0) scale(0.95);
  z-index: 0;
}
.carousel__controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.33rem;
  margin-top: 1.77rem;
}
@media (min-width: 37em) {
  .carousel__controls {
    gap: 2.36rem;
    margin-top: 2.36rem;
  }
}
.carousel__button {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 2px solid;
  border-color: #4d4d4d;
  background: transparent;
  color: #333333;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  flex-shrink: 0;
}
html.dark .carousel__button {
  border-color: #EDE8F5;
}
html.dark .carousel__button {
  background: transparent;
}
html.dark .carousel__button {
  color: #FAF5FF;
}
@media (min-width: 37em) {
  .carousel__button {
    width: 56px;
    height: 56px;
  }
}
.carousel__button svg {
  width: 24px;
  height: 24px;
  pointer-events: none;
}
.carousel__button:hover:not(:disabled) {
  background: #0061ab;
  border-color: #0061ab;
  color: white;
  transform: scale(1.1);
}
html.dark .carousel__button:hover:not(:disabled) {
  background: #1a7fc0;
}
html.dark .carousel__button:hover:not(:disabled) {
  border-color: #1a7fc0;
}
.carousel__button:focus-visible {
  outline: 3px solid #0061ab;
  outline-offset: 2px;
}
.carousel__button:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}
.carousel__dots {
  display: flex;
  gap: 0.75rem;
  align-items: center;
}
.carousel__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid;
  border-color: #4d4d4d;
  background: transparent;
  padding: 0;
  cursor: pointer;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}
html.dark .carousel__dot {
  border-color: #EDE8F5;
}
html.dark .carousel__dot {
  background: transparent;
}
@media (min-width: 37em) {
  .carousel__dot {
    width: 14px;
    height: 14px;
  }
}
.carousel__dot:hover {
  background: #004c84;
  border-color: #004c84;
  transform: scale(1.3);
}
html.dark .carousel__dot:hover {
  background: #0061ab;
}
html.dark .carousel__dot:hover {
  border-color: #0061ab;
}
.carousel__dot:focus-visible {
  outline: 2px solid #0061ab;
  outline-offset: 4px;
}
.carousel__dot[aria-selected=true] {
  background: #0061ab;
  border-color: #0061ab;
  transform: scale(1.2);
}
html.dark .carousel__dot[aria-selected=true] {
  background: #1a7fc0;
}
html.dark .carousel__dot[aria-selected=true] {
  border-color: #1a7fc0;
}

.cta {
  padding-inline: 2.36rem;
  padding-block: 1.33rem;
  background: #0061ab;
  color: white;
  text-align: center;
  max-width: 700px;
  margin-inline: auto;
  border-radius: 1rem;
  border: 2px solid #1a7fc0;
  box-shadow: 4px 4px 8px rgba(77, 77, 77, 0.5);
}
.cta__title {
  font-size: 1.77rem;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 0;
}
.cta__text {
  line-height: 1.6;
  opacity: 0.9;
}
.cta__button {
  background: #0061ab;
  color: white;
  border: 2px solid white;
}
.cta__button:hover {
  background: white;
  color: #0061ab;
  transform: translateY(-2px);
}
.cta__subtext {
  font-size: 0.75rem;
  line-height: 1.5;
  opacity: 0.85;
  margin-top: 1rem;
}
@media (min-width: 37em) {
  .cta {
    padding-block: 2.36rem;
  }
}

.faq {
  max-width: 768px;
  margin-inline: auto;
}
.faq__title {
  font-size: 2.36rem;
  font-weight: 700;
  margin-bottom: 3rem;
  text-align: center;
}
.faq__item {
  border-bottom: 1px solid #EDE8F5;
}
.faq__item:last-of-type {
  border-bottom: none;
}
.faq__question {
  width: 100%;
  padding: 1.5rem 0;
  background: none;
  border: none;
  text-align: left;
  font-size: 1.33rem;
  font-weight: 600;
  font-family: "Share Tech Mono", ui-monospace, Consolas, "SF Mono", "Menlo", "DejaVu Sans Mono", Courier, monospace;
  color: #333333;
  cursor: pointer;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
html.dark .faq__question {
  color: #FAF5FF;
}
.faq__question:hover {
  color: #0061ab;
}
html.dark .faq__question:hover {
  color: #1a7fc0;
}
.faq__toggle {
  width: 20px;
  height: 20px;
  position: relative;
  flex-shrink: 0;
  margin-left: 1rem;
}
.faq__toggle::before, .faq__toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 2px;
  background: currentColor;
  transform: translate(-50%, -50%);
  transition: all 0.3s ease;
}
.faq__toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
}
.faq__question[aria-expanded=true] .faq__toggle::after {
  transform: translate(-50%, -50%) rotate(0deg);
}
.faq__answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}
.faq__answer p {
  padding: 0 0 1.5rem 1.5rem;
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
  text-wrap: auto;
}

.note {
  padding: 1.33rem;
  border-radius: 1rem;
  text-wrap: pretty;
  background: #EDE8F5;
  color: #4d4d4d;
}
html.dark .note {
  background: #1f1f1f;
}
html.dark .note {
  color: #EDE8F5;
}
.note--accent {
  border-left: 4px solid;
  border-color: #552e84;
}
html.dark .note--accent {
  border-color: #1a7fc0;
}
.note__title {
  display: block;
  margin-bottom: 0.75rem;
  color: #552e84;
}
html.dark .note__title {
  color: #1a7fc0;
}
.note__text {
  margin: 0;
}
.note__text:not(:first-child) {
  margin-top: 0.75rem;
}

.sticky-button {
  position: fixed;
  bottom: 0.75rem;
  right: 0.75rem;
  width: 2.36rem;
  aspect-ratio: 1;
  border: none;
  border-radius: 50%;
  outline: none;
  color: white;
  transition: 150ms;
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  background: #6a3e99;
}
html.dark .sticky-button {
  background: #0061ab;
}
.sticky-button svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.sticky-button svg.sun {
  opacity: 0;
}
.sticky-button svg.moon {
  opacity: 1;
}
html.dark .sticky-button svg.sun {
  opacity: 1;
}
html.dark .sticky-button svg.moon {
  opacity: 0;
}

.styled-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.styled-list li {
  font-size: 1rem;
  line-height: 1.5;
  padding-left: 1.33rem;
  position: relative;
}
.styled-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  font-weight: 700;
  color: #1ba09c;
}
html.dark .styled-list li::before {
  color: #3db7b3;
}
.styled-list--negative li::before {
  content: "✗";
  color: #fa576e;
}
html.dark .styled-list--negative li::before {
  color: #f26c7f;
}
.styled-list--small li {
  font-size: 0.75rem;
}
@media (min-width: 37em) {
  .styled-list--small li {
    font-size: 1rem;
  }
}

.text-muted {
  color: #4d4d4d;
}
html.dark .text-muted {
  color: #EDE8F5;
}

input[type=checkbox].theme-toggle {
  height: 0;
  width: 0;
  visibility: hidden;
}

label.toggle-label {
  cursor: pointer;
  text-indent: -9999px;
  width: 2.66rem;
  height: 1.33rem;
  background: #552e84;
  display: block;
  border-radius: 1.33rem;
  position: relative;
}

label.toggle-label:after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: calc(1.33rem - 8px);
  height: calc(1.33rem - 8px);
  border-radius: calc(1.33rem - 8px);
  transition-property: all;
  transition-timing-function: linear;
  transition-duration: 150ms;
  background: #FAF5FF;
}
html.dark label.toggle-label:after {
  background: #333333;
}

input[type=checkbox].theme-toggle:checked + label.toggle-label {
  background: #0061ab;
}

input.theme-toggle:checked + label.toggle-label:after {
  left: calc(100% - 4px);
  transform: translateX(-100%);
}

label.toggle-label:active:after {
  width: 1.33rem;
}

.footer {
  position: relative;
  padding: 2.36rem 1.33rem 5rem;
  background: #EDE8F5;
}
html.dark .footer {
  background: #1f1f1f;
}
.footer__inner {
  display: flex;
  flex-direction: column;
  gap: 1.77rem;
  max-width: 900px;
  margin-inline: auto;
}
@media (min-width: 37em) {
  .footer__inner {
    flex-direction: row;
    align-items: flex-start;
    gap: 3.15rem;
  }
}
.footer__column {
  flex: 1;
  text-align: center;
}
.footer__column:first-child {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 37em) {
  .footer__column:first-child {
    align-items: flex-end;
  }
}
@media (min-width: 37em) {
  .footer__column {
    text-align: left;
  }
}
.footer__logo {
  max-width: 6rem;
  margin-bottom: 1.33rem;
}
.footer__logo svg {
  width: 100%;
  height: auto;
}
.footer__nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  font-family: "Share Tech Mono", ui-monospace, Consolas, "SF Mono", "Menlo", "DejaVu Sans Mono", Courier, monospace;
}
@media (min-width: 37em) {
  .footer__nav {
    align-items: flex-end;
  }
}
.footer__nav a.nav-link {
  padding: 0;
  font-size: 1rem;
  display: inline-block;
  width: auto;
}
.footer__nav a.nav-link:before {
  width: 100%;
  height: 0.25rem;
  top: 100%;
  left: 0;
  margin-top: 0.25rem;
}
.footer__nav a.nav-link:hover {
  color: unset;
}
.footer__about {
  text-align: center;
  flex: 2;
}
@media (min-width: 37em) {
  .footer__about {
    text-align: left;
    align-self: flex-end;
  }
}
.footer__heading {
  font-size: 1.33rem;
  font-weight: 700;
  margin-bottom: 1rem;
  color: #552e84;
}
html.dark .footer__heading {
  color: #1a7fc0;
}
.footer__text {
  font-size: 0.75rem;
  line-height: 1.6;
  margin: 0;
  color: #4d4d4d;
}
html.dark .footer__text {
  color: #EDE8F5;
}
.footer #copyright {
  position: absolute;
  bottom: 0.75rem;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 11px;
  line-height: 11px;
  color: #4d4d4d;
  opacity: 50%;
}
html.dark .footer #copyright {
  color: #EDE8F5;
}

.header {
  width: 100%;
  height: 128px;
  position: relative;
  box-shadow: 0 6px 12px 4px rgba(48, 42, 55, 0.1);
}
html.dark .header {
  box-shadow: 0 6px 12px 4px rgba(0, 0, 0, 0.25);
}
.header .wrapper {
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.25rem;
}
@media (min-width: 37em) {
  .header .wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
}
.header a.header-logo {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.header a.header-logo svg.logo {
  height: 2.36rem;
}
.header__nav {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  line-height: 1;
  font-size: 1.33rem;
  background: #FAF5FF;
  border-radius: 0.5rem 0 0 0.5rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.05);
  padding: 0;
  min-width: 200px;
  max-width: calc(100vw - 1rem);
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transform: translateX(1rem);
  transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
}
html.dark .header__nav {
  background: #333333;
}
.header__nav.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}
@media (min-width: 37em) {
  .header__nav {
    position: static;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    flex: 2;
    opacity: 1;
    visibility: visible;
    transform: none;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    min-width: auto;
  }
}
.header__cta {
  display: none;
}
@media (min-width: 37em) {
  .header__cta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}
.header__nav-cta {
  margin: 1rem;
  text-align: center;
}
@media (min-width: 37em) {
  .header__nav-cta {
    display: none;
  }
}
.header__hamburger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.375rem;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.5rem;
  background: transparent;
  border: none;
  cursor: pointer;
  z-index: 1001;
  margin-left: 0.5rem;
}
@media (min-width: 37em) {
  .header__hamburger {
    display: none;
  }
}
.header__hamburger:hover {
  opacity: 0.7;
}
.header__hamburger-line {
  display: block;
  width: 100%;
  height: 2px;
  background: #333333;
  border-radius: 2px;
  transition: all 0.3s ease;
}
html.dark .header__hamburger-line {
  background: #FAF5FF;
}
.header__hamburger[aria-expanded=true] .header__hamburger-line:nth-child(1) {
  transform: translateY(0.5rem) rotate(45deg);
}
.header__hamburger[aria-expanded=true] .header__hamburger-line:nth-child(2) {
  opacity: 0;
  transform: translateX(-1rem);
}
.header__hamburger[aria-expanded=true] .header__hamburger-line:nth-child(3) {
  transform: translateY(-0.5rem) rotate(-45deg);
}

svg.logo .logo-letter {
  fill: #552e84;
}
html.dark svg.logo .logo-letter {
  fill: #0061ab;
}

.nav-link {
  color: currentColor;
  text-decoration: none;
  display: block;
  position: relative;
  padding: 0.5rem 1rem;
  text-align: right;
  transition: color 0.2s ease, background 0.2s ease;
}
.nav-link:before {
  content: "";
  opacity: 0;
  display: block;
  position: absolute;
  background: #1a7fc0;
  transition: opacity 0.2s ease;
  width: 0.5rem;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  margin-top: 0;
}
.nav-link:hover {
  background: #EDE8F5;
  color: #1a7fc0;
}
html.dark .nav-link:hover {
  background: #4d4d4d;
}
.nav-link:hover:before {
  opacity: 0.3;
}
.nav-link[data-state=active]:before, .nav-link[aria-current=page]:before {
  opacity: 1;
}
@media (min-width: 37em) {
  .nav-link {
    padding: 0;
  }
  .nav-link:before {
    width: 100%;
    height: 0.25rem;
    top: 100%;
    left: 0;
    margin-top: 0.25rem;
  }
  .nav-link:hover {
    background: none;
    color: unset;
  }
}

/* Hero Section */
.hero {
  position: relative;
  width: 100%;
  height: calc(100vh - 15rem);
  overflow: visible;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.hero__background {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
  z-index: 0;
  overflow: hidden;
  mask-image: linear-gradient(to bottom, black 60%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 60%, transparent 100%);
}
.hero__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.hero__title {
  font-size: 2.36rem;
  font-weight: 400;
  line-height: 1.2;
  text-wrap: balance;
}
@media (min-width: 37em) {
  .hero__title {
    font-size: 4.2rem;
    max-width: 1200px;
  }
}
.hero__subtitle {
  font-size: 1rem;
  max-width: 64ch;
  text-wrap: balance;
  text-shadow: 0 0 10px #FAF5FF, 0 0 20px #FAF5FF, 0 0 40px #FAF5FF;
}
html.dark .hero__subtitle {
  text-shadow: 0 0 10px #333333, 0 0 20px #333333, 0 0 40px #333333;
}
@media (min-width: 37em) {
  .hero__subtitle {
    font-size: 1.33rem;
  }
}
.hero__cta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.hero__subtext {
  font-size: 0.75rem;
  max-width: 40ch;
  background: #FAF5FF;
}
html.dark .hero__subtext {
  background: #333333;
}

/* DotGrid Canvas */
.dot-grid__canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* Services Section */
.services {
  padding-block: 1rem;
}
@media (min-width: 37em) {
  .services {
    padding-block: 1.77rem;
  }
}
.services__title {
  margin-bottom: 1.77rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  color: #333333;
}
html.dark .services__title {
  color: #FAF5FF;
}
@media (min-width: 37em) {
  .services__title {
    font-size: 3.15rem;
  }
}
.services__steps {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 1rem;
  margin-inline: -1rem;
  padding-inline: 1rem;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.services__steps::-webkit-scrollbar {
  display: none;
}
@media (min-width: 37em) {
  .services__steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.33rem;
    overflow-x: visible;
    scroll-snap-type: none;
    margin-inline: 0;
    padding-inline: 0;
    padding-bottom: 0;
  }
}
.services__item {
  flex: 0 0 85%;
  scroll-snap-align: center;
  min-width: 0;
}
@media (min-width: 37em) {
  .services__item {
    flex: 1;
  }
}
.services__description {
  font-size: 1rem;
  line-height: 1.6;
}
.services__bullets {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.services__bullets li {
  line-height: 1.5;
  padding-left: 1.33rem;
  position: relative;
  font-size: 0.75rem;
}
@media (min-width: 37em) {
  .services__bullets li {
    font-size: 1rem;
  }
}
.services__bullets li::before {
  content: "✓";
  position: absolute;
  left: 0;
  font-weight: 700;
  color: #1ba09c;
}
html.dark .services__bullets li::before {
  color: #3db7b3;
}
.services__cta {
  color: #4d4d4d;
  text-align: center;
  margin-top: 1.33rem;
  font-size: 1rem;
  font-style: italic;
}
html.dark .services__cta {
  color: #EDE8F5;
}
@media (min-width: 37em) {
  .services__cta {
    margin-top: 1.77rem;
  }
}
.services__carousel-controls {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 1rem;
}
@media (min-width: 37em) {
  .services__carousel-controls {
    display: none;
  }
}
.services__carousel-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid;
  border-color: #4d4d4d;
  background: transparent;
  padding: 0;
  cursor: pointer;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
}
html.dark .services__carousel-dot {
  border-color: #EDE8F5;
}
html.dark .services__carousel-dot {
  background: transparent;
}
.services__carousel-dot:hover {
  background: #004c84;
  border-color: #004c84;
}
html.dark .services__carousel-dot:hover {
  background: #0061ab;
}
html.dark .services__carousel-dot:hover {
  border-color: #0061ab;
}
.services__carousel-dot[aria-selected=true], .services__carousel-dot.active {
  background: #0061ab;
  border-color: #0061ab;
}
html.dark .services__carousel-dot[aria-selected=true], html.dark .services__carousel-dot.active {
  background: #1a7fc0;
}
html.dark .services__carousel-dot[aria-selected=true], html.dark .services__carousel-dot.active {
  border-color: #1a7fc0;
}

/* Discovery Section */
.discovery {
  padding-block: 1.77rem;
}
@media (min-width: 37em) {
  .discovery {
    padding-block: 2.36rem;
  }
}
.discovery__title {
  text-align: center;
  font-size: 1.77rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1.33rem;
}
@media (min-width: 37em) {
  .discovery__title {
    font-size: 2.36rem;
    margin-bottom: 1.77rem;
  }
}
.discovery__band {
  padding-block: 1.33rem;
}
@media (min-width: 37em) {
  .discovery__band {
    padding-block: 1.77rem;
  }
}
.discovery__band:first-of-type {
  display: grid;
  gap: 1.33rem;
  align-items: center;
}
@media (min-width: 37em) {
  .discovery__band:first-of-type {
    grid-template-columns: 1fr 1fr;
    gap: 2.36rem;
  }
}
.discovery__band:first-of-type .content {
  order: 2;
}
@media (min-width: 37em) {
  .discovery__band:first-of-type .content {
    order: 1;
  }
}
.discovery__band:first-of-type .content p {
  font-size: 1rem;
  line-height: 1.6;
  margin-top: 1rem;
}
.discovery__band:first-of-type .content p:first-child {
  margin-top: 0;
}
.discovery__band:first-of-type .visual {
  order: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 37em) {
  .discovery__band:first-of-type .visual {
    order: 2;
  }
}
.discovery__band:first-of-type .visual img {
  width: 100%;
  max-width: 250px;
  height: auto;
}
@media (min-width: 37em) {
  .discovery__band:first-of-type .visual img {
    max-width: 300px;
  }
}
.discovery__band--steps h3 {
  font-size: 1.77rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 1.77rem;
}
@media (min-width: 37em) {
  .discovery__band--steps h3 {
    font-size: 2.36rem;
    margin-bottom: 2.36rem;
  }
}
.discovery__band:nth-of-type(3) h3 {
  font-size: 1.77rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 1.77rem;
}
@media (min-width: 37em) {
  .discovery__band:nth-of-type(3) h3 {
    font-size: 2.36rem;
    margin-bottom: 2.36rem;
  }
}
.discovery__band:nth-of-type(3) .columns {
  display: grid;
  gap: 1.33rem;
  margin-bottom: 1.77rem;
  max-width: 700px;
  margin-inline: auto;
}
@media (min-width: 37em) {
  .discovery__band:nth-of-type(3) .columns {
    grid-template-columns: 1fr 1fr;
    gap: 1.77rem;
    margin-bottom: 2.36rem;
  }
}
.discovery__band:nth-of-type(3) .column {
  background: #ffffff;
  padding: 1.33rem;
  border-radius: 1rem;
}
html.dark .discovery__band:nth-of-type(3) .column {
  background: #1f1f1f;
}
.discovery__band:nth-of-type(3) .column p {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
  color: #552e84;
}
html.dark .discovery__band:nth-of-type(3) .column p {
  color: #1a7fc0;
}
.discovery__band:nth-of-type(3) .column ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.discovery__band:nth-of-type(3) .column ul li {
  font-size: 1rem;
  line-height: 1.5;
  padding-left: 1.33rem;
  position: relative;
}
.discovery__band:nth-of-type(3) .column ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #1ba09c;
  font-weight: 700;
}
html.dark .discovery__band:nth-of-type(3) .column ul li::before {
  color: #3db7b3;
}
.discovery__band:nth-of-type(3) .column:last-child ul li::before {
  content: "✗";
  color: #fa576e;
}
html.dark .discovery__band:nth-of-type(3) .column:last-child ul li::before {
  color: #f26c7f;
}
.discovery__band:nth-of-type(3) > p:last-child {
  text-align: center;
  font-size: 1rem;
  font-style: italic;
  color: #4d4d4d;
}
html.dark .discovery__band:nth-of-type(3) > p:last-child {
  color: #EDE8F5;
}
.discovery__title {
  font-size: 1.77rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1rem;
}
@media (min-width: 37em) {
  .discovery__title {
    font-size: 2.36rem;
  }
}
.discovery__step {
  margin-bottom: 1rem;
  counter-increment: step-counter;
  position: relative;
}
@media (min-width: 37em) {
  .discovery__step {
    margin-bottom: 0;
  }
}
.discovery__step::before {
  content: counter(step-counter);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #0061ab;
  color: white;
  font-weight: 700;
  font-size: 1rem;
  margin-bottom: 1rem;
}
html.dark .discovery__step::before {
  background: #552e84;
}
.discovery__step .card__title {
  text-align: left;
}
.discovery__step .card__body p {
  margin: 0;
  color: #4d4d4d;
}
html.dark .discovery__step .card__body p {
  color: #EDE8F5;
}
.discovery__band--steps {
  counter-reset: step-counter;
}
@media (min-width: 37em) {
  .discovery__band--steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto 1fr;
    gap: 1.33rem;
  }
  .discovery__band--steps h3 {
    grid-column: 1/-1;
  }
}
.discovery__cta {
  text-align: center;
  padding-block: 3.15rem;
  margin-top: 1.33rem;
  border-radius: 1.33rem;
  background: #6a3e99;
  color: white;
}
@media (min-width: 37em) {
  .discovery__cta {
    padding-block: 4.2rem;
    margin-top: 1.77rem;
  }
}
.discovery__cta .button {
  margin-bottom: 1rem;
}
.discovery__cta .disclaimer {
  display: block;
  font-size: 0.75rem;
  opacity: 0.85;
}

/* Testimonials Section */
.testimonials {
  padding-block: 1.33rem;
}
@media (min-width: 37em) {
  .testimonials {
    padding-block: 2.36rem;
  }
}
.testimonials__title {
  text-align: center;
  font-size: 2.36rem;
  font-weight: 700;
  margin-bottom: 1rem;
}
.testimonials__description {
  color: #4d4d4d;
  text-align: center;
  font-size: 1rem;
  margin-bottom: 1.77rem;
}
html.dark .testimonials__description {
  color: #EDE8F5;
}
.testimonials__list {
  display: grid;
  gap: 1.33rem;
}
@media (min-width: 37em) {
  .testimonials__list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.77rem;
  }
}

.testimonial {
  background: #ffffff;
  border-radius: 1rem;
  padding: 1.33rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
html.dark .testimonial {
  background: #1f1f1f;
}
.testimonial__text,
.testimonial .testimonal__text {
  font-size: 1rem;
  line-height: 1.6;
  font-style: italic;
  margin: 0;
  flex: 1;
}
.testimonial__author {
  font-size: 0.75rem;
  font-weight: 700;
  color: #552e84;
}
html.dark .testimonial__author {
  color: #1a7fc0;
}

/* Process Section */
.process {
  padding-block: 1.33rem;
}
@media (min-width: 37em) {
  .process {
    padding-block: 2.36rem;
  }
}
.process__title {
  text-align: center;
  font-size: 2.36rem;
  font-weight: 700;
  margin-bottom: 1rem;
}
.process__description {
  color: #4d4d4d;
  text-align: center;
  font-size: 1rem;
  margin-bottom: 1.77rem;
}
html.dark .process__description {
  color: #EDE8F5;
}
@media (min-width: 37em) {
  .process__description {
    margin-bottom: 2.36rem;
  }
}
.process__steps {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 900px;
  margin-inline: auto;
  counter-reset: process-counter;
}
@media (min-width: 37em) {
  .process__steps {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.33rem;
  }
}
.process__step {
  counter-increment: process-counter;
}
.process__step::before {
  content: counter(process-counter);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #0061ab;
  color: white;
  font-weight: 700;
  font-size: 1rem;
  margin-bottom: 1rem;
}
html.dark .process__step::before {
  background: #552e84;
}
.process__step .card__body p {
  margin: 0;
  color: #4d4d4d;
}
html.dark .process__step .card__body p {
  color: #EDE8F5;
}
@media (min-width: 37em) {
  .process__step:nth-child(odd) {
    grid-column: 1;
  }
  .process__step:nth-child(even) {
    grid-column: 2;
  }
}

/* FAQ Section */
.faq {
  padding-block: 1rem;
}
@media (min-width: 37em) {
  .faq {
    padding-block: 2.36rem;
  }
}

.about-hero {
  padding: 3.15rem 0;
  background: #FAF5FF;
}
html.dark .about-hero {
  background: #333333;
}
@media (min-width: 37em) {
  .about-hero {
    padding: 4.2rem 0;
  }
}
.about-hero__content {
  display: flex;
  flex-direction: column;
  gap: 2.36rem;
}
@media (min-width: 37em) {
  .about-hero__content {
    flex-direction: row;
    align-items: center;
    gap: 3.15rem;
  }
}
.about-hero__text {
  flex: 1;
}
.about-hero__text p {
  color: #4d4d4d;
}
html.dark .about-hero__text p {
  color: #EDE8F5;
}
.about-hero__title {
  margin-bottom: 1.33rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #333333;
}
html.dark .about-hero__title {
  color: #FAF5FF;
}
@media (min-width: 37em) {
  .about-hero__title {
    font-size: 3.15rem;
  }
}
.about-hero__image {
  flex-shrink: 0;
  display: flex;
  justify-content: center;
}
@media (min-width: 37em) {
  .about-hero__image {
    justify-content: flex-end;
  }
}
.about-hero__image img {
  width: 100%;
  max-width: 300px;
  height: auto;
  border-radius: 1.33rem;
  background: #EDE8F5;
}
html.dark .about-hero__image img {
  background: #1f1f1f;
}
@media (min-width: 37em) {
  .about-hero__image img {
    max-width: 350px;
  }
}

.about-story__title {
  margin-bottom: 1.77rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #552e84;
}
html.dark .about-story__title {
  color: #1a7fc0;
}
@media (min-width: 37em) {
  .about-story__title {
    font-size: 3.15rem;
  }
}
.about-story__content p, .about-story__content li {
  color: #4d4d4d;
}
html.dark .about-story__content p, html.dark .about-story__content li {
  color: #EDE8F5;
}
.about-story__content ul {
  padding-left: 1.77rem;
  margin: 1.33rem 0;
}
.about-story__content ul li {
  margin-bottom: 0.75rem;
}
.about-story__content ul li::marker {
  color: #0061ab;
}
html.dark .about-story__content ul li::marker {
  color: #1a7fc0;
}

.about-why__title {
  margin-bottom: 1.77rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #552e84;
}
html.dark .about-why__title {
  color: #1a7fc0;
}
@media (min-width: 37em) {
  .about-why__title {
    font-size: 3.15rem;
  }
}
.about-why__content p, .about-why__content li {
  color: #4d4d4d;
}
html.dark .about-why__content p, html.dark .about-why__content li {
  color: #EDE8F5;
}
.about-why__content ul {
  padding-left: 1.77rem;
  margin: 1.33rem 0;
}
.about-why__content ul li {
  margin-bottom: 0.75rem;
}
.about-why__content ul li::marker {
  color: #0061ab;
}
html.dark .about-why__content ul li::marker {
  color: #1a7fc0;
}

.about-expertise__title {
  margin-bottom: 1.77rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #552e84;
}
html.dark .about-expertise__title {
  color: #1a7fc0;
}
@media (min-width: 37em) {
  .about-expertise__title {
    font-size: 3.15rem;
  }
}
.about-expertise__content {
  display: grid;
  gap: 2.36rem;
}
@media (min-width: 37em) {
  .about-expertise__content {
    grid-template-columns: 1fr 1fr;
    gap: 3.15rem;
  }
}
.about-expertise__services, .about-expertise__values {
  padding: 1.77rem;
  border-radius: 1rem;
  background: #EDE8F5;
}
html.dark .about-expertise__services, html.dark .about-expertise__values {
  background: #1f1f1f;
}
.about-expertise__services p, .about-expertise__services li, .about-expertise__values p, .about-expertise__values li {
  color: #4d4d4d;
}
html.dark .about-expertise__services p, html.dark .about-expertise__services li, html.dark .about-expertise__values p, html.dark .about-expertise__values li {
  color: #EDE8F5;
}
.about-expertise__services p, .about-expertise__values p {
  margin-bottom: 1rem;
}
.about-expertise__services p:last-child, .about-expertise__values p:last-child {
  margin-bottom: 0;
}
.about-expertise__services ul, .about-expertise__values ul {
  padding-left: 1.77rem;
  margin: 1rem 0;
}
.about-expertise__services ul li, .about-expertise__values ul li {
  margin-bottom: 0.75rem;
}
.about-expertise__services ul li::marker, .about-expertise__values ul li::marker {
  color: #0061ab;
}
html.dark .about-expertise__services ul li::marker, html.dark .about-expertise__values ul li::marker {
  color: #1a7fc0;
}
.about-expertise__services ul li strong, .about-expertise__values ul li strong {
  color: #333333;
}
html.dark .about-expertise__services ul li strong, html.dark .about-expertise__values ul li strong {
  color: #FAF5FF;
}

.about-process__title {
  margin-bottom: 1.77rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #552e84;
}
html.dark .about-process__title {
  color: #1a7fc0;
}
@media (min-width: 37em) {
  .about-process__title {
    font-size: 3.15rem;
  }
}
.about-process__intro {
  margin-bottom: 1.77rem;
}
.about-process__intro p {
  color: #4d4d4d;
  margin-bottom: 1rem;
}
html.dark .about-process__intro p {
  color: #EDE8F5;
}
.about-process__items {
  display: grid;
  gap: 1.33rem;
}
@media (min-width: 37em) {
  .about-process__items {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.77rem;
  }
}
.about-process__item {
  height: 100%;
}
.about-process__closing {
  margin-top: 1.77rem;
  color: #4d4d4d;
}
html.dark .about-process__closing {
  color: #EDE8F5;
}

.about-personal__title {
  margin-bottom: 1.77rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #552e84;
}
html.dark .about-personal__title {
  color: #1a7fc0;
}
@media (min-width: 37em) {
  .about-personal__title {
    font-size: 3.15rem;
  }
}
.about-personal__content p, .about-personal__content li {
  color: #4d4d4d;
}
html.dark .about-personal__content p, html.dark .about-personal__content li {
  color: #EDE8F5;
}
.about-personal__content ul {
  padding-left: 1.77rem;
  margin: 1.33rem 0;
}
.about-personal__content ul li {
  margin-bottom: 0.75rem;
}
.about-personal__content ul li::marker {
  color: #0061ab;
}
html.dark .about-personal__content ul li::marker {
  color: #1a7fc0;
}

.services-hero {
  padding: 3.15rem 0;
  background: #FAF5FF;
}
html.dark .services-hero {
  background: #333333;
}
@media (min-width: 37em) {
  .services-hero {
    padding: 4.2rem 0;
  }
}
.services-hero__content p {
  color: #4d4d4d;
}
html.dark .services-hero__content p {
  color: #EDE8F5;
}
.services-hero__title {
  margin-bottom: 1.33rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #333333;
}
html.dark .services-hero__title {
  color: #FAF5FF;
}
@media (min-width: 37em) {
  .services-hero__title {
    font-size: 3.15rem;
  }
}
.services-hero__list {
  padding-left: 1.77rem;
  margin: 1.33rem 0;
}
.services-hero__list li {
  margin-bottom: 0.75rem;
  font-weight: 600;
  color: #333333;
}
html.dark .services-hero__list li {
  color: #FAF5FF;
}
.services-hero__list li::marker {
  color: #0061ab;
}
html.dark .services-hero__list li::marker {
  color: #1a7fc0;
}

.service-detail {
  padding: 1.33rem 0;
}
.service-detail__header {
  margin-bottom: 1.77rem;
}
.service-detail__title {
  margin-bottom: 0.75rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #552e84;
}
html.dark .service-detail__title {
  color: #1a7fc0;
}
@media (min-width: 37em) {
  .service-detail__title {
    font-size: 3.15rem;
  }
}
.service-detail__subtitle {
  font-size: 1.33rem;
  font-style: italic;
  color: #4d4d4d;
}
html.dark .service-detail__subtitle {
  color: #EDE8F5;
}
@media (min-width: 37em) {
  .service-detail__subtitle {
    font-size: 1.77rem;
  }
}
.service-detail__content {
  display: grid;
  gap: 1.77rem;
  margin-bottom: 1.77rem;
}
@media (min-width: 37em) {
  .service-detail__content {
    grid-template-columns: 1fr 1fr;
    gap: 3.15rem;
  }
}
.service-detail__description p, .service-detail__description li, .service-detail__features p, .service-detail__features li {
  color: #4d4d4d;
}
html.dark .service-detail__description p, html.dark .service-detail__description li, html.dark .service-detail__features p, html.dark .service-detail__features li {
  color: #EDE8F5;
}
.service-detail__description p, .service-detail__features p {
  margin-bottom: 1rem;
}
.service-detail__description ul, .service-detail__features ul {
  padding-left: 1.77rem;
  margin: 1rem 0;
}
.service-detail__description ul li, .service-detail__features ul li {
  margin-bottom: 0.75rem;
}
.service-detail__description ul li::marker, .service-detail__features ul li::marker {
  color: #0061ab;
}
html.dark .service-detail__description ul li::marker, html.dark .service-detail__features ul li::marker {
  color: #1a7fc0;
}
.service-detail .note {
  margin-bottom: 1.77rem;
}

.contact-hero {
  padding: 3.15rem 0 1.77rem;
  background: #FAF5FF;
}
html.dark .contact-hero {
  background: #333333;
}
@media (min-width: 37em) {
  .contact-hero {
    padding: 4.2rem 0 2.36rem;
  }
}
.contact-hero__content p {
  color: #4d4d4d;
}
html.dark .contact-hero__content p {
  color: #EDE8F5;
}
.contact-hero__title {
  margin-bottom: 1.33rem;
  font-size: 2.36rem;
  font-weight: 700;
  line-height: 1.3;
  color: #333333;
}
html.dark .contact-hero__title {
  color: #FAF5FF;
}
@media (min-width: 37em) {
  .contact-hero__title {
    font-size: 3.15rem;
  }
}

.contact-form-section {
  padding: 2.36rem 0 4.2rem;
}

.contact-form__field {
  margin-bottom: 1.33rem;
}
.contact-form__label {
  display: block;
  margin-bottom: 0.75rem;
  font-weight: 600;
  color: #333333;
}
html.dark .contact-form__label {
  color: #FAF5FF;
}
.contact-form__label span:not(.contact-form__optional) {
  color: #fa576e;
}
html.dark .contact-form__label span:not(.contact-form__optional) {
  color: #f26c7f;
}
.contact-form__optional {
  font-weight: 400;
  font-size: 0.75rem;
  color: #4d4d4d;
}
html.dark .contact-form__optional {
  color: #EDE8F5;
}
.contact-form__input, .contact-form__select, .contact-form__textarea {
  display: block;
  width: 100%;
  padding: 1rem;
  font-size: 1rem;
  font-family: inherit;
  border: 2px solid;
  border-radius: 0.75rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  background: #ffffff;
  color: #333333;
  border-color: #EDE8F5;
}
html.dark .contact-form__input, html.dark .contact-form__select, html.dark .contact-form__textarea {
  background: #1f1f1f;
}
html.dark .contact-form__input, html.dark .contact-form__select, html.dark .contact-form__textarea {
  color: #FAF5FF;
}
html.dark .contact-form__input, html.dark .contact-form__select, html.dark .contact-form__textarea {
  border-color: #4d4d4d;
}
.contact-form__input:focus, .contact-form__select:focus, .contact-form__textarea:focus {
  outline: none;
  border-color: #552e84;
  box-shadow: 0 0 0 3px rgba(85, 46, 132, 0.15);
}
html.dark .contact-form__input:focus, html.dark .contact-form__select:focus, html.dark .contact-form__textarea:focus {
  border-color: #1a7fc0;
}
html.dark .contact-form__input:focus, html.dark .contact-form__select:focus, html.dark .contact-form__textarea:focus {
  box-shadow: 0 0 0 3px rgba(26, 127, 192, 0.15);
}
.contact-form__input::placeholder, .contact-form__select::placeholder, .contact-form__textarea::placeholder {
  color: #4d4d4d;
  opacity: 0.7;
}
html.dark .contact-form__input::placeholder, html.dark .contact-form__select::placeholder, html.dark .contact-form__textarea::placeholder {
  color: #EDE8F5;
}
.contact-form__select {
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.36rem;
}
.contact-form__textarea {
  resize: vertical;
  min-height: 120px;
}
.contact-form__submit {
  margin-top: 1.77rem;
  width: 100%;
}
@media (min-width: 37em) {
  .contact-form__submit {
    width: auto;
  }
}

:root {
  --flow-space: 1.77rem;
}

html, body {
  overflow-x: hidden;
}

body {
  margin: 0;
  padding: 0;
  line-height: 1.5;
  font-size: 1rem;
  text-wrap: balance;
  font-family: "Nunito Sans", "Segoe UI", "San Francisco", "DejaVu Sans", "Arial", sans-serif;
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  background: #FAF5FF;
  color: #333333;
}
html.dark body {
  background: #333333;
}
html.dark body {
  color: #FAF5FF;
}

a:not([class]) {
  color: currentColor;
  text-decoration-color: #0061ab;
}

main:focus {
  outline: none;
}

h1,
h2,
h3,
h4 {
  font-weight: 900;
  font-family: "Share Tech Mono", ui-monospace, Consolas, "SF Mono", "Menlo", "DejaVu Sans Mono", Courier, monospace;
  line-height: 1.1;
}

::selection {
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  color: #FAF5FF;
  background: rgba(31, 31, 31, 0.99);
}
html.dark ::selection {
  color: #333333;
}
html.dark ::selection {
  background: rgba(255, 255, 255, 0.99);
}

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: #4d4d4d;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: #333333;
}

html.dark ::-webkit-scrollbar-thumb {
  background-color: #EDE8F5;
}
html.dark ::-webkit-scrollbar-thumb:hover {
  background-color: #FAF5FF;
}

.bg-dark {
  background: #333333;
}

.bg-dark-shade {
  background: #1f1f1f;
}

.bg-dark-glare {
  background: #4d4d4d;
}

.bg-light {
  background: #FAF5FF;
}

.bg-light-shade {
  background: #EDE8F5;
}

.bg-light-glare {
  background: #ffffff;
}

.bg-primary {
  background: #552e84;
}

.bg-primary-shade {
  background: #45246b;
}

.bg-primary-glare {
  background: #6a3e99;
}

.bg-secondary {
  background: #0061ab;
}

.bg-secondary-shade {
  background: #004c84;
}

.bg-secondary-glare {
  background: #1a7fc0;
}

.bg-tertiary {
  background: #1ba09c;
}

.bg-tertiary-shade {
  background: #14807d;
}

.bg-tertiary-glare {
  background: #3db7b3;
}

.bg-quaternary {
  background: #ff7f5c;
}

.bg-quaternary-shade {
  background: #f96841;
}

.bg-quaternary-glare {
  background: #fe9476;
}

.bg-quinary {
  background: #fa576e;
}

.bg-quinary-shade {
  background: #fc3e59;
}

.bg-quinary-glare {
  background: #f26c7f;
}

.color-dark {
  color: #333333;
}

.color-dark-shade {
  color: #1f1f1f;
}

.color-dark-glare {
  color: #4d4d4d;
}

.color-light {
  color: #FAF5FF;
}

.color-light-shade {
  color: #EDE8F5;
}

.color-light-glare {
  color: #ffffff;
}

.color-primary {
  color: #552e84;
}

.color-primary-shade {
  color: #45246b;
}

.color-primary-glare {
  color: #6a3e99;
}

.color-secondary {
  color: #0061ab;
}

.color-secondary-shade {
  color: #004c84;
}

.color-secondary-glare {
  color: #1a7fc0;
}

.color-tertiary {
  color: #1ba09c;
}

.color-tertiary-shade {
  color: #14807d;
}

.color-tertiary-glare {
  color: #3db7b3;
}

.color-quaternary {
  color: #ff7f5c;
}

.color-quaternary-shade {
  color: #f96841;
}

.color-quaternary-glare {
  color: #fe9476;
}

.color-quinary {
  color: #fa576e;
}

.color-quinary-shade {
  color: #fc3e59;
}

.color-quinary-glare {
  color: #f26c7f;
}

.flow-space-300 {
  --flow-space: 0.75rem;
}

.flow-space-400 {
  --flow-space: 1rem;
}

.flow-space-500 {
  --flow-space: 1.33rem;
}

.flow-space-600 {
  --flow-space: 1.77rem;
}

.flow-space-700 {
  --flow-space: 2.36rem;
}

.flow-space-800 {
  --flow-space: 3.15rem;
}

.flow-space-900 {
  --flow-space: 4.2rem;
}

.flow-space-major {
  --flow-space: 5.6rem;
}

.font-base {
  font-family: "Nunito Sans", "Segoe UI", "San Francisco", "DejaVu Sans", "Arial", sans-serif;
}

.font-accent {
  font-family: "Share Tech Mono", ui-monospace, Consolas, "SF Mono", "Menlo", "DejaVu Sans Mono", Courier, monospace;
}

.gap-top-300 {
  margin-top: 0.75rem;
}

.gap-top-400 {
  margin-top: 1rem;
}

.gap-top-500 {
  margin-top: 1.33rem;
}

.gap-top-600 {
  margin-top: 1.77rem;
}

.gap-top-700 {
  margin-top: 2.36rem;
}

.gap-top-800 {
  margin-top: 3.15rem;
}

.gap-top-900 {
  margin-top: 4.2rem;
}

.gap-top-major {
  margin-top: 5.6rem;
}

.leading-loose {
  line-height: 1.7;
}

.leading-tight {
  line-height: 1.3;
}

.leading-flat {
  line-height: 1.1;
}

.measure-micro {
  max-width: 10ch;
}

.measure-compact {
  max-width: 30ch;
}

.measure-short {
  max-width: 40ch;
}

.measure-medium {
  max-width: 64ch;
}

.measure-long {
  max-width: 96ch;
}

.text-300 {
  font-size: 0.75rem;
}

.text-400 {
  font-size: 1rem;
}

.text-500 {
  font-size: 1.33rem;
}

.text-600 {
  font-size: 1.77rem;
}

.text-700 {
  font-size: 2.36rem;
}

.text-800 {
  font-size: 3.15rem;
}

.text-900 {
  font-size: 4.2rem;
}

.text-major {
  font-size: 5.6rem;
}

.weight-normal {
  font-weight: 400;
}

.weight-bold {
  font-weight: 900;
}

@media (min-width: 37em) {
  .md\:flow-space-300 {
    --flow-space: 0.75rem;
  }
  .md\:flow-space-400 {
    --flow-space: 1rem;
  }
  .md\:flow-space-500 {
    --flow-space: 1.33rem;
  }
  .md\:flow-space-600 {
    --flow-space: 1.77rem;
  }
  .md\:flow-space-700 {
    --flow-space: 2.36rem;
  }
  .md\:flow-space-800 {
    --flow-space: 3.15rem;
  }
  .md\:flow-space-900 {
    --flow-space: 4.2rem;
  }
  .md\:flow-space-major {
    --flow-space: 5.6rem;
  }
  .md\:gap-top-300 {
    margin-top: 0.75rem;
  }
  .md\:gap-top-400 {
    margin-top: 1rem;
  }
  .md\:gap-top-500 {
    margin-top: 1.33rem;
  }
  .md\:gap-top-600 {
    margin-top: 1.77rem;
  }
  .md\:gap-top-700 {
    margin-top: 2.36rem;
  }
  .md\:gap-top-800 {
    margin-top: 3.15rem;
  }
  .md\:gap-top-900 {
    margin-top: 4.2rem;
  }
  .md\:gap-top-major {
    margin-top: 5.6rem;
  }
  .md\:measure-micro {
    max-width: 10ch;
  }
  .md\:measure-compact {
    max-width: 30ch;
  }
  .md\:measure-short {
    max-width: 40ch;
  }
  .md\:measure-medium {
    max-width: 64ch;
  }
  .md\:measure-long {
    max-width: 96ch;
  }
  .md\:text-300 {
    font-size: 0.75rem;
  }
  .md\:text-400 {
    font-size: 1rem;
  }
  .md\:text-500 {
    font-size: 1.33rem;
  }
  .md\:text-600 {
    font-size: 1.77rem;
  }
  .md\:text-700 {
    font-size: 2.36rem;
  }
  .md\:text-800 {
    font-size: 3.15rem;
  }
  .md\:text-900 {
    font-size: 4.2rem;
  }
  .md\:text-major {
    font-size: 5.6rem;
  }
}
@media (min-width: 62em) {
  .lg\:flow-space-300 {
    --flow-space: 0.75rem;
  }
  .lg\:flow-space-400 {
    --flow-space: 1rem;
  }
  .lg\:flow-space-500 {
    --flow-space: 1.33rem;
  }
  .lg\:flow-space-600 {
    --flow-space: 1.77rem;
  }
  .lg\:flow-space-700 {
    --flow-space: 2.36rem;
  }
  .lg\:flow-space-800 {
    --flow-space: 3.15rem;
  }
  .lg\:flow-space-900 {
    --flow-space: 4.2rem;
  }
  .lg\:flow-space-major {
    --flow-space: 5.6rem;
  }
  .lg\:gap-top-300 {
    margin-top: 0.75rem;
  }
  .lg\:gap-top-400 {
    margin-top: 1rem;
  }
  .lg\:gap-top-500 {
    margin-top: 1.33rem;
  }
  .lg\:gap-top-600 {
    margin-top: 1.77rem;
  }
  .lg\:gap-top-700 {
    margin-top: 2.36rem;
  }
  .lg\:gap-top-800 {
    margin-top: 3.15rem;
  }
  .lg\:gap-top-900 {
    margin-top: 4.2rem;
  }
  .lg\:gap-top-major {
    margin-top: 5.6rem;
  }
  .lg\:measure-micro {
    max-width: 10ch;
  }
  .lg\:measure-compact {
    max-width: 30ch;
  }
  .lg\:measure-short {
    max-width: 40ch;
  }
  .lg\:measure-medium {
    max-width: 64ch;
  }
  .lg\:measure-long {
    max-width: 96ch;
  }
  .lg\:text-300 {
    font-size: 0.75rem;
  }
  .lg\:text-400 {
    font-size: 1rem;
  }
  .lg\:text-500 {
    font-size: 1.33rem;
  }
  .lg\:text-600 {
    font-size: 1.77rem;
  }
  .lg\:text-700 {
    font-size: 2.36rem;
  }
  .lg\:text-800 {
    font-size: 3.15rem;
  }
  .lg\:text-900 {
    font-size: 4.2rem;
  }
  .lg\:text-major {
    font-size: 5.6rem;
  }
}