/* Unified dossier hero — based on the Robotaxi hero language */
.humanoid-hero{
  position:relative!important;
  width:100%!important;
  min-height:560px!important;
  margin:0!important;
  display:flex!important;
  align-items:flex-end!important;
  overflow:hidden!important;
  background-color:#07111f!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  color:#fff!important;
  isolation:isolate;
}
.figure03-hero-new{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/Figure-03-hero-AI-visual-OutOfHands.png')!important;background-position:center 42%!important}
.optimus-hero-new{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/Tesla-Optimus-hero-AI-visual-OutOfHands.png')!important;background-position:center 46%!important}
.atlas-hero-new{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/Boston-Dynamics-Atlas-hero-AI-visual-OutOfHands.png')!important;background-position:center 44%!important}
.digit-hero-new{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/Agility-Digit-hero-AI-visual-OutOfHands.png')!important;background-position:center 44%!important}
.iron-page .humanoid-hero{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/XPENG-IRON-schoonmaakrobot-AI-visual-OutOfHands.png')!important;background-position:center 46%!important}
.unitree-page .humanoid-hero{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/Unitree-G1-hero-AI-visual-OutOfHands.png')!important;background-position:center 42%!important}
.neo-page .humanoid-hero{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/1X-NEO-hero-AI-visual-OutOfHands.png')!important;background-position:center 45%!important}
.apollo-page .humanoid-hero{background-image:url('https://outofhands.nl/wp-content/uploads/2026/09/Apptronik-Apollo-hero-AI-visual-OutOfHands.png')!important;background-position:center 42%!important}

.humanoid-hero:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  display:block!important;
  background:linear-gradient(90deg,rgba(4,12,24,.92) 0%,rgba(4,12,24,.72) 38%,rgba(4,12,24,.32) 66%,rgba(4,12,24,.12) 100%)!important;
  pointer-events:none!important;
}
.humanoid-hero:after{content:none!important;display:none!important}
.humanoid-hero .iron-hero-grid,
.humanoid-hero .neo-hero-grid,
.humanoid-hero .apollo-hero-grid,
.humanoid-hero .humanoid-hero-shade{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  display:block!important;
  opacity:.10!important;
  background-image:linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px)!important;
  background-size:54px 54px!important;
  pointer-events:none!important;
}
.humanoid-hero-copy,
.iron-page .iron-hero-copy,
.neo-page .neo-hero-copy,
.apollo-page .apollo-hero-copy{
  position:relative!important;
  z-index:2!important;
  width:min(1180px,calc(100% - 44px))!important;
  margin:0 auto!important;
  padding:92px 0 72px!important;
  box-sizing:border-box!important;
}
.humanoid-hero-copy h1,
.iron-page .iron-hero-copy h1,
.neo-page .neo-hero-copy h1,
.apollo-page .apollo-hero-copy h1{
  max-width:980px!important;
  margin:10px 0 18px!important;
  color:#fff!important;
  font-family:"DM Sans",system-ui,sans-serif!important;
  font-size:clamp(54px,7vw,94px)!important;
  line-height:.97!important;
  letter-spacing:-.045em!important;
  text-wrap:balance;
}
.humanoid-hero-copy p,
.iron-page .iron-hero-copy p,
.neo-page .neo-hero-copy p,
.apollo-page .apollo-hero-copy p{
  max-width:820px!important;
  margin:0!important;
  color:#e1e8f2!important;
  font-family:"DM Sans",system-ui,sans-serif!important;
  font-size:20px!important;
  line-height:1.55!important;
}
.humanoid-hero-pills,
.iron-hero-pills,
.neo-hero-pills,
.apollo-hero-pills{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin-top:26px!important;
}
.humanoid-hero-pills span,
.iron-hero-pills span,
.neo-hero-pills span,
.apollo-hero-pills span{
  display:inline-flex!important;
  align-items:center!important;
  padding:8px 12px!important;
  border:1px solid rgba(255,255,255,.28)!important;
  border-radius:999px!important;
  background:rgba(7,17,31,.24)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.03em!important;
  backdrop-filter:blur(4px);
}
.humanoid-ai-note{
  padding-top:10px!important;
  padding-bottom:24px!important;
  font-size:11px!important;
  line-height:1.45!important;
  color:#6b7280!important;
}
.humanoid-ai-note strong{color:#374151!important}

/* Prevent legacy hero implementations from adding competing layers */
.iron-page .iron-hero:before,.iron-page .iron-hero:after,
.neo-page .neo-hero:after,.apollo-page .apollo-hero:after,
.unitree-page .unitree-hero:after{pointer-events:none!important}

@media(max-width:760px){
  .humanoid-hero{
    min-height:520px!important;
    background-size:cover!important;
  }
  .figure03-hero-new{background-position:61% center!important}
  .optimus-hero-new{background-position:64% center!important}
  .atlas-hero-new{background-position:61% center!important}
  .digit-hero-new{background-position:61% center!important}
  .iron-page .humanoid-hero{background-position:61% center!important}
  .unitree-page .humanoid-hero{background-position:62% center!important}
  .neo-page .humanoid-hero{background-position:58% center!important}
  .apollo-page .humanoid-hero{background-position:58% center!important}

  .humanoid-hero:before{
    background:linear-gradient(180deg,rgba(4,12,24,.08) 0%,rgba(4,12,24,.14) 34%,rgba(4,12,24,.72) 70%,rgba(4,12,24,.96) 100%)!important;
  }
  .humanoid-hero-copy,
  .iron-page .iron-hero-copy,
  .neo-page .neo-hero-copy,
  .apollo-page .apollo-hero-copy{
    width:calc(100% - 44px)!important;
    padding:68px 0 42px!important;
  }
  .humanoid-hero-copy .eyebrow,
  .iron-page .iron-hero-copy .eyebrow,
  .neo-page .neo-hero-copy .eyebrow,
  .apollo-page .apollo-hero-copy .eyebrow{
    color:#cab8ff!important;
    font-size:11px!important;
    letter-spacing:.17em!important;
  }
  .humanoid-hero-copy h1,
  .iron-page .iron-hero-copy h1,
  .neo-page .neo-hero-copy h1,
  .apollo-page .apollo-hero-copy h1{
    max-width:100%!important;
    font-size:clamp(44px,12vw,56px)!important;
    line-height:.98!important;
    letter-spacing:-2.3px!important;
  }
  .humanoid-hero-copy p,
  .iron-page .iron-hero-copy p,
  .neo-page .neo-hero-copy p,
  .apollo-page .apollo-hero-copy p{
    max-width:100%!important;
    font-size:16px!important;
    line-height:1.52!important;
  }
  .humanoid-hero-pills,
  .iron-hero-pills,.neo-hero-pills,.apollo-hero-pills{gap:8px!important;margin-top:22px!important}
  .humanoid-hero-pills span,
  .iron-hero-pills span,.neo-hero-pills span,.apollo-hero-pills span{font-size:11px!important;padding:8px 11px!important}
  .humanoid-ai-note{padding-top:9px!important;padding-bottom:18px!important;font-size:10.5px!important}
}
@media(max-width:430px){
  .humanoid-hero{min-height:500px!important}
  .humanoid-hero-copy,
  .iron-page .iron-hero-copy,
  .neo-page .neo-hero-copy,
  .apollo-page .apollo-hero-copy{width:calc(100% - 36px)!important;padding-bottom:36px!important}
  .humanoid-hero-copy h1,
  .iron-page .iron-hero-copy h1,
  .neo-page .neo-hero-copy h1,
  .apollo-page .apollo-hero-copy h1{font-size:42px!important}
}