/* Main visual: original R4 front and oblique motion renders. */
.hero-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:48px;padding-top:60px;padding-bottom:60px}
.hero h1{font-size:55px;line-height:1.27;letter-spacing:-.065em;white-space:nowrap}
.hero-copy{padding:8px 0}
.hero .eyebrow{font-size:9px;letter-spacing:1.5px}
.hero-desc{font-size:16px;margin-top:25px}
.hero-actions{margin:27px 0 34px;gap:20px}
.hero-actions .button{font-size:13px;padding:16px 20px;gap:22px}
.hero-actions .text-link{font-size:12px;gap:13px}
.hero-region{font-size:10px;gap:8px}
.hero-region .divider{margin:0 2px}
.hero-motion{min-width:0;background:white;border:1px solid #d9e3e9;box-shadow:0 12px 32px #12365a06}
.motion-top{min-height:68px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:15px 22px;border-bottom:1px solid #e3ebf0}
.motion-title{display:flex;gap:10px;align-items:center;font-size:11px;color:#577084;line-height:1.6}
.motion-title b{display:block;font-weight:700;color:var(--navy);font-size:14px}
.motion-title .status-dot{flex-shrink:0}
.motion-views{display:flex;border:1px solid #d8e3eb;padding:3px;background:#f6f8fa;gap:2px;flex-shrink:0}
.motion-views button{font-size:11px;background:none;border:0;padding:8px 14px;color:#61788a;min-height:34px;white-space:nowrap}
.motion-views button[aria-pressed=true]{background:var(--navy);color:#fff;box-shadow:0 1px 3px #12365a14}
.motion-screen{background:#f3f6fa;aspect-ratio:16/9}
.motion-screen video{display:block;width:100%;height:100%;object-fit:contain;filter:none}
.motion-bottom{padding:17px 22px;border-top:1px solid #e3ebf0;display:flex;justify-content:space-between;align-items:center;gap:16px}
.motion-bottom p{font-size:12px;color:var(--navy);font-weight:700;line-height:1.5}
.motion-bottom small{font-weight:400;display:block;font-size:10px;color:#7d8e9c;margin-top:4px}
.motion-actions{display:flex;align-items:center;gap:16px;flex-shrink:0}
.motion-actions button{background:none;border:0;padding:7px 0;font-size:11px;color:var(--navy);display:flex;align-items:center;gap:6px}
.motion-actions button:hover{color:var(--blue)}
#motion-play [data-play-icon]{font-size:13px;font-weight:700;width:13px;text-align:center}
#motion-expand{border-left:1px solid #d6e0e7;padding-left:16px}
#motion-expand>span{font-size:17px}
#motion-error{font-size:11px;color:#884626;padding:12px 20px;background:#fbf4ed}
#animation-dialog{width:min(1200px,calc(100% - 36px));max-height:94dvh;background:#fff}
.animation-dialog-top{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--line);gap:20px;position:sticky;top:0;background:white;z-index:2}
.animation-dialog-top h2{font-size:19px;letter-spacing:-.03em}
.animation-dialog-top .icon-button{flex-shrink:0}
.animation-dialog-toolbar{display:flex;justify-content:space-between;align-items:center;padding:14px 24px;gap:20px}
.animation-dialog-toolbar>span{font-size:11px;color:#7d8e9c}
#expanded-motion-video{display:block;width:100%;height:auto;max-height:calc(94dvh - 145px);object-fit:contain;background:#f3f6fa}
@media(min-width:1500px){.hero-grid{gap:60px;padding-top:75px;padding-bottom:75px}.hero h1{font-size:57px}}
@media(max-width:1150px){.hero-grid{gap:30px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.hero h1{font-size:45px}.hero-desc{font-size:14px}.hero .eyebrow{font-size:8px;letter-spacing:1.2px}.motion-top{padding:14px 16px;gap:10px}.motion-title{font-size:10px;gap:7px}.motion-title b{font-size:12px}.motion-views button{font-size:10px;padding:7px 10px}.motion-bottom{padding:15px 16px;gap:12px}.motion-actions{gap:10px}.motion-actions button{font-size:10px}.motion-bottom small{font-size:9px}#motion-expand{padding-left:10px}.hero-actions{margin-bottom:25px;gap:17px}.hero-actions .button{font-size:12px;padding:15px 17px}.hero-region{font-size:9px;gap:6px}}
@media(max-width:850px){.hero-grid{grid-template-columns:1fr;gap:32px;padding:40px 0}.hero-copy{padding:0}.hero h1{font-size:52px}.hero-desc{font-size:15px;line-height:1.9;margin-top:18px}.hero-actions{margin:24px 0 22px}.hero-region{font-size:10px}.hero-region .divider{display:block}.hero-region span:last-child{width:auto;margin-left:0}.motion-top{padding:16px 20px}.motion-title{font-size:11px}.motion-title b{font-size:14px}.motion-views button{font-size:11px;padding:8px 15px}.motion-bottom{padding:17px 20px}.motion-bottom small{font-size:10px}.motion-actions button{font-size:11px}.hero-motion{width:100%}.animation-dialog-top h2{font-size:17px}}
@media(max-width:600px){.hero-grid{gap:28px;padding-top:34px;padding-bottom:26px}.hero h1{font-size:46px}.hero .eyebrow{font-size:8px}.hero-desc{font-size:13px;margin-top:19px}.hero-actions{gap:17px;margin-bottom:22px}.hero-actions .button{font-size:11px;min-height:48px;padding:14px 15px;gap:13px}.hero-actions .text-link{font-size:10px;gap:7px}.hero-region{font-size:9px;gap:5px}.hero-region .divider{margin:0 2px}.motion-top{padding:13px 13px;min-height:65px;gap:8px}.motion-title{font-size:9px;gap:6px}.motion-title b{font-size:11px}.motion-views{padding:2px;gap:1px}.motion-views button{font-size:10px;padding:7px 10px;min-height:31px}.motion-bottom{padding:13px;gap:10px;flex-wrap:wrap}.motion-bottom p{font-size:11px}.motion-bottom small{font-size:9px}.motion-actions{gap:10px}.motion-actions button{font-size:10px}.motion-bottom small{display:none}#animation-dialog{width:100%;max-width:100%;max-height:100dvh;margin:auto 0}.animation-dialog-top{padding:16px;gap:12px}.animation-dialog-top h2{font-size:14px;line-height:1.5}.animation-dialog-toolbar{padding:12px 16px;gap:10px}.animation-dialog-toolbar>span{font-size:9px}#expanded-motion-video{max-height:calc(100dvh - 140px)}}
@media(max-width:360px){.hero h1{font-size:40px}.motion-title>span:last-child{font-size:8px}.motion-title b{font-size:10px}.motion-views button{padding:7px 8px}}

/* Keep the two main actions aligned as adjacent rectangular buttons. */
.hero-actions{display:grid;grid-template-columns:1.1fr 1fr;gap:12px;max-width:420px}
.hero-actions .button{min-width:0;padding-left:12px;padding-right:12px;gap:10px;white-space:nowrap}
.hero-actions .button.outline{border-color:var(--navy)}
@media(max-width:1150px){.hero-actions{gap:10px}.hero-actions .button{padding-left:10px;padding-right:10px;gap:8px}}
@media(max-width:360px){.hero-actions .button{font-size:10px;gap:6px;padding-left:8px;padding-right:8px}}

/* Main contact number above the hero eyebrow. */
.hero-contact-phone{display:table;margin-bottom:18px;color:var(--navy);font-size:54px;font-weight:800;letter-spacing:-.035em;line-height:1.35;font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.hero-copy .hero-contact-phone{margin-bottom:4px}
.hero-patent-tagline{font-size:18px;font-weight:650;letter-spacing:-.025em;line-height:1.5;color:var(--ink);margin:0 0 22px}
@media(max-width:600px){.hero-patent-tagline{font-size:16px;margin-bottom:20px}}
.hero-contact-phone:hover{color:var(--blue)}
@media(max-width:600px){.hero-contact-phone{font-size:44px;margin-bottom:16px}}

/* All three views remain reachable on narrow screens. */
@media(max-width:600px){
  .motion-top{flex-wrap:wrap;gap:10px}
  .motion-top .motion-views{width:100%}
  .motion-top .motion-views button{flex:1;min-height:36px;font-size:11px}
  .animation-dialog-toolbar{flex-wrap:wrap}
  .animation-dialog-toolbar .motion-views{max-width:100%}
}