:root {
  --paper:#f4f2eb;
  --white:#fffef9;
  --ink:#212623;
  --muted:#595e57;
  --red:#b62320;
  --line:#d4d7cb;
  --dark:#202823;
  --bs-body-font-family:Arial,Helvetica,sans-serif;
  --bs-body-color:var(--ink);
  --bs-body-bg:var(--paper);
  --bs-link-color:var(--red);
  --bs-link-hover-color:#861817
}

body {
  font-size:1.0625rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased
}

::selection {
  background:#b62320;
  color:white
}

a {
  color:inherit;
  text-underline-offset:.25em;
  text-decoration-thickness:1px
}

a:hover {
  color:var(--red)
}

a:focus-visible,summary:focus-visible {
  outline:3px solid var(--red);
  outline-offset:6px
}

h1,h2,h3 {
  font-weight:500;
  line-height:1.08;
  letter-spacing:-.045em
}

h1 {
  font-size:clamp(3.4rem,7.2vw,6.9rem)
}

h2 {
  font-size:clamp(2.35rem,4.1vw,4rem)
}

h3 {
  font-size:1.65rem;
  letter-spacing:-.025em
}

p {
  max-width:65ch
}

.container {
  max-width:1320px;
  padding-left:32px;
  padding-right:32px
}

.eyebrow,.mono {
  font-family:Consolas,'Courier New',monospace;
  font-size:.75rem;
  letter-spacing:.09em;
  text-transform:uppercase
}

.eyebrow {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:1.7rem
}

.eyebrow::before {
  content:'';
  width:7px;
  height:7px;
  background:var(--red);
  flex-shrink:0
}

.muted {
  color:var(--muted)
}

.accent {
  color:var(--red)
}

.lede {
  font-size:clamp(1.15rem,1.65vw,1.4rem);
  line-height:1.6;
  color:var(--muted)
}

.skip-link {
  position:absolute;
  top:8px;
  left:16px;
  transform:translateY(-180%);
  z-index:10;
  padding:12px 20px;
  background:var(--ink);
  color:white
}

.skip-link:focus {
  transform:none;
  color:white
}

.site-header {
  border-bottom:1px solid var(--line)
}

.header-inner {
  min-height:100px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}

.brand {
  display:inline-flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  white-space:nowrap;
  font-size:1.45rem;
  font-weight:750;
  letter-spacing:-.055em
}

.brand img {
  width:32px;
  height:36px;
  object-fit:contain
}

.brand span:last-child {
  font-weight:400
}

.site-nav {
  display:flex;
  align-items:center;
  gap:32px;
  list-style:none;
  margin:0;
  padding:0;
  font-size:.9rem
}

.site-nav a {
  display:inline-block;
  padding:12px 0;
  text-decoration:none
}

.site-nav a[aria-current=page] {
  text-decoration:underline;
  text-decoration-color:var(--red);
  text-decoration-thickness:2px;
  text-underline-offset:9px
}

.site-nav .nav-contact {
  border:1px solid var(--ink);
  padding:10px 18px
}

.nav-contact span {
  margin-left:20px
}

.hero {
  padding:86px 0 65px
}

.hero h1 {
  margin-bottom:28px
}

.hero h1 em {
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400
}

.hero-copy {
  max-width:510px
}

.hero-art {
  position:relative
}

.hero-art img {
  width:100%;
  height:auto;
  display:block
}

.art-caption {
  display:flex;
  justify-content:space-between;
  gap:15px;
  border-top:1px solid var(--line);
  padding-top:14px;
  color:var(--muted);
  font-size:.65rem
}

.hero-actions {
  display:flex;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
  margin-top:32px
}

.btn-siren {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:36px;
  background:var(--red);
  color:white;
  border:1px solid var(--red);
  border-radius:0;
  padding:15px 23px;
  font-size:.9rem;
  text-decoration:none;
  line-height:1.5
}

.btn-siren:hover {
  background:#901b18;
  border-color:#901b18;
  color:white
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:20px;
  font-size:.95rem;
  text-decoration:none;
  border-bottom:1px solid currentColor;
  padding-bottom:4px
}

.text-link span {
  transition:transform .2s
}

.text-link:hover span {
  transform:translateX(4px)
}

.topic-strip {
  border-block:1px solid var(--line);
  padding:23px 0
}

