/* UI refinement on top of the original Figma layout. No asset substitutions. */
:root { --ui-ease: cubic-bezier(.22,.68,0,1); }
body { -webkit-font-smoothing: antialiased; }
.header { border-bottom-color: #e7edf5; box-shadow: 0 3px 18px #0b1f3a05; }
.links > a,.menu-trigger { transition: color 180ms ease, background-color 180ms ease; }
.links > a:not(.cta):hover,.menu-trigger:hover { color: #0363b8; }
.dropdown { border-color: #e4ebf4; border-radius: 12px; padding: 10px; box-shadow: 0 16px 40px #0b1f3a18; }
.dropdown a { border-radius: 7px; transition: background-color 180ms ease,color 180ms ease; }
.cta,main .action.clickable,main button[type=submit] { border-radius: 8px; transition: transform 220ms var(--ui-ease),box-shadow 220ms ease,filter 220ms ease; }
main .ui-card { box-shadow: 0 6px 22px -10px #193c652b,inset 0 0 0 1px #7794b51c; transition: transform 280ms var(--ui-ease),box-shadow 280ms ease; }
main .ui-card:focus-within { box-shadow: 0 12px 32px -12px #1268e84d,inset 0 0 0 1px #1268e855; }
main .clickable { transition: color 180ms ease,filter 180ms ease; }
.form-control { transition: box-shadow 180ms ease,border-color 180ms ease,background-color 180ms ease; }
.form-control:focus { border-color: #1268e8 !important; background: #fff !important; box-shadow: 0 0 0 4px #1268e812; }
.footer { border-top: 1px solid #ffffff12; }
dialog { box-shadow: 0 24px 90px #03162c40; }
dialog::backdrop { background: #03162c80; backdrop-filter: blur(5px); }
main .ui-enter { animation: ui-enter 620ms var(--ui-ease) both; }
@keyframes ui-enter { from { opacity: .35; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
@media (hover:hover) and (pointer:fine) {
  main .ui-card-interactive:hover { transform: translateY(-4px); box-shadow: 0 16px 34px -14px #1268e84a,inset 0 0 0 1px #1268e843; }
  .cta:hover,main .action.clickable:hover,main button[type=submit]:hover { transform: translateY(-2px); box-shadow: 0 8px 18px #0363b82b; }
}
@media (min-width:901px) {
  /* Let the home card rows fill the same content width as their headings. */
  .page-home :is(.n-2-40,.n-2-45,.n-2-50,.n-2-55,.n-2-64,.n-2-67,.n-2-70,.n-2-73,.n-2-81,.n-2-85,.n-2-89,.n-2-96,.n-2-98,.n-2-100,.n-2-102,.n-2-104,.n-2-110,.n-2-114,.n-2-118) { flex: 1 1 0; }
}
@media (max-width:900px) {
  .links.open { max-height: calc(100dvh - 72px); overflow-y: auto; box-shadow: 0 18px 32px #0b1f3a18; }
  .mobile-toggle { border-radius: 8px; }
  main .design-section { padding-top: 44px; padding-bottom: 44px; }
  main .ui-card { border-radius: 12px; }
  .footer { padding-top: 36px; padding-bottom: 36px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  main .ui-enter { animation: none; }
  .ui-card,.cta,.clickable,.form-control,.dropdown a,.links>a,.menu-trigger { transition: none !important; }
}
@media (min-width:901px) {
  .page-home .row:has(>.n-2-40),.page-home .row:has(>.n-2-64),.page-home .row:has(>.n-2-81),.page-home .row:has(>.n-2-96),.page-home .row:has(>.n-2-110) { width: 1296px; }
}
/* Homepage customer stories — user supplied image reference. */
.page-home .n-2-106 { height: auto; padding: 40px 72px 48px; gap: 20px; }
.page-home .n-2-108 { width: 100%; height: auto; font-size: 36px; line-height: 1.4; margin-bottom: 8px; }
.page-home .n-2-108 span { font-size: inherit !important; line-height: inherit !important; }
.page-home .n-2-109 { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); width: 1296px; height: auto; gap: 20px; align-items: stretch; }
.page-home .n-2-109 > .ui-card { display: flex; flex-direction: column; width: 100%; height: auto; padding: 0; gap: 0; border-radius: 14px; overflow: hidden; border: 1px solid #d6e5fa; box-shadow: none; background: #fff; }
.page-home .home-case-photo { display: block; width: 100%; height: 190px; object-fit: cover; object-position: center; flex-shrink: 0; }
.page-home .home-case-body { display: flex; flex-direction: column; align-items: flex-start; width: 100%; min-height: 166px; padding: 20px 22px; gap: 16px; }
.page-home .home-case-body > .text-node { width: 100%; height: auto; white-space: normal; }
.page-home .home-case-body > .text-node:first-child { font-size: 16px; line-height: 24px; color: #395474; }
.page-home .home-case-body > .text-node:nth-child(2) { font-size: 20px; line-height: 30px; font-weight: 700; color: #0b1f3a; }
.page-home .home-case-body > .text-node:last-child { margin-top: auto; padding-top: 14px; font-size: 16px; line-height: 24px; color: #0085ff; }
.page-home .home-case-body .text-node span { font-size: inherit !important; line-height: inherit !important; color: inherit !important; }
@media(max-width:900px) {
  .page-home .n-2-106 { padding: 40px 24px; }
  .page-home .n-2-108 { font-size: 26px; }
  .page-home .n-2-109 { width: 100%; grid-template-columns: 1fr; gap: 20px; }
  .page-home .home-case-photo { height: auto; aspect-ratio: 2.18; }
  .page-home .home-case-body { min-height: 166px; }
}
@media(max-width:900px) {
  .page-home .home-case-body > .text-node:nth-child(2) { font-size: 18px; line-height: 28px; text-wrap: pretty; }
}
/* User supplied contact map, displayed in full without cropping. */
.page-about .n-334-18 { height: auto; align-items: center; }
.page-about .n-334-20 { height: auto; overflow: hidden; aspect-ratio: 1191 / 747; }
.page-about .contact-location-image { display: block; width: 100%; height: auto; aspect-ratio: 1191 / 747; }
@media(max-width:900px) {
  .page-about .n-334-20 { width: 100%; min-height: 0 !important; flex-basis: 100% !important; }
  .page-about .contact-location-image { height: auto; aspect-ratio: 1191 / 747; }
}
.site-copyright { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px 18px; padding:20px 24px; background:#061221; color:#a6bdd6; border-top:1px solid #ffffff12; font-size:13px; line-height:1.8; text-align:center; }
.site-copyright a:hover { color:#fff; text-decoration:underline; text-underline-offset:4px; }
@media(max-width:600px) { .site-copyright { flex-direction:column; gap:4px; font-size:12px; } }
/* Match the dark left-to-right treatment of the other product hero images. */
.page-products-vr-teleoperation .n-12-6 {
  background-image: linear-gradient(90deg, rgba(3,13,31,.88) 0%, rgba(3,22,43,.65) 48%, rgba(3,28,51,.28) 100%), url('/assets/figma/12-6.png');
}
/* Shared footer contact details. */
.footer { height: auto; min-height: 197.5px; }
.footer .footer-layout { display: flex; align-items: center; justify-content: space-between; gap: 48px; }
.footer-brand { min-width: 0; }
.footer-contact { display: flex; flex-direction: column; gap: 14px; font-size: 14px; line-height: 1.6; font-style: normal; }
.footer-contact > div { display: flex; gap: 20px; }
.footer-contact > div > span:first-child { color: #809eba; flex-shrink: 0; }
.footer-contact a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
@media(max-width:900px) {
  .footer .footer-layout { flex-direction: column; align-items: stretch; gap: 28px; }
  .footer-contact { padding-top: 24px; border-top: 1px solid #ffffff12; font-size: 13px; }
  .footer-contact > div { gap: 16px; }
}
