:root{
  /* ---------- Grayscale ramp ---------- */
  --gray-50:  #F4F7FB;
  --gray-100: #E8EEF9;
  --gray-200: #CBD5E1;
  --gray-300: #9AA4B2;
  --gray-400: #6B7280;
  --gray-500: #4B5363;
  --gray-600: #353B47;
  --gray-700: #232833;
  --gray-800: #14171F;
  --gray-900: #0A0B10;

  /* ---------- Surfaces ---------- */
  --bg:        var(--gray-900);
  --surface-1: #0F1117;
  --surface-2: #14171F;

  /* ---------- Text ---------- */
  --text:       var(--gray-100);
  --muted:      var(--gray-300);
  --text-dim:   var(--gray-400);

  /* ---------- Borders ---------- */
  --border:        rgba(255,255,255,.08);
  --border-strong: rgba(255,255,255,.14);

  /* ---------- Blue accent ---------- */
  --blue:        #2563EB;
  --blue-hover:  #3B82F6;
  --blue-active: #1D4ED8;
  --blue-soft:   rgba(37,99,235,.12);
  --blue-glow:   rgba(96,165,250,.15);
  --ring:        rgba(37,99,235,.40);

  /* ---------- Status ---------- */
  --green:        #10B981;
  --green-text:   #34D399;
  --green-soft:   rgba(16,185,129,.10);
  --green-border: rgba(16,185,129,.32);

  /* ---------- Type tokens ---------- */
  --font-sans: 'Geist', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
*{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
html,body{
  margin:0;padding:0;
  background:
    radial-gradient(1000px 500px at 100% -10%, var(--blue-glow), transparent 60%),
    radial-gradient(900px 500px at 0% -20%, rgba(37,99,235,.18), transparent 60%),
    var(--bg);
  color:var(--text);
  font-family:var(--font-sans);
  font-feature-settings:"cv11","ss01","ss03";
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{color:inherit;text-decoration:none}
.container{max-width:1280px;margin:0 auto;padding:0 20px}
header{
  position:-webkit-sticky;
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(8,12,20,.6);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.06);
}

.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:12px;font-weight:600;letter-spacing:-0.01em;font-size:17px}
.brand img{height:64px;filter:brightness(0) invert(1)}

.menu-toggle{
  display:none;background:none;border:none;color:var(--text);
  font-size:24px;cursor:pointer;padding:8px
}
.navlinks{display:flex;gap:20px}
.navlinks a{padding:8px 12px;border-radius:10px;color:var(--text)}
.navlinks a:hover{background:rgba(255,255,255,.06);color:var(--text)}

@media (max-width:1023px), (hover:none) and (pointer:coarse){
  body.nav-open{overflow:hidden;}
  .menu-toggle{display:block}
  .navlinks{
    display:none;position:absolute;top:100%;left:0;right:0;z-index:60;
    background:rgba(8,12,20,.95);backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(255,255,255,.06);
    flex-direction:column;gap:0;padding:16px 0
  }
  .navlinks.open{display:flex}
  .navlinks a{
    padding:12px 20px;border-radius:0;
    border-bottom:1px solid rgba(255,255,255,.06)
  }
  .navlinks .cta{margin:16px 20px 0;border-radius:12px;text-align:center}
}

.cta{background:linear-gradient(180deg,#1e3a8a 0%,#172554 100%);color:#fff;border:1px solid rgba(147,197,253,.22);padding:12px 18px;border-radius:10px;font-weight:750;cursor:pointer;box-shadow:0 6px 14px rgba(15,23,42,.35);transition:background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease}
.cta:hover{background:linear-gradient(180deg,#1d4ed8 0%,#1e3a8a 100%);border-color:rgba(191,216,255,.35);transform:translateY(-1px);box-shadow:0 8px 18px rgba(15,23,42,.42)}
.cta:active{transform:translateY(0);box-shadow:0 4px 10px rgba(15,23,42,.32)}
.ghost{background:rgba(255,255,255,.015);border:1px solid rgba(255,255,255,.14);color:var(--text);padding:12px 18px;border-radius:10px;font-weight:700;transition:background .18s ease, border-color .18s ease, transform .18s ease}
.ghost:hover{background:rgba(255,255,255,.035);border-color:rgba(147,197,253,.24);transform:translateY(-1px);box-shadow:none}

.hero{padding:96px 0 64px;border-bottom:1px solid rgba(255,255,255,.06)}

.hero-title{
  font-size:clamp(28px, 8vw, 56px);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-0.025em;
  text-wrap:balance;
  margin:0 0 12px;
  max-width:22ch;
}
.hero-title .line{display:block}
.hero p{
  font-size:18px;
  line-height:1.55;
  color:var(--muted);
  max-width:40ch;
}
@media (min-width:768px){
  .hero-title{max-width:28ch}
  .hero p{max-width:60ch}
}
.tag{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:rgba(96,165,250,.12);color:#BFD8FF;border:1px solid rgba(96,165,250,.35);font-weight:700;font-size:12px;margin-bottom:16px}
.hero-actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}

/* Sub-page hero (slimmer) */
.page-hero{padding:64px 0 32px;border-bottom:1px solid rgba(255,255,255,.06)}
.page-hero h1{
  font-size:clamp(28px, 5vw, 44px);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-0.025em;
  margin:0 0 12px;
}
.page-hero p{
  font-size:17px;
  line-height:1.55;
  color:var(--muted);
  max-width:62ch;
  margin:0;
}

/* Enterprise logo strip */
.trusted-by{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01));border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06);padding:40px 0}
.trusted-by h3{text-align:center;margin:0 0 30px;color:var(--muted);font-size:18px;font-weight:600;letter-spacing:2px;text-transform:uppercase}
.corporate-logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:24px;align-items:center;justify-items:center}
.corporate-logos svg{height:32px;opacity:0.7;transition:opacity 0.3s ease}
.corporate-logos svg:hover{opacity:1}
.corporate-logos .logo{height:70px;opacity:0.7;transition:opacity 0.3s ease}
.corporate-logos .logo:hover{opacity:1}
.corporate-logos .bell-logo{height:45px;opacity:0.78;transition:opacity 0.3s ease;filter:brightness(0) invert(1)}
.corporate-logos .bell-logo:hover{opacity:1}
.corporate-logos .bombardier-logo{height:90px;opacity:0.7;transition:opacity 0.3s ease}
.corporate-logos .bombardier-logo:hover{opacity:1}
.corporate-logos .ibm-logo{height:45px;opacity:0.7;transition:opacity 0.3s ease}
.corporate-logos .ibm-logo:hover{opacity:1}
.corporate-logos .rogers-logo{height:95px;opacity:0.7;transition:opacity 0.3s ease;filter:brightness(0) saturate(100%) invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%)}
.corporate-logos .rogers-logo:hover{opacity:1}
.corporate-logos .canon-logo{height:80px;opacity:0.7;transition:opacity 0.3s ease}
.corporate-logos .canon-logo:hover{opacity:1}
@media(min-width:768px){
  .corporate-logos{grid-template-columns:repeat(6,1fr);gap:40px}
  .corporate-logos svg{height:36px}
  .corporate-logos .logo{height:85px}
  .corporate-logos .bell-logo{height:50px}
  .corporate-logos .bombardier-logo{height:105px}
  .corporate-logos .ibm-logo{height:50px}
  .corporate-logos .rogers-logo{height:110px}
  .corporate-logos .canon-logo{height:95px}
}