.topic-strip .container {
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap
}

.topic-strip span {
  font-size:.7rem
}

.topic-strip b {
  color:var(--red);
  font-weight:400;
  margin-right:14px
}

.section-pad {
  padding:100px 0
}

.section-heading {
  margin-bottom:56px
}

.section-heading h2 {
  max-width:700px
}

.capability {
  padding-top:24px;
  border-top:1px solid var(--line);
  height:100%
}

.capability .mono {
  color:var(--red);
  display:block;
  margin-bottom:36px
}

.capability h3 {
  max-width:290px;
  margin-bottom:20px
}

.capability p {
  color:var(--muted);
  font-size:1rem
}

.dark-section {
  background:var(--dark);
  color:var(--paper)
}

.dark-section .muted,.dark-section .lede {
  color:#bac1b7
}

.dark-section .eyebrow::before {
  background:#f07760
}

.dark-section a:hover {
  color:#ffa493
}

.dark-section .text-link {
  color:var(--paper)
}

.feature-top {
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:flex-start;
  margin-bottom:65px
}

.feature-top h2 {
  max-width:650px
}

.feature-index {
  color:#bac1b7;
  padding-top:6px
}

.product-feature {
  border-block:1px solid #4d554c;
  padding:35px 0
}

.product-feature h3 {
  font-size:3.2rem;
  margin-bottom:12px
}

.product-feature .product-type {
  color:#bac1b7;
  font-size:.75rem
}

.product-feature p {
  max-width:540px
}

.diagram {
  border:1px solid #657062;
  padding:28px;
  max-width:510px;
  margin-left:auto;
  position:relative
}

.diagram-label {
  color:#d0d7c9;
  margin-bottom:32px;
  font-size:.65rem
}

.diagram-node {
  border:1px solid #78816f;
  padding:17px;
  text-align:center;
  font-size:.85rem
}

.diagram-line {
  height:30px;
  border-left:1px solid #a5b597;
  width:1px;
  margin:0 auto
}

.diagram-node.primary {
  background:#d6dfc5;
  color:var(--dark);
  border-color:#d6dfc5
}

.diagram-endpoints {
  display:flex;
  gap:12px
}

.diagram-endpoints .diagram-node {
  flex:1
}

.diagram-caption {
  font-size:.65rem;
  color:#bac1b7;
  margin-top:22px;
  margin-bottom:0
}

.product-row {
  display:grid;
  grid-template-columns:1fr 1.5fr auto;
  gap:32px;
  align-items:center;
  padding:30px 0;
  border-bottom:1px solid #4d554c
}

.product-row h3 {
  margin:0
}

.product-row p {
  margin:0;
  color:#bac1b7;
  font-size:1rem
}

.product-row .text-link {
  white-space:nowrap
}

.product-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:32px;
}

.product-card {
  display:flex;
  flex-direction:column;
  min-width:0;
  border-top:1px solid #4d554c;
  padding-top:24px;
}

.product-card img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  border:1px solid #4d554c;
  margin-bottom:28px;
}

.product-card .product-type {
  color:#bac1b7;
  font-size:.68rem;
  margin-bottom:18px;
}

.product-card h3 {
  font-size:clamp(2rem,3vw,2.75rem);
  margin-bottom:22px;
}

.product-promise {
  font-size:1.25rem;
  line-height:1.45;
  margin-bottom:18px;
}

.product-card .muted {
  font-size:1rem;
  margin-bottom:28px;
}

.product-card .text-link {
  align-self:flex-start;
  margin-top:auto;
}

@media(max-width:991.98px) {
  .product-grid {
    grid-template-columns:1fr;
    gap:48px;
  }
  .product-card img {
    max-height:420px;
  }
}

.statement {
  font-size:clamp(2rem,3.7vw,3.6rem);
  letter-spacing:-.04em;
  line-height:1.23;
  max-width:980px
}

.statement em {
  font-family:Georgia,serif;
  color:var(--red)
}

.company-list {
  margin-top:55px
}

.company-entry {
  border-top:1px solid var(--line);
  padding:25px 0;
  display:grid;
  grid-template-columns:1fr 1.3fr auto;
  gap:32px;
  align-items:start
}

.company-entry h3 {
  font-size:1.3rem;
  margin:0
}

