html {
  font-size: 62.5%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

*, ::before, ::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after {
  animation-duration: auto !important;
  animation-timing-function: ease !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  animation-direction: normal !important;
  animation-fill-mode: none !important;
  animation-play-state: running !important;
  animation-name: none !important;
  animation-timeline: auto !important;
  animation-range-start: normal !important;
  animation-range-end: normal !important;
  transition-behavior: normal !important;
  transition-duration: 0s !important;
  transition-timing-function: ease !important;
  transition-delay: 0s !important;
  transition-property: none !important;
  scroll-behavior: auto !important;
  }
}

body {
  margin: 0px;
  font-family: var(--font-body);
  font-size: var(--text-m);
  line-height: 1.5;
  color: var(--ink);
  background: var(--canvas);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0px;
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.06;
  letter-spacing: -0.025em;
  text-wrap-mode: initial;
  text-wrap-style: balance;
}

p {
  margin: 0px;
}

img, svg, video {
  max-width: 100%;
}

img {
  display: block;
  height: auto;
}

a {
  color: var(--teal-text);
}

:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 3px;
}

.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-l);
  padding-right: var(--space-l);
  max-width: 156rem;
}

.section {
  padding-top: var(--space-4xl);
}

.grid-auto {
  display: grid;
  gap: var(--space-m);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--grid-min, 30rem)), 1fr));
}

.heading-xl {
  font-size: var(--text-4xl);
  line-height: 1.02;
  letter-spacing: -0.03em;
}

.heading-l {
  font-size: var(--text-3xl);
  line-height: 1.06;
  letter-spacing: -0.025em;
}

.heading-m {
  font-size: var(--text-2xl);
  line-height: 1.08;
  letter-spacing: -0.025em;
}

.heading-s {
  font-size: var(--text-l);
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.lead {
  font-size: 1.7rem;
  line-height: 1.6;
  color: var(--ink-muted);
}

.body-muted {
  line-height: 1.6;
  color: var(--ink-muted);
}

.fine-print {
  font-size: 1.3rem;
  line-height: 1.5;
  color: var(--ink-muted);
}

.gradient-text {
  background: linear-gradient(90deg, var(--sun) 0%, #FFE08A 50%, var(--mint) 100%);
  background-clip: text;
  color: transparent;
}

.gradient-text--teal {
  background-image: linear-gradient(90deg, var(--teal) 0%, #0E8F87 100%);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  min-height: 5.2rem;
  padding: 0px 2.6rem;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-stretch: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  cursor: pointer;
  transition-behavior: normal, normal, normal, normal, normal;
  transition-duration: 0.2s, 0.2s, 0.2s, 0.2s, 0.2s;
  transition-timing-function: ease, ease, ease, ease, ease;
  transition-delay: 0s, 0s, 0s, 0s, 0s;
  transition-property: background-color, border-color, color, transform, box-shadow;
}

.btn:hover {
  transform: translateY(-1px);
}

.btn--sun {
  background: var(--sun);
  color: var(--ink);
}

.btn--sun:hover {
  background: var(--sun-l-1);
  color: var(--ink);
  box-shadow: 0 8px 24px -8px var(--sun-60);
}

.btn--outline-light {
  border-color: var(--teal-line);
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  color: var(--surface);
}

.btn--outline-light:hover {
  border-color: var(--teal-pale);
  background: var(--surface-10);
  color: var(--surface);
}

.btn--outline-dark {
  border-color: var(--navy-line);
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  color: var(--surface);
}

.btn--outline-dark:hover {
  border-color: var(--navy-line-strong);
  background: var(--surface-5);
  color: var(--surface);
}

.btn--ink {
  background: var(--ink);
  color: var(--surface);
}

.btn--ink:hover {
  background: var(--ink-l-1);
  color: var(--surface);
}

.btn--sm {
  min-height: 4.4rem;
  padding: 0px 2rem;
  font-size: 1.5rem;
}

.btn--md {
  min-height: 4.8rem;
  padding: 0px 2.2rem;
}

.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  padding: 2.8rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: var(--space-s);
}

.card--ink {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--surface);
  --card-muted: var(--navy-text);
}

.card--sun {
  background: var(--sun);
  border-color: var(--sun);
  color: var(--ink);
}

.card--tight {
  padding: 1.6rem;
}

.panel {
  position: relative;
  isolation: isolate;
  overflow-x: hidden;
  overflow-y: hidden;
  border-top-left-radius: 3.6rem;
  border-top-right-radius: 3.6rem;
  border-bottom-right-radius: 3.6rem;
  border-bottom-left-radius: 3.6rem;
  color: var(--surface);
}

.panel--teal {
  background: var(--teal-deep);
}

.panel--ink {
  background: var(--ink);
}

.pill {
  display: inline-flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  padding: 0.6rem 1.4rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  font-size: 1.4rem;
  line-height: 1.4;
  background: var(--pill-bg, var(--teal-dark));
  color: var(--pill-fg, var(--teal-pale));
}

.tag {
  display: inline-flex;
  align-items: center;
  padding: 0.6rem 1.2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--surface);
  font-size: 1.3rem;
  line-height: 1.4;
}

.icon-tile {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 5.2rem;
  height: 5.2rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
}

@keyframes fx-drift {
  0%, 100% {
    transform: translate(0px, 0px) scale(1);
  }
  50% {
    transform: translate(40px, -30px) scale(1.1);
  }
}

@keyframes fx-spin {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes fx-load-fast {
  0% {
    transform: scaleX(0);
  }
  12% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(1);
  }
}

@keyframes fx-load-mid {
  0% {
    transform: scaleX(0);
  }
  45% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(1);
  }
}

@keyframes fx-load-slow {
  0% {
    transform: scaleX(0);
  }
  85% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(1);
  }
}

@keyframes fx-done {
  0%, 11% {
    opacity: 0;
  }
  15%, 100% {
    opacity: 1;
  }
}

@keyframes fx-needle {
  0% {
    transform: rotate(-85deg);
  }
  14% {
    transform: rotate(74deg);
  }
  20% {
    transform: rotate(60deg);
  }
  26%, 100% {
    transform: rotate(64deg);
  }
}

@keyframes fx-streak {
  0% {
    transform: translateX(-600px);
  }
  100% {
    transform: translateX(2600px);
  }
}

.skip-link {
  position: absolute;
  left: 1.6rem;
  top: -10rem;
  z-index: 100;
  padding: 1rem 1.6rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--sun);
  color: var(--ink);
  font-weight: 600;
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.skip-link:focus {
  top: 1.6rem;
}

.site-header {
  position: absolute;
  top: 2.8rem;
  left: 0px;
  right: 0px;
  z-index: 50;
  padding: 0px 2.8rem;
}

@media (min-width: 768px) {
  .site-header {
  top: 3.6rem;
  padding: 0px 3.6rem;
  }
}

.site-nav {
  margin: 0px auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  padding: 1rem 1rem 1rem 1.8rem;
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  background: color-mix(in srgb, var(--surface) 7%, transparent);
  backdrop-filter: blur(16px);
  border: 1px solid color-mix(in srgb, var(--surface) 14%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--surface) 8%, transparent);
  max-width: 156rem;
}

@media (min-width: 768px) {
  .site-nav {
  row-gap: 1.6rem;
  column-gap: 1.6rem;
  }
}

.brand {
  display: flex;
  align-items: center;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--surface);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  gap: var(--brand-gap, 1.2rem);
  font-size: var(--brand-size, 2.2rem);
}

.brand:hover {
  color: var(--surface);
}

.brand__mark {
  position: relative;
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
  background: linear-gradient(145deg, var(--sun-light) 0%, var(--sun) 45%, var(--sun-deep) 100%);
  color: var(--teal-deep);
  font-weight: 800;
  box-shadow: inset 0 1px 0 var(--surface-60), 0 6px 16px -4px color-mix(in srgb, var(--sun-deep) 65%, transparent);
  transform: rotate(-6deg);
  width: var(--brand-mark, 3.8rem);
  height: var(--brand-mark, 3.8rem);
  font-size: calc(var(--brand-mark, 3.8rem) * 0.6);
}

.brand__letter {
  margin-top: -0.3rem;
}

.brand__bolt {
  position: absolute;
  right: -0.5rem;
  top: -0.5rem;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 1.7rem;
  height: 1.7rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--teal-deep);
  color: var(--sun);
  border: 2px solid var(--teal-dark);
  border-color: var(--brand-bolt-border, var(--teal-dark));
}

.brand__bolt svg {
  width: 0.8rem;
  height: 0.8rem;
}

.brand__accent {
  color: var(--sun);
}

.site-nav__links {
  display: none;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

@media (min-width: 1024px) {
  .site-nav__links {
  display: flex;
  row-gap: 0.4rem;
  column-gap: 2.2rem;
  font-size: 1.5rem;
  font-weight: 500;
  flex-wrap: nowrap;
  }
}

.site-nav__link {
  color: var(--teal-mist);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  transition-behavior: normal;
  transition-duration: 0.2s;
  transition-timing-function: ease;
  transition-delay: 0s;
  transition-property: color;
  display: inline-flex;
  align-items: center;
  min-height: 4.4rem;
  padding: 0px 1.4rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
}

.site-nav__link:hover {
  background: var(--surface-10);
  color: var(--surface);
}

.site-nav__actions {
  display: flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-left: auto;
}

@media (min-width: 1024px) {
  .site-nav__actions {
  margin-left: 0px;
  }
}

.site-nav__cta {
  display: none;
  box-shadow: 0 8px 24px -8px var(--sun-60);
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

@media (min-width: 768px) {
  .site-nav__cta {
  display: inline-flex;
  }
}

.site-nav__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4.4rem;
  height: 4.4rem;
  padding: 0px;
  border: 1px solid var(--surface-30);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: color-mix(in srgb, var(--surface) 8%, transparent);
  color: var(--surface);
  cursor: pointer;
}

@media (min-width: 1024px) {
  .site-nav__toggle {
  display: none;
  }
}

.site-nav__toggle svg {
  width: 2rem;
  height: 2rem;
}

.mobile-menu {
  position: fixed;
  top: 10rem;
  right: 1.6rem;
  bottom: auto;
  left: 1.6rem;
  width: auto;
  max-height: calc(100dvh - 12rem);
  margin: 0px;
  padding: 1.2rem;
  overflow-x: auto;
  overflow-y: auto;
  border: 1px solid var(--surface-10);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  box-shadow: rgba(0, 0, 0, 0.5) 0px 30px 60px -20px;
  background: var(--surface);
  color: var(--ink);
  border-color: var(--ink-5);
}

@media (min-width: 1024px) {
  .mobile-menu {
  display: none;
  }
}

.mobile-menu::backdrop {
  background: color-mix(in srgb, var(--ink) 45%, transparent);
}

.mobile-menu__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.4rem 0.4rem 0.8rem 1.6rem;
  font-size: 1.3rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--teal-pale);
}

.mobile-menu__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4.4rem;
  height: 4.4rem;
  padding: 0px;
  border: 1px solid var(--surface-20);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  color: var(--surface);
  cursor: pointer;
}

.mobile-menu__close svg {
  width: 1.8rem;
  height: 1.8rem;
}

.mobile-menu__cta {
  width: 100%;
  margin-top: 0.8rem;
}

.mobile-menu:popover-open {
  animation-duration: 0.22s;
  animation-timing-function: ease-out;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: fx-menu-in;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

@keyframes fx-menu-in {
  0% {
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

.site-footer {
  padding: var(--space-4xl) 1.6rem 1.6rem;
}

.site-footer__panel {
  margin: 0px auto;
  padding: 3.6rem 2rem 2.8rem;
  background: radial-gradient(800px 420px at 0% 0%, var(--teal-glow-50), transparent 65%), radial-gradient(700px 420px at 100% 60%, color-mix(in srgb, var(--sun) 14%, transparent), transparent 70%), var(--teal-deep);
  max-width: 160rem;
}

@media (min-width: 768px) {
  .site-footer__panel {
  padding: 5.6rem 4rem 2.8rem;
  }
}

.site-footer__top {
  display: flex;
  flex-wrap: wrap;
  row-gap: 4.8rem;
  column-gap: 4.8rem;
}

.site-footer__intro {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 30rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.8rem;
  column-gap: 1.8rem;
  --brand-size: 2.6rem;
  --brand-mark: 4.2rem;
  --brand-gap: 1rem;
  --brand-bolt-border: var(--teal-deep);
}

.site-footer__blurb {
  max-width: 36rem;
  font-size: 1.6rem;
  line-height: 1.6;
  color: var(--teal-pale);
}

.site-footer__contact {
  display: grid;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.contact-card {
  transition-behavior: normal;
  transition-duration: 0.2s;
  transition-timing-function: ease;
  transition-delay: 0s;
  transition-property: background-color;
  display: flex;
  align-items: center;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
  padding: 1.4rem 1.6rem;
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--surface-10);
  border: 1px solid var(--surface-20);
  color: var(--surface);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.contact-card:hover {
  background: var(--teal-dark-l-1);
  color: var(--surface);
}

.contact-card__icon {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  background: var(--sun);
  color: var(--ink);
  width: 4rem;
  height: 4rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
}

.contact-card__icon svg {
  width: 1.6rem;
  height: 1.6rem;
}

.contact-card__title {
  display: block;
  font-weight: 600;
}

.contact-card__sub {
  display: block;
  font-size: 1.4rem;
  color: var(--teal-pale);
}

.chip-row {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.chip {
  display: inline-flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  padding: 1rem 1.4rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--teal-dark);
  font-size: 1.4rem;
  color: var(--teal-pale);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.chip:hover {
  color: var(--surface);
}

.chip svg {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 1.6rem;
  height: 1.6rem;
  color: var(--sun);
}

.footer-nav {
  flex-grow: 999;
  flex-shrink: 1;
  flex-basis: 56rem;
  min-width: 0px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  row-gap: 3.2rem;
  column-gap: 3.2rem;
  font-size: 1.5rem;
}

.footer-nav__title {
  margin: 0px 0px 1.4rem;
  font-family: var(--font-body);
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0px;
  color: var(--sun);
}

.footer-nav__list {
  display: flex;
  flex-direction: column;
  row-gap: 0.2rem;
  column-gap: 0.2rem;
  color: var(--teal-mist);
}

@media (min-width: 768px) {
  .footer-nav__list {
  row-gap: 1rem;
  column-gap: 1rem;
  }
}

.footer-nav__link {
  display: block;
  padding: 0.8rem 0px;
  color: var(--teal-mist);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

@media (min-width: 768px) {
  .footer-nav__link {
  padding: 0px;
  }
}

.footer-nav__link:hover {
  color: var(--sun);
}

@media (hover: hover) and (pointer: fine) {
  .footer-nav__link:hover {
  translate: 0.3rem;
  }
}

.footer-perks {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr));
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  margin-top: 4.8rem;
}

.perk {
  padding: 2rem;
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: var(--teal-dark);
}

.perk--sun {
  background: var(--sun);
  color: var(--ink);
}

.perk__title {
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.2;
  color: inherit;
}

.perk__text {
  margin-top: 0.4rem;
  font-size: 1.4rem;
  line-height: 1.5;
  color: var(--teal-pale);
}

.perk--sun .perk__text {
  color: var(--ink);
}

.footer-wordmark {
  margin: 4rem -2rem 0px;
  line-height: 0;
}

@media (min-width: 768px) {
  .footer-wordmark {
  margin: 4rem -4rem 0px;
  }
}

.footer-wordmark svg {
  display: block;
  width: 100%;
  height: auto;
}

.footer-legal {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
  margin-top: 1.2rem;
  font-size: 1.4rem;
  color: var(--teal-pale);
}

@media (min-width: 768px) {
  .footer-legal {
  margin-top: -5.8rem;
  }
}

.footer-legal__links {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0px;
  column-gap: 2rem;
}

.footer-legal__link {
  display: block;
  padding: 0.8rem 0px;
  color: var(--teal-mist);
}

@media (min-width: 768px) {
  .footer-legal__link {
  padding: 0px;
  }
}

.footer-legal__link:hover {
  color: var(--surface);
}

.footer-legal__link--top {
  color: var(--sun);
}

.home {
  position: relative;
  overflow-x: hidden;
  overflow-y: hidden;
  background: radial-gradient(700px 500px at 100% 50%, color-mix(in srgb, var(--sun) 20%, transparent), transparent 70%) 0 600px / 100% 1000px no-repeat, radial-gradient(760px 560px at 0% 50%, color-mix(in srgb, var(--teal) 13%, transparent), transparent 70%) 0 1240px / 100% 1120px no-repeat, radial-gradient(760px 560px at 100% 50%, color-mix(in srgb, var(--teal) 10%, transparent), transparent 70%) 0 2140px / 100% 1120px no-repeat, radial-gradient(800px 560px at 0% 50%, color-mix(in srgb, var(--sun) 18%, transparent), transparent 70%) 0 3040px / 100% 1120px no-repeat, radial-gradient(800px 600px at 80% 50%, color-mix(in srgb, var(--teal) 12%, transparent), transparent 70%) 0 4000px / 100% 1200px no-repeat;
}

.hero {
  padding: var(--space-s);
}

.hero__panel {
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  row-gap: 3.2rem;
  column-gap: 3.2rem;
  padding: 11rem 2rem 8.8rem;
  max-width: 160rem;
  background: radial-gradient(circle at calc(100% - 23rem) 21rem, transparent 40.95rem, color-mix(in srgb, var(--teal-pale) 14%, transparent) 41rem 41.1rem, color-mix(in srgb, var(--teal-pale) 7.6%, transparent) 41.15rem 50rem, color-mix(in srgb, var(--teal-pale) 4.3%, transparent) 50rem 59rem, color-mix(in srgb, var(--teal-pale) 1.8%, transparent) 59rem 68rem, transparent 68rem), radial-gradient(700px 500px at 0% 0%, color-mix(in srgb, var(--teal-glow) 55%, transparent), transparent 65%) 0 0 / 700px 500px no-repeat, radial-gradient(600px 420px at 100% 100%, color-mix(in srgb, var(--sun) 22%, transparent), transparent 70%) right bottom / 600px 420px no-repeat, var(--teal-deep);
}

@media (min-width: 768px) {
  .hero__panel {
  min-height: 86rem;
  padding: 11.8rem 4.8rem 8.8rem;
  }
}

.hero__sweep {
  position: absolute;
  right: -4rem;
  top: -4rem;
  z-index: -1;
  width: 54rem;
  height: 54rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: conic-gradient(from 90deg, transparent 0 70%, color-mix(in srgb, var(--sun) 50%, transparent) 88%, transparent 100%);
  mask-image: radial-gradient(circle, transparent 69%, rgb(0, 0, 0) 70%, rgb(0, 0, 0) 71%, transparent 72%);
  animation-duration: 14s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: fx-spin;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
  pointer-events: none;
}

.hero__glow {
  position: absolute;
  z-index: -1;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  animation-duration: 18s;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: fx-drift;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
  pointer-events: none;
  right: calc(12% - 13rem);
  bottom: -7rem;
  width: 64rem;
  height: 64rem;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--sun) 32%, transparent), color-mix(in srgb, var(--sun) 12%, transparent) 55%, transparent);
}

.hero__body {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 4.8rem;
  column-gap: 4.8rem;
}

.hero__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 44rem;
  min-width: 0px;
}

