:root{
    --blue:#8CB0FF;
    --ink:rgba(205,206,226,.95);
    --ink-soft:rgba(205,206,226,.8);
    --line:rgba(255,255,255,.12);
    --card-bg:rgba(255,255,255,.06);
    --card-line:rgba(255,255,255,.1);
    --dark-grad:linear-gradient(160deg,#101460 0%,#1a1d7a 42%,#3D1A9E 100%);
    --brand-grad:linear-gradient(135deg,#684FFF 0%,#8CB0FF 100%);
    --sans:'Open Sans',system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
    --display:'Space Grotesk','Open Sans',system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  }

  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;font-family:var(--sans);background:#0d1050;color:var(--ink);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

  /* clip, not hidden: hidden would make this a scroll container and break the sticky apply card */
  .page{background:var(--dark-grad);position:relative;overflow:hidden;overflow:clip;min-height:100vh}
  .page>*{position:relative;z-index:1}
  .glow{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:0}
  .glow-1{width:540px;height:540px;background:#684FFF;opacity:.24;top:-170px;right:-130px}
  .glow-2{width:440px;height:440px;background:#4B48FF;opacity:.16;bottom:-160px;left:-150px}

  .wrap{max-width:1200px;margin:0 auto;padding:0 24px}
  .eyebrow{font-family:var(--display);font-size:15px;font-weight:500;color:var(--blue)}

  .careers-nav{
    background:rgba(16,20,96,.82);backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  .careers-nav a:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:6px}



  .btn{
    display:inline-flex;align-items:center;gap:8px;text-decoration:none;
    font-weight:700;font-size:15px;border-radius:12px;padding:12px 22px;
    transition:transform .2s,box-shadow .2s;
  }
  .btn:hover{transform:translateY(-2px)}
  .btn-grad{background:var(--brand-grad);color:#fff;box-shadow:0 4px 20px rgba(104,79,255,.4)}
  .btn:focus-visible,.back:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

  .hero{padding-block:128px 26px}
  .hero h1{
    font-family:var(--display);
    font-size:clamp(44px,7vw,76px);line-height:1.04;letter-spacing:-.03em;font-weight:700;
    color:#fff;margin:0 0 26px;max-width:15ch;text-wrap:balance;
  }
  .hero h1 em{font-style:normal;background:linear-gradient(135deg,#8CB0FF,#684FFF);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  .hero p{font-size:20px;line-height:1.7;max-width:56ch;margin:0 0 38px;color:var(--ink)}
  /* layered signal trace: three phase-offset standing waves, faded at both edges */
  .signal{margin-bottom:26px;
    width:100%;line-height:0;opacity:0;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
  }
  .signal svg{display:block;width:100%;height:120px;overflow:visible}
  .signal path{
    fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke;
    transform-box:view-box;transform-origin:50% 50%;
  }
  .sig-faint{stroke-width:1;opacity:.18}
  .sig-echo{stroke-width:1.5;opacity:.38}
  .sig-glow{stroke-width:3;opacity:.28;filter:blur(8px)}
  .sig-primary{stroke-width:2.5}
  .signal.is-ready{opacity:1;animation:signal-fade 4s ease-out both}
  .signal.is-ready .sig-faint{animation:draw-signal 3.2s ease-out both, wave-c 11s linear 2.6s infinite backwards}
  .signal.is-ready .sig-echo{animation:draw-signal 3s ease-out .2s both, wave-b 11s linear 2.6s infinite backwards}
  .signal.is-ready .sig-glow{animation:draw-signal 2.8s ease-out .4s both, wave-a 11s linear 2.6s infinite backwards}
  .signal.is-ready .sig-primary{animation:draw-signal 2.8s ease-out .4s both, wave-a 11s linear 2.6s infinite backwards}
  @keyframes signal-fade{from{opacity:0}to{opacity:1}}
  @keyframes draw-signal{
    from{stroke-dasharray:3200;stroke-dashoffset:3200}
    to{stroke-dasharray:3200;stroke-dashoffset:0}
  }
  /* amplitude follows cos(2*pi*t + phase): nodes hold, antinodes breathe and invert */
  @keyframes wave-a{0%{transform:scaleY(1)}6.25%{transform:scaleY(.924)}12.5%{transform:scaleY(.707)}18.75%{transform:scaleY(.383)}25%{transform:scaleY(0)}31.25%{transform:scaleY(-.383)}37.5%{transform:scaleY(-.707)}43.75%{transform:scaleY(-.924)}50%{transform:scaleY(-1)}56.25%{transform:scaleY(-.924)}62.5%{transform:scaleY(-.707)}68.75%{transform:scaleY(-.383)}75%{transform:scaleY(0)}81.25%{transform:scaleY(.383)}87.5%{transform:scaleY(.707)}93.75%{transform:scaleY(.924)}100%{transform:scaleY(1)}}
  @keyframes wave-b{0%{transform:scaleY(.187)}6.25%{transform:scaleY(-.203)}12.5%{transform:scaleY(-.562)}18.75%{transform:scaleY(-.836)}25%{transform:scaleY(-.982)}31.25%{transform:scaleY(-.979)}37.5%{transform:scaleY(-.827)}43.75%{transform:scaleY(-.549)}50%{transform:scaleY(-.187)}56.25%{transform:scaleY(.203)}62.5%{transform:scaleY(.562)}68.75%{transform:scaleY(.836)}75%{transform:scaleY(.982)}81.25%{transform:scaleY(.979)}87.5%{transform:scaleY(.827)}93.75%{transform:scaleY(.549)}100%{transform:scaleY(.187)}}
  @keyframes wave-c{0%{transform:scaleY(-.93)}6.25%{transform:scaleY(-1)}12.5%{transform:scaleY(-.918)}18.75%{transform:scaleY(-.696)}25%{transform:scaleY(-.368)}31.25%{transform:scaleY(.016)}37.5%{transform:scaleY(.397)}43.75%{transform:scaleY(.718)}50%{transform:scaleY(.93)}56.25%{transform:scaleY(1)}62.5%{transform:scaleY(.918)}68.75%{transform:scaleY(.696)}75%{transform:scaleY(.368)}81.25%{transform:scaleY(-.016)}87.5%{transform:scaleY(-.397)}93.75%{transform:scaleY(-.718)}100%{transform:scaleY(-.93)}}

  .sect{padding-block:0 68px;scroll-margin-top:28px}
  .sect h2{font-family:var(--display);font-size:28px;font-weight:500;letter-spacing:-.015em;color:var(--blue);margin:0 0 26px}
  .about-row{display:flex;align-items:center;justify-content:space-between;gap:44px;flex-wrap:wrap;margin-bottom:34px}
  .about-row .section-lead{margin:0;flex:1 1 44ch}
  .btn-ghost{
    display:inline-flex;align-items:center;gap:8px;flex-shrink:0;
    font-size:14px;font-weight:600;color:var(--ink);text-decoration:none;
    background:var(--card-bg);border:1px solid var(--card-line);border-radius:9999px;
    padding:9px 18px;transition:color .2s,border-color .2s;
  }
  .btn-ghost:hover{color:#fff;border-color:rgba(140,176,255,.5)}
  .btn-ghost svg{width:15px;height:15px;transition:transform .2s}
  .btn-ghost:hover svg{transform:translateX(3px)}
  .btn-ghost:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
  .section-lead{font-size:16px;line-height:1.7;color:var(--ink);max-width:70ch;margin:0 0 18px}
  .section-lead:last-of-type{margin-bottom:34px}
  .perks-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);column-gap:44px;row-gap:22px}
  .perks-grid li{display:flex;gap:14px;align-items:center;font-size:15.5px;line-height:1.6;color:var(--ink-soft)}
  .perk-ico{
    flex:0 0 auto;width:34px;height:34px;border-radius:10px;
    display:inline-flex;align-items:center;justify-content:center;
    background:var(--card-bg);border:1px solid var(--card-line);
  }
  .perk-ico svg{width:17px;height:17px;color:var(--blue)}
  .values-grid{display:grid;grid-template-columns:repeat(3,1fr);column-gap:44px;row-gap:36px}
  .value{
    background:var(--card-bg);border:1px solid var(--card-line);border-radius:20px;
    padding:28px 30px;backdrop-filter:blur(8px);
    transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
  }
  .value:hover{transform:translateY(-4px);border-color:rgba(140,176,255,.4);box-shadow:0 12px 32px rgba(0,0,0,.18)}
  .value .vbar{width:32px;height:3px;border-radius:2px;background:var(--brand-grad);margin-bottom:18px}
  .value h3{font-family:var(--display);font-size:18px;font-weight:600;color:#fff;margin:0 0 9px;letter-spacing:-.015em}
  .value p{font-size:14.5px;line-height:1.65;margin:0;color:var(--ink-soft)}

  .roles h2{margin-bottom:8px}
  .roles-sub{font-size:15px;font-weight:500;color:var(--ink-soft);line-height:1.5;margin:0 0 24px}
  #roleList{display:flex;flex-direction:column;gap:14px}
  .role{
    display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:28px;
    padding:26px 30px;text-decoration:none;
    background:var(--card-bg);border:1px solid var(--card-line);border-radius:20px;
    backdrop-filter:blur(8px);
    transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;
  }
  .role:hover{
    transform:translateY(-4px);background:rgba(255,255,255,.09);
    border-color:rgba(140,176,255,.4);box-shadow:0 12px 32px rgba(0,0,0,.18);
  }
  .role:hover .role-loc{color:var(--ink)}
  .role:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
  .role-title{font-family:var(--display);font-size:21px;font-weight:600;color:#fff;letter-spacing:-.015em}
  .role-team{font-family:var(--display);font-size:14px;color:var(--blue);font-weight:500;margin-top:5px}
  .role-loc{font-size:14px;color:var(--ink-soft);white-space:nowrap}
  .role-arrow{color:rgba(140,176,255,.6);transition:transform .2s}
  .role:hover .role-arrow{transform:translateX(4px);color:#fff}

  .close{text-align:center;padding-block:12px 64px}
  .close h2{font-family:var(--display);font-size:34px;color:#fff;font-weight:600;margin:0 0 14px;letter-spacing:-.025em}
  .close p{max-width:48ch;margin:0 auto 28px;font-size:17px;color:var(--ink)}

  .backbar{padding-block:104px 16px;border-bottom:1px solid var(--line)}
  .back{
    display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;
    color:var(--blue);text-decoration:none;transition:gap .2s;
  }
  .back:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:4px}
  .back:hover{gap:12px}
  .back svg{width:18px;height:18px}
  .rd header{padding-block:46px 34px;border-bottom:1px solid var(--line)}
  .rd .eyebrow{display:block;margin:0 0 16px}
  .rd h1{font-family:var(--display);font-size:clamp(32px,4.4vw,50px);line-height:1.07;letter-spacing:-.03em;font-weight:700;color:#fff;margin:0 0 22px;max-width:20ch;text-wrap:balance}
  .chips{display:flex;gap:10px;flex-wrap:wrap}
  .chip{
    font-size:13.5px;font-weight:600;color:var(--ink);display:inline-flex;gap:8px;align-items:center;
    background:var(--card-bg);border:1px solid var(--card-line);border-radius:9999px;padding:8px 16px;
  }
  .chip svg{width:14px;height:14px;color:var(--blue)}

  .layout{display:grid;grid-template-columns:1fr 320px;gap:60px;padding-block:46px 84px;align-items:start}
  .rd-main{max-width:66ch;min-width:0}
  .rd-main .lead{font-size:18.5px;line-height:1.7;margin:0 0 6px;color:rgba(205,206,226,.92)}
  .rd-main h2{font-family:var(--display);font-size:22px;font-weight:600;color:#fff;margin:40px 0 16px;letter-spacing:-.02em}
  .rd-main p{margin:0 0 14px;font-size:15.5px;line-height:1.68}
  .rd-main ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:13px}
  .rd-main li{position:relative;padding-left:32px;font-size:15.5px;line-height:1.62}
  .rd-main li::before{
    content:"";position:absolute;left:0;top:2px;width:19px;height:19px;border-radius:50%;
    background-color:#8CB0FF;background-size:13px;background-position:center;background-repeat:no-repeat;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23101460'><path d='M8.3 13.6l-3.3-3.3 1.4-1.4 1.9 1.9 4.9-4.9 1.4 1.4z'/></svg>");
  }
  .rd-main ul.soft li::before{opacity:.55}

  .rd-aside{position:sticky;top:96px;max-height:calc(100vh - 120px);overflow-y:auto;display:flex;flex-direction:column;gap:14px}
  .apply-card{border-radius:20px;padding:28px;background:var(--card-bg);border:1px solid var(--card-line);backdrop-filter:blur(8px)}
  .apply-card .facts{display:flex;flex-direction:column;gap:15px;margin:0 0 24px}
  .fact{display:flex;flex-direction:column;gap:3px}
  .fact .k{font-family:var(--display);font-size:13px;font-weight:500;color:var(--ink-soft)}
  .fact .v{font-size:15px;font-weight:600;color:#fff}
  .apply-card .btn{width:100%;justify-content:center}
  .apply-note{font-size:12.5px;line-height:1.5;color:var(--ink-soft);text-align:center;margin:14px 0 0}


  @media (max-width:880px){
    .values-grid{grid-template-columns:repeat(2,1fr)}
    .layout{grid-template-columns:1fr;gap:0;padding-bottom:64px}
    .rd-aside{position:static;max-height:none;order:-1;margin-bottom:36px}
    .signal svg{height:92px}
  }
  @media (max-width:620px){
    .values-grid{grid-template-columns:1fr}
    .role{grid-template-columns:1fr auto}
    .role-loc{grid-column:1;white-space:normal;font-size:13px;margin-top:6px}
    .perks-grid{grid-template-columns:1fr}
    .signal svg{height:72px}
    .sig-faint,.sig-glow{display:none}
  }