#rndNetHero{
    position:relative;
    width:100%;
    height:clamp(480px, 64vh, 820px);
    overflow:hidden;
    background:#0a1220;                 /* deep-navy field, matches photo */
    isolation:isolate;
    -webkit-font-smoothing:antialiased;
  }
  #rndNetHero.rnd-hero--fallback{
    background:
      linear-gradient(180deg, rgba(7,12,22,.35), rgba(7,12,22,.72)),
      url("https://www.rndservices.fi/wp-content/uploads/2022/08/network-gb4571bf9e_1280.jpg")
        center/cover no-repeat;
  }
  #rndNetHero .rnd-hero__canvas{
    position:absolute; inset:0; width:100%; height:100%;
    display:block; z-index:1;
    touch-action:manipulation; cursor:crosshair;
  }
  #rndNetHero .rnd-hero__scrim{
    position:absolute; inset:0; z-index:2; pointer-events:none;
    background:
      linear-gradient(180deg, transparent 52%, rgba(4,8,16,.55) 100%),
      radial-gradient(120% 100% at 50% 40%, transparent 55%, rgba(3,6,12,.45) 100%);
  }
  #rndNetHero .rnd-hero__overlay{
    position:absolute; inset:0; z-index:3;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    padding:6vh 6vw; box-sizing:border-box; text-align:center;
    pointer-events:none;                 /* let clicks reach the canvas */
    color:#fff;
  }
  #rndNetHero .rnd-hero__title{
    margin:0 0 clamp(18px,3.4vh,42px);
    font-family:"Space Grotesk", system-ui, sans-serif;
    font-weight:700;
    font-size:clamp(2.4rem, 6.4vw, 5.4rem);
    line-height:1.02; letter-spacing:-0.02em;
    color:#fff; text-shadow:0 2px 34px rgba(0,0,0,.6);
  }
  #rndNetHero .rnd-hero__cols{
    width:min(1120px,100%);
    display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:6px;
  }
  #rndNetHero .rnd-hero__col{
    background:rgba(0,0,0,.5);
    border:1px solid rgba(255,255,255,.08);
    border-radius:10px; padding:20px 18px;
    -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  }
  #rndNetHero .rnd-hero__col h2{
    margin:0 0 10px;
    font-family:"Space Grotesk", system-ui, sans-serif;
    font-weight:600; font-size:clamp(.95rem,1.5vw,1.18rem);
    letter-spacing:.04em; text-transform:uppercase; color:#fff;
  }
  #rndNetHero .rnd-hero__col p{
    margin:0;
    font-family:"Inter", system-ui, sans-serif;
    font-size:clamp(.72rem,1vw,.86rem); line-height:1.55;
    color:rgba(255,255,255,.74); letter-spacing:.01em;
  }
  @media (max-width:760px){
    #rndNetHero{ height:clamp(560px, 80vh, 760px); }
    #rndNetHero .rnd-hero__cols{ grid-template-columns:1fr; gap:10px; }
    #rndNetHero .rnd-hero__col{ padding:14px; }
  }
  @media (prefers-reduced-motion: reduce){
    #rndNetHero .rnd-hero__canvas{ cursor:default; }
  }