/* =============================================================================
   ARS Robots — pure CSS, self-hosted, zero third-party origins.
   Every colour, font size, line height and block position below was MEASURED in
   real Chrome at 1440x900 against the client's own live site on 2026-09-02.
   Design tokens: ink #141416 · surface #3F4349 · accent #F20000 · soft #FD6262
                  grey #8A8A8A · text #FFFFFF
   ========================================================================== */

/* ---- self-hosted fonts (no Google, no parastorage) ---------------------- */
@font-face{font-family:"Open Sans";src:url("../fonts/opensans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Open Sans";src:url("../fonts/opensans-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("../fonts/poppins-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("../fonts/poppins-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Poppins";src:url("../fonts/poppins-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --ink:#141416; --surface:#3F4349; --accent:#F20000; --soft:#FD6262;
  --grey:#8A8A8A; --text:#FFFFFF;
  --sans:"Open Sans",Arial,Helvetica,sans-serif;
  --display:"Poppins","Open Sans",Arial,sans-serif;
  --canvas:1440px;
}

*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.8}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,p,ul{margin:0}
ul{list-style:none;padding:0}

/* ---- accessibility: the skip link the Wix copy lost --------------------- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--accent);color:#fff;
  padding:12px 20px;font-family:var(--sans);font-size:14px;text-decoration:none;border-radius:0 0 5px 0}
.skip-link:focus{left:0}
:focus-visible{outline:3px solid var(--soft);outline-offset:2px}

/* ---- shared -------------------------------------------------------------- */
.canvas{position:relative;width:100%;max-width:var(--canvas);margin:0 auto;height:100%}
.bg-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
section{position:relative;overflow:hidden}
section > .canvas{z-index:2}

.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;
  font-family:var(--sans);font-size:16px;line-height:22.4px;font-weight:400;color:var(--text);
  text-decoration:none;border-radius:5px;border:1px solid var(--text);background:transparent;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease;cursor:pointer}
.btn:hover,.btn:focus-visible{background:var(--text);color:var(--ink)}
.btn-solid{background:var(--accent);border-color:var(--soft);color:var(--text)}
.btn-solid:hover,.btn-solid:focus-visible{background:var(--soft);color:var(--ink)}
.btn-sm{width:120px;height:45px}
.btn-wide{width:198px;height:55px}

/* ---- header -------------------------------------------------------------- */
.site-header{position:absolute;top:0;left:0;right:0;height:90px;z-index:20;
  display:flex;align-items:center;justify-content:flex-end;gap:0;
  width:100%;max-width:var(--canvas);margin:0 auto;padding:0 113px 0 0}
.nav-list{display:flex;align-items:center}
.nav-list a{display:block;font-size:14px;line-height:50px;text-decoration:none;text-align:center;color:var(--text)}
.nav-list li:nth-child(1) a{width:70px}
.nav-list li:nth-child(2) a{width:90px}
.nav-list li:nth-child(3) a{width:80px}
.nav-list a:hover,.nav-list a[aria-current=page]{color:var(--soft)}
.site-header .btn-sm{margin-left:124px}

/* ---- hero ---------------------------------------------------------------- */
.hero{background:var(--ink)}
.hero-home{height:921px}
.hero-home .bg-media{filter:brightness(.62)}
.hero-inner{padding-top:0}
.hero-logo{position:absolute;left:210px;top:158px;width:860px}
.hero-logo .logo{width:860px;height:316px;object-fit:contain}
.hero-lede{position:absolute;left:248px;top:493px;width:771px;font-size:30px;line-height:1.4;color:var(--text)}
.hero-inner > .btn{position:absolute;left:260px;top:641px;width:142px;height:55px}

.hero-inner-page{height:433px}
.hero-inner-page .bg-media{filter:brightness(.55)}
.hero-h1{position:absolute;left:71px;top:152px;width:820px;
  font-family:var(--display);font-weight:700;font-size:60px;line-height:72px;color:var(--accent)}
.page-contact .hero-inner-page{height:428px}
.hero-h1-contact{top:161px;line-height:1.2}
.contact-lede{position:absolute;left:71px;top:257px;width:600px;
  font-family:var(--display);font-weight:700;font-size:30px;line-height:42px;color:var(--text)}

/* ---- home: automation strip --------------------------------------------- */
.s-automation{height:1010px;background:var(--ink)}
.s-automation::before{content:"";position:absolute;left:0;right:0;top:0;height:989px;background:var(--surface);z-index:1}
.auto-grid{z-index:2}
.auto-media{position:absolute;left:-1px;top:1px;width:690px}
.auto-media .cobot{width:690px;height:987px;object-fit:cover}
.auto-copy{position:absolute;left:92px;top:0;width:620px}
.auto-copy h2{font-family:var(--display);font-weight:700;font-size:32px;line-height:44.8px;color:var(--text)}
.auto-copy p{font-size:16px;line-height:28.8px;color:var(--text);margin-top:22px;
  background:rgba(20,20,22,.55);padding:14px 18px;border-radius:6px}
.cards{position:absolute;left:803px;top:0;width:560px}
.card{position:absolute;width:170px}
.card h3{font-family:var(--display);font-weight:600;font-size:18px;line-height:1.45;color:var(--grey)}
.card p{font-size:14px;line-height:22.4px;color:var(--text);margin-top:11px}
.card-1{left:0;top:21px}
.card-2{left:212px;top:141px}
.card-3{left:0;top:546px}
.card-4{left:212px;top:667px}

/* ---- home: design strip -------------------------------------------------- */
.s-design{height:671px;background:var(--ink)}
.s-design::before{content:"";position:absolute;left:50%;transform:translateX(-50%);top:0;
  width:1300px;max-width:100%;height:671px;background:var(--surface);z-index:1}
.design-grid{z-index:2}
.design-video{position:absolute;left:71px;top:-235px;width:648px;height:1155px;overflow:hidden;border-radius:4px}
.design-video video{width:100%;height:100%;object-fit:cover}
.design-still{position:absolute;left:720px;top:1px;width:649px}
.design-still img{width:649px;height:683px;object-fit:cover}
.design-copy{position:absolute;left:668px;top:36px;width:753px;z-index:3}
.design-copy h2{font-family:var(--display);font-weight:700;font-size:30px;line-height:42px;color:var(--text);
  max-width:492px;text-align:center;margin-left:-516px}
.design-copy p{margin-top:-70px;font-size:12px;line-height:21.6px;font-weight:700;color:var(--text);
  background:rgba(20,20,22,.55);padding:16px 20px;border-radius:6px}
.design-copy .btn{position:absolute;left:281px;top:431px;width:153px;height:59px}

/* ---- home: OEM + partners ------------------------------------------------ */
.s-oem{height:735px;background:var(--ink)}
.s-oem .bg-media{filter:brightness(.5)}
.s-oem h2,.s-partners h2{position:absolute;left:393px;width:653px;text-align:center;
  font-family:var(--display);font-weight:700;font-size:30px;line-height:1.45;color:var(--text)}
.s-oem h2{top:137px}
.logo-row{position:absolute;left:0;top:0;width:100%;height:0}
.logo-row li{position:absolute}
.logo-row img{object-fit:contain}
/* measured x/y from the client's own page; the rows genuinely overlap there */
.logo-row-oem li:nth-child(1){left:282px;top:285px}
.logo-row-oem li:nth-child(2){left:435px;top:299px}
.logo-row-oem li:nth-child(3){left:609px;top:310px}
.logo-row-oem li:nth-child(4){left:870px;top:294px}
.logo-row-oem li:nth-child(5){left:1034px;top:299px}
.s-partners{height:273px;background:var(--ink)}
.s-partners .bg-media{object-position:left top;filter:brightness(.5)}
.s-partners h2{top:2px}
.logo-row-par li:nth-child(1){left:0;top:63px}
.logo-row-par li:nth-child(2){left:368px;top:119px}
.logo-row-par li:nth-child(3){left:607px;top:137px}
.logo-row-par li:nth-child(4){left:767px;top:94px}
.logo-row-par li:nth-child(5){left:976px;top:63px}

/* ---- CTA ----------------------------------------------------------------- */
.s-cta{background:var(--ink)}
.s-cta-home{height:1836px}
.cta-arm{left:50%;transform:translateX(-50%);width:100%;max-width:var(--canvas);filter:brightness(.55)}
.cta-badge{position:absolute;left:111px;top:99px;width:500px;height:500px;border-radius:50%;overflow:hidden}
.cta-badge video{width:100%;height:100%;object-fit:cover}
.s-cta-home .cta-body{position:absolute;left:643px;top:60px;width:790px;
  font-size:27px;line-height:35.1px;font-weight:700;color:var(--text)}
.s-cta-home .cta-head{position:absolute;left:180px;top:306px;width:360px;text-align:center;
  font-family:var(--display);font-weight:700;font-size:30px;line-height:42px;color:var(--text)}
.s-cta-home .btn{position:absolute;left:1014px;top:343px;width:142px;height:55px}

.s-cta-inner{height:779px}
.s-cta-inner .bg-media{filter:brightness(.45)}
.s-cta-inner .cta-badge{left:210px;top:171px}
.s-cta-inner .cta-body{position:absolute;left:953px;top:313px;width:340px;font-size:16px;line-height:28.8px}
.s-cta-inner .cta-head{position:absolute;left:244px;top:378px;width:432px;text-align:center;
  font-family:var(--display);font-weight:700;font-size:30px;line-height:42px;color:var(--text)}
.s-cta-inner .btn{position:absolute;left:953px;top:482px;width:142px;height:55px}

/* ---- solutions ----------------------------------------------------------- */
.sol-h2{position:absolute;left:70px;top:377px;width:887px;
  font-family:var(--display);font-weight:700;font-size:30px;line-height:1.45;color:var(--text)}
.s-solutions{height:1235px;background:var(--ink)}
.sol-list{position:relative;height:100%}
.sol-item{position:absolute;left:402px;width:660px}
.sol-item::before{content:"";position:absolute;left:-332px;top:-55px;width:1300px;max-width:100vw;
  height:100%;background:var(--surface);z-index:-1;border-radius:4px}
.sol-item h3{font-family:var(--display);font-weight:600;font-size:18px;line-height:1.4;color:var(--accent)}
.sol-item p{margin-top:14px;font-size:16px;line-height:28.8px;color:var(--text);max-width:625px}
.sol-item:nth-child(1){top:55px;height:180px}
.sol-item:nth-child(2){top:290px;height:180px}
.sol-item:nth-child(3){top:525px;height:209px}
.sol-item:nth-child(4){top:789px;height:180px}
.sol-item:nth-child(5){top:1024px;height:211px}
.inline-link{font-weight:700;text-decoration:underline}

/* ---- contact ------------------------------------------------------------- */
.s-contact{height:2103px;background:var(--ink)}
.s-contact::before{content:"";position:absolute;left:50%;transform:translateX(-50%);top:0;
  width:1300px;max-width:100%;height:2103px;background:var(--surface);z-index:1}
.contact-grid{z-index:2}
.contact-aside{position:absolute;left:-92px;top:1px;width:698px}
.cobot-contact{width:698px;height:842px;object-fit:cover}
.contact-call{position:absolute;left:376px;top:397px;width:300px;font-size:20px;line-height:36px;color:var(--text)}
.contact-call a{text-decoration:underline}
.contact-form-wrap{position:absolute;left:611px;top:41px;width:653px}
.form-note{margin-bottom:18px;padding:14px 18px;border-radius:5px;font-size:16px}
.form-ok{background:#12351d;border:1px solid #2f7d4b}
.form-err{background:#3a1414;border:1px solid var(--soft)}
.hp-field{display:none}
.contact-form{padding-left:70px}
.contact-form .row{display:flex;gap:34px}
.contact-form .row-2 > .field{flex:0 0 245px}
.row-code{gap:16px}
.field-code{flex:0 0 183px}
.field-phone{flex:0 0 324px}
.field{margin:0}
/* vertical bands measured off the client's own form.
   These are keyed on explicit classes: nth-of-type counted the hidden honeypot div
   and silently shifted every band down one row. */
.contact-form .row-names{height:107px}
.contact-form .row-co{height:122px}
.contact-form .row-code{height:176px}
.field label{display:block;font-family:var(--sans);font-weight:700;font-size:15px;line-height:15px;color:var(--text);margin-bottom:9px}
.req{color:var(--soft)}
/* field chrome measured off the client's own form: filled grey box, no border,
   square corners, 20px left inset, and coral typed text */
.field input,.field select,.field textarea{width:100%;background:rgba(138,138,138,.8);
  color:var(--soft);border:0;border-radius:0;font-family:var(--sans);font-size:14px;
  padding:3px 3px 3px 20px}
.field input,.field select{height:55px}
.row-co .field input{height:61px}
.row-code .field input,.row-code .field select{height:61px}
.field select{color:var(--text);padding:0 48px 0 20px}
.field textarea{height:137px;max-width:524px;resize:vertical;padding:10.5px 10px 3px 20px}
.field input::placeholder,.field textarea::placeholder{color:rgba(255,255,255,.75)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--soft);outline-offset:1px}
.field select option{background:var(--ink);color:var(--text)}
.has-error input,.has-error select,.has-error textarea{outline:2px solid var(--soft);outline-offset:1px}
.field-notes{height:307px}
.field-submit{margin:0}
.btn-submit{width:510px;height:55px;background:var(--grey);border-color:var(--grey);color:#000;border-radius:5px}
.btn-submit:hover,.btn-submit:focus-visible{background:var(--text);border-color:var(--text);color:#000}
.contact-badges{position:absolute;left:0;top:0;width:100%;height:0}
.contact-badges img{position:absolute;object-fit:contain}
/* template order is ct_1, ft_3, ct_4, ft_5, ct_2 — coordinates measured per badge */
.contact-badges img:nth-child(1){left:338px;top:1026px}
.contact-badges img:nth-child(2){left:602px;top:1014px}
.contact-badges img:nth-child(3){left:619px;top:1023px}
.contact-badges img:nth-child(4){left:725px;top:1023px}
.contact-badges img:nth-child(5){left:1231px;top:1031px}

/* ---- footer -------------------------------------------------------------- */
.site-footer{position:relative;height:626px;background:var(--ink);overflow:hidden}
.footer-grid{height:626px}
.f-logo{position:absolute;left:54px;top:0;width:452px}
.f-logo .logo{width:452px;height:246px;object-fit:contain}
.f-nap{position:absolute;left:34px;top:240px;width:430px}
.f-nap p{font-size:24px;line-height:67.2px;color:var(--text);white-space:nowrap}
.f-nap .nap-key{color:var(--grey);margin-right:8px}
.f-nap a{text-decoration:none}
.f-nap a:hover{text-decoration:underline}
.f-nap .nap-city{margin-top:-4px}
.f-links{position:absolute;left:479px;top:108px;width:310px}
.f-heading{font-family:var(--display);font-weight:700;font-size:20px;line-height:28px;color:var(--grey)}
.f-links ul{margin-top:29px}
.f-links a{display:block;font-size:18px;line-height:54px;text-decoration:none}
.f-links a:hover{color:var(--soft)}
.f-social{position:absolute;left:960px;top:110px;width:320px}
.f-follow{font-size:18px;line-height:36px;color:var(--text)}
.f-icons{display:flex;gap:10px;margin-top:4px}
.f-icons img{width:25px;height:25px}
.f-social .btn-wide{margin-top:41px}
.f-badges{position:absolute;left:0;top:0;width:100%;height:0}
.f-badges img{position:absolute;object-fit:contain}
.f-badges img:nth-child(1){left:511px;top:349px}
.f-badges img:nth-child(2){left:844px;top:349px}
.f-badges-2 img:nth-child(1){left:535px;top:485px}
.f-badges-2 img:nth-child(2){left:552px;top:499px}
.f-badges-2 img:nth-child(3){left:658px;top:500px}

/* =========================================================================
   RESPONSIVE. Below the 1440 canvas the absolute layout is dropped entirely
   and everything returns to normal document flow, so the page NEVER scrolls
   horizontally on a phone.
   ====================================================================== */
@media (max-width:1439px){
  .site-header{position:relative;height:auto;padding:14px 20px;flex-wrap:wrap;gap:12px;
    justify-content:center;background:var(--ink)}
  .site-header .btn-sm{margin-left:0}
  .hero,.hero-home,.hero-inner-page,.page-contact .hero-inner-page,
  .s-automation,.s-design,.s-oem,.s-partners,.s-cta,.s-cta-home,.s-cta-inner,
  .s-solutions,.s-contact,.site-footer,.footer-grid{height:auto}
  .canvas{height:auto;padding:0 20px}

  .hero-inner,.auto-grid,.design-grid,.cta-grid,.contact-grid,.footer-grid,.sol-list{
    position:static;display:flex;flex-direction:column;align-items:center;gap:28px}
  .hero-logo,.hero-lede,.hero-inner > .btn,
  .auto-media,.auto-copy,.cards,.card,
  .design-video,.design-still,.design-copy,.design-copy .btn,
  .s-oem h2,.s-partners h2,.logo-row,
  .cta-badge,.cta-body,.cta-head,.s-cta .btn,
  .sol-h2,.sol-item,
  .contact-aside,.contact-call,.contact-form-wrap,.contact-badges,
  .f-logo,.f-nap,.f-links,.f-social,.f-badges{
    position:static !important;left:auto;top:auto;width:100% !important;max-width:100%;
    transform:none;margin-left:0}
  .hero{padding:40px 0 48px}
  .hero-logo .logo,.f-logo .logo{width:100%;height:auto;max-width:520px;margin:0 auto}
  .hero-lede{font-size:22px;text-align:center}
  .hero-h1{font-size:38px;line-height:1.15;text-align:center}
  .contact-lede{font-size:22px;line-height:1.4;text-align:center}
  .s-automation::before,.s-design::before,.s-contact::before,.sol-item::before{display:none}
  .s-automation,.s-design,.s-contact{background:var(--surface);padding:44px 0}
  .s-oem,.s-partners,.s-cta,.s-solutions{padding:44px 0}
  .auto-media .cobot,.design-still img,.cobot-contact{width:100%;height:auto;max-width:420px;margin:0 auto}
  .auto-copy h2,.design-copy h2,.s-oem h2,.s-partners h2,.cta-head,.sol-h2{font-size:26px;line-height:1.3;text-align:center}
  .auto-copy p,.design-copy p{background:transparent;padding:0;font-size:16px;line-height:1.75;font-weight:400}
  .design-copy h2{margin-left:0;max-width:none}
  .design-copy p{margin-top:16px}
  .cards{display:flex;flex-direction:column;gap:26px}
  .card{width:100%}
  .card h3,.sol-item h3{text-align:center}
  .card p,.sol-item p{text-align:center}
  .design-video{height:auto;aspect-ratio:648/1155;max-width:420px;margin:0 auto}
  .logo-row{position:static;height:auto;display:flex;flex-wrap:wrap;gap:28px;padding:0;
    align-items:center;justify-content:center}
  .logo-row li,.f-badges img,.contact-badges img{position:static !important;left:auto;top:auto}
  .f-badges,.contact-badges{position:static !important;height:auto;display:flex;flex-wrap:wrap;
    gap:22px;align-items:center;justify-content:center}
  .cta-badge{width:min(320px,80vw);height:min(320px,80vw);margin:0 auto}
  .s-cta-home .cta-body,.s-cta-inner .cta-body{font-size:18px;line-height:1.7;text-align:center}
  .sol-item{height:auto !important;margin-bottom:30px}
  .contact-form-wrap{margin-top:10px}
  .contact-form{padding-left:0}
  .contact-form .row,.contact-form .row-code,
  .contact-form .row-names,.contact-form .row-co{flex-direction:column;gap:0;height:auto}
  .field textarea{max-width:none}
  .field-notes{height:auto}
  .sol-item p{max-width:none}
  .contact-form .row-2 > .field,.field-code,.field-phone{flex:1 1 auto}
  .field{margin-bottom:26px}
  .btn-submit{width:100%}
  .contact-badges{gap:26px;margin-top:30px}
  .f-nap p{font-size:19px;line-height:2.1;white-space:normal;text-align:center}
  .f-links,.f-social{text-align:center}
  .f-links a{line-height:2.2}
  .f-icons{justify-content:center}
  .f-social .btn-wide{margin:14px auto 0}
  .f-badges{flex-wrap:wrap;gap:22px}
  .site-footer{padding:40px 0 48px}
}
@media (max-width:640px){
  .hero-h1{font-size:30px}
  .auto-copy h2,.design-copy h2,.s-oem h2,.s-partners h2,.cta-head,.sol-h2{font-size:22px}
  .hero-lede,.contact-lede{font-size:19px}
  .logo-row img,.f-badges img,.contact-badges img{max-width:44vw;height:auto}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}