.company-entry p {
  margin:0;
  font-size:1rem;
  color:var(--muted)
}

.company-entry a {
  font-size:.9rem;
  white-space:nowrap
}

.cta {
  padding:65px 0;
  border-top:1px solid var(--line)
}

.cta .container {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px
}

.cta h2 {
  font-size:clamp(2rem,3.7vw,3.6rem);
  margin-bottom:12px
}

.cta p {
  margin:0
}

.site-footer {
  background:#e9e8df;
  padding:42px 0 24px
}

.footer-top {
  display:flex;
  justify-content:space-between;
  gap:32px;
  margin-bottom:42px
}

.footer-contact {
  display:flex;
  gap:36px;
  align-items:center;
  flex-wrap:wrap;
  font-size:.9rem
}

.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid #c8cdbe;
  padding-top:22px;
  color:var(--muted);
  font-size:.75rem
}

.footer-bottom nav {
  display:flex;
  gap:22px
}

.footer-bottom a {
  text-decoration:none
}

.page-hero {
  padding:75px 0 65px;
  border-bottom:1px solid var(--line)
}

.page-hero h1 {
  font-size:clamp(3.1rem,6.3vw,6rem);
  max-width:980px;
  margin-bottom:25px
}

.page-hero .lede {
  max-width:750px
}

.breadcrumb-line {
  font-size:.8rem;
  display:flex;
  gap:12px;
  color:var(--muted);
  margin-bottom:48px
}

.detail-section {
  padding:70px 0;
  border-bottom:1px solid var(--line);
  scroll-margin-top:30px
}

.detail-section h2 {
  font-size:clamp(2.4rem,4vw,3.5rem)
}

.detail-section h3 {
  font-size:1.45rem;
  margin:30px 0 14px
}

.detail-section ul {
  padding-left:1.15rem
}

.detail-section li {
  padding:6px 0
}

.detail-label {
  margin-bottom:20px;
  display:block;
  color:var(--red)
}

.detail-text p {
  color:var(--muted)
}

.detail-text .text-link {
  margin-top:12px
}

.note {
  padding:22px 26px;
  background:#e9e8df;
  border-left:2px solid var(--red);
  font-size:.95rem
}

.faq {
  border-top:1px solid var(--line)
}

.faq details {
  border-bottom:1px solid var(--line);
  padding:24px 0
}

.faq summary {
  font-size:1.15rem;
  font-weight:500;
  cursor:pointer
}

.faq details p {
  margin:18px 0 0;
  color:var(--muted)
}

.contact-details {
  border-top:1px solid var(--line);
  margin:0
}

.contact-details>div {
  padding:28px 0;
  border-bottom:1px solid var(--line)
}

.contact-details dt {
  font-family:Consolas,'Courier New',monospace;
  text-transform:uppercase;
  font-size:.7rem;
  letter-spacing:.1em;
  color:var(--muted);
  font-weight:400;
  margin-bottom:10px
}

.contact-details dd {
  font-size:clamp(1.2rem,2.8vw,2rem);
  letter-spacing:-.025em;
  margin:0;
  overflow-wrap:anywhere
}

.contact-aside {
  padding:35px;
  background:#e7e9de
}

.contact-aside h2 {
  font-size:2rem
}

.contact-aside li {
  padding:7px 0
}

.contact-aside p {
  font-size:.95rem
}

.origin-note {
  font-family:Georgia,serif;
  font-size:1.8rem;
  line-height:1.4;
  color:var(--red);
  max-width:440px
}

@media(min-width:1400px) {
  .hero {
    padding-top:100px;
    padding-bottom:80px
  }
}

@media(max-width:991.98px) {
  .hero {
    padding-top:55px
  }
  .hero-art {
    max-width:620px;
    margin:25px auto 0
  }
  .header-inner {
    min-height:90px
  }
  .site-nav {
    gap:22px
  }
  .section-pad {
    padding:70px 0
  }
  .diagram {
    margin:30px 0 0
  }
  .company-entry {
    grid-template-columns:1fr 1.3fr
  }
  .company-entry a {
    grid-column:2
  }
  .product-row {
    grid-template-columns:1fr 1.5fr
  }
  .product-row .text-link {
    grid-column:2;
    justify-self:start
  }
  .footer-top {
    align-items:flex-start
  }
  .footer-contact {
    flex-direction:column;
    align-items:flex-start;
    gap:10px
  }
  .feature-top {
    margin-bottom:40px
  }
}