.hero__title {
  margin-top: 2.2rem;
}

.hero__lead {
  max-width: 50rem;
  margin-top: 2.2rem;
  font-size: 1.8rem;
  line-height: 1.6;
  color: var(--teal-pale);
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  margin-top: 3.2rem;
}

.hero__trust {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 2.4rem;
  margin-top: 4rem;
  font-size: 1.4rem;
  color: var(--teal-pale);
}

.hero__visual {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 46rem;
  min-width: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.orbit {
  position: relative;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 46rem;
  height: 46rem;
  margin: -8.7rem;
  transform: scale(0.62);
  border: 1.5px dashed color-mix(in srgb, var(--sun) 50%, transparent);
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: radial-gradient(circle, transparent 14.75rem, color-mix(in srgb, var(--teal-pale) 18%, transparent) 14.8rem 14.9rem, transparent 14.95rem),
    radial-gradient(circle 15rem, color-mix(in srgb, var(--sun) 50%, transparent), color-mix(in srgb, var(--sun) 18%, transparent) 50%, transparent),
    radial-gradient(circle 20.93rem, color-mix(in srgb, var(--sun) 22%, transparent), transparent 70%);
}

@media (min-width: 768px) {
  .orbit {
  margin: 0px;
  transform: none;
  }
}

.orbit__track {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  animation-duration: 36s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: fx-spin;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.orbit-chip {
  position: absolute;
  display: inline-flex;
  align-items: center;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  padding: 1rem 1.6rem;
  border: 1px solid var(--chip-border, color-mix(in srgb, var(--surface) 25%, transparent));
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--chip-bg, color-mix(in srgb, var(--surface) 12%, transparent));
  color: var(--chip-fg, var(--surface));
  font-size: var(--chip-size, 1.3rem);
  font-weight: var(--chip-weight, 600);
  line-height: 1.2;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  box-shadow: var(--chip-shadow, 0 10px 24px rgba(0, 0, 0, 0.2));
  transform: translate(-50%, -50%);
  animation-duration: 36s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: fx-chip-spin;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.orbit-chip__icon {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 1.2rem;
  height: 1.2rem;
}

.hero-mark {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 20rem;
  height: 20rem;
  margin: -10rem 0px 0px -10rem;
  border-top-left-radius: 5.6rem;
  border-top-right-radius: 5.6rem;
  border-bottom-right-radius: 5.6rem;
  border-bottom-left-radius: 5.6rem;
  background: radial-gradient(5.8rem 3.4rem at 6.4rem 3.4rem, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.2) 55%, transparent),
    linear-gradient(145deg, var(--sun-light) 0%, var(--sun) 45%, var(--sun-deep) 100%);
  box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.65), inset 0 -12px 26px rgba(180, 110, 0, 0.35), 0 30px 60px -12px rgba(0, 0, 0, 0.5), 0 0 90px color-mix(in srgb, var(--sun) 45%, transparent);
  transform: rotate(-6deg);
  animation-duration: 6s;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: fx-float-tilt;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.hero-mark__letter {
  position: relative;
  margin-top: -1.4rem;
  font-family: var(--font-display);
  font-size: 13.4rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.05em;
  color: var(--teal-deep);
}

.hero-mark__bolt {
  position: absolute;
  right: -1.4rem;
  top: -1.4rem;
  box-sizing: border-box;
  width: 5.6rem;
  height: 5.6rem;
  max-width: none;
  padding: 1.4rem;
  border: 4px solid var(--teal-dark);
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--teal-deep);
  color: var(--sun);
  box-shadow: rgba(0, 0, 0, 0.3) 0px 8px 18px;
}

.pill__label {
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.pill__dot {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 0.8rem;
  height: 0.8rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--pill-dot, var(--sun));
}

body[data-instatic-iframe-interaction="canvas"] *, body[data-instatic-iframe-interaction="canvas"] ::before, body[data-instatic-iframe-interaction="canvas"] ::after {
  animation-duration: auto !important;
  animation-timing-function: ease !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  animation-direction: normal !important;
  animation-fill-mode: none !important;
  animation-play-state: running !important;
  animation-name: none !important;
  animation-timeline: auto !important;
  animation-range-start: normal !important;
  animation-range-end: normal !important;
  transition-behavior: normal !important;
  transition-duration: 0s !important;
  transition-timing-function: ease !important;
  transition-delay: 0s !important;
  transition-property: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.section-head {
  display: flex;
  flex-direction: column;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
}

.section-head--center {
  align-items: center;
  text-align: center;
}

.section-head--split {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  row-gap: 2.4rem;
  column-gap: 2.4rem;
}

.section-head__title {
  max-width: 56rem;
}

.section-head__intro {
  max-width: 54rem;
}

.section-head__aside {
  max-width: 42rem;
}

.services__grid {
  --grid-min: 30rem;
  margin-top: 4.4rem;
}

.service-card {
  --card-muted: var(--ink-muted);
}

.service-card--ink {
  --card-muted: var(--navy-text);
  --card-accent: var(--sun);
  background: var(--ink);
  border-color: var(--ink);
  color: var(--surface);
}

.service-card__title {
  margin-top: 2.2rem;
  font-size: 2.4rem;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.service-card__text {
  margin-top: 1rem;
  line-height: 1.6;
  color: var(--card-muted);
}

.service-card__price {
  margin-top: 1.8rem;
  font-weight: 600;
  color: var(--card-accent, inherit);
}

.icon-tile--teal {
  background: var(--teal-mist);
  color: var(--teal-text);
}

.icon-tile--sun-soft {
  background: var(--sun-wash);
  color: var(--sun-text);
}

.icon-tile--sun {
  background: var(--sun);
  color: var(--ink);
}

.apps__grid {
  --grid-min: 26rem;
  margin-top: 4rem;
}

.feature-card__body {
  padding: 1.6rem 0.8rem 0.8rem;
}

.feature-card__title {
  font-family: var(--font-body);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0px;
}

.feature-card__text {
  margin-top: 0.6rem;
  font-size: 1.5rem;
  line-height: 1.55;
  color: var(--ink-muted);
}

.choice {
  padding: 3.6rem 2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 3.2rem;
  border-top-right-radius: 3.2rem;
  border-bottom-right-radius: 3.2rem;
  border-bottom-left-radius: 3.2rem;
  background: var(--surface);
}

@media (min-width: 768px) {
  .choice {
  padding: 4.8rem 4rem;
  }
}

.choice__grid {
  --grid-min: 30rem;
  row-gap: 2rem;
  column-gap: 2rem;
  margin-top: 3.6rem;
}

.choice-card {
  --choice-line: var(--line);
  display: flex;
  flex-direction: column;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
  padding: 2.8rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
}

.choice-card--featured {
  --choice-line: #C9DCDA;
  --badge-bg: var(--sun);
  --badge-fg: var(--ink);
  border: 2px solid var(--teal-deep);
  background: var(--teal-wash);
}

.choice-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.choice-card__name {
  font-size: 2.6rem;
  letter-spacing: -0.01em;
}

.choice-badge {
  padding: 0.5rem 1.2rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--badge-bg, var(--mist));
  color: var(--badge-fg, #33424F);
  font-size: 1.3rem;
  font-weight: 600;
}

.check-list {
  display: grid;
  row-gap: 1rem;
  column-gap: 1rem;
  font-size: 1.5rem;
}

.check-item {
  display: flex;
  row-gap: 1rem;
  column-gap: 1rem;
}

.check-item__icon {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  display: flex;
  color: var(--teal);
}

.choice-card__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-top: auto;
  padding-top: 1.4rem;
  border-top: 1px solid var(--choice-line);
}

.choice-card__price {
  font-weight: 600;
}

.text-link {
  font-weight: 600;
  color: var(--teal-text);
}

.feature-card {
  position: relative;
}

[data-inview] {
  --play: running;
}

.speed__inner {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 5.6rem;
  column-gap: 5.6rem;
}

.speed-fx {
  position: absolute;
  top: -8rem;
  bottom: -6rem;
  left: -42rem;
  right: -42rem;
  z-index: -1;
  overflow-x: hidden;
  overflow-y: hidden;
  pointer-events: none;
}

.speed-fx__grid {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  background-image: repeating-linear-gradient(180deg, color-mix(in srgb, var(--teal) 7%, transparent) 0 1px, transparent 1px 30px);
  mask-image: radial-gradient(45% 55% at 62% 50%, rgb(0, 0, 0), transparent 75%);
}

.speed-fx__glow {
  position: absolute;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
}

.speed-fx__glow--sun {
  left: calc(58% - 13rem);
  top: calc(18% - 13rem);
  width: 72rem;
  height: 72rem;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--sun) 30%, transparent), color-mix(in srgb, var(--sun) 10%, transparent) 55%, transparent);
}

.speed-fx__glow--teal {
  left: calc(22% - 14rem);
  top: calc(40% - 14rem);
  width: 70rem;
  height: 70rem;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--teal) 14%, transparent), color-mix(in srgb, var(--teal) 5%, transparent) 55%, transparent);
}

.speed-fx__bolt {
  position: absolute;
  left: 60%;
  top: 2%;
  width: 56rem;
  height: 56rem;
  color: var(--teal);
  opacity: 0.08;
}

.speed-fx__bolt svg {
  width: 100%;
  height: 100%;
}

.speed-fx__streak {
  position: absolute;
  left: 0px;
  top: var(--top, 50%);
  width: var(--w, 40rem);
  height: var(--h, 2px);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  background: linear-gradient(90deg, transparent, var(--c, var(--teal-50)), transparent);
  animation: fx-streak var(--dur, 3.4s) linear var(--delay, 0s) infinite;
  animation-play-state: var(--play, paused);
}

.speed__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 38rem;
  min-width: 0px;
  display: flex;
  flex-direction: column;
  row-gap: 2rem;
  column-gap: 2rem;
}

.speed-badge {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  padding: 0.6rem 1.4rem 0.6rem 0.6rem;
  border: 1px solid var(--line);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--surface);
  font-size: 1.3rem;
  font-weight: 600;
}

.speed-badge__icon {
  display: grid;
  align-items: center;
  justify-items: center;
  width: 2.4rem;
  height: 2.4rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--sun);
  color: var(--ink);
}

.speed__title {
  font-size: var(--text-3xl);
  line-height: 1.02;
  letter-spacing: -0.03em;
}

.bolt-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  row-gap: 1.2rem;
  column-gap: 2rem;
  font-size: 1.5rem;
  font-weight: 500;
}

.bolt-item {
  display: flex;
  align-items: center;
  row-gap: 1rem;
  column-gap: 1rem;
}

.bolt-item__icon {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 2.6rem;
  height: 2.6rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--sun);
  color: var(--ink);
}

.speed__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  row-gap: 0.6rem;
  column-gap: 1.4rem;
  padding-top: 1.8rem;
  border-top: 1px solid var(--line);
  font-size: 1.5rem;
  color: var(--ink-muted);
}

.speed__price-value {
  font-family: var(--font-display);
  font-size: 3.4rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.1;
}

.speed__visual {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 48rem;
  min-width: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 3.2rem;
  column-gap: 3.2rem;
}

.gauge {
  position: relative;
  width: 30rem;
  height: 15.8rem;
}

.gauge__arc {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  border-top-left-radius: 300px;
  border-top-right-radius: 300px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  background: conic-gradient(from 270deg at 50% 100%, #D5E7E5 0deg, var(--mint) 85deg, var(--sun) 140deg, var(--sun-deep) 180deg, transparent 180deg);
  mask-image: radial-gradient(circle at 50% 100%, transparent 112px, rgb(0, 0, 0) 113px);
}

.gauge__ticks {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  border-top-left-radius: 300px;
  border-top-right-radius: 300px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  background: repeating-conic-gradient(from 270deg at 50% 100%, color-mix(in srgb, var(--ink) 35%, transparent) 0deg 1.2deg, transparent 1.2deg 9deg);
  mask-image: radial-gradient(circle at 50% 100%, transparent 96px, rgb(0, 0, 0) 97px, rgb(0, 0, 0) 106px, transparent 107px);
}

.gauge__needle {
  position: absolute;
  left: 50%;
  bottom: 0px;
  width: 5px;
  height: 12.8rem;
  margin-left: -2.5px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  background: var(--ink);
  transform-origin: 50% 100%;
  transform: rotate(64deg);
  animation-duration: 6s;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: var(--play, paused);
  animation-name: fx-needle;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.gauge__hub {
  position: absolute;
  left: 50%;
  bottom: -1.1rem;
  width: 2.2rem;
  height: 2.2rem;
  margin-left: -1.1rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--ink);
  box-shadow: 0 0 0 5px var(--canvas);
}

.gauge__label {
  position: absolute;
  bottom: -2.6rem;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--ink-muted);
}

