:root{
    --ink-950:#070b14;
    --ink-900:#0a0f1e;
    --ink-800:#0f1730;
    --line:#1e2740;
    --slate:#7c8aa8;
    --slate-dim:#4a5678;
    --gold:#c9a24a;
    --gold-soft:rgba(201,162,74,0.5);
    --paper:#eef1f7;
  }
  *{box-sizing:border-box;}


  .reach{
    position:relative;
    padding:120px 24px 100px;
    background:
      radial-gradient(ellipse 120% 80% at 50% -10%, #101c38 0%, var(--ink-900) 55%, var(--ink-950) 100%);
    color:var(--paper);
    overflow:hidden;
  }
  .reach::before{
    /* faint hairline grid, echoes "structured" brand language */
    content:"";
    position:absolute; inset:0;
    background-image:
      linear-gradient(to right, rgba(255,255,255,0.025) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255,255,255,0.025) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black, transparent 75%);
    pointer-events:none;
  }

  .reach__head{
    position:relative;
    max-width:640px;
    margin:0 auto 8px;
    text-align:center;
  }
  .reach__eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:12px; letter-spacing:.16em; text-transform:uppercase;
    color:var(--gold); font-weight:600;
    margin-bottom:18px;
  }
  .reach__eyebrow::before{
    content:""; width:22px; height:1px; background:var(--gold-soft);
  }
  .reach__title{
    font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-weight:800;
    font-size:clamp(1.9rem, 3.2vw, 2.75rem);
    line-height:1.15;
    margin:0 0 18px;
    letter-spacing:-0.01em;
	  color:#fff;
  }
  .reach__title em{
     font-weight:800; color:var(--gold);
  }
  .reach__sub{
    font-size:16px; line-height:1.7; color:var(--slate);
    max-width:520px; margin:0 auto;
  }

  .globe-wrap{
    position:relative;
    max-width:900px;
    height:min(640px, 78vw);
    margin:56px auto 8px;
  }
  .globe-canvas-holder{
    position:absolute; inset:0;
    cursor:grab;
  }
  .globe-canvas-holder canvas{ display:block; width:100%; height:100%; }

  .globe-label{
    position:absolute;
    top:0; left:0;
    transform:translate(-50%,-130%);
    display:flex; align-items:center; gap:7px;
    padding:5px 10px 5px 8px;
    background:rgba(10,15,30,0.72);
    border:1px solid var(--line);
    border-radius:999px;
    font-size:11.5px; font-weight:500;
    letter-spacing:.02em;
    color:var(--paper);
    white-space:nowrap;
    pointer-events:none;
    backdrop-filter: blur(4px);
    transition:opacity .25s ease;
  }
  .globe-label.is-hq{
    border-color:var(--gold-soft);
    color:var(--gold);
  }
  .globe-label__dot{
    width:6px; height:6px; border-radius:50%;
    background:var(--gold);
    box-shadow:0 0 8px var(--gold);
    flex:none;
  }

  .reach__legend{
    position:relative;
    display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
    max-width:680px; margin:36px auto 0;
  }
  .reach__legend span{
    font-size:12.5px; font-weight:500; letter-spacing:.03em;
    color:var(--slate);
    padding:7px 14px;
    border:1px solid var(--line);
    border-radius:999px;
    background:rgba(255,255,255,0.015);
  }
  .reach__legend span.hq{ color:var(--gold); border-color:var(--gold-soft); }

  @media (prefers-reduced-motion: reduce){
    .globe-canvas-holder{ cursor:default; }
  }