@media(max-width:575.98px) {
  .container {
    padding-left:22px;
    padding-right:22px
  }
  .header-inner {
    display:block;
    padding-top:19px;
    padding-bottom:8px
  }
  .brand {
    font-size:1.3rem
  }
  .brand img {
    width:27px;
    height:30px
  }
  .site-nav {
    justify-content:space-between;
    gap:12px;
    margin-top:12px;
    font-size:.8rem
  }
  .site-nav .nav-contact {
    border:0;
    padding:12px 0
  }
  .nav-contact span {
    margin-left:5px
  }
  .hero {
    padding:43px 0
  }
  .hero-actions {
    gap:22px
  }
  .hero-art {
    margin-top:12px
  }
  .art-caption {
    font-size:.58rem
  }
  .topic-strip .container {
    display:grid;
    grid-template-columns:1fr;
    gap:9px
  }
  .section-pad {
    padding:58px 0
  }
  .section-heading {
    margin-bottom:35px
  }
  .capability .mono {
    margin-bottom:18px
  }
  .feature-index {
    display:none
  }
  .product-feature h3 {
    font-size:2.6rem
  }
  .product-row {
    display:block;
    padding:25px 0
  }
  .product-row p {
    margin:16px 0
  }
  .company-entry {
    display:block
  }
  .company-entry p {
    margin:12px 0
  }
  .company-entry a {
    display:inline-block
  }
  .cta .container,.footer-top,.footer-bottom {
    display:block
  }
  .cta .btn-siren {
    margin-top:25px
  }
  .footer-contact {
    margin-top:25px
  }
  .footer-bottom nav {
    margin-top:15px;
    flex-wrap:wrap
  }
  .page-hero {
    padding:42px 0
  }
  .breadcrumb-line {
    margin-bottom:30px
  }
  .detail-section {
    padding:48px 0
  }
  .detail-text {
    margin-top:22px
  }
  .contact-aside {
    padding:25px
  }
  .diagram {
    padding:20px
  }
}

@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    transition:none!important;
    scroll-behavior:auto!important
  }
}

.hero-art .hero-scene {
  aspect-ratio:1.12;
  object-fit:cover;
  object-position:48% center;
  border:1px solid var(--line)
}

.art-caption {
  margin-top:16px
}

.dark-section {
  color:#f4f2eb
}

.dark-section .text-link {
  color:#f4f2eb
}

.brand>span {
  font-weight:700
}

.brand>span>span {
  font-weight:400
}

@media(max-width:575.98px) {
  .row {
    --bs-gutter-x:1.5rem
  }
  .page-hero h1 {
    font-size:clamp(2.25rem,12vw,3.1rem)
  }
}

@media(prefers-color-scheme:dark) {
  :root {
    --paper:#151a18;
    --white:#1e2521;
    --ink:#efefe7;
    --muted:#b4bcb1;
    --red:#ff8b75;
    --line:#3b463e;
    --dark:#101512;
    --bs-body-color:var(--ink);
    --bs-body-bg:var(--paper);
    --bs-link-color:var(--red);
    --bs-link-hover-color:#ffb8a9
  }
  body {
    background:var(--paper);
    color:var(--ink)
  }
  .btn-siren {
    background:#b62320;
    border-color:#b62320
  }
  .site-footer,.contact-aside,.note {
    background:#202822
  }
  .footer-bottom {
    border-color:var(--line)
  }
  .site-nav .nav-contact {
    border-color:#63715f
  }
  .skip-link {
    background:#efefe7;
    color:#151a18
  }
  .skip-link:focus {
    color:#151a18
  }
  .hero-art .hero-scene {
    border-color:#4b5549
  }
}

@media print {
  body {
    background:white;
    color:black
  }
  .site-header,.site-footer,.cta,.hero-art,.hero-actions {
    display:none
  }
  .dark-section {
    background:white;
    color:black
  }
  .dark-section .muted,.dark-section .lede,.dark-section .text-link {
    color:#333
  }
  .section-pad,.detail-section,.page-hero {
    padding:24px 0
  }
  a {
    color:black
  }
  details {
    display:block
  }
  details::details-content {
    content-visibility:visible
  }
}