:root{
  --theus-paper:#f4efe8;
  --theus-blue:#315d75;
  --theus-blue-soft:#9fb1ba;
  --theus-gold:#cf7f36;
  --theus-gold-soft:#e7bd98;
}
html,body{margin:0;background:#081018}
body.path-frontpage{overflow:hidden}
.path-frontpage .dialog-off-canvas-main-canvas{height:100vh;height:100svh}

.theus-network-scene{
  position:relative;
  width:100vw;
  height:100vh;
  height:100svh;
  overflow:hidden;
  background:#081018;
}

/* Real video is the actual background, not hidden behind an opaque gradient. */
.theus-bg-video{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  opacity:.86;
  filter:saturate(.82) contrast(1.12) brightness(.78);
  background:#081018;
  transition:opacity .20s ease;
}
.theus-bg-video.is-switching{opacity:.18}

/* Only a restrained dark veil. It does not erase the video. */
.theus-bg-shade{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 27% 50%,
      rgba(235,231,224,.30) 0%,
      rgba(40,47,50,.18) 35%,
      rgba(5,11,16,.10) 62%,
      rgba(2,7,11,.36) 100%);
}

.theus-stage{
  position:absolute;
  left:50%;
  top:50%;
  z-index:2;
  transform:translate(-50%,-50%);
  width:min(100vw,1584px);
  height:min(100svh,928px);
}

.theus-brand,.theus-company{position:absolute;z-index:5}
.theus-brand img,.theus-company img{display:block;width:100%;height:auto}
.theus-brand img{filter:drop-shadow(0 12px 18px rgba(0,0,0,.20))}

/* Hard reset: Drupal/global button CSS cannot draw a rectangle anymore. */
.theus-company,
.theus-company:hover,
.theus-company:focus,
.theus-company:focus-visible,
.theus-company:active,
.theus-company.is-active{
  appearance:none!important;
  -webkit-appearance:none!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  text-shadow:none!important;
  padding:0!important;
  margin:0!important;
  border-radius:0!important;
  color:inherit!important;
  cursor:pointer;
  overflow:visible;
  line-height:1;
  -webkit-tap-highlight-color:transparent;
  transform-origin:center;
}
.theus-company::before,.theus-company::after{display:none!important}
.theus-company img{
  pointer-events:none;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 5px 8px rgba(0,0,0,.15));
  transition:transform .22s ease,filter .22s ease,opacity .22s ease;
}
.theus-company:hover{
  transform:translateX(4px) scale(1.035);
  z-index:8;
}
.theus-company:hover img{
  filter:brightness(1.10) saturate(1.09) drop-shadow(0 7px 12px rgba(0,0,0,.22));
}
.theus-company.is-active{
  transform:translateX(5px) scale(1.045);
  z-index:8;
}
.theus-company.is-active img{
  filter:brightness(1.12) saturate(1.10) drop-shadow(0 8px 13px rgba(0,0,0,.24));
}

.theus-network{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:3;
  overflow:visible;
  pointer-events:none;
}
.theus-network path{
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  transition:opacity .18s ease,stroke-width .18s ease;
}
.theus-network .main{stroke-width:3.05}
.theus-network .fine{stroke-width:1.4;opacity:.52}
.theus-network .blue{stroke:var(--theus-blue)}
.theus-network .blueSoft{stroke:var(--theus-blue-soft)}
.theus-network .gold{stroke:var(--theus-gold)}
.theus-network .goldSoft{stroke:var(--theus-gold-soft)}
.theus-network circle{
  fill:rgba(12,20,25,.78);
  stroke-width:2.65;
  vector-effect:non-scaling-stroke;
}
.theus-network path[data-route].is-highlighted{stroke-width:4.0;opacity:1}
.theus-network circle[data-route].is-highlighted{stroke-width:3.5}