section{padding:64px 0}
h2{
  font-size:clamp(24px, 3.4vw, 32px);
  font-weight:600;
  line-height:1.15;
  letter-spacing:-0.02em;
  margin:0 0 10px;
}
.sub{color:var(--muted);margin:0 0 24px;font-size:16px;line-height:1.55}

/* Section header row with link on the right (desktop) */
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.section-head .titles{flex:1;min-width:240px}
.section-head .titles h2{margin:0 0 4px}
.section-head .titles .sub{margin:0}

.grid{display:grid;gap:16px}
@media(min-width:768px){
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .grid-2{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:640px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid-4{grid-template-columns:repeat(4,1fr)}}

.card{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px;position:relative;overflow:hidden}
.card h3{margin:6px 0 6px;font-size:18px;font-weight:600;letter-spacing:-0.01em}
.card p{color:var(--muted);font-size:14px;line-height:1.55}

/* Compact service card — editorial layout */
.service-card-compact{
  display:flex;flex-direction:column;
  padding:24px;height:100%;
}
.service-icon-compact{
  width:36px;height:36px;
  opacity:0.85;
  filter:brightness(0) invert(1);
  margin-bottom:14px;
}
.service-card-compact h3{
  font-size:16px;font-weight:600;
  margin:0 0 8px;letter-spacing:-0.01em;
}
.service-card-compact p{
  font-size:14px;line-height:1.55;
  color:var(--muted);margin:0;
}
.service-card-compact .capability{
  margin-top:auto;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.06);
  font-size:13px;
  line-height:1.5;
  color:rgba(255,255,255,.62);
}
.service-card-compact .capability-label{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,.40);
  margin-right:10px;
}
@media(max-width:520px){
  .service-card-compact .capability-label{
    display:block;
    margin:0 0 4px;
  }
}

