:root { --vision-ink: #182734; --vision-muted: #4b5b65; --vision-blue: #0d5961; --vision-pale: #eef7f5; --vision-line: #dbe5e4; }
.vision-hero { background: linear-gradient(135deg, #e9f4f0 0%, #f9faf6 58%, #fff7de 100%); padding: 7rem 1.5rem 4rem; }
.vision-hero .container { max-width: 1152px; }
.vision-eyebrow { color: var(--vision-blue); font-size: .82rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.vision-hero h1 { max-width: 850px; font-size: clamp(2.35rem, 5vw, 4.6rem); line-height: 1.08; letter-spacing: -.035em; margin: 1rem 0 1.3rem; }
.vision-lead { max-width: 760px; font-size: clamp(1.12rem, 2vw, 1.45rem); line-height: 1.55; color: var(--vision-muted); }
.vision-actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2rem; }
.vision-actions .button { white-space: normal; height: auto; min-height: 3rem; padding: .7rem 1.25rem; font-weight: 700; }
.vision-secondary { border: 1px solid #a7bbb8; background: #fff; color: var(--vision-ink); }
.vision-main { background: #fff; }
.vision-section { padding: 4.5rem 1.5rem; }
.vision-section.is-tinted { background: var(--vision-pale); }
.vision-section .container { max-width: 1152px; }
#face-recognition { scroll-margin-top: 5rem; }
.vision-section h2 { font-size: clamp(1.85rem, 3vw, 2.6rem); line-height: 1.2; margin: .2rem 0 1.1rem; }
.vision-section h3 { font-size: 1.25rem; margin: 0 0 .65rem; }
.vision-section p, .vision-section li { color: var(--vision-muted); line-height: 1.7; }
.vision-section p + p { margin-top: 1rem; }
.vision-section a:not(.button) { color: #075c69; text-decoration: underline; text-underline-offset: .16em; }
.vision-section a:not(.button):hover { color: #073b44; }
.vision-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 1.25rem; margin-top: 2rem; }
.vision-copy { max-width: 780px; }
.vision-card { background: #fff; border: 1px solid var(--vision-line); border-radius: 12px; padding: 1.5rem; height: 100%; }
.vision-card p { margin-bottom: 1rem; }
.vision-card a { font-weight: 700; }
.vision-media { border: 1px solid var(--vision-line); border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 15px 35px rgba(24, 39, 52, .08); }
.vision-media img, .vision-media video { display: block; width: 100%; height: auto; }
.vision-media figcaption { font-size: .85rem; color: var(--vision-muted); padding: .75rem 1rem; }
.vision-video-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.vision-video-pair .vision-media { margin: 0; }
.vision-video-pair .vision-media figcaption { font-size: .75rem; padding: .6rem .65rem; }
.vision-video-pair video { aspect-ratio: 16 / 9; object-fit: cover; }
.vision-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 3rem; }
.vision-split.is-reversed .vision-media { order: -1; }
.vision-list { padding-left: 1.25rem; margin-top: 1rem; }
.vision-list li { margin-bottom: .65rem; }
.vision-breadcrumb { font-size: .85rem; margin-bottom: 1.25rem; }
.vision-breadcrumb a { color: #245c61; text-decoration: underline; }
.vision-breadcrumb span { padding: 0 .45rem; color: #64767b; }
.vision-callout { border-left: 4px solid #dfac00; background: #fff9e4; padding: 1.2rem 1.5rem; margin-top: 1.5rem; }
.vision-callout p { margin: 0; }
.vision-cta { background: #18313b; color: #fff; text-align: center; }
.vision-cta h2, .vision-cta p { color: #fff; }
.vision-cta p { max-width: 700px; margin: 0 auto; opacity: .9; }
.vision-cta .vision-actions { justify-content: center; }
.vision-footer { padding: 3rem 1.5rem; background: #10242d; color: #dce9e7; }
.vision-footer a { color: #fff; }
.vision-footer .container { max-width: 1152px; }
.vision-footer-links { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: 1rem 0; }
@media (max-width: 768px) {
  .vision-hero { padding-top: 6rem; }
  .vision-section { padding: 3rem 1.25rem; }
  .vision-grid, .vision-split { grid-template-columns: 1fr; }
  .vision-split.is-reversed .vision-media { order: 0; }
}
@media (max-width: 560px) {
  .vision-video-pair { grid-template-columns: 1fr; }
}