.gauge__label--slow {
  left: -0.6rem;
}

.gauge__label--fast {
  right: -0.6rem;
  font-weight: 700;
  color: var(--teal);
}

.gauge-caption {
  margin-top: 1.8rem;
  text-align: center;
}

.gauge-caption__small {
  font-size: 1.3rem;
  color: var(--ink-muted);
}

.gauge-caption__big {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: 600;
  line-height: 1.2;
}

.gauge-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
}

.loads {
  width: 100%;
}

.loads__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 0.6rem;
  column-gap: 1.2rem;
  font-size: 1.3rem;
  color: var(--ink-muted);
}

.loads__title {
  font-weight: 600;
  color: var(--ink);
}

.loads__list {
  display: flex;
  flex-direction: column;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
  margin-top: 1.6rem;
}

.load__meta {
  display: flex;
  justify-content: space-between;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-bottom: 0.6rem;
  font-size: 1.3rem;
}

.load__name {
  font-weight: 600;
}

.load__name--fast {
  font-weight: 700;
  color: var(--teal);
}

.load__note {
  color: var(--ink-muted);
}

.load__track {
  position: relative;
  height: 2.8rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(230, 236, 239);
  overflow-x: hidden;
  overflow-y: hidden;
}

.load__track--fast {
  box-shadow: 0 0 0 2px var(--sun-50);
}

.load__fill {
  display: flex;
  row-gap: 2px;
  column-gap: 2px;
  width: var(--fill, 100%);
  height: 100%;
  transform-origin: left center;
  animation-duration: 6s;
  animation-timing-function: ease-in-out;
  animation-delay: 0.4s;
  animation-iteration-count: 1;
  animation-fill-mode: both;
  animation-play-state: var(--play, paused);
}

.load__fill--slow {
  animation-name: fx-load-slow;
}

.load__fill--mid {
  animation-name: fx-load-mid;
}

.load__fill--fast {
  animation-name: fx-load-fast;
}

.load__seg {
  flex: var(--f, 1);
  display: flex;
  align-items: center;
  padding: 0px 0.3rem;
  overflow-x: hidden;
  overflow-y: hidden;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  background: var(--seg, #D5E7E5);
  color: var(--teal-deep);
  font-size: 0.9rem;
  font-weight: 600;
}

@media (min-width: 768px) {
  .load__seg {
  padding: 0px 0.8rem;
  font-size: 1.1rem;
  }
}

.load__seg--sun {
  --seg: var(--sun);
  color: var(--ink);
  font-weight: 700;
}

.load__done {
  position: absolute;
  left: calc(24% + 1rem);
  top: 50%;
  display: inline-flex;
  align-items: center;
  row-gap: 0.4rem;
  column-gap: 0.4rem;
  height: 1.8rem;
  margin-top: -0.9rem;
  color: var(--teal);
  font-size: 1.2rem;
  font-weight: 700;
  animation-duration: 6s;
  animation-timing-function: ease-in-out;
  animation-delay: 0.4s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: both;
  animation-play-state: var(--play, paused);
  animation-name: fx-done;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.loads__note {
  margin-top: 1.4rem;
  font-size: 1.2rem;
  line-height: 1.5;
  color: var(--ink-muted);
}

[hidden] {
  display: none !important;
}

.planner {
  display: flex;
  flex-wrap: wrap;
  row-gap: 3.2rem;
  column-gap: 3.2rem;
  padding: 3.6rem 2rem;
  background: radial-gradient(600px 400px at 0% 0%, color-mix(in srgb, var(--teal) 45%, transparent), transparent 70%), radial-gradient(500px 400px at 100% 100%, color-mix(in srgb, var(--sun) 18%, transparent), transparent 70%), var(--ink);
  box-shadow: 0 40px 90px -40px color-mix(in srgb, var(--ink) 70%, transparent);
}

@media (min-width: 768px) {
  .planner {
  padding: 4.8rem 4rem;
  }
}

.planner__main {
  flex-grow: 999;
  flex-shrink: 1;
  flex-basis: 56rem;
  min-width: 0px;
  display: flex;
  flex-direction: column;
  row-gap: 2.2rem;
  column-gap: 2.2rem;
}

.planner__intro {
  --pill-bg: var(--navy-chip);
  --pill-fg: var(--navy-text);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
}

.planner-steps {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.planner-step {
  --step-bg: transparent;
  --step-border: var(--navy-line);
  --step-fg: var(--navy-text);
  display: inline-flex;
  align-items: center;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  min-height: 4rem;
  padding: 0px 1.4rem;
  border: 1px solid var(--step-border);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--step-bg);
  color: var(--step-fg);
  font-size: 1.4rem;
}

:is(.planner-step)[data-state="current"] {
  --step-bg: var(--sun);
  --step-border: var(--sun);
  --step-fg: var(--ink);
  font-weight: 600;
}

:is(.planner-step)[data-state="done"] {
  --step-bg: var(--teal-deep);
  --step-border: var(--teal-deep);
  --step-fg: var(--teal-pale);
}

.planner__options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
}

.planner__times {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
}

.planner-option {
  --opt-bg: var(--navy-raised);
  --opt-border: var(--navy-line);
  --opt-fg: var(--surface);
  --opt-muted: var(--navy-text);
  --opt-price: var(--sun);
  --opt-check-bg: transparent;
  --opt-check-border: var(--navy-line-strong);
  --opt-check-icon: transparent;
  --opt-badge-bg: var(--sun);
  --opt-badge-fg: var(--ink);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  width: 100%;
  min-height: 12.8rem;
  padding: 1.8rem;
  border: 2px solid var(--opt-border);
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--opt-bg);
  color: var(--opt-fg);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  text-align: left;
  cursor: pointer;
}

:is(.planner-option):hover {
  --opt-border: var(--navy-line-strong);
}

:is(.planner-option)[aria-pressed="true"] {
  --opt-bg: var(--surface);
  --opt-border: var(--sun);
  --opt-fg: var(--ink);
  --opt-muted: var(--ink-muted);
  --opt-price: var(--teal-text);
  --opt-check-bg: var(--sun);
  --opt-check-border: var(--sun);
  --opt-check-icon: var(--ink);
  --opt-badge-bg: var(--teal-deep);
  --opt-badge-fg: var(--sun);
}

.planner-option__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  width: 100%;
}

.planner-option__title {
  font-size: 1.7rem;
  font-weight: 600;
}

.planner-option__check {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 2.4rem;
  height: 2.4rem;
  border: 1.5px solid var(--opt-check-border);
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--opt-check-bg);
  color: var(--opt-check-icon);
}

.planner-option__desc {
  font-size: 1.4rem;
  line-height: 1.45;
  color: var(--opt-muted);
}

.planner-option__foot {
  display: flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-top: auto;
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--opt-price);
}

.planner-option__badge {
  padding: 0.2rem 0.8rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--opt-badge-bg);
  color: var(--opt-badge-fg);
  font-size: 1.1rem;
}

.planner-time {
  --time-bg: var(--navy-raised);
  --time-border: var(--navy-line);
  --time-fg: var(--surface);
  --time-sub: var(--navy-text);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 0.4rem;
  column-gap: 0.4rem;
  width: 100%;
  min-height: 11rem;
  padding: 1.8rem;
  border: 2px solid var(--time-border);
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--time-bg);
  color: var(--time-fg);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  text-align: left;
  cursor: pointer;
}

:is(.planner-time):hover {
  --time-border: var(--navy-line-strong);
}

:is(.planner-time)[aria-pressed="true"] {
  --time-bg: var(--sun);
  --time-border: var(--sun);
  --time-fg: var(--ink);
  --time-sub: var(--ink);
}

.planner-time__title {
  font-family: var(--font-display);
  font-size: 2.4rem;
  font-weight: 600;
}

.planner-time__sub {
  font-size: 1.4rem;
  color: var(--time-sub);
}

.planner-review {
  display: flex;
  flex-direction: column;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
}

.planner-summary {
  padding: 1.8rem;
  border: 1px dashed var(--navy-line-strong);
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--navy-raised);
  line-height: 1.6;
}

.planner-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
}

.field {
  display: flex;
  flex-direction: column;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  font-size: 1.4rem;
  color: var(--navy-text);
}

.field__input {
  min-height: 4.8rem;
  padding: 0px 1.6rem;
  border: 1px solid var(--navy-line);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--navy-raised);
  color: var(--surface);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
}

.planner-sent {
  padding: 1.4rem 1.8rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: var(--teal-deep);
  font-weight: 600;
}

.planner__nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  margin-top: auto;
}

.planner__hint {
  font-size: 1.4rem;
  color: var(--navy-text);
}

.planner__next {
  margin-left: auto;
  min-height: 5rem;
}

.planner__back {
  min-height: 5rem;
  padding: 0px 2.2rem;
}

.planner__aside {
  flex-grow: 1;
  flex-shrink: 1;
  display: flex;
  justify-content: center;
  flex-basis: 40rem;
}

.phone {
  display: flex;
  flex-direction: column;
  column-gap: 1rem;
  width: 100%;
  border: 8px solid var(--navy-chip);
  border-top-left-radius: 4rem;
  border-top-right-radius: 4rem;
  border-bottom-right-radius: 4rem;
  border-bottom-left-radius: 4rem;
  background: var(--canvas);
  color: var(--ink);
  max-width: none;
  padding: 1.6rem;
  row-gap: 1.2rem;
}

.phone__head {
  padding: 2.4rem 2rem 0.4rem;
}

.phone__kicker {
  font-size: 1.2rem;
  color: var(--ink-muted);
}

.phone__title {
  font-family: var(--font-display);
  font-size: 1.8rem;
  font-weight: 600;
}

.phone__estimate {
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  background: var(--teal-deep);
  color: var(--surface);
  padding: 2.8rem;
}

.phone__price {
  font-family: var(--font-display);
  font-size: 4.8rem;
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--sun);
}

.phone__monthly {
  margin-top: 0.6rem;
  font-size: 1.4rem;
  color: var(--teal-pale);
}

.phone__chips {
  display: flex;
  flex-direction: column;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
}

.phone__chip {
  display: block;
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
  background: var(--surface);
  font-size: 1.4rem;
  font-weight: 500;
  padding: 1.6rem 2rem;
}

.phone__row {
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
  background: var(--surface);
  font-size: 1.4rem;
  padding: 1.6rem 2rem;
}

.phone__row-label {
  color: var(--ink-muted);
}

.phone__note {
  margin-top: 0.4rem;
  font-size: 1.2rem;
  line-height: 1.5;
  color: var(--ink-muted);
  padding: 0px 2rem 2rem;
}

.case {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 4rem;
  column-gap: 4rem;
}

.case__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 38rem;
  min-width: 0px;
}

.case__kicker {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--teal-text);
}

.case__title {
  margin-top: 1rem;
}

.case__lead {
  margin-top: 1.8rem;
}

.case__tags {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-top: 2rem;
}

.case__cta {
  margin-top: 2.8rem;
}

.case__media {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 52rem;
  min-width: 0px;
  padding: 3.2rem 3.2rem 0px;
  border-top-left-radius: 3.2rem;
  border-top-right-radius: 3.2rem;
  border-bottom-right-radius: 3.2rem;
  border-bottom-left-radius: 3.2rem;
  background: var(--teal-deep);
  overflow-x: hidden;
  overflow-y: hidden;
}

.case__image {
  width: 100%;
  height: 38rem;
  object-fit: cover;
  object-position: center top;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
}

.stats {
  --grid-min: 22rem;
}

.stat-card {
  --stat-label: var(--ink-muted);
  padding: 2.8rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  background: var(--surface);
}

.stat-card--sun {
  --stat-label: var(--ink);
  border-color: var(--sun);
  background: var(--sun);
}

.stat-card--ink {
  --stat-value: var(--sun);
  --stat-label: var(--navy-text);
  border-color: var(--ink);
  background: var(--ink);
  color: var(--surface);
}

.stat__value {
  font-family: var(--font-display);
  font-size: 5.2rem;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--stat-value, inherit);
}

.stat__label {
  margin-top: 0.4rem;
  color: var(--stat-label);
}

.cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 3.2rem;
  column-gap: 3.2rem;
  padding: 3.6rem 2rem;
  background: radial-gradient(520px 320px at 100% 0%, color-mix(in srgb, var(--sun) 30%, transparent), transparent 70%), radial-gradient(520px 360px at 0% 100%, color-mix(in srgb, var(--teal-glow) 55%, transparent), transparent 70%), var(--teal-deep);
}

@media (min-width: 768px) {
  .cta {
  padding: 5.6rem 4.8rem;
  }
}

.cta__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 42rem;
  min-width: 0px;
}

.cta__text {
  max-width: 46rem;
  margin-top: 1.4rem;
  font-size: 1.7rem;
  line-height: 1.6;
  color: var(--teal-pale);
}

.cta__actions {
  display: flex;
  flex-wrap: wrap;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
}

body[data-instatic-iframe-interaction="canvas"] > :is(.speed-fx) {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  height: 70rem;
}

* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

#__bundler_loading {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-style: normal;
  font-variant-caps: normal;
  font-variant-ligatures: normal;
  font-variant-numeric: normal;
  font-variant-east-asian: normal;
  font-variant-alternates: normal;
  font-size-adjust: none;
  font-language-override: normal;
  font-kerning: auto;
  font-optical-sizing: auto;
  font-feature-settings: normal;
  font-variation-settings: normal;
  font-variant-position: normal;
  font-variant-emoji: normal;
  font-weight: normal;
  font-stretch: normal;
  font-size: 13px;
  line-height: 1.4;
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  color: rgb(102, 102, 102);
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(255, 255, 255);
  padding: 8px 14px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 4px;
  z-index: 10000;
}

#__bundler_thumbnail {
  position: fixed;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(250, 249, 245);
  z-index: 9999;
}

#__bundler_thumbnail svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#__bundler_placeholder {
  color: rgb(153, 153, 153);
  font-size: 14px;
}

@media (max-width: 720px) {
  .m-hide {
  display: none !important;
  }
}

.orbit-chip--featured {
  --chip-bg: var(--sun);
  --chip-border: var(--sun);
  --chip-fg: var(--ink);
  --chip-size: 1.4rem;
  --chip-weight: 700;
  --chip-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}

.orbit-chip--top {
  left: 50%;
  top: 0%;
}

.orbit-chip--right {
  left: 97.55%;
  top: 34.55%;
}

.orbit-chip--bottom-right {
  left: 79.39%;
  top: 90.45%;
}

.orbit-chip--bottom-left {
  left: 20.61%;
  top: 90.45%;
}

.orbit-chip--left {
  left: 2.45%;
  top: 34.55%;
}

@keyframes fx-chip-spin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}

@keyframes fx-float-tilt {
  0%, 100% {
    transform: translateY(0px) rotate(-6deg);
  }
  50% {
    transform: translateY(-12px) rotate(-6deg);
  }
}

body[data-instatic-iframe-interaction="canvas"] * > :is(.speed-fx) {
  display: none;
}

body[data-instatic-iframe-interaction="canvas"] :is(.hero__sweep, .hero__glow, .gauge__ticks) {
  display: none !important;
}

body[data-instatic-iframe-interaction="canvas"] :is(.home, .hero__panel, .orbit, .planner, .cta, .site-footer__panel) {
  background-image: none !important;
}

body[data-instatic-iframe-interaction="canvas"] :is(.hero-mark, .brand__mark) {
  background-image: none !important;
  background-color: var(--sun) !important;
}