/* Featured Work cards */
.featured-work-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:768px){.featured-work-grid{grid-template-columns:repeat(3,1fr)}}
.featured-work-card{
  display:flex;flex-direction:column;
  padding:24px;height:100%;
}
.work-meta{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  margin-bottom:12px;
  font-family:var(--font-sans);
  font-size:13px;
  font-weight:650;
  letter-spacing:0;
  color:rgba(232,238,249,.86);
  text-transform:none;
}
.work-meta span:last-child{
  color:var(--muted);
  font-weight:500;
  white-space:nowrap;
}
.featured-work-card h3{
  margin:8px 0 10px;font-size:17px;
  font-weight:600;letter-spacing:-0.01em;
  line-height:1.3;
}
.featured-work-card p{
  font-size:14px;line-height:1.55;
  color:var(--muted);margin:0;
}

/* Section link / View all */
.section-link{
  display:inline-flex;align-items:center;gap:6px;
  margin-top:28px;color:var(--text);
  font-weight:500;font-size:14px;
  border-bottom:1px solid rgba(255,255,255,.20);
  padding-bottom:2px;width:fit-content;
  transition:border-color .2s ease,color .2s ease;
}
.section-link:hover{color:#BFD8FF;border-color:#BFD8FF}
.section-link.inline{margin-top:0}

/* Current Focus layout */
.focus-layout{
  display:grid;
  gap:20px;
  grid-template-columns:1fr;
}
@media(min-width:900px){
  .focus-layout{
    grid-template-columns:1.35fr .95fr;
    align-items:stretch;
  }
}
.focus-list{
  background:rgba(255,255,255,.015);
  border:1px solid var(--border);
  border-radius:16px;padding:28px;
  display:flex;flex-direction:column;
}
.focus-primary{min-height:100%}
.product-secondary{min-height:100%}
.focus-header{margin-bottom:20px}
.meta-label{
  display:block;
  font-family:var(--font-sans);
  font-size:15px;
  font-weight:750;
  letter-spacing:-.01em;
  color:var(--text);
  text-transform:none;
  margin-bottom:6px;
}
.focus-header p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}
.focus-item{padding:18px 0;border-bottom:1px solid var(--border)}
.focus-item:first-of-type{padding-top:0}
.focus-item:last-child{border-bottom:none;padding-bottom:0}
.focus-item .focus-label{
  display:block;
  font-family:var(--font-sans);
  font-size:15px;
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--text);
  text-transform:none;
  margin-bottom:5px;
}
.focus-item .focus-title{
  display:block;
  font-size:15px;
  line-height:1.55;
  color:var(--muted);
  font-weight:400;
}

/* Teaser grid (Research + About side-by-side) */
.teaser-grid{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:768px){.teaser-grid{grid-template-columns:1fr 1fr}}
.teaser-card{
  padding:32px;background:rgba(255,255,255,.015);
  border:1px solid var(--border);border-radius:16px;
  display:flex;flex-direction:column;height:100%;
}
.teaser-card h2{margin:0 0 8px;font-size:22px}
.teaser-card .sub{margin:0 0 16px}
.teaser-card .teaser-body{flex:1;color:var(--muted);font-size:15px;line-height:1.6;margin:0 0 20px}

