.technology-header { background: #0a1219; border-bottom: 1px solid #405366; }
.technology-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 1.25rem; }
.technology-nav .brand { display: block; }
.technology-hero { background: linear-gradient(125deg, #0b1118, #142b40); }
.technology-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); align-items: center; gap: clamp(1.5rem, 6vw, 5rem); padding-block: clamp(3rem, 8vw, 7rem); }
.technology-page h1, .technology-page h2 { font-family: Georgia, serif; line-height: 1.12; }
.technology-page h1 { margin: .25em 0; font-size: clamp(2.5rem, 6vw, 5rem); }
.technology-page h2 { margin: .4em 0; font-size: clamp(1.75rem, 4vw, 3rem); }
.technology-kicker { color: #a6cdef; font-size: .8rem; font-weight: 800; letter-spacing: .14em; }
.technology-lead { color: #c6e2f8; font-size: clamp(1.2rem, 3vw, 1.6rem); }
.technology-art { display: block; width: 100%; max-width: 25rem; height: auto; justify-self: center; border: 1px solid #54718a; }
.technology-section { padding-block: clamp(2.5rem, 7vw, 5rem); }
.technology-section > p { max-width: 65ch; }
.technology-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 1.5rem; }
.technology-grid article { padding: 1.25rem; background: #142332; border: 1px solid #486078; border-top: 3px solid #84b8cb; }
.technology-grid h3 { margin-top: 0; }
.technology-grid p { margin-bottom: 0; color: #d3dce4; }
.technology-examples, .technology-contact { background: #101e2c; }
.technology-button { background: #bbdbf4; color: #0b2034; }
.technology-button:hover { background: #e0f0fc; }
@media (max-width: 46rem) {
  .technology-hero-grid, .technology-grid { grid-template-columns: 1fr; }
  .technology-art { justify-self: start; }
}