body[data-instatic-iframe-interaction="canvas"] :is(.gauge__arc) {
  mask-image: none !important;
  background-image: none !important;
  background-position-x: initial !important;
  background-position-y: initial !important;
  background-size: initial !important;
  background-repeat: initial !important;
  background-attachment: initial !important;
  background-origin: initial !important;
  background-clip: initial !important;
  background-color: initial !important;
  border: 1.2rem solid var(--sun) !important;
  border-bottom-width: 0px !important;
  border-bottom-style: none !important;
  border-bottom-color: currentcolor !important;
}

.contact-title {
  font-size: var(--text-3xl);
}

.contact-card__text {
  display: grid;
}

.contact-card__icon--teal {
  background: var(--teal-dark);
  color: var(--sun);
}

.contact-cards {
  display: grid;
  row-gap: 1rem;
  column-gap: 1rem;
  max-width: 46rem;
  margin-top: 2.4rem;
}

.cf-input {
  min-height: 5rem;
  padding: 0px 1.6rem;
  border: 1px solid var(--line-d-1);
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
  background: var(--canvas);
  color: var(--ink);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  font-weight: 400;
}

.cf-field {
  display: flex;
  flex-direction: column;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  font-size: 1.4rem;
  font-weight: 600;
}

.cf-row {
  display: grid;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
}

.cf-group__label {
  font-size: 1.4rem;
  font-weight: 600;
}

.cf-chip {
  display: inline-flex;
  align-items: center;
  min-height: 4.4rem;
  padding: 0px 1.6rem;
  border: 1px solid var(--line-d-1);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--surface);
  font-size: 1.4rem;
  font-weight: 500;
  cursor: pointer;
}

.cf-chip__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0px;
  opacity: 0;
  pointer-events: none;
}

.cf-chips {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-top: 0.8rem;
}

.cf-group--need {
  --chip-on-bg: var(--teal-deep);
  --chip-on-fg: var(--surface);
}

.cf-group--budget {
  --chip-on-bg: var(--sun);
  --chip-on-fg: var(--ink);
}

.cf-input--area {
  min-height: 12rem;
  padding: 1.4rem 1.6rem;
  line-height: 1.55;
  resize: vertical;
}

.cf-foot__link {
  display: inline-flex;
  align-items: center;
  min-height: 4.4rem;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--teal-text);
}

.cf-submit {
  min-height: 5.2rem;
}

.cf-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
}

.contact-form__form {
  display: flex;
  flex-direction: column;
  row-gap: 1.8rem;
  column-gap: 1.8rem;
  margin-top: 1.8rem;
}

.contact-form {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 52rem;
  min-width: 0px;
  padding: 2.2rem;
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 40px 80px -30px color-mix(in srgb, var(--ink) 45%, transparent);
}

@media (min-width: 768px) {
  .contact-form {
  padding: 3.6rem;
  }
}

.contact-hero {
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  row-gap: 3.2rem;
  column-gap: 3.2rem;
  max-width: 160rem;
  padding: 11rem 2rem 4rem;
  background: radial-gradient(76rem 76rem at -20rem 100%, transparent 37.9rem, color-mix(in srgb, var(--teal-pale) 14%, transparent) 38rem 38.1rem, color-mix(in srgb, var(--teal-pale) 5%, transparent) 38.15rem 47rem, color-mix(in srgb, var(--teal-pale) 2.5%, transparent) 47rem 56rem, transparent 56rem), radial-gradient(70rem 50rem at 0% 0%, color-mix(in srgb, var(--teal-glow) 55%, transparent), transparent 65%) 0 0 / 70rem 50rem no-repeat, radial-gradient(60rem 42rem at 100% 100%, color-mix(in srgb, var(--sun) 22%, transparent), transparent 70%) right bottom / 60rem 42rem no-repeat, var(--teal-deep);
}

@media (min-width: 768px) {
  .contact-hero {
  min-height: 86rem;
  padding: 11.8rem 4.8rem 6.4rem;
  }
}

.contact-step__num {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--step-num);
}

.contact-step__title {
  margin-top: 1.4rem;
  font-family: var(--font-display);
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 1.2;
}

.contact-step__text {
  margin-top: 0.8rem;
  line-height: 1.55;
  color: var(--step-text);
}

.contact-step {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  padding: 2.8rem;
  background: var(--step-bg);
  border-color: var(--step-border);
  color: var(--step-fg);
}

.contact-steps {
  --grid-min: 24rem;
  margin-top: 4rem;
  list-style-position: initial;
  list-style-image: initial;
  list-style-type: none;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
}

.btn--outline-ink {
  border-color: var(--teal-deep);
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  color: var(--teal-deep);
}

.contact-faq__intro {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 32rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
}

.contact-faq__q {
  font-family: var(--font-display);
  font-size: 1.9rem;
  font-weight: 600;
  line-height: 1.25;
}

.contact-faq__a {
  margin-top: 0.8rem;
  font-size: 1.5rem;
  line-height: 1.6;
  color: var(--ink-muted);
}

.contact-faq__item {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  padding: 2.4rem;
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: var(--faq-bg);
  border-color: var(--faq-border);
}

.contact-faq__grid {
  --grid-min: 26rem;
  flex-grow: 2;
  flex-shrink: 1;
  flex-basis: 56rem;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
}

.contact-faq {
  display: flex;
  flex-wrap: wrap;
  row-gap: 4.8rem;
  column-gap: 4.8rem;
}

.cf-input:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 2px;
}

:is(.cf-chip):has(+ .cf-chip__input:checked) {
  border-color: var(--chip-on-bg);
  background: var(--chip-on-bg);
  color: var(--chip-on-fg);
  font-weight: 600;
}

:is(.cf-chip):has(+ .cf-chip__input:focus-visible) {
  outline: 2px solid var(--teal);
  outline-offset: 2px;
}

.btn--outline-ink:hover {
  background: var(--teal-deep-10);
  color: var(--teal-deep);
}

body[data-instatic-iframe-interaction="canvas"] :is(.contact-hero) {
  background-image: none !important;
}

.cf-message {
  padding: 1.4rem 1.8rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: var(--mist);
  font-weight: 600;
  line-height: 1.5;
}

.cf-message[data-instatic-form-message="success"] {
  background: var(--sun-wash);
}

.cf-message[data-instatic-form-message="error"] {
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(253, 232, 232);
  color: rgb(138, 28, 28);
}

.contact-steps__item {
  display: flex;
  --step-bg: var(--surface);
  --step-border: var(--line);
  --step-fg: var(--ink);
  --step-num: var(--teal-text);
  --step-text: var(--ink-muted);
}

.contact-steps__item--sun {
  --step-bg: var(--sun);
  --step-border: var(--sun);
  --step-num: var(--ink);
  --step-text: var(--ink);
}

.contact-steps__item--ink {
  --step-bg: var(--ink);
  --step-border: var(--ink);
  --step-fg: var(--surface);
  --step-num: var(--sun);
  --step-text: var(--navy-text);
}

.contact-faq__cell {
  display: flex;
  --faq-bg: var(--surface);
  --faq-border: var(--line);
}

.contact-faq__cell--wash {
  --faq-bg: var(--sun-wash);
  --faq-border: var(--sun-wash);
}

.nav-trigger {
  display: inline-flex;
  align-items: center;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  min-height: 4.4rem;
  padding: 0px 1.4rem;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  border-top-color: currentcolor;
  border-right-color: currentcolor;
  border-bottom-color: currentcolor;
  border-left-color: currentcolor;
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  color: var(--teal-mist);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  cursor: pointer;
  transition-behavior: normal, normal;
  transition-duration: 0.2s, 0.2s;
  transition-timing-function: ease, ease;
  transition-delay: 0s, 0s;
  transition-property: background-color, color;
}

.nav-trigger:hover {
  background: var(--surface-10);
  color: var(--surface);
}

.nav-trigger__chev {
  width: 1.4rem;
  height: 1.4rem;
  transition-behavior: normal;
  transition-duration: 0.15s;
  transition-timing-function: ease;
  transition-delay: 0s;
  transition-property: transform;
}

.nav-item:has(:popover-open) :is(.nav-trigger) {
  background: var(--surface);
  color: var(--ink);
  font-weight: 600;
}

.nav-item:has(:popover-open) :is(.nav-trigger__chev) {
  transform: rotate(180deg);
}

