/* Rex Group v0.6.4 — isolated mobile Hero collision fix.
   Scope: phones only. Desktop/tablet remain unchanged. */
@media (max-width: 700px) {
  .hero .hero-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 22px !important;
    align-items: start !important;
  }

  .hero .hero-copy {
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  .hero .hero-copy .eyebrow,
  .hero .hero-copy h1,
  .hero .hero-copy .lead,
  .hero .hero-copy .cta {
    position: relative !important;
    z-index: 2 !important;
  }

  /* Globe/technology badges get their own row under the copy.
     This prevents the Software badge from entering the English headline. */
  .hero .globe-wrap {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 430px !important;
    margin: 4px 0 0 !important;
    z-index: 1 !important;
    overflow: visible !important;
  }

  .hero .global-canvas {
    position: relative !important;
    inset: auto !important;
    width: min(100%, 430px) !important;
    height: 430px !important;
    margin: 0 auto !important;
    transform: none !important;
  }

  .hero .digital-globe {
    position: absolute !important;
    width: 62% !important;
    height: auto !important;
    max-width: none !important;
    left: 19% !important;
    top: 102px !important;
    transform: none !important;
  }

  .hero .tech-badge {
    position: absolute !important;
    width: 76px !important;
    min-width: 76px !important;
    margin: 0 !important;
    transform: none !important;
    text-align: center !important;
  }

  .hero .tech-badge > span {
    display: grid !important;
    place-items: center !important;
    width: 58px !important;
    height: 58px !important;
    margin: 0 auto 7px !important;
    box-sizing: border-box !important;
  }

  .hero .tech-badge > b {
    display: block !important;
    max-width: 82px !important;
    margin: 0 auto !important;
    font-size: 10px !important;
    line-height: 1.15 !important;
    letter-spacing: .02em !important;
    white-space: normal !important;
  }

  /* 4 left + 4 right, balanced around the globe. */
  .hero .b-software { left: 4% !important; top: 20px !important; right: auto !important; bottom: auto !important; }
  .hero .b-web      { left: 1% !important; top: 126px !important; right: auto !important; bottom: auto !important; }
  .hero .b-cloud    { left: 4% !important; top: 238px !important; right: auto !important; bottom: auto !important; }
  .hero .b-network  { left: 9% !important; top: 346px !important; right: auto !important; bottom: auto !important; }

  .hero .b-mobile   { right: 4% !important; top: 20px !important; left: auto !important; bottom: auto !important; }
  .hero .b-android  { right: 1% !important; top: 126px !important; left: auto !important; bottom: auto !important; }
  .hero .b-ios      { right: 4% !important; top: 238px !important; left: auto !important; bottom: auto !important; }
  .hero .b-ai       { right: 9% !important; top: 346px !important; left: auto !important; bottom: auto !important; }
}

@media (max-width: 390px) {
  .hero .global-canvas { height: 405px !important; }
  .hero .globe-wrap { min-height: 405px !important; }
  .hero .digital-globe { width: 58% !important; left: 21% !important; top: 108px !important; }
  .hero .tech-badge { width: 70px !important; min-width: 70px !important; }
  .hero .tech-badge > span { width: 54px !important; height: 54px !important; }
  .hero .tech-badge > b { font-size: 9.5px !important; }
  .hero .b-software,.hero .b-cloud { left: 1% !important; }
  .hero .b-web { left: 0 !important; }
  .hero .b-network { left: 4% !important; }
  .hero .b-mobile,.hero .b-ios { right: 1% !important; }
  .hero .b-android { right: 0 !important; }
  .hero .b-ai { right: 4% !important; }
}