@media(min-width:721px){
  .theus-brand{left:4.9%;top:36.2%;width:38%}
  .theus-rental{left:76.2%;top:8.5%;width:15.6%}
  .theus-development{left:75.7%;top:22.5%;width:18.1%}
  .theus-workforce{left:76.0%;top:36.9%;width:18.1%}
  .theus-events{left:75.9%;top:51.4%;width:16.5%}
  .theus-georgia{left:74.9%;top:65.2%;width:17.5%}
  .theus-trade{left:69.1%;top:76.3%;width:18.5%}
}
@media(max-width:720px){
  .theus-stage{width:100vw;height:min(84svh,820px)}
  .theus-brand{left:2.8%;top:43%;width:35.5%}
  .theus-rental{left:75.4%;top:19.8%;width:22%}
  .theus-development{left:74.2%;top:30.7%;width:24%}
  .theus-workforce{left:74.3%;top:41.7%;width:24%}
  .theus-events{left:75.3%;top:52.8%;width:22%}
  .theus-georgia{left:72.9%;top:63.8%;width:25%}
  .theus-trade{left:70.1%;top:74.5%;width:27.5%}
  .theus-bg-video{opacity:.80}
  .theus-network .main{stroke-width:2.2}
  .theus-network .fine{stroke-width:1.03;opacity:.48}
  .theus-network circle{stroke-width:2.05}
}

/* v11: client-logo assets + clearly visible thematic video */
.theus-network-scene{background:#050b10!important}
.theus-bg-video{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  display:block!important;
  visibility:visible!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  opacity:.92!important;
  filter:saturate(.80) contrast(1.16) brightness(.62)!important;
  transition:opacity .22s ease!important;
}
.theus-bg-video.is-switching{opacity:.24!important}
.theus-bg-shade{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(6,12,17,.12) 0%,rgba(6,12,17,.05) 45%,rgba(3,8,12,.28) 100%);
}
.theus-stage{z-index:2!important}
.theus-brand img,.theus-company img{
  background:transparent!important;
  box-shadow:none!important;
}

/* =====================================================================
   THEUS v12 FINAL OVERRIDES
   ===================================================================== */
.theus-network-scene{
  background:#050b10!important;
}
.theus-video-stack{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  background:#050b10;
}
.theus-video-stack .theus-bg-video{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
  visibility:visible!important;
  opacity:0!important;
  filter:saturate(.78) contrast(1.18) brightness(.62)!important;
  transition:opacity .45s ease!important;
}
.theus-video-stack .theus-bg-video.is-active{
  opacity:.92!important;
}
.theus-bg-shade{
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,
      rgba(5,11,16,.15) 0%,
      rgba(5,11,16,.06) 48%,
      rgba(2,7,11,.25) 100%)!important;
}
.theus-stage{z-index:2!important}

.theus-brand img,
.theus-company img{
  background:transparent!important;
  box-shadow:none!important;
}

.theus-company,
.theus-company:hover,
.theus-company:focus,
.theus-company:focus-visible,
.theus-company:active,
.theus-company.is-active{
  appearance:none!important;
  -webkit-appearance:none!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
  border-radius:0!important;
}
.theus-company::before,
.theus-company::after{display:none!important}
.theus-company:hover{
  transform:translateX(4px) scale(1.035)!important;
  z-index:8;
}
.theus-company:hover img,
.theus-company.is-active img{
  filter:brightness(1.10) saturate(1.08) drop-shadow(0 7px 12px rgba(0,0,0,.22))!important;
}

@media(max-width:720px){
  .theus-video-stack .theus-bg-video.is-active{opacity:.84!important}
}


/* ================================================================
   v14 — layout correction for the new high-quality PNG logo set.
   The new files have different aspect ratios, therefore all brand
   marks are normalized by visual HEIGHT instead of width.
   ================================================================ */

@media (min-width:721px){
  .theus-brand{
    left:7.5%!important;
    top:34.5%!important;
    width:auto!important;
    height:37%!important;
  }
  .theus-brand img{
    width:auto!important;
    height:100%!important;
    max-width:none!important;
    object-fit:contain!important;
  }

  .theus-company{
    width:auto!important;
    height:12.2%!important;
  }
  .theus-company img{
    width:auto!important;
    height:100%!important;
    max-width:none!important;
    object-fit:contain!important;
  }

  .theus-rental{
    left:76.0%!important;
    top:7.5%!important;
  }
  .theus-development{
    left:75.2%!important;
    top:21.5%!important;
  }
  .theus-workforce{
    left:75.5%!important;
    top:35.5%!important;
  }
  .theus-events{
    left:76.2%!important;
    top:49.6%!important;
  }
  .theus-georgia{
    left:74.7%!important;
    top:63.8%!important;
  }
  .theus-trade{
    left:74.0%!important;
    top:77.0%!important;
  }
}