@keyframes mega-in {
  0% {
    opacity: 0;
    transform: translateY(0.8rem);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

.mega {
  position: fixed;
  right: auto;
  bottom: auto;
  left: 50%;
  translate: -50%;
  margin: 0px;
  width: min(68rem, calc(100vw - 2.4rem));
  padding: 1rem;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  border-right-color: currentcolor;
  border-bottom-color: currentcolor;
  border-left-color: currentcolor;
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 3rem;
  border-top-right-radius: 3rem;
  border-bottom-right-radius: 3rem;
  border-bottom-left-radius: 3rem;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 34px 70px -22px color-mix(in srgb, var(--teal-deep) 60%, transparent), 0 0 0 1px var(--ink-5);
  overflow-x: visible;
  overflow-y: visible;
  max-height: none;
  top: 11.8rem;
  background-clip: border-box;
  border-top-width: 0px;
  border-top-style: none;
  white-space-collapse: collapse;
  text-wrap-mode: wrap;
}

@media (max-width: 1023px) {
  .mega {
  display: none;
  }
}

@supports (top: anchor(bottom)) {
  .mega {
  left: anchor(center);
  position-anchor: --nav-item;
  top: calc(-0.6rem + anchor(bottom));
  }
}

.mega--wide {
  width: min(72rem, calc(100vw - 2.4rem));
}

.mega:popover-open {
  animation-duration: 0.18s;
  animation-timing-function: ease-out;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
  animation-name: mega-in;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.mega__notch {
  position: absolute;
  top: -0.6rem;
  left: 50%;
  width: 1.4rem;
  height: 1.4rem;
  margin-left: -0.7rem;
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
  border-bottom-left-radius: 0.3rem;
  background: var(--surface);
  transform: rotate(45deg);
}

.mega__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.mtile {
  --tile-bg: var(--teal-wash);
  --tile-fg: var(--ink);
  --tile-muted: var(--ink-muted);
  --tile-accent: var(--teal-text);
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  column-gap: 1rem;
  min-height: 17.6rem;
  padding: 2rem;
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: var(--tile-bg);
  color: var(--tile-fg);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  transition-behavior: normal;
  transition-duration: 0.15s;
  transition-timing-function: ease;
  transition-delay: 0s;
  transition-property: transform;
}

.mtile:hover {
  transform: translateY(-2px);
  color: var(--tile-fg);
}

.mtile--ink {
  --tile-bg: var(--ink);
  --tile-fg: var(--surface);
  --tile-muted: var(--navy-text);
  --tile-accent: var(--sun);
  background: radial-gradient(26rem 18rem at 100% 0%, color-mix(in srgb, var(--sun) 22%, transparent), transparent 70%), var(--ink);
}

.mtile--sun {
  --tile-bg: var(--sun-wash);
  --tile-accent: var(--sun-text);
}

.mtile--mist {
  --tile-bg: var(--mist);
  --tile-accent: var(--ink-muted);
}

.mtile--teal {
  --tile-bg: var(--teal-deep);
  --tile-fg: var(--surface);
  --tile-muted: var(--teal-pale);
  --tile-accent: var(--sun);
  grid-column-start: 1;
  grid-column-end: -1;
  flex-direction: row;
  align-items: center;
  min-height: 7.2rem;
  padding: 1.2rem 1.4rem 1.2rem 1.2rem;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
}

.mtile__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.mtile__icon {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 4.4rem;
  height: 4.4rem;
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
  background: var(--surface);
  color: var(--tile-accent);
  box-shadow: 0 0 0 1px var(--ink-10);
}

.mtile--ink .mtile__icon, .mtile--teal .mtile__icon {
  background: var(--sun);
  color: var(--ink);
  box-shadow: none;
}

.mtile__badge {
  padding: 0.4rem 1rem;
  border-top-left-radius: 99px;
  border-top-right-radius: 99px;
  border-bottom-right-radius: 99px;
  border-bottom-left-radius: 99px;
  background: color-mix(in srgb, var(--sun) 16%, transparent);
  color: var(--sun);
  font-size: 1.2rem;
  font-weight: 700;
}

.mtile__badge--solid {
  padding: 0.2rem 0.8rem;
  background: var(--sun);
  color: var(--ink);
  font-size: 1.1rem;
}

.mtile__title {
  font-family: var(--font-display);
  font-size: 2.1rem;
  font-weight: 600;
  line-height: 1.2;
}

.mtile__text {
  font-size: 1.4rem;
  line-height: 1.5;
  color: var(--tile-muted);
}

.mtile__foot {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mtile__price {
  font-family: var(--font-display);
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--tile-accent);
}

.mtile__go {
  display: grid;
  align-items: center;
  justify-items: center;
  width: 3rem;
  height: 3rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--surface);
  color: var(--tile-accent);
}

.mtile--ink .mtile__go {
  background: var(--surface-10);
}

.mtile__body {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  min-width: 0px;
}

.mtile__body .mtile__title {
  display: flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  font-size: 1.8rem;
}

.mtile__body .mtile__text {
  display: block;
  font-size: 1.3rem;
}

.mega__foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  row-gap: 1rem;
  column-gap: 1rem;
  padding: 1.2rem 0.8rem 0.4rem 1.2rem;
}

.mega__ticks {
  display: flex;
  flex-direction: column;
  row-gap: 0.4rem;
  column-gap: 0.4rem;
  font-size: 1.3rem;
  color: var(--ink-muted);
}

.mega__tick {
  display: inline-flex;
  align-items: center;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
}

.mega__tick svg {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 1.4rem;
  height: 1.4rem;
  color: var(--teal);
}

.mega__actions {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.mega__pill {
  display: inline-flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  min-height: 4.4rem;
  padding: 0px 1.6rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  border: 1px solid var(--line-d-1);
  color: var(--ink);
  font-size: 1.4rem;
  font-weight: 600;
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.mega__pill--solid {
  border-color: var(--teal-deep);
  background: var(--teal-deep);
  color: var(--surface);
}

.mega__pill svg {
  width: 1.5rem;
  height: 1.5rem;
}

.mega__pill--solid svg {
  color: var(--sun);
}

.mega__cols {
  display: flex;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.mega__col {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  min-width: 0px;
  padding: 1rem 0.4rem 0.4rem;
}

.mega__heading {
  padding: 0px 1rem 0.4rem;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--teal-text);
}

.mega__heading--sun {
  color: var(--sun-text);
}

.mrow {
  --row-bg: var(--teal-mist);
  --row-fg: var(--teal-text);
  display: flex;
  align-items: center;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  min-height: 6rem;
  padding: 0.8rem 1rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.mrow:hover {
  background: var(--teal-wash);
  color: var(--ink);
}

.mrow--sun {
  --row-bg: var(--sun-wash);
  --row-fg: var(--sun-text);
}

.mrow__icon {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 3.8rem;
  height: 3.8rem;
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
  background: var(--row-bg);
  color: var(--row-fg);
}

.mrow__icon svg {
  width: 1.8rem;
  height: 1.8rem;
}

.mrow__text {
  display: grid;
}

.mrow__title {
  font-weight: 600;
}

.mrow__sub {
  font-size: 1.3rem;
  color: var(--ink-muted);
}

.mfeature {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 22rem;
  display: flex;
  flex-direction: column;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  padding: 1.2rem;
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: radial-gradient(22rem 16rem at 100% 0%, color-mix(in srgb, var(--sun) 25%, transparent), transparent 70%), var(--teal-deep);
  color: var(--surface);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.mfeature:hover {
  color: var(--surface);
}

.mfeature__badge {
  align-self: flex-start;
  padding: 0.4rem 1rem;
  border-top-left-radius: 99px;
  border-top-right-radius: 99px;
  border-bottom-right-radius: 99px;
  border-bottom-left-radius: 99px;
  background: var(--sun);
  color: var(--ink);
  font-size: 1.2rem;
  font-weight: 700;
}

.mfeature__img {
  display: block;
  width: 100%;
  height: 9.6rem;
  object-fit: cover;
  object-position: left top;
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
}

.mfeature__title {
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.3;
}

.mfeature__text {
  font-size: 1.3rem;
  line-height: 1.45;
  color: var(--teal-pale);
}

.mfeature__foot {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1.3rem;
  color: var(--teal-pale);
}

.mfeature__more {
  display: inline-flex;
  align-items: center;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  font-weight: 600;
  color: var(--sun);
}

.mfeature__more svg {
  width: 1.3rem;
  height: 1.3rem;
}

.mega__banner {
  margin-top: 0.8rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 1rem;
  column-gap: 1rem;
  padding: 1rem 1rem 1rem 1.4rem;
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--sun-wash);
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.mega__banner-main {
  display: flex;
  align-items: center;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
}

.mega__banner-icon {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 3.8rem;
  height: 3.8rem;
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
  background: var(--sun);
  color: var(--ink);
}

.mega__banner-icon svg {
  width: 1.7rem;
  height: 1.7rem;
}

.mega__banner-text {
  display: grid;
}

.mega__banner-title {
  font-family: var(--font-display);
  font-size: 1.7rem;
  font-weight: 600;
}

.mega__banner-sub {
  font-size: 1.3rem;
  color: var(--sun-text);
}

.mega__banner-btn {
  display: inline-flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  min-height: 4.4rem;
  padding: 0px 1.8rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--ink);
  color: var(--surface);
  font-size: 1.4rem;
  font-weight: 600;
}

.mega__banner-btn svg {
  width: 1.4rem;
  height: 1.4rem;
}

body[data-breakpoint-id] > :is(.mega) {
  position: static;
  display: block;
  translate: none;
  width: auto;
  max-width: 72rem;
  margin: 1.6rem;
  max-height: none;
}

.mnav {
  display: flex;
  flex-direction: column;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
  padding: 0.4rem;
}

.mnav__tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  row-gap: 0.6rem;
  column-gap: 0.6rem;
}

.mnav-tile {
  --tile-bg: var(--teal-wash);
  --tile-fg: var(--ink);
  --tile-accent: var(--teal-text);
  display: flex;
  flex-direction: column;
  row-gap: 0.4rem;
  column-gap: 0.4rem;
  padding: 1.4rem;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--tile-bg);
  color: var(--tile-fg);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.mnav-tile:hover {
  color: var(--tile-fg);
}

.mnav-tile--ink {
  --tile-bg: var(--ink);
  --tile-fg: var(--surface);
  --tile-accent: var(--sun);
}

.mnav-tile--sun {
  --tile-bg: var(--sun-wash);
  --tile-accent: var(--sun-text);
}

.mnav-tile--mist {
  --tile-bg: var(--mist);
  --tile-accent: var(--ink-muted);
}

.mnav-tile--wide {
  --tile-bg: var(--teal-deep);
  --tile-fg: var(--surface);
  --tile-accent: var(--sun);
  grid-column-start: 1;
  grid-column-end: -1;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.mnav-tile__title {
  display: flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  font-weight: 600;
}

.mnav-tile__price {
  font-size: 1.3rem;
  color: var(--tile-accent);
}

.mnav__label {
  padding: 0px 0.6rem 0.6rem;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--teal-text);
}

.mnav__links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  row-gap: 0.6rem;
  column-gap: 0.6rem;
}

.mnav-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.8rem;
  padding: 0px 1.2rem;
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
  background: var(--canvas);
  color: var(--ink);
  font-size: 1.5rem;
  font-weight: 500;
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.mnav-link--outline {
  min-height: 5.2rem;
  border: 1px solid var(--line-d-1);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  font-weight: 600;
}

.mnav__note {
  padding-bottom: 0.4rem;
  text-align: center;
  font-size: 1.3rem;
  color: var(--ink-muted);
}

body[data-breakpoint-id] > :is(.mobile-menu) {
  position: static;
  display: block;
  margin: 1.6rem;
  max-height: none;
}

.nav-item {
  anchor-name: --nav-item;
  anchor-scope: --nav-item;
  padding-bottom: 2.4rem;
  margin-bottom: -2.4rem;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow-x: hidden;
  overflow-y: hidden;
  clip-path: inset(50%);
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.eyebrow {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--teal-text);
}

.page-hero {
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  row-gap: 3.2rem;
  max-width: 160rem;
  padding: 11rem 2rem 4rem;
  background: radial-gradient(circle at var(--ring-x, calc(100% - 16rem)) var(--ring-y, 12rem), transparent 37.9rem, color-mix(in srgb, var(--teal-pale) 14%, transparent) 38rem 38.1rem, color-mix(in srgb, var(--teal-pale) 5%, transparent) 38.15rem 47rem, color-mix(in srgb, var(--teal-pale) 2.5%, transparent) 47rem 56rem, transparent 56rem), radial-gradient(70rem 50rem at 0% 0%, color-mix(in srgb, var(--teal-glow) 55%, transparent), transparent 65%) 0 0 / 70rem 50rem no-repeat, radial-gradient(60rem 42rem at 100% 100%, color-mix(in srgb, var(--sun) 22%, transparent), transparent 70%) right bottom / 60rem 42rem no-repeat, var(--teal-deep);
}

@media (min-width: 768px) {
  .page-hero {
  min-height: 86rem;
  padding: 11.8rem 4.8rem 6.4rem;
  }
}

.page-hero--center {
  --ring-x: 50%;
  --ring-y: 40rem;
}

.page-hero__body {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 4.8rem;
  row-gap: 4.8rem;
  padding-top: var(--space-3xl);
  padding-bottom: var(--space-3xl);
}

.page-hero--center .page-hero__body {
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.page-hero__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 44rem;
  min-width: 0px;
}

.page-hero--center .page-hero__copy {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  max-width: 86rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.page-hero__title {
  margin-top: 2.2rem;
  font-size: var(--text-3xl);
  line-height: 1.02;
  letter-spacing: -0.03em;
}

.chip-link {
  display: inline-flex;
  align-items: center;
  min-height: 4.4rem;
  padding: 0px 1.8rem;
  border: 1px solid var(--surface-20);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--surface-10);
  color: var(--surface);
  font-size: 1.5rem;
  font-weight: 500;
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.chip-link:hover {
  background: var(--surface-20);
  color: var(--surface);
}

.quote-tiles {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 40rem;
  min-width: 0px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
}

.quote-tile {
  --tile-muted: var(--teal-pale);
  display: flex;
  flex-direction: column;
  row-gap: 0.4rem;
  padding: 2rem;
  border: 1px solid var(--surface-20);
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: var(--surface-10);
  color: var(--surface);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.quote-tile:hover {
  color: var(--surface);
}

.quote-tile--sun {
  --tile-muted: var(--ink);
  border-color: var(--sun);
  background: var(--sun);
  color: var(--ink);
}

.quote-tile--sun:hover {
  color: var(--ink);
}

.quote-tile--ink {
  --tile-muted: var(--navy-text);
  --tile-price: var(--sun);
  border-color: var(--ink);
  background: var(--ink);
}

.quote-tile__label {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--tile-muted);
}

.quote-tile__price {
  font-family: var(--font-display);
  font-size: 3.4rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--tile-price, inherit);
}

.quote-tile__note {
  font-size: 1.3rem;
  color: var(--tile-muted);
}

.offer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 1.6rem;
  column-gap: 3.2rem;
  padding: 2.2rem 2.8rem;
  border: 1px solid color-mix(in srgb, var(--sun) 55%, white);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  background: var(--sun-wash);
}

.offer__main {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 52rem;
  display: flex;
  align-items: center;
  column-gap: 1.6rem;
}

.offer__badge {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 5.2rem;
  height: 5.2rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: var(--sun);
  font-family: var(--font-display);
  font-size: 1.7rem;
  font-weight: 700;
}

.offer__title {
  font-family: var(--font-display);
  font-size: 2.1rem;
  font-weight: 600;
}

.offer__text {
  margin-top: 0.4rem;
  font-size: 1.5rem;
  line-height: 1.55;
  color: var(--sun-text);
}

.offer__tags {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  font-weight: 600;
}

.seg {
  display: inline-flex;
  padding: 0.5rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--surface);
  flex-wrap: nowrap;
}

.seg__btn {
  display: inline-flex;
  align-items: center;
  column-gap: 0.8rem;
  min-height: 4.4rem;
  padding: 0px 2rem;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  border-top-color: currentcolor;
  border-right-color: currentcolor;
  border-bottom-color: currentcolor;
  border-left-color: currentcolor;
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  color: rgb(51, 66, 79);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  font-weight: 600;
  cursor: pointer;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.seg__btn[aria-pressed="true"] {
  background: var(--teal-deep);
  color: var(--surface);
}

.tier-grid {
  --grid-min: 30rem;
  margin-top: 4rem;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
}

.tier {
  --tier-muted: var(--ink-muted);
  --tier-rule: var(--line);
  --tier-chip-bg: var(--mist);
  --tier-chip-fg: #33424F;
  --tier-tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%230B7A75' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E");
  display: flex;
  flex-direction: column;
  row-gap: 1.8rem;
  padding: 2.8rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  background: var(--surface);
  color: var(--ink);
}

.tier--ink {
  --tier-muted: var(--navy-text);
  --tier-rule: var(--navy-line);
  --tier-chip-bg: var(--navy-chip);
  --tier-chip-fg: var(--navy-text);
  --tier-price: var(--sun);
  --tier-tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23FFC93C' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E");
  border-color: var(--ink);
  background: var(--ink);
  color: var(--surface);
  box-shadow: 0 30px 60px -30px color-mix(in srgb, var(--ink) 60%, transparent);
}

.tier--navy {
  --tier-muted: var(--navy-text);
  --tier-rule: var(--navy-line-strong);
  --tier-chip-bg: var(--navy-chip);
  --tier-chip-fg: var(--navy-text);
  --tier-price: var(--sun);
  --tier-tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23FFC93C' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E");
  border-color: var(--navy-line-strong);
  background: var(--navy-raised);
  color: var(--surface);
}

.tier--accent {
  border: 2px solid var(--sun);
}

.tier__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 0.8rem;
}

.tier__label {
  padding: 0.5rem 1.2rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--tier-chip-bg);
  color: var(--tier-chip-fg);
  font-size: 1.3rem;
  font-weight: 600;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.tier__badge {
  padding: 0.4rem 1rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--sun);
  color: var(--ink);
  font-size: 1.2rem;
  font-weight: 700;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.tier__name {
  font-family: var(--font-display);
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.2;
}

.price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  row-gap: 0.6rem;
  column-gap: 1.2rem;
}

.price__from {
  font-size: 1.5rem;
  color: var(--tier-muted);
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.price__amount {
  font-family: var(--font-display);
  font-size: 4.6rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--tier-price, inherit);
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.price__was {
  font-size: 1.7rem;
  color: var(--tier-muted);
  text-decoration-line: line-through;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.price__rate {
  padding: 0.3rem 0.9rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--sun-wash);
  color: var(--sun-text);
  font-size: 1.2rem;
  font-weight: 600;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.price__note {
  color: var(--tier-muted);
}

.tier__text {
  line-height: 1.6;
  color: var(--tier-muted);
}

.tick-list {
  display: grid;
  row-gap: 1rem;
  padding-top: 1.8rem;
  border-top: 1px solid var(--tier-rule);
  font-size: 1.5rem;
  list-style-position: initial;
  list-style-image: initial;
  list-style-type: none;
}

.tick {
  padding-left: 3rem;
  background: var(--tier-tick) no-repeat left 0.1rem;
}

.tick--no {
  --tier-tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%238795A3' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E");
  color: var(--tier-muted);
}

.tier__note {
  margin-top: auto;
  padding: 1.4rem 1.6rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: var(--canvas);
  font-size: 1.4rem;
  line-height: 1.55;
  color: rgb(51, 66, 79);
}

.showcase {
  position: relative;
  isolation: isolate;
  padding: 5.6rem 2rem;
  border-top-left-radius: 3.6rem;
  border-top-right-radius: 3.6rem;
  border-bottom-right-radius: 3.6rem;
  border-bottom-left-radius: 3.6rem;
  background: radial-gradient(60rem 40rem at 0% 0%, color-mix(in srgb, var(--teal) 45%, transparent), transparent 70%), radial-gradient(50rem 40rem at 100% 100%, color-mix(in srgb, var(--sun) 16%, transparent), transparent 70%), var(--ink);
  color: var(--surface);
  box-shadow: 0 40px 90px -40px color-mix(in srgb, var(--ink) 70%, transparent);
  --ink-muted: var(--navy-text);
}

@media (min-width: 768px) {
  .showcase {
  padding: 5.6rem 4rem;
  }
}

.tag-row {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.tag--dark {
  border-color: var(--navy-line-strong);
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: transparent;
  color: var(--navy-text);
}

.tag--md {
  padding: 0.8rem 1.4rem;
  font-size: 1.4rem;
}

.support {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 3.2rem;
  row-gap: 3.2rem;
  padding: 3rem 2rem;
  border-top-left-radius: 3.2rem;
  border-top-right-radius: 3.2rem;
  border-bottom-right-radius: 3.2rem;
  border-bottom-left-radius: 3.2rem;
  background: var(--sun);
}

@media (min-width: 768px) {
  .support {
  padding: 4rem;
  }
}

.support__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 44rem;
}

.support__text {
  max-width: 52rem;
  margin-top: 1.2rem;
  font-size: 1.6rem;
  line-height: 1.6;
  color: var(--sun-text);
}

.support__list {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 30rem;
  display: grid;
  row-gap: 1rem;
  list-style-position: initial;
  list-style-image: initial;
  list-style-type: none;
}

.support__item {
  padding: 1.6rem 1.8rem 1.6rem 5rem;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--tier-tick) no-repeat 1.8rem center, var(--surface);
  --tier-tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%230B7A75' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E");
  font-weight: 600;
}

.split {
  display: flex;
  flex-wrap: wrap;
  column-gap: 4.8rem;
  row-gap: 4rem;
}

.split__lead {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 38rem;
}

.split__main {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 52rem;
}

.info-grid {
  --grid-min: 24rem;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
}

.card__title {
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 600;
}

.card__text {
  margin-top: 0.6rem;
  font-size: 1.5rem;
  line-height: 1.55;
  color: var(--card-muted, var(--ink-muted));
}

.card--lg {
  padding: 2.2rem;
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
}

.qa-list {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}

.qa {
  border: 1px solid var(--line);
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--surface);
}

.qa__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 1.6rem;
  min-height: 6.4rem;
  padding: 1.6rem 2.2rem;
  font-size: 1.7rem;
  font-weight: 600;
  list-style-position: initial;
  list-style-image: initial;
  list-style-type: none;
  cursor: pointer;
}

.qa__q::-webkit-details-marker {
  display: none;
}

.qa__cat {
  display: block;
  margin-bottom: 0.4rem;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--teal-text);
}

.qa__icon {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 3.2rem;
  height: 3.2rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--teal-mist);
  color: var(--teal-text);
}

.qa[open] :is(.qa__vbar) {
  opacity: 0;
  rotate: 90deg;
}

.qa__a {
  max-width: 76rem;
  padding: 0px 2.2rem 2.2rem;
  line-height: 1.65;
  color: var(--ink-muted);
}

body[data-instatic-iframe-interaction="canvas"] :is(.page-hero, .showcase) {
  background-image: none !important;
}

body[data-instatic-iframe-interaction="canvas"] :is(.showcase) {
  box-shadow: none;
}

.tier__cta {
  margin-top: auto;
}

.section-head__main {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  max-width: 62rem;
}

