:root{
    --ink:#0C1119; --ink-2:#141B27; --ink-3:#1B2432;
    --paper:#F1EFE7; --paper-dim:#C9C6BC;
    --slate:#8792A2; --slate-dim:#596271;
    --beacon:#2F8FEF; --beacon-dim:#1B4E85; --beacon-2:#29D3F2;
    --alert:#C4432E;
    --line: rgba(241,239,231,0.12);
    --line-strong: rgba(241,239,231,0.22);
    font-family:'IBM Plex Sans',sans-serif;
    box-sizing:border-box;
    padding-top:env(safe-area-inset-top,0px);
    padding-bottom:env(safe-area-inset-bottom,0px);
  }
  *,*::before,*::after{box-sizing:inherit;margin:0;padding:0;}
  html{scroll-padding-top:env(safe-area-inset-top,0px); scroll-behavior:smooth;}
  body{background:var(--ink);color:var(--paper);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
  img{max-width:100%;display:block;}
  a{color:inherit;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
  h1,h2,h3{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-0.01em;line-height:1.08;}
  .mono{font-family:'IBM Plex Mono',monospace;}

  /* ---- header ---- */
  header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(12,17,25,0.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
  .nav{display:flex;align-items:center;justify-content:space-between;padding:18px 32px;max-width:1180px;margin:0 auto;}
  .logo{display:flex;align-items:center;gap:10px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:1.15rem;letter-spacing:-0.01em;}
  .logo .mark{width:34px;height:auto;flex:none;}
  .logo .cyber{color:var(--beacon);}
  nav.links{display:flex;gap:32px;font-size:0.93rem;color:var(--slate);}
  nav.links a{text-decoration:none;transition:color .15s;}
  nav.links a:hover{color:var(--paper);}
  .navcta{background:var(--beacon);color:var(--ink);padding:10px 18px;border-radius:2px;font-size:0.9rem;font-weight:600;text-decoration:none;white-space:nowrap;}
  .navcta:hover{background:#54A9F7;}
  .menu-toggle{display:none;background:none;border:1px solid var(--line-strong);color:var(--paper);padding:8px 12px;font-size:0.85rem;border-radius:2px;}

  /* ---- hero ---- */
  .hero{position:relative;padding:96px 0 88px;border-bottom:1px solid var(--line);overflow:hidden;}
  .masthead{padding-bottom:56px;border-bottom:none;}
  .brandmark{font-size:0.78rem;letter-spacing:0.14em;color:var(--slate);margin-bottom:22px;}
  .hero-follow{padding-top:0;}
  .hero-follow .wrap{max-width:760px;}
  .hero-h2{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-0.01em;line-height:1.1;font-size:clamp(1.9rem,3.4vw,2.6rem);margin-bottom:18px;}
  .hero-grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:center;}
  .kicker{font-family:'IBM Plex Mono',monospace;font-size:0.8rem;color:var(--beacon);margin-bottom:22px;display:flex;align-items:center;gap:10px;}
  .kicker::before{content:'';width:7px;height:7px;background:var(--beacon);border-radius:50%;box-shadow:0 0 0 4px rgba(47,143,239,0.2);}
  .hero-tagline{font-size:1.02rem;color:var(--beacon-2);font-weight:500;margin-bottom:18px;}
  .hero-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;}
  .hero-tags span{border:1px solid var(--line-strong);color:#C7CBD4;font-size:0.82rem;padding:8px 14px;border-radius:2px;}
  .hero h1{font-size:clamp(2.4rem,4.6vw,3.6rem);max-width:15ch;}
  .hero h1 .accent{color:var(--beacon);}
  .hero p.lead{margin-top:22px;font-size:1.12rem;color:#C7CBD4;max-width:46ch;}
  .hero-ctas{margin-top:34px;display:flex;gap:16px;flex-wrap:wrap;}
  .btn-primary{background:var(--beacon);color:var(--ink);padding:14px 26px;font-weight:600;text-decoration:none;border-radius:2px;font-size:0.98rem;}
  .btn-primary:hover{background:#54A9F7;}
  .btn-ghost{border:1px solid var(--line-strong);color:var(--paper);padding:14px 26px;text-decoration:none;border-radius:2px;font-size:0.98rem;}
  .btn-ghost:hover{border-color:var(--paper-dim);}
  .hero-meta{margin-top:40px;display:flex;gap:36px;border-top:1px solid var(--line);padding-top:22px;}
  .hero-meta div{font-size:0.82rem;color:var(--slate);}
  .hero-meta strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:1.5rem;color:var(--paper);font-weight:600;}

  /* radar */
  .radar-wrap{position:relative;aspect-ratio:1/1;max-width:420px;margin:0 auto;}
  .radar-ring{position:absolute;border:1px solid var(--line-strong);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);}
  .r1{width:100%;height:100%;} .r2{width:70%;height:70%;} .r3{width:40%;height:40%;}
  .radar-cross{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;}
  .radar-cross::before,.radar-cross::after{content:'';position:absolute;background:var(--line);}
  .radar-cross::before{left:0;right:0;top:50%;height:1px;}
  .radar-cross::after{top:0;bottom:0;left:50%;width:1px;}
  .sweep{position:absolute;top:50%;left:50%;width:50%;height:1px;transform-origin:0 0;background:linear-gradient(90deg, var(--beacon-2), transparent);animation:spin 4.5s linear infinite;filter:drop-shadow(0 0 6px rgba(41,211,242,.6));}
  @keyframes spin{to{transform:rotate(360deg);}}
  .blip{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--beacon-2);box-shadow:0 0 0 5px rgba(41,211,242,.18);}
  .blip.b1{top:32%;left:64%;} .blip.b2{top:68%;left:38%;} .blip.b3{top:44%;left:22%;}
  .radar-label{position:absolute;bottom:-34px;left:50%;transform:translateX(-50%);font-size:0.72rem;color:var(--slate);white-space:nowrap;}
  @media (prefers-reduced-motion:reduce){ .sweep{animation:none;} }

  /* ---- section shell ---- */
  section{padding:88px 0;border-bottom:1px solid var(--line);}
  .section-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:52px;}
  .section-head .num{font-family:'IBM Plex Mono',monospace;color:var(--slate-dim);font-size:0.82rem;margin-bottom:14px;}
  .section-head h2{font-size:clamp(1.7rem,3vw,2.3rem);}
  .section-head p{color:var(--slate);font-size:1rem;max-width:42ch;}

  /* ---- pillars ---- */
  .pillars{display:grid;grid-template-columns:1.2fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
  .pillar{background:var(--ink);padding:44px;}
  .pillar.dim{background:var(--ink-2);}
  .pillar .tag{font-family:'IBM Plex Mono',monospace;font-size:0.76rem;color:var(--beacon);margin-bottom:16px;}
  .pillar h3{font-size:1.5rem;margin-bottom:14px;}
  .pillar p{color:var(--slate);margin-bottom:28px;max-width:44ch;}
  .svc-list{list-style:none;display:grid;gap:12px;}
  .svc-list li{display:flex;gap:12px;font-size:0.96rem;padding:12px 0;border-top:1px solid var(--line);}
  .svc-list li:first-child{border-top:none;}
  .svc-list .n{font-family:'IBM Plex Mono',monospace;color:var(--slate-dim);font-size:0.8rem;flex:none;padding-top:2px;}

  /* ---- IT services grid ---- */
  .svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
  .svc-card{background:var(--ink);padding:32px 28px;}
  .svc-card h4{font-size:1.08rem;margin-bottom:10px;font-family:'Space Grotesk',sans-serif;font-weight:600;}
  .svc-card p{color:var(--slate);font-size:0.92rem;}
  .svc-card .icon{width:34px;height:34px;margin-bottom:18px;color:var(--beacon);}

  /* ---- process ---- */
  .process{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;}
  .step{padding:24px 24px 0 0;border-top:1px solid var(--line-strong);}
  .step h4{font-size:1.15rem;margin-bottom:10px;}
  .step p{color:var(--slate);font-size:0.92rem;}

  /* ---- stats ---- */
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
  .stat{background:var(--ink);padding:36px 28px;}
  .stat strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:2.4rem;font-weight:600;color:var(--beacon);}
  .stat span{color:var(--slate);font-size:0.88rem;}

  /* ---- sales strip ---- */
  .sales{background:var(--ink-2);}
  .sales-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
  .sales ul{list-style:none;display:grid;gap:14px;margin-top:24px;}
  .sales ul li{padding-left:20px;position:relative;color:#C7CBD4;}
  .sales ul li::before{content:'';position:absolute;left:0;top:9px;width:8px;height:1px;background:var(--beacon);}

  /* ---- cta ---- */
  .cta{text-align:left;}
  .cta-box{border:1px solid var(--line-strong);padding:56px;display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;}
  .cta-box h2{font-size:clamp(1.6rem,3vw,2.1rem);margin-bottom:14px;}
  .cta-box p{color:var(--slate);max-width:42ch;}
  .hotline{border:1px solid var(--alert);padding:22px 24px;}
  .hotline .tag{font-family:'IBM Plex Mono',monospace;color:var(--alert);font-size:0.76rem;margin-bottom:8px;}
  .hotline strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:1.4rem;}
  .hotline span{color:var(--slate);font-size:0.85rem;}

  footer{padding:48px 0 calc(48px + env(safe-area-inset-bottom,0px));}

  /* ---- about ---- */
  .about-photo{max-width:420px;margin:0 0 56px;border:1px solid var(--line);}
  .about-photo img{width:100%;height:auto;display:block;filter:saturate(0.85) brightness(0.92);}
  .team-photo{width:calc(100% + 72px);height:auto;margin:-36px -36px 22px -36px;display:block;filter:saturate(0.85) brightness(0.92);}
  .team-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:8px;}
  .team-card{background:var(--ink);padding:36px;}
  .team-card h4{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:1.2rem;margin-bottom:14px;}
  .team-card p{color:var(--slate);margin-bottom:12px;font-size:0.94rem;}
  .team-card p:last-child{margin-bottom:0;}
  .dash-list{list-style:none;display:grid;gap:12px;margin-top:8px;}
  .dash-list li{padding-left:20px;position:relative;color:#C7CBD4;font-size:0.96rem;}
  .dash-list li::before{content:'';position:absolute;left:0;top:9px;width:8px;height:1px;background:var(--beacon);}
  .dash-list.two-col{grid-template-columns:1fr 1fr;column-gap:32px;}
  .about-close{border-top:1px solid var(--line-strong);margin-top:64px;padding-top:40px;}
  .about-close-tag{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:1.4rem;margin-bottom:10px;}
  .about-close-brand{font-weight:600;color:var(--beacon-2);margin-bottom:6px;}
  .about-close-meta{color:var(--slate);font-size:0.82rem;}
  @media (max-width:860px){
    .team-grid{grid-template-columns:1fr;}
    .dash-list.two-col{grid-template-columns:1fr;}
  }
  .foot-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;align-items:center;color:var(--slate);font-size:0.85rem;}
  .foot-grid .logo{font-size:1rem;}

  @media (max-width:860px){
    nav.links{display:none;}
    .menu-toggle{display:block;}
    .hero-grid{grid-template-columns:1fr;}
    .radar-wrap{margin-top:20px;max-width:280px;}
    .section-head{grid-template-columns:1fr;}
    .pillars{grid-template-columns:1fr;}
    .svc-grid{grid-template-columns:1fr;}
    .process{grid-template-columns:1fr;gap:28px;}
    .step:not(:last-child)::after{display:none;}
    .stats{grid-template-columns:1fr 1fr;}
    .sales-grid{grid-template-columns:1fr;}
    .cta-box{grid-template-columns:1fr;padding:32px;}
    .hero-meta{flex-wrap:wrap;row-gap:18px;}
  }

  /* ---- multi-page additions ---- */
  nav.links a.active{color:var(--paper);box-shadow:0 2px 0 var(--beacon);padding-bottom:4px;}
  .logo{text-decoration:none;}
  .section-head h1{font-size:clamp(1.7rem,3vw,2.3rem);}
  .cta-box h1{font-size:clamp(1.6rem,3vw,2.1rem);margin-bottom:14px;}
  a.svc-card{display:block;text-decoration:none;transition:background .15s;}
  a.svc-card:hover{background:var(--ink-3);}
  a.svc-card .n{display:block;font-family:'IBM Plex Mono',monospace;font-size:0.78rem;color:var(--beacon);margin-bottom:16px;}
  .foot-nav{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:0.85rem;width:100%;padding-bottom:22px;margin-bottom:6px;border-bottom:1px solid var(--line);}
  .foot-nav a{text-decoration:none;color:var(--slate);} .foot-nav a:hover{color:var(--paper);}
  @media (max-width:860px){
    header nav.links{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--ink);border-bottom:1px solid var(--line);padding:8px 32px 16px;}
    header.open nav.links{display:flex;}
    header nav.links a{padding:12px 0;border-bottom:1px solid var(--line);}
    header nav.links a.active{box-shadow:none;color:var(--beacon-2);}
    .navcta{display:none;}
  }