/* Keep the original image, including its existing motto, within the header. */
:root {
  --animatrix-header-height: 88px;
  --animatrix-social-space: 0px;
  --animatrix-fixed-cta-space: 0px;
}
header { height: var(--animatrix-header-height); }
header > .brand { flex-shrink: 0; }
header > .brand img { width: 175px; max-height: 84px; object-fit: contain; }
.social-dock .social-link {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 50%;
  color: #fff;
  font-size: 0 !important;
  line-height: 1 !important;
}
.social-dock .social-link svg {
  display: block;
  width: 25px;
  height: 25px;
  flex-shrink: 0;
  fill: currentColor;
}
.social-dock .instagram svg { fill: none; }
.social-dock .social-link:focus-visible {
  outline: 3px solid #c59100;
  outline-offset: 3px;
}
@media (min-width: 761px) and (max-width: 1279px) {
  header > nav.open {
    box-sizing: border-box;
    max-height: calc(100dvh - var(--animatrix-header-height) - var(--animatrix-social-space));
  }
}
@media (max-width: 1279px) {
  :root { --animatrix-social-space: calc(56px + env(safe-area-inset-bottom)); }
  html {
    scroll-padding-top: calc(var(--animatrix-header-height) + 12px);
    scroll-padding-bottom: calc(var(--animatrix-social-space) + var(--animatrix-fixed-cta-space) + 12px);
  }
  body { padding-bottom: calc(var(--animatrix-social-space) + var(--animatrix-fixed-cta-space)) !important; }
  .social-dock {
    box-sizing: border-box;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    width: 100%;
    height: var(--animatrix-social-space);
    transform: none;
    flex-direction: row;
    justify-content: center;
    gap: 14px;
    padding: 6px 12px calc(6px + env(safe-area-inset-bottom));
    border: 0;
    border-top: 1px solid rgba(22, 63, 50, .16);
    border-radius: 0;
    background: rgba(245, 245, 240, .98);
    box-shadow: 0 -3px 16px rgba(7, 42, 28, .08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
  .social-dock > span { display: none !important; }
  .social-dock .social-link:hover,
  .social-dock .social-link:focus-visible { transform: none; }
  header > nav.open {
    box-sizing: border-box;
    max-height: calc(100dvh - var(--animatrix-header-height) - var(--animatrix-social-space));
    overflow-y: auto;
  }
  main input,
  main select,
  main textarea,
  main button,
  main .btn,
  main label {
    scroll-margin-top: calc(var(--animatrix-header-height) + 12px);
    scroll-margin-bottom: calc(var(--animatrix-social-space) + var(--animatrix-fixed-cta-space) + 12px);
  }
}
@media (max-width: 760px) {
  :root {
    --animatrix-header-height: 68px;
    --animatrix-fixed-cta-space: 76px;
  }
  header > .brand { width: 108px !important; height: 68px !important; }
  header > .brand img { width: 108px !important; max-height: 68px !important; }
  .mobile-context-cta {
    bottom: calc(var(--animatrix-social-space) + 10px);
    max-width: calc(100% - 24px);
    box-sizing: border-box;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
  }
}
@media (max-width: 360px) {
  header > .brand { width: 96px !important; }
  header > .brand img { width: 96px !important; }
}
/* The scene occupies the space above the permanent social row and mobile CTA. */
body.galaxy-route {
  padding-bottom: 0 !important;
  overflow: hidden;
}
body.galaxy-route #app {
  height: calc(100dvh - var(--animatrix-header-height) - var(--animatrix-social-space) - var(--animatrix-fixed-cta-space)) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
body.galaxy-route .galaxy-embed,
body.galaxy-route .galaxy-embed iframe {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
}