.section-head__main :is(.section-head__intro) {
  max-width: none;
  margin-top: 0.4rem;
}

.tier--wash {
  --tier-price: var(--teal-deep);
  --tier-rule: #C9DCDA;
  border: 2px solid var(--teal-deep);
  background: var(--teal-wash);
}

.tier--wash :is(.tier__label) {
  background: var(--sun);
  color: var(--ink);
}

.tier__name--lg {
  font-size: 2.6rem;
}

.tier__head--name {
  flex-wrap: wrap;
  row-gap: 0.8rem;
}

.showcase :is(.pill) {
  --pill-bg: var(--navy-chip);
  --pill-fg: var(--navy-text);
}

.hosting-grid {
  --grid-min: 32rem;
  margin-top: 4rem;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
}

.container--narrow {
  max-width: 96rem;
}

.btn--teal {
  background: var(--teal-deep);
  color: var(--surface);
}

.btn--teal:hover {
  background: var(--teal-dark);
  color: var(--surface);
}

.section--tight {
  padding-top: var(--space-m);
}

.support__eyebrow {
  color: var(--ink);
}

.support__title {
  margin-top: 1rem;
}

.lead--spaced {
  margin-top: 1.6rem;
}

.text-center {
  text-align: center;
}

.qa-list--spaced {
  margin-top: 3.6rem;
}

.perk-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(24rem, 1fr));
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  width: 100%;
  max-width: 98rem;
  margin: 0px auto;
  text-align: left;
}

.perk__icon {
  margin-bottom: 1.6rem;
  width: 4.4rem;
  height: 4.4rem;
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
  background: var(--sun);
  color: var(--ink);
}

.perk-grid :is(.perk__title) {
  font-size: 2.2rem;
}

.perk-grid :is(.perk__text) {
  margin-top: 0.6rem;
  font-size: 1.5rem;
}

.sidebar-layout {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  column-gap: 2.4rem;
  row-gap: 2.4rem;
}

.sidebar-layout__side {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 26rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.6rem;
}

.sidebar-layout__main {
  flex-grow: 999;
  flex-shrink: 1;
  flex-basis: 60rem;
  min-width: 0px;
}

.filter-list {
  display: flex;
  flex-direction: column;
  row-gap: 0.6rem;
}

@media (max-width: 720px) {
  .filter-list {
  flex-direction: row;
  overflow-x: auto;
  padding-bottom: 0.4rem;
  }
}

.filter-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 1rem;
  min-height: 5.2rem;
  padding: 0px 1.8rem;
  border: 1px solid var(--line);
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: var(--surface);
  color: var(--ink);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}

@media (max-width: 720px) {
  .filter-btn {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  }
}

.filter-btn[aria-pressed="true"] {
  border-color: var(--teal-deep);
  background: var(--teal-deep);
  color: var(--surface);
  font-weight: 600;
}

.filter-btn__count {
  font-size: 1.3rem;
  color: var(--ink-muted);
}

.filter-btn[aria-pressed="true"] :is(.filter-btn__count) {
  color: var(--sun);
}

.card__action {
  margin-top: 1.6rem;
}

.error-code {
  display: flex;
  align-items: center;
  column-gap: 1.8rem;
  font-family: var(--font-display);
  font-size: 12rem;
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.05em;
}

@media (min-width: 768px) {
  .error-code {
  font-size: 22rem;
  }
}

.error-code__tile {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 10rem;
  height: 10rem;
  border-top-left-radius: 3rem;
  border-top-right-radius: 3rem;
  border-bottom-right-radius: 3rem;
  border-bottom-left-radius: 3rem;
  background: linear-gradient(145deg, var(--sun-light) 0%, var(--sun) 45%, var(--sun-deep) 100%);
  box-shadow: rgba(255, 255, 255, 0.65) 0px 2px 0px inset, rgba(180, 110, 0, 0.35) 0px -12px 26px inset, rgba(0, 0, 0, 0.5) 0px 30px 60px -12px;
  color: var(--teal-deep);
}

@media (min-width: 768px) {
  .error-code__tile {
  width: 18rem;
  height: 18rem;
  border-top-left-radius: 5.2rem;
  border-top-right-radius: 5.2rem;
  border-bottom-right-radius: 5.2rem;
  border-bottom-left-radius: 5.2rem;
  }
}

.error-code__letter {
  margin-top: -0.12em;
  font-size: 0.55em;
  font-weight: 800;
  letter-spacing: -0.05em;
}

.hero-center-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 2.2rem;
}

.link-tiles {
  width: 100%;
  max-width: 92rem;
  margin: 0px auto;
  display: flex;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
  list-style-position: initial;
  list-style-image: initial;
  list-style-type: none;
  text-align: left;
  align-items: stretch;
}

.quote-tile__title {
  font-weight: 600;
}

.hero__actions--center {
  justify-content: center;
  margin-top: 0.8rem;
}

body[data-instatic-iframe-interaction="canvas"] :is(.error-code__tile) {
  background-image: none !important;
  background-color: var(--sun) !important;
}

.link-tiles :is(.quote-tile) {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
}

.doc {
  padding: 2.4rem 2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--surface);
  color: rgb(51, 66, 79);
  font-size: 1.7rem;
  line-height: 1.7;
  scroll-margin-top: 2.4rem;
}

@media (min-width: 768px) {
  .doc {
  padding: 4rem;
  }
}

.doc--ink {
  border-color: var(--teal-deep);
  background: var(--teal-deep);
  color: var(--surface);
  --doc-heading: var(--surface);
}

.doc__title {
  font-family: var(--font-display);
  font-size: 3.4rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--doc-heading, var(--ink));
}

.doc__sub {
  margin: 2.8rem 0px 0.8rem;
  font-family: var(--font-display);
  font-size: 2.1rem;
  font-weight: 600;
  color: var(--ink);
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: wrap;
}

.doc__lead {
  margin-top: 1.4rem;
}

.doc--ink :is(.doc__lead) {
  color: var(--teal-pale);
}

.doc__note {
  margin-top: 2rem;
  font-size: 1.5rem;
  color: var(--ink-muted);
}

.doc a {
  color: var(--teal-text);
}

.note-grid {
  --grid-min: 22rem;
  row-gap: 1rem;
  column-gap: 1rem;
}

.note-card {
  padding: 1.8rem;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--canvas);
  font-size: 1.5rem;
  line-height: 1.55;
}

.note-card__title {
  font-size: 1.7rem;
  font-weight: 600;
  color: var(--ink);
}

.term-list {
  margin-top: 2.4rem;
  display: grid;
  row-gap: 1rem;
  column-gap: 1rem;
  list-style-position: initial;
  list-style-image: initial;
  list-style-type: none;
}

.term {
  display: flex;
  column-gap: 1.6rem;
  padding: 1.8rem;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--canvas);
}

.term__num {
  display: grid;
  align-items: center;
  justify-items: center;
  width: 3.2rem;
  height: 3.2rem;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  border-bottom-left-radius: 1rem;
  background: var(--teal-deep);
  color: var(--sun);
  font-size: 1.4rem;
  font-weight: 700;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.term strong {
  color: var(--ink);
}

.toc {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 24rem;
  padding: 2.2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: var(--surface);
}

.toc__label {
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--teal-text);
}

.toc__list {
  margin-top: 1.2rem;
  display: grid;
  row-gap: 0.4rem;
  list-style-position: initial;
  list-style-image: initial;
  list-style-type: none;
  font-size: 1.5rem;
}

.toc__link {
  display: flex;
  align-items: center;
  min-height: 4rem;
  padding: 0px 1rem;
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.toc__link:hover {
  background: var(--teal-wash);
  color: var(--teal-text);
}

.doc-stack {
  flex-grow: 999;
  flex-shrink: 1;
  flex-basis: 60rem;
  min-width: 0px;
  display: flex;
  flex-direction: column;
  row-gap: 2rem;
}

.pref-list {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  margin-top: 2.4rem;
}

.pref-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  column-gap: 1.6rem;
  row-gap: 1.6rem;
  padding: 2rem;
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--teal-dark);
}

.pref-row__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 32rem;
  min-width: 0px;
}

.pref-row__head {
  display: flex;
  align-items: center;
  column-gap: 1rem;
  flex-wrap: wrap;
  row-gap: 0.4rem;
}

.pref-row__title {
  font-family: var(--font-display);
  font-size: 1.9rem;
  font-weight: 600;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.pref-row__tag {
  padding: 0.2rem 1rem;
  border-top-left-radius: 99px;
  border-top-right-radius: 99px;
  border-bottom-right-radius: 99px;
  border-bottom-left-radius: 99px;
  background: var(--surface-10);
  font-size: 1.2rem;
  color: var(--teal-pale);
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.pref-row__text {
  margin-top: 0.6rem;
  font-size: 1.5rem;
  line-height: 1.55;
  color: var(--teal-pale);
}

.pref-locked {
  display: inline-flex;
  align-items: center;
  min-height: 3.6rem;
  padding: 0px 1.4rem;
  border-top-left-radius: 99px;
  border-top-right-radius: 99px;
  border-bottom-right-radius: 99px;
  border-bottom-left-radius: 99px;
  background: var(--surface-10);
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--teal-pale);
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.switch {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  appearance: none;
  width: 5.6rem;
  height: 3.2rem;
  margin: 0px;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  border-top-color: currentcolor;
  border-right-color: currentcolor;
  border-bottom-color: currentcolor;
  border-left-color: currentcolor;
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 99px;
  border-top-right-radius: 99px;
  border-bottom-right-radius: 99px;
  border-bottom-left-radius: 99px;
  background: radial-gradient(circle at 1.6rem 1.6rem, var(--surface) 1.2rem, transparent 1.25rem), var(--teal-line);
  cursor: pointer;
}

.switch:checked {
  background: radial-gradient(circle at 4rem 1.6rem, var(--ink) 1.2rem, transparent 1.25rem), var(--sun);
}

.switch:focus-visible {
  outline: 2px solid var(--sun);
  outline-offset: 3px;
}

.pref-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 1rem;
  row-gap: 1rem;
  margin-top: 2rem;
}

.pref-status {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--sun);
}

.badge {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  padding: 0.5rem 1.2rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--badge-bg, var(--mist));
  color: var(--badge-fg, #33424F);
  font-size: 1.3rem;
  font-weight: 600;
}

.badge--sun {
  --badge-bg: var(--sun);
  --badge-fg: var(--ink);
}

.badge--teal {
  --badge-bg: var(--teal-mist);
  --badge-fg: var(--teal-text);
}

.badge--warm {
  --badge-bg: var(--sun-wash);
  --badge-fg: var(--sun-text);
}

.badge-row {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.stat-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 1rem;
  column-gap: 1rem;
  margin-top: 3.2rem;
}

.stat-chip {
  display: inline-flex;
  align-items: center;
  column-gap: 1rem;
  padding: 1rem 1.6rem;
  border: 1px solid var(--surface-20);
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: var(--surface-10);
  font-size: 1.4rem;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
}

.stat-chip__value {
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 600;
  color: var(--sun);
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
}

.pill-filters {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.pill-filter {
  min-height: 4.4rem;
  padding: 0px 1.8rem;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: rgb(211, 218, 225);
  border-right-color: rgb(211, 218, 225);
  border-bottom-color: rgb(211, 218, 225);
  border-left-color: rgb(211, 218, 225);
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--surface);
  color: var(--ink);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  font-weight: 600;
  cursor: pointer;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.pill-filter[aria-pressed="true"] {
  border-color: var(--teal-deep);
  background: var(--teal-deep);
  color: var(--surface);
}

.pill-filter__count {
  margin-left: 0.4rem;
  opacity: 0.7;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
}

.feature-case {
  display: flex;
  flex-wrap: wrap;
  overflow-x: hidden;
  overflow-y: hidden;
  border: 1px solid var(--line);
  border-top-left-radius: 3.2rem;
  border-top-right-radius: 3.2rem;
  border-bottom-right-radius: 3.2rem;
  border-bottom-left-radius: 3.2rem;
  background: var(--surface);
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  box-shadow: 0 30px 70px -40px color-mix(in srgb, var(--ink) 35%, transparent);
}

.feature-case:hover {
  color: var(--ink);
}

.feature-case__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 42rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.8rem;
  padding: 2.8rem 2rem;
}

@media (min-width: 768px) {
  .feature-case__copy {
  padding: 4rem;
  }
}

.feature-case__media {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 56rem;
  min-width: 0px;
  display: flex;
  align-items: flex-end;
  padding: 4rem 0px 0px 4rem;
  background: radial-gradient(50rem 36rem at 100% 0%, color-mix(in srgb, var(--sun) 28%, transparent), transparent 70%), var(--teal-deep);
}

.feature-case__image {
  display: block;
  width: 100%;
  height: 48rem;
  object-fit: cover;
  object-position: left top;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
}

.feature-case__eyebrow {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--teal-text);
}

.feature-case__title {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -0.025em;
}

.feature-case__text {
  font-size: 1.7rem;
  line-height: 1.6;
  color: var(--ink-muted);
}

.feature-case__cta {
  margin-top: auto;
  align-self: flex-start;
}

.mini-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
}

.mini-stat {
  padding: 1.6rem;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--canvas);
}

.mini-stat__value {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: 600;
}

.mini-stat__label {
  font-size: 1.4rem;
  color: var(--ink-muted);
}

.work-grid {
  --grid-min: 34rem;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
}

.work-card {
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: hidden;
  border: 1px solid var(--line);
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--surface);
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.work-card:hover {
  color: var(--ink);
}

.work-card__media {
  min-height: 22rem;
  padding: 2rem 2rem 0px;
  background: var(--work-tint, var(--mist));
}

.work-card__image {
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.work-card__body {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  display: flex;
  flex-direction: column;
  row-gap: 1.2rem;
  padding: 2.8rem;
}

.work-card__title {
  font-family: var(--font-display);
  font-size: 2.6rem;
  font-weight: 600;
  line-height: 1.15;
}

.work-card__text {
  line-height: 1.6;
  color: var(--ink-muted);
}

.work-card__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-top: auto;
  padding-top: 1.4rem;
  border-top: 1px solid var(--line);
  font-size: 1.4rem;
  color: var(--ink-muted);
}

.work-card__go {
  font-weight: 600;
  color: var(--teal-text);
}

.work-card--lilac {
  --work-tint: #EFE9F2;
}

.work-cta {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-top-width: 2px;
  border-right-width: 2px;
  border-bottom-width: 2px;
  border-left-width: 2px;
  border-top-style: dashed;
  border-right-style: dashed;
  border-bottom-style: dashed;
  border-left-style: dashed;
  border-top-color: rgb(185, 207, 204);
  border-right-color: rgb(185, 207, 204);
  border-bottom-color: rgb(185, 207, 204);
  border-left-color: rgb(185, 207, 204);
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--teal-wash);
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
  padding: 4rem;
  row-gap: 3.2rem;
  min-height: 46rem;
}

.work-cta:hover {
  color: var(--ink);
}

.work-cta__title {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-top: 2.4rem;
  font-size: 2.8rem;
  line-height: 1.2;
}

.work-cta__text {
  color: var(--ink-muted);
  margin-top: 1.6rem;
  line-height: 1.7;
}

.work-cta__btn {
  align-self: flex-start;
  margin-top: 0.8rem;
}

.icon-tile--deep {
  width: 5.6rem;
  height: 5.6rem;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--teal-deep);
  color: var(--sun);
}

body[data-instatic-iframe-interaction="canvas"] :is(.feature-case__media) {
  background-image: none !important;
}

.card__text--ink {
  color: var(--ink);
}

.card__title--sun {
  color: var(--sun);
}

.stat-chips--start {
  justify-content: flex-start;
}

