/* generated by tools/build.mjs — do not edit by hand */

/* Self-hosted webfonts — generated by tools/fetch-fonts.py, do not edit by hand.
 * Manrope: SIL Open Font License 1.1 (c) The Manrope Project Authors.
 * IBM Plex Mono: SIL Open Font License 1.1 (c) IBM Corp.
 * See fonts/OFL.txt.
 */

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('/fonts/manrope-latin-ext-300_800.3911b66d.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('/fonts/manrope-latin-300_800.a30ddcd3.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/ibmplexmono-latin-ext-400.6bc0f226.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/ibmplexmono-latin-400.08949f72.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/ibmplexmono-latin-ext-500.6bb06407.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/ibmplexmono-latin-500.01d28544.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---- base styles, lifted verbatim from the design canvas <helmet> ---- */
html { scroll-behavior: smooth; }
  body { margin: 0; background: #080A11; color: #EFF2F7; font-family: 'Manrope', system-ui, sans-serif; font-feature-settings: "ss01","ss02"; -webkit-font-smoothing: antialiased; }
  a { color: #EFF2F7; text-decoration: none; }
  a:hover { color: #3391FF; }
  * { box-sizing: border-box; }
  ::-webkit-scrollbar { width: 6px; }
  ::-webkit-scrollbar-track { background: #080A11; }
  ::-webkit-scrollbar-thumb { background: #212736; border-radius: 3px; }
  @keyframes floatY { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
  @keyframes pulseGlow { 0%,100% { opacity: 0.55; } 50% { opacity: 1; } }

/* ---- hover states, lifted out of style-hover attributes ----
   These need !important: the base declarations live in style="" attributes,
   which outrank any stylesheet selector. */
[data-hover="h1"]:hover,[data-hover="h1"]:focus-visible{background:#131824 !important}
[data-hover="h2"]:hover,[data-hover="h2"]:focus-visible{opacity:0.9 !important}
[data-hover="h3"]:hover,[data-hover="h3"]:focus-visible{opacity:0.92 !important}
[data-hover="h4"]:hover,[data-hover="h4"]:focus-visible{border-color:#3391FF !important;color:#3391FF !important}
[data-hover="h5"]:hover,[data-hover="h5"]:focus-visible{border-color:rgba(51,145,255,0.5) !important;box-shadow:0 0 30px rgba(51,145,255,0.14) !important;transform:translateY(-2px) !important}
[data-hover="h6"]:hover,[data-hover="h6"]:focus-visible{border-color:#3391FF !important}
[data-hover="h7"]:hover,[data-hover="h7"]:focus-visible{border-color:rgba(51,145,255,0.5) !important;transform:translateY(-2px) !important}
[data-hover="h8"]:hover,[data-hover="h8"]:focus-visible{border-color:rgba(51,145,255,0.5) !important;color:#1AE0F0 !important}
[data-hover="h9"]:hover,[data-hover="h9"]:focus-visible{border-color:rgba(51,145,255,0.5) !important;box-shadow:0 0 30px rgba(51,145,255,0.12) !important}
[data-hover="h10"]:hover,[data-hover="h10"]:focus-visible{color:#3391FF !important}

a[data-nav]{text-decoration:none}
a[data-nav][aria-current="page"]{cursor:default}
:focus-visible{outline:2px solid #3391FF;outline-offset:3px;border-radius:4px}
[data-stage-btn]{font:inherit;color:inherit}

/* ---- footer -------------------------------------------------------------
   auto-fit gives 5 tracks at 1440px while the content needs 6 units (the brand
   block spans 2), so CONTACT wrapped alone onto a second row next to a large
   empty area. An explicit template keeps the brand double-width and all four
   link columns on one row. */
/* Six units live in this grid: the brand block spans 2 tracks, then COMPANY,
   EXPERTISE, LEGAL and CONTACT. Five tracks left CONTACT stranded on its own row. */
[data-footer-grid]{grid-template-columns:repeat(6,minmax(0,1fr)) !important}
/* Every footer link, not just the ones inside <nav>: uniform column rhythm, and a
   tap target taller than the 19px the bare 14px text was giving on a phone. */
footer a{display:block;padding:7px 0;text-align:left !important}

/* Release the 2-track span once the grid can no longer hold two tracks;
   left in place it forces an implicit second column and the page scrolls
   sideways. Below this width every one of these grids is single-column. */
@media (max-width:900px){
  [data-span2]{grid-column:auto !important}
  [data-footer-grid]{grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr)) !important}
}

/* The toggle exists only for the mobile layout; declared before the media query so
   the media query's display:inline-flex wins at equal specificity. */
[data-nav-toggle]{display:none}

/* ---- mobile -------------------------------------------------------------- */
@media (max-width:760px){
  header > div{padding-left:20px !important;padding-right:20px !important}
  main section > div{padding-left:20px !important;padding-right:20px !important}
  footer > div{padding-left:20px !important;padding-right:20px !important}

  /* The canvas nav is a single desktop row that flex-wraps into 3-4 rows on a
     phone — a sticky header 232px tall, 27% of an iPhone viewport, on every
     screen. Collapse it behind a disclosure button instead. */
  header nav{
    display:none !important;
    position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;gap:2px;
    padding:8px 20px 16px;
    background:#0B0E15;border-bottom:1px solid #171B26;
    box-shadow:0 18px 40px -20px rgba(0,0,0,0.9);
  }
  header[data-nav-open] nav{display:flex !important}
  header nav a[data-nav]{padding:13px 8px !important;border-radius:8px}
  header nav ~ a[data-nav]{margin-left:auto}
  [data-nav-toggle]{
    display:inline-flex;align-items:center;justify-content:center;
    width:44px;height:44px;margin-left:12px;
    background:none;border:1px solid #212736;border-radius:10px;
    cursor:pointer;color:#EFF2F7;
  }
  header > div{position:relative;flex-wrap:nowrap !important;gap:10px !important}
  header nav ~ a[data-nav],[data-nav-toggle]{flex:0 0 auto}
}

/* The header row is logo + CTA + burger on one line. Below ~380px that no longer fits at
   the canvas's desktop spacing, and the burger was pushed past the right edge (measured
   with tools/find-overflow.mjs: 29px of overflow at 320px). Tighten, then drop the
   wordmark on the narrowest phones — the V mark still identifies the company. */
@media (max-width:380px){
  header nav ~ a[data-nav]{padding:11px 16px !important;font-size:13px !important}
  header > div{gap:8px !important}
}
@media (max-width:345px){
  header a[data-nav="home"] > span:last-child{display:none}

  /* Desktop section rhythm on a phone leaves ~200px empty bands between every
     section — seven of them on the home page alone. */
  main section{padding-top:56px !important;padding-bottom:56px !important}
  footer > div{padding-top:48px !important}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;scroll-behavior:auto !important}
}