html {
  scroll-behavior: smooth;
}

body {
  min-width: 20rem;
  min-height: 100vh;
}

a {
  color: inherit;
}

.site-shell {
  position: relative;
  overflow: hidden;
}

.site-container {
  width: min(100% - 2rem, 74rem);
  margin-inline: auto;
}

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 5rem;
}

.site-brand,
.site-nav,
.site-actions,
.site-language {
  display: flex;
  align-items: center;
}

.site-brand {
  gap: 0.625rem;
  text-decoration: none;
}

.site-brand img {
  width: 1rem;
  height: 1rem;
}

.site-nav {
  gap: 1.5rem;
}

.site-language {
  gap: 0.25rem;
}

.site-nav-link,
.site-language-link {
  text-decoration: none;
}

.site-hero {
  position: relative;
  display: grid;
  align-items: center;
  padding-block: 3.5rem 4.5rem;
}

.site-hero > :not(.ui-bg-pattern) {
  position: relative;
  z-index: 1;
}

.site-page-hero {
  position: relative;
  padding-block: 5rem;
}

.site-page-hero > :not(.ui-bg-pattern) {
  position: relative;
  z-index: 1;
}

.site-page-hero-copy {
  display: grid;
  max-width: 54rem;
  gap: 1.5rem;
}

.site-page-hero-copy > .ui-tag {
  justify-self: start;
}

.site-hero-inner {
  display: grid;
  gap: 3rem;
}

.site-hero-copy {
  display: grid;
  max-width: 56rem;
  gap: 1.5rem;
}

.site-hero-copy > .site-wide-type.ui-type-par-l {
  max-width: 43rem;
}

.site-compact-type {
  display: none;
}

.site-actions {
  flex-wrap: wrap;
  gap: 0.75rem;
}

.site-section {
  display: grid;
  gap: 2rem;
  padding-block: 3.5rem;
}

#workflow,
#capabilities {
  scroll-margin-top: 2.5rem;
}

.site-section-heading {
  display: grid;
  max-width: 47rem;
  gap: 1rem;
}

.site-hero-diagram {
  display: grid;
  gap: 1.5rem;
  width: 100%;
  margin: 0;
}

.site-product-visual {
  display: grid;
  grid-template-columns:
    17.375rem minmax(2rem, 1fr) 17.375rem minmax(2rem, 1fr)
    minmax(24rem, 1.5fr);
  align-items: center;
  gap: 1rem;
}

.site-visual-sources,
.site-visual-project,
.site-visual-outputs,
.site-output-list,
.site-output-card,
.site-visual-gate {
  display: grid;
}

.site-visual-sources,
.site-visual-project,
.site-output-card {
  justify-items: center;
}

.site-visual-sources,
.site-visual-project {
  gap: 1rem;
}

.site-evidence-tags,
.site-visual-connector {
  display: flex;
  align-items: center;
  justify-content: center;
}

.site-evidence-tags {
  flex-wrap: wrap;
  gap: 0.5rem;
}

.site-visual-mascot {
  position: relative;
  z-index: 1;
  width: 4.5rem;
  height: 4.5rem;
  margin-bottom: -2.25rem;
}

.site-visual-connector {
  min-width: 0;
}

.site-visual-connector-wide {
  width: 100%;
}

.site-visual-connector-compact,
.site-output-list-compact {
  display: none;
}

.site-visual-gate {
  width: 100%;
  justify-items: center;
  gap: 0.75rem;
}

.site-visual-gate > .site-visual-connector {
  width: 100%;
}

.site-visual-gate > .ui-tag {
  text-align: center;
}

.site-visual-outputs {
  min-width: 0;
  gap: 0.75rem;
}

.site-output-list {
  gap: 0.75rem;
}

.site-output-card {
  gap: 0.5rem;
  width: 100%;
}

.site-output-card > .ui-tag {
  justify-self: start;
}

.site-journey {
  display: flex;
  align-items: stretch;
  gap: 1.5rem;
}