.about-portrait__img {
  display: block;
  width: 100%;
  height: 56rem;
  object-fit: cover;
  object-position: center top;
  border-top-left-radius: 3.2rem;
  border-top-right-radius: 3.2rem;
  border-bottom-right-radius: 3.2rem;
  border-bottom-left-radius: 3.2rem;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(228, 229, 231);
  box-shadow: rgba(0, 0, 0, 0.55) 0px 4rem 8rem -3rem;
}

@media (max-width: 720px) {
  .about-portrait__img {
  height: 42rem;
  }
}

.about-portrait__icon {
  width: 4rem;
  height: 4rem;
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
}

.about-portrait__sub {
  display: block;
  font-size: 1.3rem;
  font-weight: 400;
  color: var(--ink-muted);
}

.about-portrait__place {
  font-weight: 600;
}

.about-portrait__loc {
  position: absolute;
  left: -2rem;
  bottom: 2.8rem;
  display: flex;
  align-items: center;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  padding: 1.2rem 1.8rem 1.2rem 1.2rem;
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--surface);
  color: var(--ink);
}

@media (max-width: 720px) {
  .about-portrait__loc {
  left: 1rem;
  }
}

.about-portrait__badge {
  position: absolute;
  right: -1.4rem;
  top: 2.8rem;
  padding: 0.8rem 1.4rem;
  border-top-left-radius: 99px;
  border-top-right-radius: 99px;
  border-bottom-right-radius: 99px;
  border-bottom-left-radius: 99px;
  background: var(--sun);
  color: var(--ink);
  font-size: 1.3rem;
  font-weight: 700;
}

@media (max-width: 720px) {
  .about-portrait__badge {
  right: 1rem;
  }
}

.about-portrait {
  position: relative;
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 34rem;
  max-width: 44rem;
  margin: 0px auto;
}

.about-checks {
  margin-top: 1.6rem;
  row-gap: 1rem;
}

.about-split {
  align-items: center;
}

.stack-tab__count {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  font-size: 1.3rem;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  color: var(--tab-count);
}

.stack-tab {
  --tab-count: var(--ink-muted);
  display: flex;
  justify-content: space-between;
  align-items: center;
  row-gap: 1rem;
  column-gap: 1rem;
  min-height: 5.6rem;
  padding: 0px 1.8rem;
  border: 1px solid var(--line);
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--surface);
  color: var(--ink);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}

.stack-tabs__list {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 26rem;
  display: flex;
  flex-direction: column;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
}

.stack-panel__title {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.stack-panel__points {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
  margin-top: auto;
  padding-top: 2.2rem;
  border-top: 1px solid var(--line);
}

.stack-panel {
  display: flex;
  flex-direction: column;
  row-gap: 2.2rem;
  column-gap: 2.2rem;
  height: 100%;
  padding: 3.6rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--surface);
}

.stack-panels {
  flex-grow: 999;
  flex-shrink: 1;
  flex-basis: 56rem;
  min-width: 0px;
}

.stack-tabs {
  display: flex;
  flex-wrap: wrap;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
  margin-top: 4rem;
}

.stack-note__text {
  line-height: 1.5;
  color: var(--navy-text);
}

.stack-note {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  row-gap: 1.6rem;
  column-gap: 1.6rem;
  margin-top: 1.6rem;
  padding: 2rem 2.4rem;
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: var(--ink);
  color: var(--surface);
}

.about-checks :is(.check-item) {
  align-items: center;
  padding: 1.4rem 1.6rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(245, 247, 249);
}

.stack-tab[aria-pressed="true"] {
  --tab-count: var(--sun);
  background: var(--teal-deep);
  border-color: var(--teal-deep);
  color: var(--surface);
  font-weight: 600;
}

.case-back {
  display: inline-flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  min-height: 4.4rem;
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--navy-text);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.case-meta {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 30rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  row-gap: 1rem;
  column-gap: 1rem;
  margin: 0px;
}

@media (max-width: 720px) {
  .case-meta {
  grid-template-columns: 1fr;
  }
}

.case-meta__item {
  padding: 1.6rem;
  border: 1px solid var(--surface-20);
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--surface-10);
}

.case-meta__label {
  font-size: 1.3rem;
  color: var(--navy-text);
}

.case-meta__value {
  margin: 0.4rem 0px 0px;
  font-weight: 600;
}

.shot-frame {
  display: flex;
  flex-direction: column;
  margin: 0px -0.8rem;
  padding: 1.2rem 1.2rem 0px;
  border: 1px solid var(--surface-20);
  border-bottom-width: 0px;
  border-bottom-style: none;
  border-bottom-color: currentcolor;
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  background: var(--surface-10);
}

.shot-frame__dots {
  height: 2.4rem;
  background: radial-gradient(circle at .6rem 1.1rem,var(--surface-30,rgba(255,255,255,.3)) .5rem,transparent .55rem),radial-gradient(circle at 2.2rem 1.1rem,var(--surface-30,rgba(255,255,255,.3)) .5rem,transparent .55rem),radial-gradient(circle at 3.8rem 1.1rem,var(--surface-30,rgba(255,255,255,.3)) .5rem,transparent .55rem);
}

.shot-frame__img {
  display: block;
  width: 100%;
  height: 48rem;
  object-fit: cover;
  object-position: center top;
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
}

@media (max-width: 720px) {
  .shot-frame__img {
  height: 30rem;
  }
}

.case-lead {
  max-width: 94rem;
  font-family: var(--font-display);
  font-size: 2.6rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.01em;
}

@media (max-width: 720px) {
  .case-lead {
  font-size: 2.2rem;
  }
}

.case-text {
  margin-top: 2.2rem;
  font-size: 1.7rem;
  line-height: 1.7;
  color: var(--ink-muted);
}

.case-note {
  display: flex;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  margin-top: 2.2rem;
  padding: 1.6rem 1.8rem;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--teal-mist);
  font-size: 1.5rem;
  line-height: 1.55;
  color: var(--teal-deep);
}

.case-row {
  display: flex;
  flex-wrap: wrap;
  row-gap: 4.8rem;
  column-gap: 4.8rem;
  align-items: flex-start;
}

.case-row--center {
  align-items: center;
}

.case-row__a {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 38rem;
  min-width: 0px;
}

.case-row__b {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 48rem;
  min-width: 0px;
}

.case-row__wide {
  flex-grow: 999;
  flex-shrink: 1;
  flex-basis: 56rem;
  min-width: 0px;
}

.case-row__aside {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 24rem;
  align-self: flex-start;
}

.case-toc {
  padding: 2.2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.2rem;
  border-top-right-radius: 2.2rem;
  border-bottom-right-radius: 2.2rem;
  border-bottom-left-radius: 2.2rem;
  background: var(--surface);
}

.case-toc__label {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--ink-muted);
}

.case-toc__link {
  display: flex;
  align-items: center;
  min-height: 4rem;
  font-weight: 500;
  color: var(--ink);
  text-decoration-line: none;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.brief-list {
  display: grid;
  row-gap: 1rem;
  column-gap: 1rem;
}

.brief-item {
  --b-bg: #efe6f5;
  --b-fg: #4f3a63;
  display: flex;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
  padding: 2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background: var(--surface);
  line-height: 1.55;
}

.brief-item--amber {
  --b-bg: #fff4d6;
  --b-fg: #7a5a00;
}

.brief-item--ink {
  --b-bg: var(--sun);
  --b-fg: var(--ink);
  border-color: var(--ink);
  background: var(--ink);
  color: var(--surface);
}

.brief-item__num {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 3.2rem;
  height: 3.2rem;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  border-bottom-left-radius: 1rem;
  background: var(--b-bg);
  color: var(--b-fg);
  font-size: 1.4rem;
  font-weight: 700;
}

.case-panel {
  padding: 5.6rem 4rem;
}

@media (max-width: 720px) {
  .case-panel {
  padding: 3.6rem 2rem;
  }
}

.case-panel__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  row-gap: 2.4rem;
  column-gap: 2.4rem;
}

.case-panel__body {
  display: flex;
  flex-wrap: wrap;
  row-gap: 2.4rem;
  column-gap: 2.4rem;
  margin-top: 4rem;
  align-items: flex-start;
}

.case-panel__copy {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 30rem;
}

.case-panel__title {
  font-family: var(--font-display);
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 1.15;
}

.case-panel__text {
  margin-top: 1.4rem;
  font-size: 1.7rem;
  line-height: 1.65;
  color: var(--navy-text);
}

.step-picks {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 30rem;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  column-gap: 1rem;
}

.step-pick {
  --sp-num: var(--sun);
  display: flex;
  flex-direction: column;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  width: 100%;
  padding: 2rem;
  border-top-width: 2px;
  border-right-width: 2px;
  border-bottom-width: 2px;
  border-left-width: 2px;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: rgb(43, 59, 82);
  border-right-color: rgb(43, 59, 82);
  border-bottom-color: rgb(43, 59, 82);
  border-left-color: rgb(43, 59, 82);
  border-image-source: none;
  border-image-slice: 100%;
  border-image-width: 1;
  border-image-outset: 0;
  border-image-repeat: stretch;
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(21, 36, 58);
  color: var(--surface);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-weight: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  text-align: left;
  cursor: pointer;
}

.step-pick[aria-pressed="true"] {
  --sp-num: var(--sun-text);
  border-color: var(--sun);
  background: var(--surface);
  color: var(--ink);
}

.step-pick__num {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--sp-num);
}

.step-pick__title {
  font-family: var(--font-display);
  font-size: 2.2rem;
  font-weight: 600;
}

.step-pick__text {
  font-size: 1.5rem;
  line-height: 1.55;
  color: var(--ink-muted);
}

.step-pick:not([aria-pressed="true"]) .step-pick__text {
  display: none;
}

.step-shots {
  flex-grow: 2;
  flex-shrink: 1;
  flex-basis: 52rem;
  min-width: 0px;
}

.shot-card {
  --shot-bg: var(--surface);
  margin: 0px;
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--shot-bg);
}

.shot-card--teal {
  --shot-bg: var(--teal-deep);
  border-color: var(--teal-deep);
}

.shot-card--lilac {
  --shot-bg: #efe6f5;
  border-top-color: rgb(239, 230, 245);
  border-right-color: rgb(239, 230, 245);
  border-bottom-color: rgb(239, 230, 245);
  border-left-color: rgb(239, 230, 245);
}

.shot-card--night {
  --shot-bg: #1a2a40;
  border-top-color: rgb(26, 42, 64);
  border-right-color: rgb(26, 42, 64);
  border-bottom-color: rgb(26, 42, 64);
  border-left-color: rgb(26, 42, 64);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
}

.shot-card__img {
  display: block;
  width: 100%;
  height: 42rem;
  object-fit: cover;
  object-position: center top;
  border-top-left-radius: 1.8rem;
  border-top-right-radius: 1.8rem;
  border-bottom-right-radius: 1.8rem;
  border-bottom-left-radius: 1.8rem;
  background: var(--surface);
}

.shot-card__img--tall {
  height: 50rem;
}

.shot-card__img--wide {
  height: 56rem;
}

.shot-card__img--short {
  height: 34rem;
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
}

.shot-card__cap {
  padding: 1.4rem 0.8rem 0.4rem;
  font-weight: 600;
}

.shot-caption {
  margin-top: 1.2rem;
  font-size: 1.4rem;
  color: var(--ink-muted);
}

.shot-caption--dark {
  padding: 1rem 0.4rem 0px;
  margin-top: 0px;
  color: var(--navy-text);
}

.feature-pair {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(min(100%,36rem),1fr));
  row-gap: 1.6rem;
  column-gap: 1.6rem;
  margin-top: 2.4rem;
}

.feature-panel {
  display: flex;
  flex-direction: column;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
  padding: 2.8rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.8rem;
  border-top-right-radius: 2.8rem;
  border-bottom-right-radius: 2.8rem;
  border-bottom-left-radius: 2.8rem;
  background: var(--surface);
}

.feature-panel__img {
  margin-top: auto;
  display: block;
  width: 100%;
  height: 30rem;
  object-fit: cover;
  object-position: left top;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  border: 1px solid var(--line);
}

.tint-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(min(100%,26rem),1fr));
  row-gap: 1.6rem;
  column-gap: 1.6rem;
  margin-top: 1.6rem;
}

.tint-card {
  padding: 2.4rem;
  border: 1px solid var(--line);
  border-top-left-radius: 2.4rem;
  border-top-right-radius: 2.4rem;
  border-bottom-right-radius: 2.4rem;
  border-bottom-left-radius: 2.4rem;
  background: var(--surface);
}

.tint-card--sun {
  border-top-color: rgb(255, 244, 214);
  border-right-color: rgb(255, 244, 214);
  border-bottom-color: rgb(255, 244, 214);
  border-left-color: rgb(255, 244, 214);
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(255, 244, 214);
  color: rgb(61, 49, 8);
}

.tint-card--teal {
  border-color: var(--teal-mist);
  background: var(--teal-mist);
  color: var(--teal-deep);
}

.tint-card__title {
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 600;
}

.tint-card__text {
  margin-top: 0.6rem;
  font-size: 1.5rem;
  line-height: 1.55;
}

.case-split-card {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 44rem;
  padding: 3.6rem;
  border: 1px solid var(--line);
  border-top-left-radius: 3.2rem;
  border-top-right-radius: 3.2rem;
  border-bottom-right-radius: 3.2rem;
  border-bottom-left-radius: 3.2rem;
  background: var(--surface);
  --cs-text: var(--ink-muted);
  display: flex;
  flex-direction: column;
}

.case-split-card--teal {
  border-color: var(--teal-deep);
  background: var(--teal-deep);
  color: var(--surface);
  --cs-text: var(--navy-text);
}

.case-split-card--teal .case-split-card__text {
  color: var(--navy-text);
}

.case-split-card__text {
  margin-top: 1.4rem;
  line-height: 1.6;
  color: var(--cs-text);
}

.case-split-card__list {
  display: grid;
  row-gap: 1.4rem;
  column-gap: 1.4rem;
  margin-top: 2.2rem;
  line-height: 1.55;
}

.case-split-card__chips {
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-top: 1.6rem;
  font-size: 1.5rem;
  display: grid;
}

.case-split-card__chip {
  padding: 1.2rem 1.4rem;
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
  border-bottom-right-radius: 1.4rem;
  border-bottom-left-radius: 1.4rem;
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(15, 79, 75);
}

.swatch-list {
  display: grid;
  row-gap: 1rem;
  column-gap: 1rem;
  margin-top: 2.2rem;
}

.swatch {
  display: flex;
  align-items: center;
  row-gap: 1.2rem;
  column-gap: 1.2rem;
  padding: 1.2rem 1.4rem;
  border: 1px solid var(--line);
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: var(--surface);
}

.swatch__chip {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 3.2rem;
  height: 3.2rem;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  border-bottom-left-radius: 1rem;
  background: var(--swatch,var(--teal));
}

.swatch__name {
  font-weight: 600;
}

.swatch__sub {
  display: block;
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--ink-muted);
}

.case-tech {
  display: flex;
  flex-wrap: wrap;
  row-gap: 4.8rem;
  column-gap: 4.8rem;
}

.stat-card--lilac {
  --stat-label: #3e2f4a;
  border-top-color: rgb(239, 230, 245);
  border-right-color: rgb(239, 230, 245);
  border-bottom-color: rgb(239, 230, 245);
  border-left-color: rgb(239, 230, 245);
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(239, 230, 245);
}

.stat__value--md {
  font-size: 3rem;
  letter-spacing: -0.02em;
  line-height: 1.6;
}

.case-row--top {
  margin-top: 7.2rem;
}

.pill--dark {
  background-image: initial;
  background-position-x: initial;
  background-position-y: initial;
  background-size: initial;
  background-repeat: initial;
  background-attachment: initial;
  background-origin: initial;
  background-clip: initial;
  background-color: rgb(26, 42, 64);
  color: var(--navy-text);
}

.case-panel__heading {
  margin-top: 1.6rem;
  max-width: 64rem;
}

