:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  color: #172b43;
  background: #f7f9fc;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; }
a { color: #09669b; text-underline-offset: 3px; }
a[href^="mailto:"] { overflow-wrap: anywhere; }
a:hover { color: #064e78; }
a:focus-visible { outline: 3px solid #24b5df; outline-offset: 4px; border-radius: 3px; }

.site-shell { min-height: 100vh; display: flex; flex-direction: column; }
.site-header, main, .site-footer { width: min(100% - 64px, 1120px); margin-inline: auto; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 86px; border-bottom: 1px solid #e0e8f1; }
.wordmark { display: inline-flex; align-items: center; gap: 11px; color: #122940; font-size: 24px; font-weight: 780; letter-spacing: -.055em; text-decoration: none; white-space: nowrap; }
.brand-mark { width: 20px; height: 20px; display: inline-block; border: 5px solid #0b90bf; border-radius: 50%; box-shadow: 9px -7px 0 -5px #50cae7; }
.site-header nav, .site-footer nav { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; }
.site-header nav a, .site-footer nav a { color: #476075; font-size: 14px; font-weight: 600; text-decoration: none; }
.site-header nav a:hover, .site-footer nav a:hover, .site-header nav a[aria-current] { color: #09669b; }

main { flex: 1; }
.hero { position: relative; overflow: hidden; padding: clamp(68px, 10vw, 128px) min(7vw, 76px); margin-top: 38px; background: linear-gradient(135deg, #eaf5fb 0%, #f4f9fd 55%, #fff 100%); border: 1px solid #dbeaf4; border-radius: 24px; }
.hero::after { content: ""; position: absolute; width: 480px; height: 480px; right: -180px; bottom: -300px; border: 72px solid rgba(28, 159, 205, .08); border-radius: 50%; pointer-events: none; }
.eyebrow { margin: 0 0 20px; color: #087ba8; font-size: 12px; font-weight: 800; letter-spacing: .16em; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: #11263d; letter-spacing: -.045em; }
.hero h1 { max-width: 720px; margin-bottom: 22px; font-size: clamp(40px, 5.8vw, 72px); line-height: 1.07; font-weight: 760; }
.lead { position: relative; max-width: 665px; margin-bottom: 0; color: #455d72; font-size: clamp(17px, 1.7vw, 20px); line-height: 1.7; }
.hero-app-card { position: relative; z-index: 1; max-width: 680px; margin-top: 36px; padding: 24px 28px; background: rgba(255, 255, 255, .92); border: 1px solid #d4e4f0; border-radius: 16px; box-shadow: 0 8px 24px rgba(20, 50, 82, .04); }
.hero-app-card .product-tag { margin-bottom: 8px; }
.hero-app-card h2 { margin-bottom: 10px; font-size: clamp(22px, 2.4vw, 28px); color: #11263d; letter-spacing: -.03em; }
.hero-app-card p:not(.product-tag) { margin-bottom: 0; color: #425c72; font-size: clamp(15px, 1.4vw, 16px); line-height: 1.65; }

.product-section { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr); gap: 45px; align-items: start; padding: 88px 24px; }
.section-intro h2 { margin-bottom: 0; font-size: clamp(30px, 3.5vw, 42px); }
.product-card { padding: clamp(26px, 4vw, 42px); background: #fff; border: 1px solid #dce5ee; border-radius: 18px; box-shadow: 0 15px 45px rgba(20, 50, 82, .045); }
.product-tag { margin-bottom: 20px; color: #087ba8; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.product-card h3 { margin-bottom: 14px; font-size: 28px; }
.product-card p { color: #425c72; line-height: 1.7; }
.product-card .small-copy { margin-bottom: 0; color: #6b8091; font-size: 13px; }
.contact-section { padding: 36px 24px 85px; border-top: 1px solid #e0e8f1; }
.contact-section h2 { margin-bottom: 10px; font-size: 28px; }
.contact-section p { margin-bottom: 0; color: #476075; line-height: 1.7; }

.document-page { max-width: 860px; padding-block: 68px 92px; }
.document-page h1 { margin-bottom: 9px; font-size: clamp(38px, 5vw, 54px); }
.effective-date { margin-bottom: 36px; color: #61788c; font-size: 14px; }
.document-page h2 { margin: 38px 0 10px; font-size: 22px; }
.document-page p { color: #40596d; font-size: 16px; line-height: 1.8; }

.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 100px; padding-block: 24px; border-top: 1px solid #e0e8f1; color: #61788c; font-size: 13px; }

@media (max-width: 700px) {
  .site-header, main, .site-footer { width: min(100% - 36px, 1120px); }
  .site-header { min-height: 74px; }
  .hero { margin-top: 18px; padding: 54px 27px 64px; border-radius: 17px; }
  .hero::after { width: 260px; height: 260px; right: -145px; bottom: -180px; border-width: 44px; }
  .hero-app-card { margin-top: 24px; padding: 18px 20px; border-radius: 14px; }
  .product-section { grid-template-columns: 1fr; gap: 24px; padding: 66px 4px; }
  .contact-section { padding: 30px 4px 70px; }
  .document-page { padding-block: 54px 76px; }
  .site-footer { align-items: flex-start; flex-direction: column; gap: 14px; }
}

@media (max-width: 390px) {
  .wordmark { font-size: 21px; }
  .site-header nav { gap: 11px; }
  .site-header nav a { font-size: 13px; }
}

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