.site-journey > .ui-divider {
  display: none;
}

.site-journey-step,
.site-capability {
  display: grid;
  align-content: start;
}

.site-journey-step {
  flex: 1 1 0;
  gap: 0.75rem;
}

.site-journey-heading {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.site-capability-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.site-capability,
.site-capability-card,
.site-guardrail-list {
  display: grid;
}

.site-capability-card,
.site-guardrail-list {
  gap: 1rem;
}

.site-guardrail-row {
  display: grid;
  gap: 0.5rem;
}

.site-guardrail-status-compact {
  display: none;
}

.site-capability-card-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.site-capability-icon {
  width: 2rem;
  height: 2rem;
}

.site-page-sections {
  display: grid;
}

.site-page-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.8fr);
  gap: 5rem;
  padding-block: 4rem;
}

.site-page-section-heading,
.site-point-list {
  display: grid;
  align-content: start;
}

.site-page-section-heading {
  gap: 1rem;
}

.site-page-section-heading > .ui-tag {
  justify-self: start;
}

.site-point-list {
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-point {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.site-guardrail {
  display: block;
}

.site-guardrail-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(24rem, 1.1fr);
  align-items: center;
  gap: 3rem;
}

.site-guardrail-copy {
  display: grid;
  gap: 1rem;
}

.site-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 6rem;
}

.site-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}

@media (max-width: 72rem) {
  .site-product-visual {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 1.5rem;
  }

  .site-visual-connector-wide {
    display: none;
  }

  .site-visual-connector-compact {
    display: block;
  }

  .site-visual-outputs {
    width: min(100%, 36rem);
  }
}

@media (max-width: 62rem) {
  .site-hero-inner {
    grid-template-columns: 1fr;
    gap: 3rem;
  }

  .site-hero-copy {
    max-width: 43rem;
  }

  .site-capability-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-page-section {
    gap: 3rem;
  }
}

@media (max-width: 44rem) {
  .site-container {
    width: min(100% - 1.5rem, 74rem);
  }

  .site-header {
    min-height: 4.5rem;
  }

  .site-nav {
    display: none;
  }

  .site-hero {
    padding-block: 2.5rem 3.5rem;
  }

  .site-page-hero {
    padding-block: 3.5rem;
  }

  .site-hero-inner {
    gap: 2.5rem;
  }

  .site-hero-copy {
    gap: 1.25rem;
  }

  .site-wide-type {
    display: none;
  }

  .site-compact-type {
    display: block;
  }

  .site-section {
    gap: 2rem;
    padding-block: 3.5rem;
  }

  .site-hero-diagram {
    gap: 1.25rem;
    width: calc(100% + 1.5rem);
    margin-inline: -0.75rem;
  }

  .site-hero-diagram > figcaption {
    justify-self: start;
  }

  .site-visual-outputs {
    width: 100%;
  }

  .site-output-list-wide {
    display: none;
  }

  .site-output-list-compact {
    display: grid;
    justify-items: center;
  }

  .site-journey {
    flex-direction: column;
    gap: 1rem;
  }

  .site-journey > .ui-divider {
    display: block;
  }

  .site-capability-grid,
  .site-guardrail-panel,
  .site-page-section {
    grid-template-columns: 1fr;
  }

  .site-page-section {
    gap: 2rem;
    padding-block: 3rem;
  }

  .site-guardrail-panel {
    align-items: start;
    gap: 2rem;
  }

  .site-guardrail-status-wide {
    display: none;
  }

  .site-guardrail-status-compact {
    display: grid;
    justify-items: start;
  }

  .site-footer {
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
  }
}

@media (max-width: 62rem) and (max-height: 32rem) {
  .site-hero {
    min-height: auto;
    padding-block: 2.5rem 3.5rem;
  }

  .site-hero-copy {
    gap: 1.25rem;
  }

  .site-wide-type {
    display: none;
  }

  .site-compact-type {
    display: block;
  }

  .site-section {
    padding-block: 3.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}