.dark-tab {
  --dt-bg: #15243a;
  --dt-bd: #2b3b52;
  --dt-fg: var(--surface);
  min-height: 4.4rem;
  padding: 0px 1.8rem;
  border: 1px solid var(--dt-bd);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--dt-bg);
  color: var(--dt-fg);
  font-style: inherit;
  font-variant-ligatures: inherit;
  font-variant-caps: inherit;
  font-variant-numeric: inherit;
  font-variant-east-asian: inherit;
  font-variant-alternates: inherit;
  font-variant-position: inherit;
  font-variant-emoji: inherit;
  font-stretch: inherit;
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  font-weight: 600;
  cursor: pointer;
}

.dark-tabs {
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.shot-grid {
  flex-grow: 2;
  flex-shrink: 1;
  flex-basis: 56rem;
  min-width: 0px;
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(min(100%,26rem),1fr));
  row-gap: 1.4rem;
  column-gap: 1.4rem;
}

.eyebrow--sun {
  color: var(--sun);
}

.case-split-card__cta {
  margin-top: auto;
  align-self: flex-start;
}

.dark-tab[aria-pressed="true"] {
  --dt-bg: var(--sun);
  --dt-bd: var(--sun);
  --dt-fg: var(--ink);
}

.case-checks {
  margin-top: 2rem;
  row-gap: 1rem;
  font-size: 1.6rem;
}

.case-figure {
  margin-top: 3.6rem;
  border-top-left-radius: 3.2rem;
  border-top-right-radius: 3.2rem;
  border-bottom-right-radius: 3.2rem;
  border-bottom-left-radius: 3.2rem;
  padding: 1.4rem;
}

.swatch__chip--blue {
  --swatch: #1976d2;
}

.swatch__chip--clay {
  --swatch: #ae4133;
}

.case-tags {
  margin-top: 1.8rem;
}

.showcase :is(.section-head__intro) {
  color: var(--navy-text);
  opacity: 1;
}

.mk {
  position: relative;
  isolation: isolate;
  overflow-x: hidden;
  overflow-y: hidden;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 21rem;
  padding: 1.4rem;
  border: 1px solid var(--line);
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: radial-gradient(120% 90% at 100% 0%, var(--teal-mist), transparent 62%), var(--canvas);
}

.mk--sun {
  background: radial-gradient(120% 90% at 0% 0%, var(--sun-wash), transparent 62%), var(--canvas);
}

.mk--dots {
  background: radial-gradient(60% 60% at 50% 50%, var(--teal-mist), transparent 70%), radial-gradient(var(--ink-10) 1px, transparent 1.3px) 0 0 / 1.6rem 1.6rem, var(--canvas);
}

.mk-panel {
  display: flex;
  flex-direction: column;
  row-gap: 0.9rem;
  column-gap: 0.9rem;
  width: 100%;
  max-width: 30rem;
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
  background: var(--surface);
  box-shadow: 0 1px 2px var(--ink-5), 0 1.4rem 3rem -1.4rem var(--ink-30);
  transition-behavior: normal;
  transition-duration: 0.45s;
  transition-timing-function: cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: 0s;
  transition-property: translate;
}

.mk-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  min-height: 2.2rem;
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--ink);
}

.mk-muted {
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--ink-muted);
}

.mk-float {
  position: absolute;
  z-index: 2;
  top: 1rem;
  right: 1rem;
  display: flex;
  align-items: center;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  padding: 0.5rem 1rem 0.5rem 0.5rem;
  border: 1px solid var(--line);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--surface);
  box-shadow: 0 1rem 2.4rem -1rem var(--ink-40);
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  color: var(--ink);
  rotate: 3deg;
  animation-duration: 4.5s;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: var(--play, paused);
  animation-name: mk-bob;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.mk-float__icon {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 2.2rem;
  height: 2.2rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--sun);
  color: var(--ink);
}

.mk-float__icon--teal {
  background: var(--teal-deep);
  color: var(--sun);
}

.mk-ico {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 1.3rem;
  height: 1.3rem;
}

.mk-days {
  display: grid;
  grid-template-columns: repeat(5, minmax(0px, 1fr));
  row-gap: 0.5rem;
  column-gap: 0.5rem;
}

.mk-day {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 0.2rem;
  column-gap: 0.2rem;
  padding: 0.5rem 0px;
  border: 1px solid var(--line);
  border-top-left-radius: 0.8rem;
  border-top-right-radius: 0.8rem;
  border-bottom-right-radius: 0.8rem;
  border-bottom-left-radius: 0.8rem;
  background: var(--surface);
  line-height: 1;
}

.mk-day__dow {
  font-size: 0.9rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-muted);
}

.mk-day__num {
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--ink);
}

.mk-day--on {
  border-color: var(--teal-deep);
  background: var(--teal-deep);
  box-shadow: 0 0.6rem 1.4rem -0.6rem var(--teal-deep);
}

.mk-day--on > :is(.mk-day__dow) {
  color: var(--teal-pale);
}

.mk-day--on > :is(.mk-day__num) {
  color: var(--sun);
}

.mk-slots {
  display: flex;
  row-gap: 0.5rem;
  column-gap: 0.5rem;
}

.mk-slot {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0px;
  padding: 0.5rem 0px;
  border: 1px solid var(--line);
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--surface);
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
  color: var(--ink);
}

.mk-slot--on {
  border-color: var(--sun);
  background: var(--sun);
  font-weight: 700;
}

.mk-slot--off {
  background: var(--mist);
  color: var(--ink-40);
  text-decoration-line: line-through;
  text-decoration-thickness: initial;
  text-decoration-style: initial;
  text-decoration-color: initial;
}

.mk-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  row-gap: 0.6rem;
  column-gap: 0.6rem;
  height: 3rem;
  border-top-left-radius: 0.9rem;
  border-top-right-radius: 0.9rem;
  border-bottom-right-radius: 0.9rem;
  border-bottom-left-radius: 0.9rem;
  background: var(--ink);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--surface);
}

.mk-profile {
  display: flex;
  align-items: center;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
}

.mk-avatar {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 3.2rem;
  height: 3.2rem;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: linear-gradient(135deg, var(--mint), var(--teal));
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--surface);
  box-shadow: 0 0 0 2px var(--surface), 0 0 0 3.5px var(--teal-pale);
}

.mk-id {
  display: flex;
  flex-direction: column;
  row-gap: 0.2rem;
  column-gap: 0.2rem;
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0px;
  min-width: 0px;
}

.mk-id__name {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--ink);
}

.mk-badge {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  padding: 0.35rem 0.8rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--sun);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: var(--ink);
}

.mk-meter {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  column-gap: 0.5rem;
}

.mk-track {
  height: 0.6rem;
  overflow-x: hidden;
  overflow-y: hidden;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--mist);
}

.mk-fill {
  width: 67%;
  height: 100%;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: linear-gradient(90deg, var(--teal), var(--mint));
  transform-origin: left center;
  animation-duration: 1.2s;
  animation-timing-function: cubic-bezier(0.2, 0.7, 0.2, 1);
  animation-delay: 0.3s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: both;
  animation-play-state: var(--play, paused);
  animation-name: mk-grow;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.mk-list {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  column-gap: 0.5rem;
}

.mk-item {
  display: flex;
  align-items: center;
  row-gap: 0.7rem;
  column-gap: 0.7rem;
  padding: 0.6rem 0.7rem;
  border-top-left-radius: 0.8rem;
  border-top-right-radius: 0.8rem;
  border-bottom-right-radius: 0.8rem;
  border-bottom-left-radius: 0.8rem;
  background: var(--canvas);
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.2;
  color: var(--ink);
}

.mk-item__icon {
  display: grid;
  align-items: center;
  justify-items: center;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  width: 2rem;
  height: 2rem;
  border-top-left-radius: 0.6rem;
  border-top-right-radius: 0.6rem;
  border-bottom-right-radius: 0.6rem;
  border-bottom-left-radius: 0.6rem;
  background: var(--surface);
  color: var(--teal-text);
}

.mk-item__label {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0px;
  min-width: 0px;
}

.mk-pill {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  padding: 0.3rem 0.7rem;
  border-top-left-radius: 999px;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  border-bottom-left-radius: 999px;
  background: var(--teal-mist);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  color: var(--teal-text);
}

.mk-pill--sun {
  background: var(--sun-wash);
  color: var(--sun-text);
}

.mk-kpi {
  display: flex;
  align-items: baseline;
  row-gap: 0.8rem;
  column-gap: 0.8rem;
  margin-top: -0.4rem;
}

.mk-kpi__value {
  font-family: var(--font-display);
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--ink);
}

.mk-chart {
  position: relative;
  height: 7.2rem;
  margin: 0px -0.2rem;
}

.mk-chart__svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow-x: visible;
  overflow-y: visible;
}

.mk-chart__pin {
  position: absolute;
  left: 100%;
  top: 14%;
  width: 1rem;
  height: 1rem;
  border: 2px solid var(--surface);
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--sun-deep);
  box-shadow: rgba(255, 201, 60, 0.35) 0px 0px 0px 4px;
  translate: -50% -50%;
}

.mk-hub {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 5.6rem;
  height: 5.6rem;
  border-top-left-radius: 1.6rem;
  border-top-right-radius: 1.6rem;
  border-bottom-right-radius: 1.6rem;
  border-bottom-left-radius: 1.6rem;
  background: linear-gradient(160deg, var(--teal-dark), var(--teal-deep));
  box-shadow: 0 0 0 0.8rem hsla(171.43, 33.33%, 91.76%, 0.7), 0 0 0 1.6rem hsla(171.43, 33.33%, 91.76%, 0.35), 0 1.2rem 2.4rem -0.8rem var(--teal-deep);
  font-family: var(--font-display);
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--sun);
  translate: -50% -50%;
}

.mk-hub__live {
  position: absolute;
  top: -0.3rem;
  right: -0.3rem;
  width: 1.2rem;
  height: 1.2rem;
  border: 2px solid var(--surface);
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  background: var(--mint);
}

.mk-wires {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  color: var(--teal-glow);
}

.mk-wires line {
  stroke-dasharray: 3, 5;
  animation-duration: 0.9s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: var(--play, paused);
  animation-name: mk-flow;
  animation-timeline: auto;
  animation-range-start: normal;
  animation-range-end: normal;
}

.mk-app {
  position: absolute;
  z-index: 1;
  display: grid;
  align-items: center;
  justify-items: center;
  width: 4.4rem;
  height: 4.4rem;
  border: 1px solid var(--line);
  border-top-left-radius: 1.2rem;
  border-top-right-radius: 1.2rem;
  border-bottom-right-radius: 1.2rem;
  border-bottom-left-radius: 1.2rem;
  background: var(--surface);
  box-shadow: 0 0.8rem 1.8rem -0.8rem var(--ink-30);
  color: var(--teal-text);
  translate: -50% -50%;
}

.mk-app--tl {
  left: 20%;
  top: 27%;
  color: var(--sun-text);
}

.mk-app--tr {
  left: 80%;
  top: 27%;
}

.mk-app--bl {
  left: 20%;
  top: 70%;
}

.mk-app--br {
  left: 80%;
  top: 70%;
  color: var(--sun-text);
}

.mk-app__label {
  position: absolute;
  top: calc(100% + 0.5rem);
  left: 50%;
  translate: -50%;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  white-space-collapse: collapse;
  text-wrap-mode: nowrap;
  color: var(--ink-muted);
}

.feature-card:hover :is(.mk-panel) {
  translate: 0px -0.3rem;
}

@keyframes mk-bob {
  0%, 100% {
    translate: 0px;
  }
  50% {
    translate: 0px -0.4rem;
  }
}

@keyframes mk-grow {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}

@keyframes mk-flow {
  100% {
    stroke-dashoffset: -8;
  }
}

@keyframes fx-rise {
  0% {
    opacity: 0;
    translate: 0px 1.6rem;
  }
}

:is(.hero__copy, .page-hero__copy) > * {
  animation: fx-rise 0.7s var(--ease-out) backwards;
}

:is(.hero__copy, .page-hero__copy) > :nth-child(2) {
  animation-delay: 0.06s;
}

:is(.hero__copy, .page-hero__copy) > :nth-child(3) {
  animation-delay: 0.12s;
}

:is(.hero__copy, .page-hero__copy) > :nth-child(4) {
  animation-delay: 0.18s;
}

:is(.hero__copy, .page-hero__copy) > :nth-child(n+5) {
  animation-delay: 0.24s;
}

:is(.hero__body, .page-hero__body) > :not(.hero__copy, .page-hero__copy), :is(.page-hero) > :is(.shot-frame) {
  animation: fx-rise 0.9s var(--ease-out) 0.2s backwards;
}

[data-reveal="wait"] {
  opacity: 0;
}

[data-reveal="in"] {
  animation: fx-rise 0.7s var(--ease-out) var(--reveal-delay, 0s) backwards;
}

:is(.work-card__image, .feature-case__image, .case__image) {
  transition: scale 0.6s var(--ease-out);
}

:is(.icon-tile) {
  transition: rotate 0.35s var(--ease-out), scale 0.35s var(--ease-out);
}

:is(.work-card__go, .footer-nav__link) {
  transition: translate 0.25s var(--ease-out), color 0.2s;
}

:is(.feature-case__cta, .case-back) svg {
  transition: translate 0.25s var(--ease-out);
}

:is(.pill-filter, .stack-tab, .filter-btn, .seg__btn, .dark-tab, .chip, .toc__link, .footer-legal__link, .mrow) {
  transition-behavior: normal, normal, normal;
  transition-duration: 0.2s, 0.2s, 0.2s;
  transition-timing-function: ease, ease, ease;
  transition-delay: 0s, 0s, 0s;
  transition-property: background-color, border-color, color;
}

:is(.qa__icon) {
  transition-behavior: normal, normal;
  transition-duration: 0.2s, 0.2s;
  transition-timing-function: ease, ease;
  transition-delay: 0s, 0s;
  transition-property: background-color, color;
}

:is(.qa__vbar) {
  transform-box: fill-box;
  transform-origin: center center;
  transition: opacity 0.25s, rotate 0.25s var(--ease-out);
}

:is(.text-link) {
  text-decoration-line: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 0.15em;
  text-underline-offset: 0.35em;
  transition: text-decoration-color 0.2s, text-underline-offset 0.2s var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
  :is(.work-card, .work-cta, .feature-case, .quote-tile, a.perk):hover {
  translate: 0px -0.6rem;
  box-shadow: 0 3.2rem 6.4rem -3.6rem color-mix(in srgb, var(--ink) 45%, transparent);
  }
}

@media (hover: hover) and (pointer: fine) {
  .work-card:hover :is(.work-card__image) {
  scale: 1.03;
  }
}

@media (hover: hover) and (pointer: fine) {
  .feature-case:hover :is(.feature-case__image) {
  scale: 1.03;
  }
}

@media (hover: hover) and (pointer: fine) {
  .work-card:hover :is(.work-card__go) {
  translate: 0.4rem;
  }
}

@media (hover: hover) and (pointer: fine) {
  .feature-case:hover :is(.feature-case__cta) svg {
  translate: 0.3rem;
  }
}

@media (hover: hover) and (pointer: fine) {
  :is(.service-card, .work-cta, .contact-steps__item):hover :is(.icon-tile) {
  rotate: -6deg;
  scale: 1.06;
  }
}

@media (hover: hover) and (pointer: fine) {
  :is(.text-link):hover {
  text-decoration-color: currentcolor;
  text-underline-offset: 0.2em;
  }
}

@media (hover: hover) and (pointer: fine) {
  :is(.pill-filter, .stack-tab, .filter-btn):not([aria-pressed="true"]):hover {
  border-color: var(--teal-text);
  }
}

a:is(.perk) {
  display: block;
  color: var(--surface);
  text-decoration-line: none;
}

a:is(.perk--sun) {
  color: var(--ink);
}