/* Existing Work card icons (used on work.html) */
.work-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.work-icon {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 72px;
  height: 72px;
  opacity: 0.8;
  filter: brightness(0) invert(1);
  object-fit: contain;
  padding: 2px;
}
.work-icon[src$=".svg"] { filter: none; }
.work-icon[src*="media.png"] { filter: none; opacity: 0.9; }
.work-content { flex: 1; padding-right: 75px; }
@media (max-width: 640px) {
  .work-content { padding-right: 0; }
  .work-icon {
    position: static; width: 48px; height: 48px;
    margin-bottom: 12px;
  }
}

/* Forge / About */
.forge-section { position: relative; display: flex; align-items: flex-start; }
.forge-content { flex: 1; z-index: 2; position: relative; text-align: left; }
.forge-content h2 { margin: 0 0 10px 0; color: var(--text); }
.forge-content p {
  margin: 0 0 16px 0; line-height: 1.6;
  color: var(--muted); font-size: 16px;
}
.forge-content .forge-note {
  color: var(--muted); font-size: 16px;
  margin: 0; line-height: 1;
}
@media (max-width: 768px) {
  .forge-content { padding-right: 20px; }
}

.about-text {
  color: var(--muted); line-height: 1.6;
  font-size: 16px; margin: 0 0 16px 0;
}
.about-text strong { color: var(--text); }
.about{display:grid;gap:24px}
@media(min-width:768px){.about{grid-template-columns:1.2fr .8fr;align-items:start}}

/* KPI */
.kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.kpi .stat{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);padding:12px;border-radius:12px;text-align:center}
.stat .big{
  font-family:var(--font-mono);
  font-size:22px;
  font-weight:500;
  letter-spacing:-0.02em;
  font-feature-settings:"tnum","ss01";
}