@media (max-width:720px){
  .theus-stage{
    width:100vw!important;
    height:min(86svh,820px)!important;
  }

  .theus-brand{
    left:3%!important;
    top:39%!important;
    width:auto!important;
    height:26%!important;
  }
  .theus-brand img{
    width:auto!important;
    height:100%!important;
    max-width:none!important;
    object-fit:contain!important;
  }

  .theus-company{
    width:auto!important;
    height:9.2%!important;
  }
  .theus-company img{
    width:auto!important;
    height:100%!important;
    max-width:none!important;
    object-fit:contain!important;
  }

  .theus-rental{left:76%!important;top:18%!important}
  .theus-development{left:74.5%!important;top:29.5%!important}
  .theus-workforce{left:75%!important;top:41%!important}
  .theus-events{left:76%!important;top:52.5%!important}
  .theus-georgia{left:74%!important;top:64%!important}
  .theus-trade{left:73%!important;top:75.5%!important}
}

@media (max-width:390px){
  .theus-brand{
    left:2.5%!important;
    height:25%!important;
  }
  .theus-company{
    height:8.8%!important;
  }
  .theus-rental{left:75%!important}
  .theus-development{left:73.5%!important}
  .theus-workforce{left:74%!important}
  .theus-events{left:75%!important}
  .theus-georgia{left:73%!important}
  .theus-trade{left:72%!important}
}


/* v15 — real client-supplied Development video.
   Grayed/darkened in CSS: source MP4 stays untouched, no quality loss. */
.theus-video-stack .theus-bg-video[data-theus-video-id="development"]{
  filter:grayscale(1) saturate(0) contrast(1.16) brightness(.52)!important;
}
.theus-video-stack .theus-bg-video[data-theus-video-id="development"].is-active{
  opacity:.78!important;
}
@media(max-width:720px){
  .theus-video-stack .theus-bg-video[data-theus-video-id="development"].is-active{
    opacity:.72!important;
  }
}


/* =========================================================
   v16 — sand homepage + subtle thematic video + full route highlight
   ========================================================= */
body.path-frontpage,
body.path-frontpage .dialog-off-canvas-main-canvas,
body.path-frontpage main.theus-front,
.theus-network-scene{
  background:#d8c7ad !important;
}

/* Video should only breathe through the sand layer, never dominate logos/network. */
.theus-video-layer{
  opacity:1 !important;
  background:#d8c7ad !important;
}
.theus-video-layer::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:rgba(216,199,173,.72);
  mix-blend-mode:normal;
}
.theus-video-layer .theus-bg-video{
  opacity:0 !important;
  filter:grayscale(1) saturate(0) contrast(.92) brightness(.78) !important;
}
.theus-video-layer .theus-bg-video.is-active{
  opacity:.27 !important;
}
.theus-bg-veil{
  background:linear-gradient(90deg,
    rgba(216,199,173,.76) 0%,
    rgba(216,199,173,.60) 42%,
    rgba(216,199,173,.66) 100%) !important;
}

/* Selected company: no black tile — only a clean glow. */
.theus-company{
  background:transparent !important;
  box-shadow:none !important;
}
.theus-company:hover,
.theus-company:focus-visible,
.theus-company.is-active{
  background:transparent !important;
  box-shadow:none !important;
  filter:drop-shadow(0 0 9px rgba(221,128,39,.34));
}

/* Full path to selected icon.
   JS adds .is-route-active to every SVG segment belonging to that company,
   not only the final outer branch. */
.theus-network path,
.theus-network line,
.theus-network polyline{
  transition:stroke .28s ease, stroke-width .28s ease, opacity .28s ease,
             filter .28s ease !important;
}
.theus-network .is-route-active{
  stroke:#df7f26 !important;
  stroke-width:3.15 !important;
  opacity:1 !important;
  filter:drop-shadow(0 0 3px rgba(223,127,38,.52));
}
.theus-network circle.is-route-active{
  stroke:#df7f26 !important;
  fill:#f3e5d2 !important;
  stroke-width:2.6 !important;
  opacity:1 !important;
}
@media(max-width:720px){
  .theus-video-layer::after{background:rgba(216,199,173,.78)}
  .theus-video-layer .theus-bg-video.is-active{opacity:.22 !important}
  .theus-network .is-route-active{stroke-width:2.5 !important}
}