@keyframes countUp {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Contact form */
.success-message {
  background: linear-gradient(135deg, #059669, #10b981);
  border: 1px solid rgba(16, 185, 129, 0.4);
  color: white; padding: 16px 20px;
  border-radius: 12px; margin-bottom: 24px;
  text-align: center; font-weight: 600;
  display: none;
}
.success-message.show {
  display: block;
  animation: slideIn 0.3s ease-out;
}
@keyframes slideIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
.submit-btn:disabled { opacity: 0.7; cursor: not-allowed; }
.submit-btn .spinner {
  display: none; width: 16px; height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top: 2px solid white;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.submit-btn.loading .spinner { display: block; }
.submit-btn.loading span { display: none; }
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.contact-wrapper{max-width:700px;margin:0 auto}
.contact-form{max-width:100%}
.contact-header{text-align:center;margin-bottom:40px}
.modern-form{display:grid;gap:24px}
.form-row{display:grid;grid-template-columns:1fr;gap:20px}
@media(min-width:640px){.form-row{grid-template-columns:1fr 1fr}}
.form-group{display:flex;flex-direction:column;gap:8px}
.form-group label{font-weight:600;color:var(--text);font-size:14px}
input, select{background:rgba(255,255,255,.03);border:2px solid rgba(255,255,255,.12);padding:14px 16px;border-radius:12px;color:var(--text);font-size:15px;transition:all 0.2s ease}
textarea{background:rgba(255,255,255,.03);border:2px solid rgba(255,255,255,.12);padding:14px 16px;border-radius:12px;color:var(--text);font-size:15px;transition:all 0.2s ease;resize:none;min-height:100px;width:100%;font-family:inherit}
@media(min-width:768px){textarea{min-height:140px}}
@media(min-width:1024px){textarea{min-height:160px}}
input:focus, textarea:focus, select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px var(--ring);background:rgba(255,255,255,.05)}
input::placeholder, textarea::placeholder{color:var(--muted)}
select{cursor:pointer}
select option{background:#0F1524;color:var(--text)}
.submit-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:16px 24px;font-size:16px;margin-top:8px}

/* Shared eyebrow label */
.eyebrow{
  display:block;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 10px;
}

/* No-dot tag chip */
.tag-static{
  display:inline-flex;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  padding:5px 10px;
  border-radius:999px;
  color:var(--muted);
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
}

/* Product featured card */
.product-card{
  position:relative;
  padding:32px;
  background:
    linear-gradient(180deg,rgba(96,165,250,.07),rgba(255,255,255,.02));
  border:1px solid rgba(96,165,250,.22);
  border-radius:16px;
  overflow:hidden;
  display:flex;flex-direction:column;
}
.product-logo{
  display:block;
  align-self:flex-start;
  height:44px;
  width:auto;
  max-width:140px;
  object-fit:contain;
  margin:14px 0 16px;
  filter:brightness(0) invert(1);
  opacity:.92;
}
.product-card h3{
  font-size:clamp(20px,2.4vw,24px);
  font-weight:600;
  letter-spacing:-0.01em;
  margin:0 0 10px;
}
.product-card p{
  color:var(--muted);
  font-size:15px;
  line-height:1.6;
  max-width:68ch;
  margin:0;
}
.product-cta{
  display:inline-flex;align-items:center;gap:6px;
  margin-top:18px;
  color:var(--text);
  font-weight:500;
  font-size:14px;
  border-bottom:1px solid rgba(255,255,255,.20);
  padding-bottom:2px;
  width:fit-content;
  transition:border-color .2s ease,color .2s ease;
}
.product-cta:hover{color:#BFD8FF;border-color:#BFD8FF}

/* Publication card */
.publication-card{
  position:relative;
  padding:36px;
  background:rgba(255,255,255,.015);
  border:1px solid rgba(255,255,255,.07);
  border-radius:16px;
}
.publication-card .eyebrow{
  font-size:12px;
  color:#BFD8FF;
  letter-spacing:0.06em;
  margin-bottom:16px;
}
.publication-card h3{
  font-size:clamp(18px,2.2vw,22px);
  font-weight:600;
  letter-spacing:-0.01em;
  line-height:1.35;
  margin:0 0 14px;
}
.publication-card p{
  color:var(--muted);
  font-size:15px;
  line-height:1.65;
  max-width:64ch;
  margin:0;
}
.publication-card .tag-static{margin-top:20px}

/* Hero node-graph */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero > .container{position:relative;z-index:2}
.hero-graph{
  position:absolute;inset:0;
  width:100%;height:100%;
  pointer-events:none;
  z-index:0;
}
/* Static gradient overlay that fades the node-graph into the page.
   Replaces an expensive mask-image on the animated SVG (the mask forced
   the browser to re-composite the masked layer every animation frame and
   during scroll). This pseudo-element paints once and is cheap. */
.hero::after{
  content:"";
  position:absolute;inset:0;
  z-index:1;
  pointer-events:none;
  background:radial-gradient(
    ellipse 70% 80% at 80% 35%,
    transparent 0%, transparent 35%,
    rgba(10,11,16,.6) 70%,
    var(--bg) 100%);
}
.hero-graph .edge{
  stroke:#60A5FA;
  stroke-width:1;
  vector-effect:non-scaling-stroke;
  fill:none;
  opacity:0.18;
}
.hero-graph .node{ fill:#93C5FD; opacity:0.85; }
.hero-graph .node-halo{ fill:#60A5FA; opacity:0.14; }
@media (prefers-reduced-motion: reduce){
  .hero-graph .edge{opacity:0.16}
  .hero-graph .node{opacity:0.70}
  .hero-graph .node-halo{opacity:0.10}
}

/* How Engagements Work — Assess, Plan, Build, Operate */
.process{
  display:grid;
  gap:18px;
  grid-template-columns:1fr;
  margin-top:28px;
}
@media(min-width:768px){
  .process{
    grid-template-columns:repeat(4,1fr);
    gap:22px;
  }
}
.step{
  border-top:1px solid rgba(255,255,255,.14);
  padding-top:18px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.step-num{
  font-family:var(--font-sans);
  font-size:13px;
  font-weight:700;
  letter-spacing:0.02em;
  color:rgba(191,216,255,.8);
  line-height:1;
  opacity:1;
}
.step h3{
  font-size:19px;
  font-weight:700;
  letter-spacing:-0.015em;
  margin:0;
}
.step p{
  font-size:15px;
  line-height:1.65;
  color:var(--muted);
  margin:0;
}

.footer{padding:28px 0;border-top:1px solid rgba(255,255,255,.08);color:var(--muted);font-size:14px;text-align:center}
.note{font-size:12px;color:var(--muted)}
.forge-note{font-size:14px;color:var(--muted);margin-top:12px}