/* ============================================================
   Intelligence Assist — Website Redesign
   Aesthetic: contemporary B2B (modular cards, subtle texture)
   Built on tokens.css
   ============================================================ */
@import url("./tokens.css");

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
  font-feature-settings: "ss01", "cv11";
}
img, svg { display: block; max-width: 100%; }
button { font-family: inherit; }

/* ---------- Accelerator + pillar colours (from brief) ---------- */
:root {
  /* Pillar tones — IA palette only (skill: Dark Blue / Teal / Blue). No off-brand
     green or amber; the -bg values are tints of the brand hex, not new colours. */
  --pl-strategy-bg:  #E5E8F0;  --pl-strategy-fg:  #001A55;  /* Dark Blue  #001A55 */
  --pl-enable-bg:    #E0F2F1;  --pl-enable-fg:    #00655F;  /* Teal, darkened for text (accent stays #00968F) */
  --pl-enable-accent:#00968F;                                /* Teal       #00968F — dots, rules, swatches */
  --pl-build-bg:     #E4E7FA;  --pl-build-fg:     #0119B7;  /* Blue       #0119B7 */

  --ac-agents-bg:    #ECE7FE;  --ac-agents-fg:    #3B2C82;  --ac-agents-dot:  #885CF6;
  --ac-knowledge-bg: #D6F0EC;  --ac-knowledge-fg: #0A5249;  --ac-knowledge-dot: #0D9488;
  --ac-decision-bg:  #DCE1F0;  --ac-decision-fg:  #001A55;  --ac-decision-dot:  #001A55;
  --ac-tool-bg:      #E9F6DD;  --ac-tool-fg:      #335E16;  --ac-tool-dot:      #63C240;
  --ac-conversational-bg: #DCF7FC;  --ac-conversational-fg: #0A4E5A;  --ac-conversational-dot: #4BE4F8;
  --ac-everyday-bg:  #F3F4F6;  --ac-everyday-fg:  #374151;  --ac-everyday-dot:  #6B7280;

  --paper:           #FAFAF7;   /* warm off-white site background */
  --hairline:        #E8E8E2;
  --ink:             #0B1024;
}

/* Lighten the brand surfaces slightly for a less corporate, more product feel */
body { background: var(--paper); color: var(--ink); }

/* ---------- Layout ---------- */
.container { max-width: 1240px; margin: 0 auto; padding: 0 28px; }
.container--narrow { max-width: 1040px; }
.section { padding: 96px 0; }
.section--tight { padding: 64px 0; }
.section--ink { background: var(--ink); color: #fff; }
.section--ink .muted { color: rgba(255,255,255,.65); }
.section--paper { background: var(--paper); }
.section--white { background: #fff; }

/* subtle dot grid texture for hero / breaks */
.dot-grid {
  background-image: radial-gradient(rgba(11,16,36,.07) 1px, transparent 1px);
  background-size: 22px 22px;
  background-position: -1px -1px;
}
.section--ink.dot-grid {
  background-image: radial-gradient(rgba(75, 228, 248, .12) 1px, transparent 1px);
}

/* ---------- Typography ---------- */
.eyebrow {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 12px;
  letter-spacing:.01em;
  
  color: var(--ia-blue);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.eyebrow::before {
  content: "";
  width: 24px;
  height: 1px;
  background: currentColor;
  opacity: .8;
}
.eyebrow--plain::before { display: none; }
.section--ink .eyebrow { color: var(--ia-light-blue); }

.h-display {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: clamp(40px, 4.6vw + 8px, 72px);
  line-height: 1.02;
  letter-spacing: -0.028em;
  margin: 0;
  color: var(--ink);
}
.h-display em {
  font-style: normal;
  background: linear-gradient(180deg, transparent 62%, var(--ia-cyan-300) 62%);
  padding: 0 2px;
}
.section--ink .h-display { color: #fff; }
.section--ink .h-display em { color: var(--ia-light-blue); background: none; }

h1.h-section, h2.h-section {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: clamp(30px, 2.6vw + 8px, 44px);
  line-height: 1.08;
  letter-spacing: -0.022em;
  margin: 0;
  color: var(--ink);
}
.section--ink .h-section { color: #fff; }

h3.h-card, .h-card {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: -0.01em;
  margin: 0;
}

.lede {
  font-size: 20px;
  line-height: 1.5;
  color: #4A4F60;
  max-width: 60ch;
  font-weight: 400;
  margin: 0;
}
.section--ink .lede { color: rgba(255,255,255,.72); }
.muted { color: #5C6172; }

.section-head { display: flex; flex-direction: column; gap: 14px; margin-bottom: 56px; max-width: 760px; }
.section-head--center { margin-left: auto; margin-right: auto; text-align: center; align-items: center; }
.section-head--row {
  flex-direction: row; align-items: end; justify-content: space-between;
  max-width: none;
}
.section-head--row .head-left { display: flex; flex-direction: column; gap: 14px; max-width: 640px; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--font-body); font-weight: 500; font-size: 16px; line-height: 1;
  padding: 14px 22px; border-radius: 999px;
  border: 1px solid transparent; cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard),
              color var(--dur-fast) var(--ease-standard),
              border-color var(--dur-fast) var(--ease-standard),
              transform var(--dur-fast) var(--ease-standard);
  text-decoration: none; white-space: nowrap;
}
.btn:active { transform: translateY(1px); }
.btn--primary { background: var(--ia-blue); color: #fff; }
.btn--primary:hover { background: var(--ia-blue-700); }
.btn--secondary { background: #fff; color: var(--ink); border-color: var(--hairline); }
.btn--secondary:hover { border-color: var(--ink); }
.btn--ghost { background: transparent; color: var(--ink); padding-left: 4px; padding-right: 4px; }
.btn--ghost:hover { color: var(--ia-blue); }
.btn--on-dark-primary { background: var(--ia-light-blue); color: var(--ia-dark-blue); }
.btn--on-dark-primary:hover { background: #6CECFF; }
.btn--on-dark-secondary { background: transparent; color: #fff; border-color: rgba(255,255,255,.22); }
.btn--on-dark-secondary:hover { border-color: rgba(255,255,255,.6); }
.btn--lg { font-size: 16px; padding: 17px 28px; }
.btn--sm { font-size: 14px; padding: 9px 16px; }
.btn .arrow { transition: transform var(--dur-fast) var(--ease-standard); }
.btn:hover .arrow { transform: translateX(3px); }

/* Inline arrow link */
.linkout {
  display: inline-flex; align-items: center; gap: 6px;
  font-weight: 500; color: var(--ia-blue);
  cursor: pointer; text-decoration: none; font-size: 16px;
  background: transparent; border: 0; padding: 0;
  font-family: inherit;
}
.linkout:hover { color: var(--ia-blue-700); }
.linkout .arrow { transition: transform var(--dur-fast) var(--ease-standard); }
.linkout:hover .arrow { transform: translateX(3px); }

/* ---------- Tags (pillars + accelerators) ---------- */
.tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600;
  letter-spacing:.01em; 
  padding: 5px 10px; border-radius: 999px;
}
.tag .dot {
  width: 6px; height: 6px; border-radius: 999px;
  background: currentColor;
}
.tag--strategy   { background: var(--pl-strategy-bg);   color: var(--pl-strategy-fg); }
.tag--enable     { background: var(--pl-enable-bg);     color: var(--pl-enable-fg); }
.tag--build      { background: var(--pl-build-bg);      color: var(--pl-build-fg); }
.tag--agents     { background: var(--ac-agents-bg);     color: var(--ac-agents-fg); }
.tag--knowledge  { background: var(--ac-knowledge-bg);  color: var(--ac-knowledge-fg); }
.tag--decision   { background: var(--ac-decision-bg);   color: var(--ac-decision-fg); }
.tag--tool       { background: var(--ac-tool-bg);       color: var(--ac-tool-fg); }
.tag--conversational { background: var(--ac-conversational-bg); color: var(--ac-conversational-fg); }
.tag--everyday   { background: var(--ac-everyday-bg);   color: var(--ac-everyday-fg); }
.tag--neutral    { background: #F2F2EE; color: #5C6172; }

/* Dot indicator using accelerator colours */
.acc-dot { width: 10px; height: 10px; border-radius: 999px; flex: none; }
.acc-dot--agents    { background: var(--ac-agents-dot); }
.acc-dot--knowledge { background: var(--ac-knowledge-dot); }
.acc-dot--decision  { background: var(--ac-decision-dot); }
.acc-dot--tool      { background: var(--ac-tool-dot); }
.acc-dot--conversational { background: var(--ac-conversational-dot); }
.acc-dot--everyday  { background: var(--ac-everyday-dot); }

/* ---------- Foundations hero: 1-2-3 step cards ---------- */
.fdn-steps { display: flex; flex-direction: column; gap: 0; position: relative; }
.fdn-step {
  display: flex; align-items: center; gap: 16px; width: 100%; text-align: left;
  background: #fff; border: 1px solid var(--hairline); border-radius: 14px;
  padding: 15px 18px; cursor: pointer; font-family: inherit; position: relative;
  margin-bottom: 14px;
  transition: border-color var(--dur-base, .18s) var(--ease-standard, ease),
              transform var(--dur-base, .18s) var(--ease-standard, ease),
              box-shadow var(--dur-base, .18s) var(--ease-standard, ease);
}
.fdn-step:last-child { margin-bottom: 0; }
.fdn-step:hover { border-color: #C7CCD8; transform: translateX(2px); box-shadow: 0 4px 14px rgba(11,16,36,.05); }
.fdn-step:not(:last-child)::after {
  content: ""; position: absolute; left: 37px; bottom: -14px; width: 2px; height: 14px;
  background: var(--pl-enable-bg);
}
.fdn-step-n {
  width: 40px; height: 40px; border-radius: 999px; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--pl-enable-bg); color: var(--pl-enable-fg);
  font-family: var(--font-display); font-weight: 700; font-size: 18px;
}
.fdn-step-body { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fdn-step-side { font-size: 12px; font-weight: 700; letter-spacing:.01em;  color: var(--pl-enable-fg); }
.fdn-step-label { font-size: 16px; font-weight: 600; color: var(--ink); }
.fdn-step-arr { color: #9BA0AE; flex: none; transition: color var(--dur-base, .18s) var(--ease-standard, ease); }
.fdn-step:hover .fdn-step-arr { color: var(--pl-enable-fg); }

/* ---------- Cards ---------- */
.card {
  background: #fff;
  border: 1px solid var(--hairline);
  border-radius: 18px;
  padding: 28px;
  display: flex; flex-direction: column; gap: 14px;
  transition: border-color var(--dur-base) var(--ease-standard),
              box-shadow var(--dur-base) var(--ease-standard),
              transform var(--dur-base) var(--ease-standard);
}
.card--hoverable { cursor: pointer; }
.card--hoverable:hover {
  border-color: #C7CCD8;
  box-shadow: 0 4px 14px rgba(11,16,36,.05);
  transform: translateY(-2px);
}
.card-foot {
  margin-top: auto;
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid var(--hairline);
  font-size: 14px;
  color: #5C6172;
}
.card-foot strong { color: var(--ink); font-weight: 500; }

/* Pillar card on Home */
.pillar-card {
  display: flex; flex-direction: column; gap: 18px;
  padding: 32px;
  border-radius: 22px;
  border: 1px solid var(--hairline);
  background: #fff;
  position: relative;
  overflow: hidden;
  min-height: 280px;
  cursor: pointer;
  transition: transform var(--dur-base) var(--ease-standard),
              border-color var(--dur-base) var(--ease-standard);
}
.pillar-card:hover { transform: translateY(-3px); border-color: #C7CCD8; }
.pillar-card .pillar-glyph {
  position: absolute;
  top: 22px; right: 22px;
  width: 96px; height: 96px;
  border-radius: 999px;
  opacity: .9;
  z-index: 0;
}
.pillar-card > *:not(.pillar-glyph) { position: relative; z-index: 1; }
.pillar-card .pillar-glyph--strategy { background: var(--pl-strategy-bg); }
.pillar-card .pillar-glyph--enable   { background: var(--pl-enable-bg); }
.pillar-card .pillar-glyph--build    { background: var(--pl-build-bg); }
.pillar-card .pillar-cta {
  margin-top: auto;
  display: inline-flex; align-items: center; gap: 6px;
  font-weight: 500; color: var(--ia-blue); font-size: 14px;
}
.pillar-card .pillar-meta {
  font-size: 14px; color: #5C6172;
  display: flex; flex-direction: column; gap: 4px;
  margin-top: 8px;
}
.pillar-card .pillar-meta li {
  display: flex; align-items: center; gap: 8px;
  list-style: none;
}
.pillar-card .pillar-meta li::before {
  content: ""; width: 4px; height: 4px; border-radius: 999px;
  background: var(--ink); opacity: .3;
}
.pillar-card ul { margin: 0; padding: 0; }

/* ---------- Purpose / Mission / Values ---------- */
.pmv-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
  margin-top: 40px;
}
@media (max-width: 720px) { .pmv-stats { grid-template-columns: 1fr; } }
.pmv-stat {
  background: #fff; border: 1px solid var(--hairline); border-radius: 16px;
  padding: 26px 24px;
  border-top: 3px solid var(--ia-blue);
}
.pmv-stat-value {
  font-family: var(--font-display); font-weight: 700; font-size: 44px; line-height: 1;
  letter-spacing: -0.02em; color: var(--ia-blue);
}
.pmv-stat-label { margin-top: 10px; font-size: 14px; color: #4A4F60; line-height: 1.45; }
@media (max-width: 860px) { .pmv-split { grid-template-columns: 1fr !important; gap: 24px !important; } }

/* ---------- Accelerator strip ---------- */
.acc-strip-wrap {
  background: #F6F6F2;
  border-radius: 28px;
  padding: 30px;
  border: 1px solid #E8E8E2;
}
.acc-strip-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: 22px;
  padding: 2px 6px 0;
  gap: 16px;
}
.acc-strip-head .head-title { font-family: var(--font-display); font-weight: 700; font-size: 20px; letter-spacing: -0.01em; color: var(--ink); }
.acc-strip-head .head-sub { font-size: 14px; color: #5C6172; text-align: right; max-width: 38ch; }
.acc-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
}
@media (max-width: 1180px) { .acc-strip { grid-template-columns: repeat(3, 1fr); } }
.acc-tile {
  background: #fff;
  border-radius: 18px;
  padding: 24px 22px 22px;
  display: flex; flex-direction: column; gap: 10px;
  border: 1px solid #ECECE6;
  transition: border-color var(--dur-base) var(--ease-standard),
              transform var(--dur-base) var(--ease-standard),
              box-shadow var(--dur-base) var(--ease-standard);
  position: relative;
  overflow: hidden;
  min-height: 150px;
}
.acc-tile::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--c);
}
.acc-tile:hover { border-color: color-mix(in srgb, var(--c) 45%, #ECECE6); transform: translateY(-3px); box-shadow: 0 10px 26px rgba(11,16,36,.07); }
.acc-tile .acc-name {
  font-weight: 600; font-size: 16px; color: var(--ink);
  letter-spacing: -0.01em;
  display: flex; align-items: center; gap: 9px;
}
.acc-tile .acc-name .acc-dot { width: 10px; height: 10px; }
.acc-tile .acc-sub {
  font-size: 14px; line-height: 1.5;
  color: #5C6172;
}

/* ---------- Stepper ---------- */
.stepper {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  position: relative;
}
.stepper--four { grid-template-columns: repeat(4, 1fr); }
.step {
  display: flex; flex-direction: column; gap: 12px;
  position: relative;
}
.step::before {
  content: "";
  position: absolute;
  top: 18px; left: 36px; right: -8px;
  height: 1px;
  background: repeating-linear-gradient(to right, #C7CCD8 0 4px, transparent 4px 8px);
}
.step:last-child::before { display: none; }
.step .step-num {
  width: 36px; height: 36px; border-radius: 999px;
  background: #fff; border: 1px solid var(--hairline);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 600;
  color: var(--ia-blue);
  font-feature-settings: "tnum";
  position: relative; z-index: 1;
}
.step .step-eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing:.01em;
   color: var(--ia-blue);
}
.step .step-name {
  font-weight: 600; font-size: 18px; color: var(--ink);
  letter-spacing: -0.01em;
}
.step .step-desc {
  font-size: 14px; color: #5C6172; line-height: 1.5;
}
.stepper--three { grid-template-columns: repeat(3, 1fr); }
.step--link { cursor: pointer; }
.step--link:hover .step-num { border-color: var(--ia-blue); color: var(--ia-blue); }
.step--link:hover .step-name { color: var(--ia-blue); }
.step--link:hover .step-cta .arrow { transform: translateX(3px); }
.step--active .step-num { background: var(--ia-blue); border-color: var(--ia-blue); color: #fff; }

/* Enablement triangle (deck motif, per-page emphasis) */
.tri-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 56px; align-items: center; }
.tri-stage { max-width: 460px; width: 100%; margin: 0 auto; }
.tri-legend { display: flex; flex-direction: column; gap: 12px; }
.tri-row {
  display: grid; grid-template-columns: 6px 1fr auto; gap: 18px; align-items: center;
  background: #fff; border: 1px solid var(--hairline); border-radius: 14px;
  padding: 18px 22px 18px 18px;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard), box-shadow var(--dur-base) var(--ease-standard);
}
.tri-row--active { border-color: var(--tri-accent); box-shadow: var(--shadow-md); }
.tri-row[role="button"] { cursor: pointer; }
.tri-row[role="button"]:hover { border-color: #C7CCD8; transform: translateX(2px); }
.tri-row[role="button"]:hover .tri-cta .arrow { transform: translateX(3px); }
.tri-swatch { align-self: stretch; width: 6px; border-radius: 99px; background: var(--tri-accent); }
.tri-body { min-width: 0; }
.tri-name {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-display); font-weight: 700; font-size: 18px; color: var(--ink); letter-spacing: -0.01em;
}
.tri-n { font-size: 12px; font-weight: 700; color: #9BA0AE; font-feature-settings: "tnum"; }
.tri-side {
  font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: var(--tri-accent); padding: 3px 8px; border-radius: 999px; background: color-mix(in srgb, var(--tri-accent) 12%, #fff);
}
.tri-blurb { margin-top: 5px; font-size: 14px; color: #5C6172; line-height: 1.5; }
.tri-cta { font-size: 14px; white-space: nowrap; }
@media (max-width: 860px) {
  .tri-grid { grid-template-columns: 1fr; gap: 32px; }
  .tri-stage { max-width: 360px; }
}

.enb-card-head { display: flex; align-items: center; gap: 14px; }

/* Governance sub-nav (sticky in-page nav with scroll-spy) */
.gov-subnav {
  position: sticky; top: 68px; z-index: 40;
  background: rgba(250,250,247,.92); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--hairline);
}
.gov-subnav-inner { display: flex; align-items: center; gap: 6px; height: 54px; overflow-x: auto; }
.gov-subnav-label {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE; margin-right: 8px; white-space: nowrap;
}
.gov-subnav-link {
  background: transparent; border: 0; cursor: pointer; font-family: inherit;
  font-size: 14px; color: #5C6172; padding: 8px 14px; border-radius: 999px; white-space: nowrap;
  transition: color var(--dur-fast), background var(--dur-fast);
}
.gov-subnav-link:hover { color: var(--ink); }
.gov-subnav-link.is-active { color: var(--ia-blue); background: var(--ia-blue-50); font-weight: 600; }

/* Hero deadline pill */
.gov-deadline-pill {
  display: inline-flex; align-items: center; gap: 9px; margin-top: 24px;
  background: var(--ia-blue-50); border: 1px solid var(--ia-blue-100); color: var(--ink);
  font-family: inherit; font-size: 14px; padding: 9px 14px; border-radius: 999px; cursor: pointer;
  transition: border-color var(--dur-fast), transform var(--dur-fast);
}
.gov-deadline-pill strong { font-weight: 600; color: var(--ia-blue); }
.gov-deadline-pill:hover { border-color: var(--ia-blue); transform: translateY(-1px); }
.gov-deadline-pill:hover .arrow { transform: translateX(3px); }

/* Proof / case-study card */
.gov-proof {
  display: grid; grid-template-columns: auto 1fr auto; gap: 40px; align-items: center;
  background: #fff; border: 1px solid var(--hairline); border-left: 4px solid var(--ia-blue);
  border-radius: 18px; padding: 28px 36px;
}
.gov-proof-metric { display: flex; flex-direction: column; }
.gov-proof-metric .v { font-family: var(--font-display); font-weight: 700; font-size: 40px; line-height: 1; color: var(--ia-blue); letter-spacing: -0.01em; }
.gov-proof-metric .l { font-size: 12px; color: #5C6172; margin-top: 6px; max-width: 14ch; }
.gov-proof-body h3 { margin: 8px 0 8px; font-size: 20px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink); line-height: 1.25; }
.gov-proof-body p { margin: 0; font-size: 14px; color: #5C6172; line-height: 1.5; }
@media (max-width: 820px) {
  .gov-proof { grid-template-columns: 1fr; gap: 18px; padding: 24px; }
}

/* Enablement "where it fits" — triangle + vertical 1-2-3 step process */
.enb-grid { display: grid; grid-template-columns: 0.85fr 1fr; gap: 60px; align-items: center; }
.enb-steps { display: flex; flex-direction: column; }
.enb-step {
  display: grid; grid-template-columns: 40px 1fr; gap: 20px;
  padding-bottom: 26px; position: relative;
}
.enb-step:last-child { padding-bottom: 0; }
.enb-rail { position: relative; display: flex; justify-content: center; }
.enb-n {
  width: 40px; height: 40px; border-radius: 999px; flex: none; z-index: 1;
  background: var(--ia-blue-50); color: var(--ia-blue);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 700; font-size: 18px;
}
.enb-step--active .enb-n { background: var(--ia-blue); color: #fff; }
.enb-rail::before {
  content: ""; position: absolute; left: 50%; transform: translateX(-50%);
  top: 44px; bottom: -22px; width: 2px;
  background: repeating-linear-gradient(to bottom, var(--ia-blue) 0 4px, transparent 4px 9px);
  opacity: .35;
}
.enb-step:last-child .enb-rail::before { display: none; }
.enb-content { padding-top: 6px; }
.enb-name { font-family: var(--font-display); font-weight: 700; font-size: 20px; color: var(--ink); letter-spacing: -0.01em; }
.enb-desc { margin-top: 5px; font-size: 14px; color: #5C6172; line-height: 1.5; }
.enb-step--link { cursor: pointer; }
.enb-step--link:hover .enb-name { color: var(--ia-blue); }
.enb-step--link:hover .enb-cta .arrow { transform: translateX(3px); }
@media (max-width: 860px) {
  .enb-grid { grid-template-columns: 1fr; gap: 36px; }
  .enb-grid .tri-stage { max-width: 360px; order: -1; }
}

/* ---------- Nav ---------- */
.nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(250,250,247,.86);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--hairline);
}
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 68px; gap: 24px; }
.nav-brand { display: inline-flex; flex-shrink: 0; align-items: center; }
.nav-logo { height: 30px; width: auto; display: block; }
.nav-links { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.nav-link {
  background: transparent; border: 0; cursor: pointer;
  font-family: var(--font-body); font-size: 14px; font-weight: 500;
  color: var(--ink); padding: 8px 12px; border-radius: 8px;
  transition: background var(--dur-fast), color var(--dur-fast);
  display: inline-flex; align-items: center; gap: 4px;
  white-space: nowrap;
}
.nav-link:hover { background: rgba(11,16,36,.05); }
.nav-link.active { color: var(--ia-blue); background: rgba(1,25,183,.06); }
.nav-link .chev { opacity: .5; }

.nav-cta { display: flex; gap: 10px; align-items: center; flex-shrink: 0; }

@media (max-width: 1180px) {
  .nav-link { padding: 8px 8px; font-size: 14px; }
  .nav-links { gap: 2px; }
  .nav-cta .btn--ghost { display: none; }
}
@media (max-width: 1000px) {
  .container { padding: 0 20px; }
  .nav-inner { gap: 12px; }
  .nav-link { padding: 6px 7px; font-size: 14px; }
}

/* Services dropdown */
.nav-dropwrap { position: relative; }
/* invisible bridge — covers the visual gap between trigger and panel so hover doesn't drop */
.nav-dropwrap::after {
  content: "";
  position: absolute;
  top: 100%; left: 0; right: 0;
  height: 12px;
  pointer-events: none;
}
.nav-dropwrap:hover::after { pointer-events: auto; }
.nav-drop {
  position: absolute; top: 100%; left: -16px;
  margin-top: 8px;
  background: #fff; border: 1px solid var(--hairline);
  border-radius: 16px; padding: 12px;
  box-shadow: 0 12px 32px rgba(11,16,36,.10);
  min-width: 540px;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 4px;
  z-index: 60;
  opacity: 0; pointer-events: none;
  transform: translateY(-4px);
  transition: opacity var(--dur-fast), transform var(--dur-fast);
}
.nav-dropwrap:hover .nav-drop,
.nav-dropwrap:focus-within .nav-drop {
  opacity: 1; pointer-events: auto; transform: translateY(0);
}
.nav-drop-group {
  padding: 12px;
  display: flex; flex-direction: column; gap: 6px;
}
.nav-drop-group h5 {
  font-size: 12px; font-weight: 700; letter-spacing:.01em;
   color: #9BA0AE;
  margin: 0 0 4px;
}
.nav-drop-group h5.nav-drop-head {
  display: inline-flex; align-items: center; gap: 5px;
  background: transparent; border: 0; cursor: pointer; font-family: inherit;
  align-self: flex-start; padding: 2px 0;
  color: var(--ia-blue);
  transition: color var(--dur-fast), text-decoration-color var(--dur-fast);
  text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px;
}
.nav-drop-group h5.nav-drop-head:hover { color: var(--ia-dark-blue); text-decoration-color: currentColor; }
.nav-drop-head .nav-drop-head-arr { opacity: 1; transition: transform var(--dur-fast); }
.nav-drop-head:hover .nav-drop-head-arr { transform: translateX(2px); }
.nav-drop-item {
  display: flex; flex-direction: column; gap: 2px;
  padding: 10px; border-radius: 10px;
  background: transparent; border: 0; text-align: left; cursor: pointer;
  transition: background var(--dur-fast);
}
.nav-drop-item:hover { background: #F4F4F0; }
.nav-drop-item .nm { font-weight: 600; font-size: 14px; color: var(--ink); }
.nav-drop-item .ds { font-size: 12px; color: #5C6172; }

/* Parent page row (Foundations, Build) — reads as a main page, not a label */
.nav-drop-parent {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 10px; border-radius: 10px; margin: 0;
  background: transparent; border: 0; cursor: pointer; font-family: inherit;
  width: 100%; text-align: left;
  transition: background var(--dur-fast);
}
.nav-drop-parent:hover { background: #F4F4F0; }
.nav-drop-parent .nm {
  font-weight: 600; font-size: 16px; color: var(--ia-blue); letter-spacing: -0.01em;
  text-transform: none;
}
.nav-drop-parent .ovw {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE; border: 1px solid var(--hairline); border-radius: 999px; padding: 1px 7px;
}
.nav-drop-parent .nav-drop-head-arr {
  margin-left: auto; color: var(--ia-blue); transition: transform var(--dur-fast);
}
.nav-drop-parent:hover .nav-drop-head-arr { transform: translateX(2px); color: var(--ia-blue); }
/* Indented, smaller subpages beneath a parent */
.nav-drop-children {
  margin: 1px 0 0 13px; padding-left: 11px;
  border-left: 1px solid var(--hairline);
  display: flex; flex-direction: column; gap: 1px;
}
.nav-drop-children .nav-drop-item { padding: 7px 9px; }
.nav-drop-children .nav-drop-item .nm { font-size: 14px; font-weight: 500; }
.nav-drop-children .nav-drop-item .ds { font-size: 12px; }

/* ---------- Footer ---------- */
.footer { background: var(--ink); color: #fff; padding: 80px 0 32px; }
.footer-top {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 56px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.footer-top h5 {
  font-size: 12px; font-weight: 700; letter-spacing:.01em;
   color: var(--ia-light-blue);
  margin: 0 0 16px;
}
.footer-top a, .footer-top button {
  display: block; background: 0; border: 0; padding: 5px 0; cursor: pointer;
  color: rgba(255,255,255,.7); text-decoration: none;
  font-size: 14px; font-family: inherit;
  text-align: left;
}
.footer-top a:hover, .footer-top button:hover { color: #fff; }
.footer-top button.footer-h5 {
  font-size: 12px; font-weight: 700; letter-spacing:.01em;
   color: var(--ia-light-blue);
  margin: 0 0 16px; padding: 0; display: block; cursor: pointer;
  transition: color var(--dur-fast);
}
.footer-top button.footer-h5:hover { color: #fff; }
.footer-tag { color: rgba(255,255,255,.6); font-size: 14px; line-height: 1.55; margin-top: 16px; max-width: 320px; }
.footer-bottom {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 24px;
  font-size: 14px; color: rgba(255,255,255,.45);
}
.footer-bottom .legal { display: flex; gap: 20px; }
.footer-bottom .legal a { color: rgba(255,255,255,.5); text-decoration: none; }

/* ---------- Generic grid utilities ---------- */
.grid { display: grid; gap: 20px; }
.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }

/* Fixed-Scope Builds tracks — subgrid so label rows align across cards */
.fsb-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.fsb-grid--3 { grid-template-rows: auto auto auto; }
.fsb-grid--2 { grid-template-rows: auto auto; }
.fsb-card {
  display: grid;
  grid-template-rows: subgrid;
  row-gap: 18px;
}
.fsb-grid--3 .fsb-card { grid-row: span 3; }
.fsb-grid--2 .fsb-card { grid-row: span 2; }
@media (max-width: 980px) {
  .fsb-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .fsb-grid { grid-template-columns: 1fr; }
}
.grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 980px) {
  .grid--3, .grid--4 { grid-template-columns: 1fr 1fr; }
  .grid--2 { grid-template-columns: 1fr; }
  .stepper, .stepper--four { grid-template-columns: 1fr 1fr; }
  .stepper--three { grid-template-columns: 1fr; }
  .acc-strip { grid-template-columns: 1fr 1fr; }
  .footer-top { grid-template-columns: 1fr 1fr; }
}
/* Two columns still overflow a 375px phone: the 'Get in touch' column cannot
   fit intelligenceassist.com.au, so the whole page scrolled sideways. */
@media (max-width: 620px) {
  .footer-top { grid-template-columns: 1fr; gap: 32px; }
  .footer-top a, .footer-top button { overflow-wrap: anywhere; }
}

/* ---------- Specific blocks ---------- */
/* Hero */
.hero { padding: 84px 0 96px; position: relative; overflow: hidden; }
/* Hero-specific: fade the paper background into white at the bottom so the
   hand-off to the (white) logo strip below reads as a soft transition rather
   than a hard line. Dots layer on top of the gradient. */
.hero.dot-grid {
  background-image:
    radial-gradient(rgba(11,16,36,.07) 1px, transparent 1px),
    linear-gradient(to bottom, var(--paper) 55%, #fff 100%);
  background-size: 22px 22px, 100% 100%;
  background-position: -1px -1px, 0 0;
  background-repeat: repeat, no-repeat;
}
.hero-grid {
  display: grid; grid-template-columns: 1.15fr .85fr; gap: 64px; align-items: end;
}
.hero h1 { margin-top: 18px; }
.hero .lede { margin-top: 22px; font-size: 20px; }
.hero .cta-row { display: flex; gap: 12px; margin-top: 32px; flex-wrap: wrap; }
.hero .proof {
  margin-top: 56px;
  padding-top: 24px; border-top: 1px solid var(--hairline);
  display: flex; flex-wrap: wrap; gap: 28px;
  font-size: 14px; color: #5C6172;
  align-items: center;
}
.hero .proof strong { color: var(--ink); font-weight: 600; }
.hero-visual { position: relative; height: 100%; min-height: 480px; }

/* Hero — composed: a sticker-board of accelerator cards + base graphic crops */
.hero-board {
  position: relative;
  width: 100%; height: 100%;
  border-radius: 28px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--hairline);
  min-height: 500px;
}
.hero-board::before {
  content: "";
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(11,16,36,.06) 1px, transparent 1px);
  background-size: 18px 18px;
  pointer-events: none;
}
.hero-chip {
  position: absolute;
  background: #fff;
  border: 1px solid var(--hairline);
  border-radius: 14px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 6px;
  box-shadow: 0 8px 24px rgba(11,16,36,.08);
  min-width: 200px;
}
.hero-chip .chip-row { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #5C6172; }
.hero-chip .chip-row strong { color: var(--ink); font-weight: 600; font-size: 14px; }
.hero-chip .chip-meta { font-size: 12px; color: #9BA0AE; letter-spacing: .04em; }

/* Pricing-deliberately-hidden price block */
.priceless-callout {
  border: 1px dashed var(--hairline);
  background: #fff;
  padding: 18px 22px;
  border-radius: 14px;
  display: flex; gap: 14px; align-items: center;
  font-size: 14px; color: #5C6172;
}
.priceless-callout strong { color: var(--ink); font-weight: 500; }

/* CTA strip */
.cta-strip {
  border-radius: 28px;
  padding: 56px;
  background: var(--ink);
  color: #fff;
  display: flex; align-items: center; justify-content: space-between;
  gap: 40px; flex-wrap: wrap;
  position: relative; overflow: hidden;
}
.cta-strip h2 { max-width: 16ch; margin: 0; }
.cta-strip .actions { display: flex; gap: 12px; flex-wrap: wrap; }
.cta-strip::before {
  content: "";
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(75, 228, 248, .14) 1px, transparent 1px);
  background-size: 22px 22px;
  pointer-events: none;
}
.cta-strip .eyebrow { color: var(--ia-light-blue); }

/* Off-ramp strip (lighter, paper) */
.offramp {
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px; padding: 24px 28px;
  background: #fff; border: 1px solid var(--hairline); border-radius: 16px;
  font-size: 16px; color: var(--ink);
}
.offramp .copy { display: flex; flex-direction: column; gap: 4px; }
.offramp .copy .lbl { font-size: 12px; color: #9BA0AE; letter-spacing:.01em;  }

/* Primary variant: brand-blue, white text — used for the final pre-form
   hand-off on each page so it stands out from mid-page OffRamps. */
.offramp--primary {
  background: var(--ia-blue);
  border-color: var(--ia-blue);
  color: #fff;
  padding: 28px 32px;
  position: relative;
  overflow: hidden;
}
.offramp--primary .copy .lbl { color: var(--ia-light-blue); }
.offramp--primary strong { color: #fff; font-weight: 600; }
.offramp--primary .copy > span:not(.lbl) { font-size: 18px; font-weight: 500; }

/* Service column (Services overview) */
.svc-col { display: flex; flex-direction: column; gap: 16px; }
.svc-col-head {
  display: flex; flex-direction: column; gap: 8px;
  padding: 6px 4px 12px;
}
.svc-col-head .title { font-weight: 600; font-size: 22px; color: var(--ink); letter-spacing: -0.01em; }
.svc-col-head .desc { font-size: 14px; color: #5C6172; line-height: 1.5; }
.svc-card {
  background: #fff; border: 1px solid var(--hairline); border-radius: 16px;
  padding: 22px; display: flex; flex-direction: column; gap: 12px;
  cursor: pointer;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.svc-card:hover { border-color: #C7CCD8; transform: translateY(-2px); }
.svc-card .top { display: flex; align-items: center; gap: 12px; justify-content: space-between; }
.svc-card .ic {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: var(--pl-strategy-bg);
}
.svc-card .ic svg { width: 20px; height: 20px; }
.svc-card .nm { font-weight: 600; font-size: 18px; letter-spacing: -0.01em; }
.svc-card .ds { font-size: 14px; color: #5C6172; line-height: 1.5; }
.svc-card .arrow-pill {
  width: 30px; height: 30px; border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
  background: #F4F4F0; color: var(--ink);
  transition: background var(--dur-fast), color var(--dur-fast);
}
.svc-card:hover .arrow-pill { background: var(--ia-blue); color: #fff; }

/* Stepped service column (Enablement = a 1-2-3 process) */
.svc-steps { display: flex; flex-direction: column; gap: 16px; }
.svc-step-row { display: grid; grid-template-columns: 32px 1fr; gap: 16px; align-items: stretch; }
.svc-step-rail { position: relative; display: flex; justify-content: center; }
.svc-step-rail .n {
  width: 32px; height: 32px; border-radius: 999px;
  background: var(--ia-blue); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 700; font-size: 16px;
  font-feature-settings: "tnum"; z-index: 1; flex: none; margin-top: 24px;
}
.svc-step-rail::before {
  content: ""; position: absolute; left: 50%; transform: translateX(-50%);
  top: 56px; bottom: -16px; width: 2px;
  background: repeating-linear-gradient(to bottom, var(--ia-blue) 0 4px, transparent 4px 9px);
  opacity: .35;
}
.svc-step-row:last-child .svc-step-rail::before { display: none; }
.svc-step-row .svc-card { flex: 1; }
@media (max-width: 900px) {
  .svc-step-row { grid-template-columns: 28px 1fr; gap: 12px; }
  .svc-step-rail .n { width: 28px; height: 28px; font-size: 14px; }
}

/* Engagement card (Build category, How We Work) */
.eng-card {
  background: #fff; border: 1px solid var(--hairline);
  border-radius: 20px; padding: 32px;
  display: flex; flex-direction: column; gap: 16px;
}
.eng-card .eng-tag { align-self: flex-start; }
.eng-card h3 { font-size: 26px; font-weight: 600; letter-spacing: -0.015em; margin: 0; }
.eng-card .eng-rows {
  margin-top: 8px; padding-top: 16px; border-top: 1px solid var(--hairline);
  display: flex; flex-direction: column;
}
.eng-card .eng-row {
  display: grid; grid-template-columns: 130px 1fr; gap: 12px;
  padding: 12px 0; border-bottom: 1px solid var(--hairline);
  font-size: 14px;
}
.eng-card .eng-row:last-child { border-bottom: 0; }
.eng-card .eng-row .lbl { font-size: 12px; font-weight: 600; letter-spacing:.01em;  color: #9BA0AE; padding-top: 3px; }
.eng-card .eng-row .val { color: var(--ink); line-height: 1.5; }

/* Product card (Quick Wins) */
.prod-card {
  background: #fff; border: 1px solid var(--hairline);
  border-radius: 16px; padding: 24px;
  display: flex; flex-direction: column; gap: 14px;
  min-height: 260px;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.prod-card:hover { border-color: #C7CCD8; transform: translateY(-2px); }
.prod-card .prod-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.prod-card .prod-ic { width: 40px; height: 40px; opacity: .9; }
.prod-card h3 { font-size: 18px; font-weight: 600; margin: 0; letter-spacing: -0.01em; }
.prod-card .ds { font-size: 14px; color: #5C6172; line-height: 1.5; margin: 0; }
.prod-card .prod-foot {
  margin-top: auto;
  display: flex; flex-direction: column; gap: 4px;
  padding-top: 14px; border-top: 1px solid var(--hairline);
}
.prod-card .prod-foot .lbl { font-size: 12px; font-weight: 600; letter-spacing:.01em;  color: #9BA0AE; }
.prod-card .prod-foot .val { font-size: 14px; color: var(--ink); line-height: 1.45; }

/* Case study card (Recent work) */
.case-card {
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform var(--dur-base) var(--ease-standard);
  cursor: pointer;
}
.case-card:hover { transform: translateY(-3px); }
.case-card .case-img {
  aspect-ratio: 4 / 3;
  width: 100%;
  background: #F2F2EE;
  position: relative;
  border-bottom: 1px solid var(--hairline);
}
.case-card .case-body { padding: 22px; display: flex; flex-direction: column; gap: 10px; }
.case-card .case-headline { font-size: 18px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink); line-height: 1.25; }
.case-card .case-client { font-size: 14px; color: #5C6172; }

/* Bullet list */
.bullet-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.bullet-list li { display: flex; gap: 12px; align-items: flex-start; font-size: 16px; line-height: 1.5; color: var(--ink); }
.bullet-list li::before {
  content: "";
  width: 8px; height: 8px; border-radius: 999px; background: var(--ia-blue);
  margin-top: 8px; flex: none;
}

/* Deliverable callout */
.deliverable {
  background: linear-gradient(135deg, var(--ia-blue) 0%, var(--ia-dark-blue) 100%);
  color: #fff; padding: 36px; border-radius: 22px;
  display: grid; grid-template-columns: 56px 1fr auto; gap: 24px; align-items: center;
}
.deliverable .doc-ic {
  width: 56px; height: 56px; border-radius: 14px;
  background: rgba(255,255,255,.12);
  display: flex; align-items: center; justify-content: center;
}
.deliverable .label { font-size: 12px; letter-spacing:.01em;  color: var(--ia-light-blue); font-weight: 600; }
.deliverable .stmt { font-size: 20px; font-weight: 500; letter-spacing: -0.01em; margin-top: 4px; line-height: 1.3; }
.deliverable .stmt-highlight {
  font-weight: 600;
  color: var(--ia-light-blue);
}

/* "What's included" two col */
.included-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
@media (max-width: 880px) { .included-grid { grid-template-columns: 1fr; gap: 24px; } }

/* Generic image slot styling */
image-slot {
  display: block; width: 100%; height: 100%;
}

/* tweaks panel host position */
.tweaks-host { position: fixed; bottom: 20px; right: 20px; z-index: 100; }

/* Misc helpers */
.row { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.row--end { justify-content: flex-end; }
.stack { display: flex; flex-direction: column; gap: 12px; }
.divider { height: 1px; background: var(--hairline); border: 0; margin: 24px 0; }
.kbd {
  font-family: var(--font-mono);
  font-size: 12px; padding: 2px 6px; border-radius: 6px;
  background: #F2F2EE; border: 1px solid var(--hairline); color: var(--ink);
}

/* breadcrumbs / eyebrow path */
.crumbs {
  font-size: 12px; letter-spacing:.01em; 
  color: #9BA0AE; font-weight: 600;
  display: inline-flex; align-items: center; gap: 8px;
}
.crumbs strong { color: var(--ink); font-weight: 600; }
.crumbs .sep { color: #C7CCD8; }
.crumb-link {
  background: none; border: 0; padding: 0; margin: 0;
  font: inherit; letter-spacing: inherit; text-transform: inherit;
  color: inherit; cursor: pointer;
  transition: color var(--dur-fast);
}
.crumb-link:hover { color: var(--ia-blue); text-decoration: underline; text-underline-offset: 3px; }
/* On dark sections, lighten the crumbs */
.section--ink .crumbs        { color: rgba(255,255,255,.45); font-weight: 500; }
.section--ink .crumbs strong { color: rgba(255,255,255,.78); font-weight: 500; }
.section--ink .crumbs .sep   { color: rgba(255,255,255,.22); }
.section--ink .crumb-link:hover { color: #fff; }

/* ---------- Filter chip (Toolbox + Resources sticky bar) ---------- */
.filter-chip {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: inherit;
  background: #fff;
  border: 1px solid var(--hairline);
  color: var(--ink);
  font-size: 14px; font-weight: 500;
  padding: 8px 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: background var(--dur-fast), border-color var(--dur-fast), color var(--dur-fast);
}
.filter-chip:hover { border-color: #C7CCD8; }
.filter-chip--active {
  background: var(--ink); color: #fff; border-color: var(--ink);
}
.filter-chip--active .filter-count { color: rgba(255,255,255,.6); }
.filter-count {
  font-size: 12px; color: #9BA0AE; font-feature-settings: "tnum";
  font-weight: 500;
}

/* ---------- Toolbox grid ---------- */
.tool-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}
.tool-card {
  background: #fff; border: 1px solid var(--hairline); border-radius: 16px;
  padding: 22px;
  display: flex; flex-direction: column; gap: 14px;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
  cursor: pointer;
}
.tool-card:hover { border-color: #C7CCD8; transform: translateY(-2px); }
.tool-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tool-mark {
  width: 44px; height: 44px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-body);
  font-weight: 600; font-size: 20px;
  letter-spacing: -0.02em;
  flex-shrink: 0;
  overflow: hidden;
  padding: 4px;
}
.tool-mark > image-slot {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}
.tool-name {
  display: flex; flex-direction: column; gap: 2px;
  font-size: 18px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink);
}
.tool-vendor { font-size: 12px; font-weight: 400; color: #9BA0AE; }
.tool-use {
  margin: 0; font-size: 14px; line-height: 1.5; color: #4A4F60;
  min-height: 3em;
}
.tool-foot {
  margin-top: auto;
  padding-top: 12px; border-top: 1px solid var(--hairline);
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #5C6172;
}
/* Clickable tool card → detail page */
.tool-card--link:focus-visible { outline: 2px solid var(--ia-blue); outline-offset: 2px; }
.tool-foot .tool-more {
  font-size: 14px; font-weight: 500; color: var(--ia-blue);
}
.tool-foot .tool-more-arr { color: var(--ia-blue); transition: transform var(--dur-fast); }
.tool-card--link:hover .tool-more-arr { transform: translateX(3px); }

/* ---------- Tool detail page ---------- */
.tool-detail-hero { display: flex; align-items: center; gap: 22px; margin-top: 22px; }
.tool-detail-vendor { font-size: 16px; color: #5C6172; margin-top: 6px; }
.tool-detail-body { display: grid; grid-template-columns: 1.5fr .85fr; gap: 48px; align-items: start; }
.tool-detail-aside { position: sticky; top: 92px; }
@media (max-width: 820px) {
  .tool-detail-body { grid-template-columns: 1fr; gap: 28px; }
  .tool-detail-aside { position: static; }
  .tool-detail-hero { flex-wrap: wrap; gap: 16px; }
}
/* pricing indicator */
.tool-price { display: flex; align-items: baseline; gap: 12px; margin-top: 18px; }
.tool-price-dollars { font-family: var(--font-display); font-weight: 700; font-size: 22px; letter-spacing: 1px; }
.tool-price-dollars .on { color: var(--ink); }
.tool-price-dollars .off { color: #C7CCD8; }
.tool-price-note { font-size: 14px; color: #5C6172; }
/* key features */
.tool-feat-list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.tool-feat { background: #fff; border: 1px solid var(--hairline); border-radius: 14px; padding: 20px 22px; }
.tool-feat-name { font-size: 16px; font-weight: 600; color: var(--ia-blue); letter-spacing: -0.01em; }
.tool-feat-desc { margin: 8px 0 0; font-size: 14px; line-height: 1.55; color: #4A4F60; }
@media (max-width: 720px) { .tool-feat-list { grid-template-columns: 1fr; } }
/* security & ai depth */
.tool-sec-cols { display: grid; grid-template-columns: 1.6fr 1fr; gap: 48px; align-items: start; }
@media (max-width: 820px) { .tool-sec-cols { grid-template-columns: 1fr; gap: 28px; } }
.tool-sec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
@media (max-width: 520px) { .tool-sec-grid { grid-template-columns: 1fr; } }
.tool-sec-item { display: flex; gap: 12px; align-items: flex-start; }
.tool-sec-ic { color: var(--ia-blue); flex: none; margin-top: 1px; }
.tool-sec-name { font-size: 16px; font-weight: 600; color: var(--ink); }
.tool-sec-desc { font-size: 14px; color: #5C6172; line-height: 1.5; margin-top: 2px; }
.tool-depth { background: #fff; border: 1px solid var(--hairline); border-radius: 16px; padding: 24px; }
.tool-depth-ic { display: inline-flex; color: var(--ia-blue); }
.tool-depth-label { font-size: 16px; font-weight: 600; color: var(--ia-blue); margin-top: 12px; }
.tool-depth-desc { font-size: 14px; color: #4A4F60; line-height: 1.55; margin: 6px 0 0; }
/* our insights */
.tool-insights { background: var(--ink); color: #fff; border-radius: 22px; padding: 40px 44px; }
.tool-insights .eyebrow { color: var(--ia-light-blue); }
.tool-insights p { margin: 14px 0 0; font-size: 18px; line-height: 1.6; color: rgba(255,255,255,.88); max-width: 70ch; }
@media (max-width: 620px) { .tool-insights { padding: 28px 24px; } }

/* ---------- Course card (AI Literacy) ---------- */
/* --- Capability narrative (deck-based) --- */
/* Great Leveler */
.lev-line { position: relative; margin-top: 44px; height: 116px; }
.lev-track { position: absolute; left: 0; right: 0; bottom: 38px; height: 2px; background: rgba(255,255,255,.22); }
.lev-track::before, .lev-track::after {
  content: ""; position: absolute; bottom: -4px; width: 10px; height: 10px; border-radius: 999px;
  background: var(--ia-light-blue);
}
.lev-track::before { left: 16%; }
.lev-track::after { left: 78%; }
.lev-fig { position: absolute; bottom: 46px; display: flex; flex-direction: column; align-items: center; gap: 8px; transform: translateX(-50%); }
.lev-fig .who { font-family: var(--font-display); font-weight: 700; font-size: 18px; color: #fff; letter-spacing: -0.01em; }
.lev-fig .sub { font-size: 12px; color: rgba(255,255,255,.55); }
.lev-fig.grad { left: 16%; }
.lev-fig.exec { left: 78%; }
@media (max-width: 720px) { .lev-fig .sub { display: none; } }

/* Five literacy basics */
.lit-basics { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.lit-basic {
  background: #fff; border: 1px solid var(--hairline); border-radius: 14px;
  padding: 22px 20px; display: flex; flex-direction: column; gap: 10px;
  border-top: 3px solid var(--ia-light-blue);
}
.lit-basic .term-n { font-size: 12px; font-weight: 700; letter-spacing:.01em;  color: var(--ia-blue); }
.lit-basic .term-w { font-family: var(--font-display); font-weight: 700; font-size: 20px; letter-spacing: -0.01em; color: var(--ink); line-height: 1.15; }
.lit-basic .term-d { font-size: 14px; color: #4A4F60; line-height: 1.5; }
@media (max-width: 980px) { .lit-basics { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .lit-basics { grid-template-columns: 1fr; } }

/* Voice & Skills — SKILL.md code card */
.skill-card {
  background: var(--ia-dark-blue); border-radius: 18px; overflow: hidden;
  font-family: var(--font-mono); color: rgba(255,255,255,.9);
  display: flex; flex-direction: column;
}
.skill-card .bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,.12);
  font-size: 12px; letter-spacing: .02em;
}
.skill-card .bar .fname { color: var(--ia-light-blue); font-weight: 600; }
.skill-card .bar .live { color: #5BE58A; font-size: 12px; letter-spacing: .08em; }
.skill-card .code { padding: 20px 22px; font-size: 14px; line-height: 1.85; }
.skill-card .code .cm { color: rgba(255,255,255,.4); }
.skill-card .code .ky { color: var(--ia-light-blue); }
.skill-card .code p { margin: 0; white-space: pre-wrap; }

/* Peer learning moves */
.peer-moves { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.peer-move {
  display: flex; gap: 16px; align-items: flex-start;
  background: #fff; border: 1px solid var(--hairline); border-radius: 14px; padding: 22px 24px;
}
.peer-move .pn {
  flex: none; width: 34px; height: 34px; border-radius: 999px;
  background: var(--ia-blue-50); color: var(--ia-blue);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 700; font-size: 16px;
}
.peer-move .ph { font-weight: 600; font-size: 16px; color: var(--ink); letter-spacing: -0.01em; margin: 0 0 5px; }
.peer-move .ps { font-size: 14px; color: #5C6172; line-height: 1.5; margin: 0; }
@media (max-width: 760px) { .peer-moves { grid-template-columns: 1fr; } }

.course-card {
  background: #fff; border: 1px solid var(--hairline); border-radius: 16px;
  padding: 24px;
  display: flex; flex-direction: column; gap: 14px;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
  min-height: 280px;
}
.course-card:hover { border-color: #C7CCD8; transform: translateY(-2px); }
.course-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.course-num {
  font-size: 12px; color: #C7CCD8;
  font-feature-settings: "tnum";
  letter-spacing: .04em;
}
.course-name {
  margin: 0;
  font-size: 18px; font-weight: 600; letter-spacing: -0.01em;
  color: var(--ink); line-height: 1.25;
}
.course-desc {
  margin: 0;
  font-size: 14px; color: #4A4F60; line-height: 1.5;
}
.course-meta {
  margin-top: auto;
  padding-top: 14px; border-top: 1px solid var(--hairline);
  display: flex; flex-direction: column; gap: 6px;
}
.course-meta .meta-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #5C6172;
}

/* ---------- AI Governance ---------- */
/* Deck-based: carrot/stick policy, classification ladder, ADM date, board */
.gov-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: stretch; }
.gov-side {
  border-radius: 18px; padding: 32px;
  display: flex; flex-direction: column; gap: 18px;
}
.gov-side--carrot { background: #fff; border: 1px solid var(--hairline); border-top: 4px solid var(--ia-light-blue); }
.gov-side--stick  { background: var(--ia-dark-blue); border-top: 4px solid var(--ia-light-blue); }
.gov-side-lbl { font-size: 12px; font-weight: 700; letter-spacing:.01em;  }
.gov-side--carrot .gov-side-lbl { color: var(--ia-blue); }
.gov-side--stick  .gov-side-lbl { color: var(--ia-light-blue); }
.gov-side h3 { font-size: 20px; font-weight: 600; letter-spacing: -0.01em; margin: 0; line-height: 1.25; color: var(--ink); }
.gov-side--stick h3 { color: #fff; }
.gov-side ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.gov-side li { position: relative; padding-left: 22px; font-size: 14px; line-height: 1.5; }
.gov-side li::before { content: ""; position: absolute; left: 0; top: 8px; width: 8px; height: 8px; border-radius: 999px; }
.gov-side--carrot li { color: #5C6172; }
.gov-side--carrot li::before { background: var(--ia-blue); }
.gov-side--stick  li { color: rgba(255,255,255,.85); }
.gov-side--stick  li::before { background: var(--ia-light-blue); }

/* Classification ladder */
.gov-class { display: flex; flex-direction: column; gap: 10px; }
.gov-class-row {
  display: grid; grid-template-columns: 48px 1.1fr 2.4fr; gap: 24px; align-items: center;
  background: #fff; border: 1px solid var(--hairline); border-radius: 14px; padding: 18px 24px;
}
.gov-class-n { font-weight: 600; font-size: 20px; color: var(--ia-blue); font-feature-settings: "tnum"; }
.gov-class-name { font-weight: 600; font-size: 16px; color: var(--ink); letter-spacing: -0.01em; }
.gov-class-desc { font-size: 14px; color: #5C6172; line-height: 1.45; }
.gov-class-cond { font-size: 14px; color: var(--ink); font-weight: 500; background: var(--ia-blue-50); border-radius: 10px; padding: 10px 14px; line-height: 1.4; }
.gov-pullout { margin-top: 28px; text-align: center; font-size: 20px; font-weight: 500; line-height: 1.45; color: var(--ink); max-width: 40ch; margin-inline: auto; letter-spacing: -0.01em; }
.gov-pullout strong { color: var(--ia-blue); font-weight: 600; }

/* ADM date beat */
.gov-adm { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 56px; align-items: start; }
.gov-adm-date { font-weight: 700; font-size: 132px; line-height: .85; letter-spacing: -0.05em; color: #fff; }
.gov-adm-month { font-size: 20px; font-weight: 500; color: var(--ia-light-blue); margin-top: 12px; letter-spacing: .02em; }
.gov-adm-src { font-size: 12px; color: rgba(255,255,255,.5); line-height: 1.5; margin-top: 28px; }

/* Board: theatre vs practice */
.gov-board-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 13px; }
.gov-board-list li { display: flex; gap: 11px; font-size: 14px; line-height: 1.5; color: #5C6172; }
.gov-board-list li .ic { flex: none; margin-top: 1px; }

@media (max-width: 860px) {
  .gov-duo { grid-template-columns: 1fr; }
  .gov-class-row { grid-template-columns: 40px 1fr; row-gap: 6px; padding: 16px 18px; gap: 14px; }
  .gov-class-cond { grid-column: 1 / -1; }
  .gov-adm { grid-template-columns: 1fr; gap: 24px; }
  .gov-adm-date { font-size: 88px; }
}

/* Tier cards (3 progression cards) */
.tier-card {
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  padding: 28px;
  display: flex; flex-direction: column; gap: 14px;
  position: relative;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.tier-card[data-tier="t1"] { border-top: 3px solid var(--pl-strategy-fg); }
.tier-card[data-tier="t2"] { border-top: 3px solid var(--pl-enable-fg); }
.tier-card[data-tier="t3"] { border-top: 3px solid var(--pl-build-fg); }
.tier-card:hover { border-color: #C7CCD8; transform: translateY(-2px); }
.tier-head { display: flex; flex-direction: column; gap: 4px; }
.tier-num {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.tier-name {
  margin: 0; font-size: 24px; font-weight: 600; letter-spacing: -0.02em;
  color: var(--ink);
}
.tier-blurb { margin: 0; font-size: 14px; color: #5C6172; line-height: 1.5; }
.tier-section {
  display: flex; flex-direction: column; gap: 4px;
  padding-top: 14px; border-top: 1px solid var(--hairline);
}
.tier-lbl {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.tier-val { font-size: 14px; color: #4A4F60; line-height: 1.5; }
.tier-val--em { color: var(--ink); font-weight: 500; }
.tier-ladder-arrow {
  position: absolute;
  top: 38px; right: -20px;
  width: 32px; height: 32px;
  border-radius: 999px;
  background: #fff; border: 1px solid var(--hairline);
  display: flex; align-items: center; justify-content: center;
  z-index: 2;
}
@media (max-width: 980px) { .tier-ladder-arrow { display: none; } }

/* Tier matrix */
.gov-matrix {
  border: 1px solid var(--hairline); border-radius: 18px;
  background: #fff; overflow: hidden;
}
.gov-matrix-head, .gov-matrix-row {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr;
}
.gov-matrix-head { background: var(--paper); border-bottom: 1px solid var(--hairline); }
.gov-area-h, .gov-tier-h {
  padding: 18px 20px;
  font-size: 14px; color: var(--ink); font-weight: 600;
  display: flex; flex-direction: column; gap: 2px;
  border-right: 1px solid var(--hairline);
}
.gov-tier-h:last-child, .gov-cell:last-child { border-right: 0; }
.gov-tier-h-num {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.gov-tier-h-name { font-size: 16px; font-weight: 600; letter-spacing: -0.01em; }
.gov-tier-h[data-tier="t1"] .gov-tier-h-name { color: var(--pl-strategy-fg); }
.gov-tier-h[data-tier="t2"] .gov-tier-h-name { color: var(--pl-enable-fg); }
.gov-tier-h[data-tier="t3"] .gov-tier-h-name { color: var(--pl-build-fg); }
.gov-matrix-row { border-top: 1px solid var(--hairline); }
.gov-area {
  padding: 18px 20px;
  font-size: 14px; font-weight: 600; color: var(--ink);
  background: var(--paper);
  border-right: 1px solid var(--hairline);
  display: flex; align-items: center;
}
.gov-cell {
  padding: 18px 20px;
  font-size: 14px; color: #4A4F60; line-height: 1.5;
  border-right: 1px solid var(--hairline);
}
.gov-cell[data-tier="t1"] { background: rgba(230, 241, 251, .25); }
.gov-cell[data-tier="t2"] { background: rgba(225, 245, 238, .25); }
.gov-cell[data-tier="t3"] { background: rgba(238, 237, 254, .3); }

/* Tier Finder quiz */
.tier-finder {
  background: #fff; border: 1px solid var(--hairline); border-radius: 22px;
  padding: 36px;
  max-width: 760px; margin: 0 auto;
}
.tier-finder-progress { display: flex; align-items: center; gap: 10px; margin-bottom: 28px; }
.tfp-dot {
  width: 28px; height: 4px; border-radius: 999px;
  background: var(--hairline);
  transition: background var(--dur-base) var(--ease-standard);
}
.tfp-dot--done, .tfp-dot--current { background: var(--ia-blue); }
.tfp-label {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE; margin-left: 8px;
  font-feature-settings: "tnum";
}
.tfp-reset {
  margin-left: auto;
  background: 0; border: 0; padding: 4px 8px; border-radius: 6px;
  font-family: inherit; font-size: 12px; color: #5C6172; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.tfp-reset:hover { color: var(--ia-blue); background: #F4F4F0; }
.tier-finder-q { display: flex; flex-direction: column; gap: 24px; }
.tfq-eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: var(--ia-blue);
}
.tfq-text {
  margin: 0;
  font-size: clamp(22px, 2vw + 8px, 30px); font-weight: 600;
  color: var(--ink); letter-spacing: -0.015em; line-height: 1.2;
  max-width: 28ch;
}
.tfq-actions { display: flex; gap: 10px; margin-top: 4px; }
.tfq-btn {
  flex: 1; max-width: 200px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: #fff; border: 1px solid var(--hairline); color: var(--ink);
  font-family: inherit; font-size: 16px; font-weight: 500;
  padding: 16px 24px; border-radius: 12px;
  cursor: pointer;
  transition: border-color var(--dur-fast), background var(--dur-fast), color var(--dur-fast);
}
.tfq-btn--yes:hover { background: var(--ia-blue); border-color: var(--ia-blue); color: #fff; }
.tfq-btn--no:hover  { background: var(--ink);     border-color: var(--ink);     color: #fff; }
.tier-finder-result { display: flex; flex-direction: column; gap: 20px; }
.tfr-head { display: flex; flex-direction: column; gap: 6px; }
.tfr-eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: var(--ia-blue);
}
.tfr-tier { display: flex; align-items: baseline; gap: 10px; }
.tfr-num {
  font-size: 14px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.tfr-name {
  margin: 0; font-size: 36px; font-weight: 600; letter-spacing: -0.025em;
  color: var(--ink);
}
.tier-finder-result[data-tier="t1"] .tfr-name { color: var(--pl-strategy-fg); }
.tier-finder-result[data-tier="t2"] .tfr-name { color: var(--pl-enable-fg); }
.tier-finder-result[data-tier="t3"] .tfr-name { color: var(--pl-build-fg); }
.tfr-headline { margin: 0; font-size: 18px; line-height: 1.5; color: var(--ink); max-width: 50ch; }
.tfr-summary {
  background: var(--paper); border: 1px solid var(--hairline); border-radius: 12px;
  padding: 18px;
  display: flex; flex-direction: column; gap: 10px;
}
.tfr-summary-block { display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: #4A4F60; line-height: 1.5; }
.tfr-lbl {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.tfr-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* ---------- How We Work ---------- */
/* Narrative numbered list (in dark hero) */
.hww-narrative { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.hww-narrative li {
  display: flex; gap: 14px; align-items: flex-start;
  font-size: 16px; color: rgba(255,255,255,.86); line-height: 1.5;
}
.hww-narrative-num {
  width: 22px; height: 22px; border-radius: 999px;
  background: rgba(75,228,248,.18); color: var(--ia-light-blue);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600;
  flex-shrink: 0; margin-top: 2px;
  font-feature-settings: "tnum";
}
.hww-narrative-text { flex: 1; }

/* Phase list (3-phase process) */
.phase-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.phase-row {
  display: grid; grid-template-columns: 80px 1fr;
  gap: 24px; padding: 28px 0;
  border-top: 1px solid var(--hairline);
}
.phase-row:last-child { border-bottom: 1px solid var(--hairline); }
.phase-num {
  font-family: var(--font-display);
  font-size: 56px; line-height: 1; letter-spacing: -0.04em;
  font-weight: 600;
  color: var(--ia-blue);
  font-feature-settings: "tnum";
}
.phase-body { display: flex; flex-direction: column; gap: 8px; }
.phase-name {
  margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -0.015em;
  color: var(--ink);
}
.phase-desc { margin: 0; font-size: 16px; color: #4A4F60; line-height: 1.55; max-width: 56ch; }

/* Principle grid */
.principle-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid var(--hairline); border-radius: 20px;
  background: #fff; overflow: hidden;
}
@media (max-width: 980px) { .principle-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .principle-grid { grid-template-columns: 1fr; } }
.principle-card {
  display: grid; grid-template-columns: 40px 1fr; gap: 16px;
  padding: 28px;
  border-right: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}
.principle-card:nth-child(3n) { border-right: 0; }
.principle-card:nth-last-child(-n+3) { border-bottom: 0; }
@media (max-width: 980px) {
  .principle-card:nth-child(3n) { border-right: 1px solid var(--hairline); }
  .principle-card:nth-child(2n) { border-right: 0; }
  .principle-card:nth-last-child(-n+3) { border-bottom: 1px solid var(--hairline); }
  .principle-card:nth-last-child(-n+2) { border-bottom: 0; }
}
.principle-ic {
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--ia-blue-50);
  display: flex; align-items: center; justify-content: center;
}
.principle-body { display: flex; flex-direction: column; gap: 6px; }
.principle-name {
  margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -0.01em;
  color: var(--ink);
}
.principle-desc { margin: 0; font-size: 14px; color: #4A4F60; line-height: 1.55; }

/* ---------- Work / Case studies ---------- */
.filter-row {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 16px; align-items: center;
}
.filter-row-lbl {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.filter-chips { display: flex; gap: 6px; flex-wrap: wrap; }

/* Featured case card (big) */
.case-feature {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0;
  background: #fff; border: 1px solid var(--hairline); border-radius: 22px;
  overflow: hidden;
  cursor: pointer;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.case-feature:hover { border-color: #C7CCD8; transform: translateY(-3px); }
@media (max-width: 980px) { .case-feature { grid-template-columns: 1fr; } }
.case-feature-img {
  background: #F2F2EE;
  min-height: 440px;
  border-right: 1px solid var(--hairline);
}
.case-feature-body { padding: 40px; display: flex; flex-direction: column; }
.case-feature-meta {
  margin-top: auto;
  padding-top: 24px;
  border-top: 1px solid var(--hairline);
  display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 24px;
}
.case-meta-block { display: flex; flex-direction: column; gap: 2px; }
.case-meta-lbl {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.case-meta-val { font-size: 16px; font-weight: 500; color: var(--ink); line-height: 1.3; }
.case-meta-val--big {
  font-family: var(--font-body); font-weight: 600;
  font-size: 28px; letter-spacing: -0.02em; color: var(--ia-blue);
  line-height: 1;
}
.case-meta-sub { font-size: 12px; color: #5C6172; }

/* Grid */
.case-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}

/* Standard work card */
.work-card {
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  overflow: hidden;
  display: flex; flex-direction: column;
  cursor: pointer;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.work-card:hover { border-color: #C7CCD8; transform: translateY(-3px); }
.work-card-img {
  aspect-ratio: 16 / 9;
  width: 100%;
  background: #F2F2EE;
  border-bottom: 1px solid var(--hairline);
  position: relative;
}
.work-card-pillar {
  position: absolute; top: 12px; left: 12px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(6px);
  border-radius: 999px; padding: 2px;
}
.work-card-body { padding: 22px; display: flex; flex-direction: column; gap: 12px; }
.work-card-headline {
  font-size: 20px; font-weight: 600; letter-spacing: -0.015em;
  color: var(--ink); line-height: 1.25; margin: 0;
}
.work-card-summary {
  margin: 0; font-size: 14px; color: #4A4F60; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.work-card-foot {
  margin-top: auto;
  padding-top: 14px; border-top: 1px solid var(--hairline);
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.work-card-client { display: flex; flex-direction: column; gap: 2px; font-size: 12px; color: #5C6172; line-height: 1.4; }
.work-card-client strong { color: var(--ink); font-weight: 600; font-size: 14px; }
.work-card-metric { display: flex; flex-direction: column; align-items: flex-end; }
.work-card-metric-val {
  font-size: 22px; font-weight: 600; letter-spacing: -0.02em;
  color: var(--ia-blue); line-height: 1;
}
.work-card-metric-lbl { font-size: 12px; color: #5C6172; line-height: 1.3; max-width: 12ch; text-align: right; }

/* Detail view */
.case-detail-meta {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  overflow: hidden;
}
@media (max-width: 980px) { .case-detail-meta { grid-template-columns: 1fr 1fr; } }
.case-detail-meta-block {
  padding: 20px 22px;
  display: flex; flex-direction: column; gap: 4px;
  border-right: 1px solid var(--hairline);
}
.case-detail-meta-block:last-child { border-right: 0; }
@media (max-width: 980px) {
  .case-detail-meta-block { border-bottom: 1px solid var(--hairline); }
  .case-detail-meta-block:nth-child(2n) { border-right: 0; }
}
.case-detail-meta-block--hl { background: var(--paper); }
.case-section-eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
  padding-top: 8px;
}
.case-outcome-stat {
  margin-top: 24px;
  display: flex; align-items: baseline; gap: 14px;
  padding: 20px 24px;
  background: var(--ia-blue-50); border-radius: 14px;
}
.case-outcome-val {
  font-family: var(--font-body); font-weight: 600;
  font-size: 56px; letter-spacing: -0.025em; line-height: 1;
  color: var(--ia-blue);
}
.case-outcome-lbl { font-size: 14px; color: var(--ink); font-weight: 500; }

/* ---------- Book a Blueprint / Contact ---------- */
.contact-hero {
  background: var(--ia-dark-blue);
  color: #fff;
  padding: 84px 0 76px;
  position: relative;
  overflow: hidden;
}
.contact-hero-title {
  margin: 24px 0 0;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: clamp(40px, 4.8vw, 68px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: #fff;
  max-width: 16ch;
  position: relative;
  z-index: 1;
}
.contact-hero-title em {
  font-style: normal;
  color: var(--ia-light-blue);
}
.contact-hero-bg {
  position: absolute;
  top: -10%; right: -10%; width: 70%; height: 140%;
  background: url(../assets/graphics/ia-base-graphic-full.png) center/cover no-repeat;
  opacity: .15;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
  pointer-events: none;
}
/* Crumbs in the contact hero need light treatment over navy */
.contact-hero .crumbs        { color: rgba(255,255,255,.4); font-weight: 500; }
.contact-hero .crumbs strong { color: rgba(255,255,255,.7); font-weight: 500; }
.contact-hero .crumbs .sep   { color: rgba(255,255,255,.2); }
.contact-hero .crumb-link:hover { color: #fff; }

/* Eyebrow inside the blue band — re-color via scoped rule */
.contact-band .eyebrow { color: var(--ia-light-blue); }

/* Blue strip "Boost your business" */
.contact-band {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 56px; align-items: start;
}
@media (max-width: 880px) { .contact-band { grid-template-columns: 1fr; } }
.contact-band-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 14px;
}
.contact-band-list li {
  display: flex; gap: 12px; align-items: flex-start;
  font-size: 18px; color: #fff; line-height: 1.45; font-weight: 500;
}
.contact-band-dot {
  width: 8px; height: 8px; border-radius: 999px;
  background: var(--ia-light-blue);
  margin-top: 8px; flex-shrink: 0;
}
.contact-band-actions {
  display: flex; gap: 12px; flex-wrap: wrap;
  margin-top: 36px; padding-top: 28px;
  border-top: 1px solid rgba(255,255,255,.18);
  justify-content: flex-end;
}
@media (max-width: 880px) { .contact-band-actions { justify-content: flex-start; } }

/* Booking widget */
.booking-widget {
  background: #fff; border: 1px solid var(--hairline); border-radius: 22px;
  display: grid;
  grid-template-columns: 360px 1fr;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(11,16,36,.04);
}
@media (max-width: 880px) { .booking-widget { grid-template-columns: 1fr; } }
.booking-aside {
  background: var(--paper);
  padding: 32px;
  border-right: 1px solid var(--hairline);
  display: flex; flex-direction: column;
}
@media (max-width: 880px) { .booking-aside { border-right: 0; border-bottom: 1px solid var(--hairline); } }

/* Calendly inline embed. Calendly draws its own padding inside the iframe, so
   this pane goes flush and just supplies the height it reports back. */
.booking-main--embed { padding: 0; gap: 0; }
.booking-embed { position: relative; width: 100%; min-height: 560px; transition: height .2s var(--ease-standard); }
.booking-embed-host { width: 100%; height: 100%; }
.booking-embed-host iframe { display: block; width: 100%; height: 100%; border: 0; }
.booking-embed-loading {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: var(--fg-muted); font-size: var(--fs-14);
}
.booking-fallback {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; text-align: center; padding: 64px 32px; min-height: 360px;
}
.booking-fallback p { margin: 0; max-width: 34ch; color: var(--fg-muted); font-size: var(--fs-14); }
@media (max-width: 880px) { .booking-embed { min-height: 640px; } }
.booking-brand { margin-bottom: 24px; }
.booking-host { display: flex; align-items: center; gap: 14px; }
.booking-host-avatar {
  width: 56px; height: 56px; border-radius: 999px;
  background: #E8E8E2; overflow: hidden;
}
.booking-host-name { font-size: 16px; font-weight: 600; color: var(--ink); }
.booking-host-role { font-size: 14px; color: #5C6172; }
.booking-event-name {
  margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -0.015em; color: var(--ink);
}
.booking-event-meta {
  list-style: none; margin: 14px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.booking-event-meta li {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; color: #4A4F60;
}
.booking-event-blurb {
  font-size: 14px; color: #5C6172; line-height: 1.55;
  margin: 18px 0 0;
  padding-top: 18px; border-top: 1px solid var(--hairline);
}

.booking-main { padding: 32px; display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.booking-cal-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.booking-cal-title {
  margin: 0; font-size: 18px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink);
}
.booking-cal-nav { display: flex; align-items: center; gap: 6px; }
.cal-nav-btn {
  width: 32px; height: 32px; border-radius: 999px;
  background: #fff; border: 1px solid var(--hairline); color: var(--ink);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background var(--dur-fast), border-color var(--dur-fast);
}
.cal-nav-btn:hover { background: var(--paper); border-color: var(--ink); }
.booking-cal-month { font-size: 14px; color: var(--ink); font-weight: 500; min-width: 100px; text-align: center; }
.booking-back {
  background: 0; border: 0; padding: 4px 8px; border-radius: 6px;
  font-family: inherit; font-size: 14px; color: #5C6172; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.booking-back:hover { color: var(--ia-blue); background: var(--paper); }

.booking-cal {
  display: grid; grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.booking-cal-dayhead {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE; padding: 8px 4px; text-align: center;
}
.booking-cal-empty { height: 40px; }
.booking-cal-day {
  height: 40px; border-radius: 8px;
  background: transparent; border: 0;
  font-family: inherit; font-size: 14px; color: #C7CCD8; font-weight: 500;
  cursor: not-allowed;
  transition: background var(--dur-fast), color var(--dur-fast);
  font-feature-settings: "tnum";
}
.booking-cal-day.is-avail {
  background: var(--ia-blue-50); color: var(--ia-blue);
  cursor: pointer; font-weight: 600;
}
.booking-cal-day.is-avail:hover { background: var(--ia-blue); color: #fff; }

.booking-cal-legend {
  margin-top: 12px;
  padding-top: 16px; border-top: 1px solid var(--hairline);
  display: flex; align-items: center; gap: 16px;
}
.legend-row { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #5C6172; }
.legend-swatch { width: 14px; height: 14px; border-radius: 4px; }
.legend-swatch--avail { background: var(--ia-blue-50); border: 1px solid var(--ia-blue-100); }
.legend-swatch--past  { background: transparent;       border: 1px solid var(--hairline); }

.booking-slots {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;
}
.booking-slot {
  padding: 16px; border-radius: 10px;
  background: #fff; border: 1px solid var(--hairline); color: var(--ink);
  font-family: inherit; font-size: 16px; font-weight: 500; cursor: pointer;
  transition: border-color var(--dur-fast), background var(--dur-fast), color var(--dur-fast);
}
.booking-slot:hover { background: var(--ia-blue); border-color: var(--ia-blue); color: #fff; }

.booking-form { display: flex; flex-direction: column; gap: 14px; }
.booking-field { display: flex; flex-direction: column; gap: 6px; }
.booking-field-lbl {
  font-size: 14px; font-weight: 500; color: var(--ink);
  display: flex; align-items: baseline; gap: 6px;
}
.booking-req { color: var(--ia-error); }
.booking-opt { color: #9BA0AE; font-weight: 400; font-size: 12px; }
.booking-field input, .booking-field textarea {
  font-family: inherit; font-size: 16px; color: var(--ink);
  background: #fff; border: 1px solid var(--hairline); border-radius: 10px;
  padding: 12px 14px; outline: 0;
  transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
}
.booking-field input:focus, .booking-field textarea:focus {
  border-color: var(--ia-blue);
  box-shadow: 0 0 0 3px rgba(1,25,183,.14);
}
.booking-field textarea { resize: vertical; min-height: 80px; font-family: inherit; }

/* Confirmation */
.booking-confirmed {
  background: #fff; border: 1px solid var(--hairline); border-radius: 22px;
  padding: 56px;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  max-width: 640px; margin: 0 auto;
  text-align: center;
}
.booking-confirmed-ic {
  width: 56px; height: 56px; border-radius: 999px;
  background: var(--ia-success);
  display: flex; align-items: center; justify-content: center;
}
.booking-summary {
  background: var(--paper); border: 1px solid var(--hairline); border-radius: 12px;
  padding: 18px 22px;
  display: flex; flex-direction: column; gap: 10px;
  width: 100%;
}
.booking-summary-row {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; color: var(--ink);
}

/* Alternative contact strip */
.alt-contact {
  background: #fff; border: 1px solid var(--hairline); border-radius: 22px;
  padding: 36px;
  display: grid; grid-template-columns: 320px 1fr; gap: 48px; align-items: start;
}
@media (max-width: 880px) { .alt-contact { grid-template-columns: 1fr; gap: 24px; } }
.alt-contact-list { display: flex; flex-direction: column; gap: 4px; }
.alt-contact-row {
  display: grid; grid-template-columns: 40px 1fr auto;
  gap: 14px; align-items: center;
  padding: 14px 0;
  border-top: 1px solid var(--hairline);
  background: 0; border-left: 0; border-right: 0; border-bottom: 0;
  cursor: pointer; text-align: left;
  font-family: inherit; color: var(--ink);
  text-decoration: none;
  transition: padding var(--dur-fast);
}
.alt-contact-row:first-child { border-top: 0; }
.alt-contact-row:hover { padding-left: 4px; }
.alt-contact-ic {
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--ia-blue-50);
  display: flex; align-items: center; justify-content: center;
}
.alt-contact-body { display: flex; flex-direction: column; gap: 2px; }
.alt-contact-lbl {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.alt-contact-val { font-size: 16px; color: var(--ink); font-weight: 500; }

/* ---------- About ---------- */
.about-block {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 56px;
  align-items: center;
}
.about-block--reverse { grid-template-columns: 1.1fr 1fr; }
.about-block--reverse .about-block-media { order: 2; }
@media (max-width: 980px) {
  .about-block, .about-block--reverse { grid-template-columns: 1fr; gap: 32px; }
  .about-block--reverse .about-block-media { order: 0; }
}
.about-block-media {
  background: #F2F2EE;
  border-radius: 22px;
  border: 1px solid var(--hairline);
  overflow: hidden;
  min-height: 460px;
  height: 100%;
}
.about-block-body { display: flex; flex-direction: column; }

/* Team grid */
.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 1100px) { .team-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 820px)  { .team-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px)  { .team-grid { grid-template-columns: 1fr; } }
.team-card {
  margin: 0;
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.team-card:hover { border-color: #C7CCD8; transform: translateY(-3px); }
.team-photo {
  aspect-ratio: 1 / 1;
  width: 100%;
  background: #F2F2EE;
  border-bottom: 1px solid var(--hairline);
}
.team-card figcaption { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 4px; }
.team-name {
  font-size: 16px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink);
}
.team-role {
  font-size: 12px; font-weight: 600; letter-spacing: .04em;
  color: var(--ia-blue);
}
.team-bio {
  margin: 8px 0 0; font-size: 14px; color: #5C6172; line-height: 1.5;
}
/* Read-bio cue + clickable team card */
.team-card--clickable { cursor: default; }
.team-readbio {
  margin-top: 10px; align-self: flex-start;
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: 0; padding: 0; cursor: pointer;
  font-family: inherit; font-size: 14px; font-weight: 600; color: var(--ia-blue);
  transition: gap var(--dur-fast);
}
.team-readbio .arrow { transition: transform var(--dur-fast); }
.team-readbio:hover .arrow { transform: translateX(3px); }

/* Team member unfold panel (inline accordion) */
.team-card--active { border-color: var(--ia-blue); }
.team-unfold {
  grid-column: 1 / -1;
  margin-top: 4px;
  overflow: hidden;
  transform-origin: top center;
  animation: team-unfold .42s var(--ease-standard);
}
@keyframes team-unfold {
  from { opacity: 0; transform: translateY(-12px) scaleY(.97); }
  to   { opacity: 1; transform: translateY(0) scaleY(1); }
}
.team-unfold-inner { min-height: 0; }
.team-unfold-card {
  position: relative; background: #fff; border: 1px solid var(--hairline);
  border-radius: 22px; overflow: hidden;
  box-shadow: 0 12px 38px rgba(11,16,36,.09);
}
.team-unfold-grid { display: block; }
.team-modal-close {
  position: absolute; top: 16px; right: 16px; z-index: 2;
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.86); border: 1px solid var(--hairline);
  color: var(--ink); cursor: pointer; transition: background var(--dur-fast);
}
.team-modal-close:hover { background: #F4F4F0; }
.team-modal-body {
  padding: 40px 44px 44px; max-width: 860px;
}
.team-modal-name {
  margin: 6px 0 0; font-size: 28px; font-weight: 600;
  letter-spacing: -0.02em; color: var(--ink);
}
.team-modal-bio { margin-top: 20px; display: flex; flex-direction: column; gap: 14px; }
.team-modal-bio p { margin: 0; font-size: 16px; line-height: 1.65; color: #4A4F60; }
.team-modal-contact {
  margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--hairline);
  display: flex; flex-direction: column; gap: 10px; align-items: flex-start;
}
.tm-contact-h {
  font-size: 12px; font-weight: 600; letter-spacing:.01em;
   color: #9BA0AE; margin-bottom: 2px;
}
.tm-contact-row {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 16px; color: var(--ink); text-decoration: none;
}
.tm-contact-row:hover { color: var(--ia-blue); }
/* Headshot attribution */
.team-credit {
  margin-top: 28px;
  text-align: center;
  font-size: 14px; color: #9BA0AE;
}
.team-credit-brand {
  display: inline-flex; align-items: center; gap: 6px;
  color: #5C6172; font-weight: 600; text-decoration: none;
}
.team-credit-brand img { width: 16px; height: 16px; border-radius: 4px; }
.team-credit-brand:hover { color: var(--ia-blue); }
@media (max-width: 720px) {
  .team-unfold-grid { grid-template-columns: 1fr; }
  .team-unfold-media { min-height: 220px; aspect-ratio: 16 / 9; }
  .team-modal-body { padding: 28px 24px 32px; }
}

/* FAQ */
.faq-list {
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  overflow: hidden;
}
.faq-item { border-top: 1px solid var(--hairline); }
.faq-item:first-child { border-top: 0; }
.faq-q {
  width: 100%;
  background: transparent; border: 0; padding: 22px 28px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  font-family: inherit; font-size: 18px; font-weight: 600; letter-spacing: -0.01em;
  color: var(--ink); text-align: left;
  cursor: pointer;
  transition: background var(--dur-fast);
}
.faq-q:hover { background: var(--paper); }
.faq-item.is-open .faq-q { background: transparent; }
.faq-item.is-open .faq-q:hover { background: transparent; }
.faq-a {
  padding: 0 28px 22px;
  font-size: 16px; color: #4A4F60; line-height: 1.6;
  max-width: 80ch;
}

/* ---------- FAQs aggregator page ---------- */
.faqs-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 48px;
  align-items: flex-start;
}
@media (max-width: 880px) { .faqs-layout { grid-template-columns: 1fr; gap: 28px; } }
.faqs-sidebar {
  position: sticky; top: 92px;
}
@media (max-width: 880px) { .faqs-sidebar { position: static; } }
.faqs-sidebar-label {
  font-size: 12px; font-weight: 600; letter-spacing:.01em;
   color: #9BA0AE;
  margin-bottom: 14px;
}
.faqs-cat-list {
  display: flex; flex-direction: column; gap: 4px;
}
.faqs-cat-btn {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; gap: 12px;
  background: transparent; border: 0; border-radius: 10px;
  padding: 11px 14px;
  font-family: inherit; font-size: 14px; font-weight: 500;
  color: #4A4F60;
  text-align: left; cursor: pointer;
  transition: background var(--dur-fast), color var(--dur-fast);
}
.faqs-cat-btn:hover { background: rgba(0,0,0,.04); color: var(--ink); }
.faqs-cat-btn.is-active {
  background: #fff; color: var(--ink);
  box-shadow: inset 0 0 0 1px var(--hairline);
}
.faqs-cat-count {
  font-size: 12px; color: #9BA0AE;
  font-feature-settings: "tnum";
  background: var(--paper); border-radius: 999px;
  padding: 2px 8px;
}
.faqs-cat-btn.is-active .faqs-cat-count { background: var(--paper); color: var(--ia-blue); }


/* ---------- Home testimonials ---------- */
.testimonial-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 16px;
  align-items: stretch;
}
@media (max-width: 980px) { .testimonial-grid { grid-template-columns: 1fr; } }
.testimonial {
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  padding: 28px;
  margin: 0;
  display: flex; flex-direction: column; gap: 18px;
  position: relative;
}
.testimonial--feature {
  background: linear-gradient(180deg, #fff 0%, #FAFAF7 100%);
  border-color: #DBDBD3;
  grid-row: span 2;
}
.testimonial-mark {
  background: var(--ia-blue-50);
  width: 44px; height: 44px;
  border-radius: 10px;
  padding: 8px;
}
.testimonial--feature .testimonial-mark {
  width: 48px; height: 48px;
  background: var(--ia-blue);
  color: #fff !important;
}
.testimonial blockquote {
  margin: 0;
  display: flex; flex-direction: column; gap: 12px;
  flex: 1;
}
.testimonial blockquote p {
  margin: 0; font-size: 16px; color: var(--ink); line-height: 1.55;
  font-weight: 400;
}
.testimonial--feature blockquote p {
  font-size: 22px; line-height: 1.4; letter-spacing: -0.012em;
  font-weight: 500;
  color: var(--ink);
}
.testimonial--feature blockquote p em {
  font-style: normal;
  background: linear-gradient(180deg, transparent 65%, var(--ia-cyan-300) 65%);
  padding: 0 2px;
}
.testimonial figcaption {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  padding-top: 18px;
  border-top: 1px solid var(--hairline);
}
.testimonial-avatar {
  width: 44px; height: 44px;
  border-radius: 999px;
  background: var(--paper);
  border: 1px solid var(--hairline);
  overflow: hidden;
}
.testimonial-avatar--sm { width: 36px; height: 36px; }
.testimonial-attr {
  display: flex; flex-direction: column; gap: 2px;
  font-size: 14px; color: #5C6172; line-height: 1.4;
}
.testimonial-attr strong { color: var(--ink); font-weight: 600; font-size: 14px; }
.testimonial-logo {
  width: 120px; height: 44px;
}
.testimonial-logo image-slot { width: 100%; height: 100%; display: block; }
.testimonial-logo image-slot::part(frame) { background: transparent; }
.testimonial-logo image-slot::part(ring)  { border-color: rgba(0,0,0,.08); }

/* Logo strip below testimonials */
.logo-strip {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--hairline);
  display: flex; flex-direction: column; gap: 18px; align-items: center;
}
.logo-strip-label {
  font-size: 12px; font-weight: 600; letter-spacing:.01em; 
  color: #9BA0AE;
}
.logo-strip-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  width: 100%;
  max-width: 800px;
}
@media (max-width: 720px) { .logo-strip-row { grid-template-columns: repeat(3, 1fr); } }
.logo-strip--standalone {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.logo-strip-label-row {
  display: flex; justify-content: center;
  margin-bottom: 22px;
}
.logo-marquee {
  position: relative;
  width: 100%;
  overflow: hidden;
  /* Soft fade at the edges so logos scroll in/out cleanly */
  mask-image: linear-gradient(to right, transparent 0, black 8%, black 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0, black 18%, black 82%, transparent 98%);
}
.logo-marquee-track {
  display: flex;
  gap: 56px;
  width: max-content;
  animation: logo-marquee-scroll 80s linear infinite;
  /* Start mid-flow so the first logo doesn't sit half-faded at the left edge on load */
  animation-delay: -26s;
}
/* Pause when the cursor is over the strip OR a file is being dragged over any slot */
.logo-marquee:hover .logo-marquee-track,
.logo-marquee:has(image-slot[data-over]) .logo-marquee-track {
  animation-play-state: paused;
}
.logo-marquee-item {
  flex: 0 0 auto;
  width: 168px; height: 72px;
  display: flex; align-items: center; justify-content: center;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 8px 12px;
  /* Button reset */
  font: inherit; color: inherit;
  cursor: pointer;
  -webkit-appearance: none; appearance: none;
  transition: opacity var(--dur-fast);
}
.logo-marquee-item:hover { opacity: .75; }
.logo-marquee-item:focus-visible {
  outline: 2px solid var(--ia-blue);
  outline-offset: 2px;
  border-radius: 8px;
}
.logo-marquee-item image-slot {
  width: 100%; height: 100%; display: block;
}
/* Drop the grey tint the image-slot uses for its empty drop-target —
   logo files should sit on the page background directly. */
.logo-marquee-item image-slot::part(frame) { background: transparent; }
.logo-marquee-item image-slot::part(ring)  { border-color: rgba(0,0,0,.08); }
@keyframes logo-marquee-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(-50% - 28px)); } /* -50% of track minus half the gap so the seam is clean */
}
@media (prefers-reduced-motion: reduce) {
  .logo-marquee-track { animation: none; }
}
.logo-slot {
  height: 72px;
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}
.logo-slot > image-slot {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

/* ---------- Services finder ---------- */
.svc-finder { display: flex; flex-direction: column; gap: 16px; max-width: 1080px; margin: 0 auto; }
.svc-finder-head { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.svc-finder-options {
  display: grid; grid-template-columns: 1fr; gap: 8px;
  margin-top: 4px;
}
.svc-finder-option {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  background: #fff; border: 1px solid var(--hairline); color: var(--ink);
  font-family: inherit; font-size: 16px; font-weight: 500; text-align: left;
  padding: 13px 18px; border-radius: 12px;
  cursor: pointer;
  transition: border-color var(--dur-fast), background var(--dur-fast), color var(--dur-fast);
}
.svc-finder-option:hover {
  border-color: var(--ia-blue); background: var(--ia-blue-50);
}
.svc-finder-option:hover .svc-finder-arrow { color: var(--ia-blue); transform: translateX(3px); }
.svc-finder-arrow { color: #C7CCD8; transition: transform var(--dur-fast), color var(--dur-fast); flex-shrink: 0; }

/* Compact overrides for the Service Finder card */
.svc-finder .tier-finder { padding: 26px; }
.svc-finder .tier-finder-progress { margin-bottom: 18px; }
.svc-finder .tier-finder-q { gap: 14px; }
.svc-finder .tfq-text { font-size: clamp(20px, 1.3vw + 8px, 24px); max-width: 30ch; }

/* Resource Hub: article category chip — NOT an accelerator tag */
.cat-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: inherit;
  font-size: 12px; font-weight: 500;
  letter-spacing: .04em;
  color: #5C6172;
  background: transparent;
  border: 1px solid var(--hairline);
  padding: 4px 10px;
  border-radius: 6px;
}
.cat-chip--featured {
  background: var(--ink); color: #fff; border-color: var(--ink);
}
.article-card {
  background: #fff; border: 1px solid var(--hairline); border-radius: 18px;
  overflow: hidden;
  display: flex; flex-direction: column;
  cursor: pointer;
  transition: border-color var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-standard);
}
.article-card:hover { border-color: #C7CCD8; transform: translateY(-3px); }
.article-cover {
  aspect-ratio: 16 / 10;
  width: 100%;
  position: relative; overflow: hidden;
  background: #F2F2EE;
  border-bottom: 1px solid var(--hairline);
}
.article-body {
  padding: 22px;
  display: flex; flex-direction: column; gap: 12px;
}
.article-title {
  font-size: 20px; font-weight: 600; letter-spacing: -0.015em;
  color: var(--ink); line-height: 1.25; margin: 0;
}
.article-excerpt {
  margin: 0; font-size: 14px; color: #4A4F60; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.article-meta {
  margin-top: auto;
  padding-top: 12px; border-top: 1px solid var(--hairline);
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #5C6172;
}


/* ============================================================
   REBUILD (content brief v4) — two-door structure + decision markers
   ============================================================ */

/* Decision markers */
.decision{border:1px dashed #E0B84B;background:#FFFCF3;border-radius:12px;margin:24px 0;overflow:hidden}
.decision--compact{margin:20px 0}
.decision-head{width:100%;display:flex;align-items:center;gap:12px;padding:14px 18px;background:none;border:0;cursor:pointer;font-family:inherit;text-align:left}
.decision-id{font-size:12px;font-weight:600;letter-spacing:.01em;color:#8A6A12;background:#FBEFCE;padding:3px 9px;border-radius:999px;flex:none}
.decision-title{font-size:14px;font-weight:600;color:#5E4A0C;flex:1;letter-spacing:-.005em}
.decision-body{padding:0 18px 18px 18px;display:flex;flex-direction:column;gap:12px}
.decision-q{margin:0;font-size:14px;color:#4A4436;line-height:1.6;max-width:78ch}
.decision-opts{display:flex;flex-wrap:wrap;gap:8px}
.decision-opt{font-size:12px;color:#5E4A0C;background:#fff;border:1px solid #EBDCB2;border-radius:999px;padding:5px 12px}
.decision-rec{margin:0;font-size:14px;color:#4A4436;line-height:1.6;max-width:78ch}
.decision-rec strong{color:#8A6A12}
.decision-goto{align-self:flex-start;color:#8A6A12}
.dec-group-head{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid var(--hairline)}
.dec-group-name{font-size:12px;font-weight:600;letter-spacing:.01em;color:var(--ia-blue)}
.dec-group-count{font-size:12px;color:#8A8F9E}
.dec-stack{display:flex;flex-direction:column;gap:10px}

/* Draft / placeholder status flags */
.status-flag{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:600;letter-spacing:.04em;padding:5px 12px;border-radius:999px;margin-top:4px;position:relative;border:0;font-family:inherit;cursor:default}
.status-flag--tip{cursor:pointer}
.status-flag+.status-flag{margin-left:8px}
.status-flag .note{font-weight:400;color:#6B6B6B;letter-spacing:0}

.status-flag .dotk{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.status-flag--draft{background:#FDF3DD;color:#9A6700}
.status-flag--placeholder{background:#FBE9EB;color:#B3261E}
.status-flag--final{background:#E6F4EA;color:#1E7B34}
.status-flag--draft,.status-flag--placeholder,.status-flag--final,.status-flag--decision{background:#FDF0C8;color:#8A5A00;box-shadow:inset 0 0 0 1px rgba(138,90,0,.18)}
.status-note-pop{position:fixed;z-index:2000;width:min(52ch,72vw);max-width:calc(100vw - 32px);background:#FFFBEB;color:#4A3200;font-size:12px;font-weight:400;line-height:1.55;letter-spacing:0;text-align:left;padding:12px 14px;border-radius:12px;box-shadow:0 12px 32px rgba(90,60,0,.22);border:1px solid rgba(138,90,0,.28);pointer-events:none}
.status-flag--decision{background:#FDF0C8;color:#8A5A00}

/* Nav additions */
.nav-decisions{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-size:12px;font-weight:500;color:#8A6A12;background:#FFF8E6;border:1px dashed #E0B84B;border-radius:999px;padding:6px 12px;cursor:pointer}
.nav-decisions:hover{background:#FDF1D3}
.nav-decisions.is-on{background:#FBEFCE}
.nav-decisions .nd-dot{width:6px;height:6px;border-radius:50%;background:#E0A800}
.nav-decisions .nd-n{font-weight:600}
.nav-playground{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:14px;font-weight:500;color:var(--ia-dark-blue);background:#fff;border:1px solid var(--ia-blue);border-radius:999px;padding:7px 14px;text-decoration:none;transition:background .16s ease,color .16s ease}
.nav-playground:hover{background:var(--ia-dark-blue);border-color:var(--ia-dark-blue);color:#fff}
/* Below 1180 the horizontal menu folds into the burger, which frees the bar for
   the Playground link — it stays spelled out rather than shrinking to an icon. */
@media (max-width:1180px){.nav-playground{font-size:12px;padding:7px 10px;gap:5px}}
@media (max-width:760px){.nav-playground{display:none}}
.nav-panel-item.nav-panel-item--playground{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:11px 14px;border:1px solid var(--ia-blue);border-radius:10px;color:var(--ia-dark-blue);font-weight:500}
.nav-panel-item.nav-panel-item--playground:hover{background:var(--ia-dark-blue);border-color:var(--ia-dark-blue);color:#fff}

/* Home — calm hero + router */
.hero--calm{padding-top:96px;padding-bottom:72px;background:var(--paper)}
.home-hero{max-width:62ch}
.home-h1{font-size:clamp(40px,5.2vw,68px);line-height:1.04}
.home-lede{margin-top:22px;max-width:56ch}
.thesis{max-width:70ch;margin:0;font-size:clamp(19px,2vw,24px);line-height:1.55;color:var(--ink);letter-spacing:-.01em}
.thesis em{font-style:normal;color:var(--ia-blue)}
.door-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.door{background:#fff;border:1px solid var(--hairline);border-radius:18px;padding:40px;display:flex;flex-direction:column;gap:16px;cursor:pointer;transition:border-color .2s,transform .2s,box-shadow .2s;border-top:5px solid var(--door)}
.door:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,26,85,.08)}
.door--enable{--door:var(--pl-enable-fg)}
.door--build{--door:var(--pl-build-fg)}
.door-name{font-family:var(--font-display);font-size:30px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.door-body{margin:0;font-size:16px;line-height:1.65;color:#4A4F60;max-width:44ch}
.door-route{font-size:16px;font-style:italic;color:var(--door)}
.door-cta{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:500;color:var(--ia-blue);padding-top:12px}
.proof-strip{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;padding:22px 26px;background:#fff;border:1px solid var(--hairline);border-radius:14px}
.proof-strip-lead{font-size:12px;font-weight:600;letter-spacing:.01em;color:#9BA0AE}
.proof-strip-list{font-size:16px;color:var(--ink)}
.badge-row{display:flex;gap:14px;margin-top:12px}
.badge-slot{width:150px;height:80px;border:1px solid var(--hairline);border-radius:12px;background:#fff;overflow:hidden}
.philosophy{display:flex;flex-direction:column;gap:14px;align-items:flex-start;max-width:66ch}
.philosophy p{margin:0;font-size:18px;line-height:1.65;color:var(--ink)}

/* Service page shells */
.svc-hero{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center;margin-top:18px}
.svc-hero-tri{max-width:360px;justify-self:end;width:100%}
.svc-hero-card{background:#fff;border:1px solid var(--hairline);border-radius:16px;padding:28px}
.glance-h{font-size:12px;font-weight:600;letter-spacing:.01em;color:#9BA0AE;margin-bottom:14px}
.glance-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:11px}
.glance-list li{font-size:16px;color:var(--ink);line-height:1.5;padding-left:18px;position:relative}
.glance-list li:before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--pl-build-fg)}

/* Foundations pillars */
.pillar-rows{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--hairline)}
.pillar-row{display:grid;grid-template-columns:260px 1fr;gap:40px;padding:34px 0;border-bottom:1px solid var(--hairline)}
.pillar-row-head{display:flex;gap:14px;align-items:flex-start}
.pillar-swatch{width:10px;height:34px;border-radius:5px;flex:none;margin-top:3px}
.pillar-row-name{font-family:var(--font-display);font-size:27px;font-weight:600;letter-spacing:-.02em;color:var(--ink);line-height:1.1}
.pillar-row-side{font-size:14px;color:#8A8F9E;margin-top:4px}
.pillar-row-body{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.pillar-row-body p{margin:0;font-size:16px;line-height:1.65;color:#3E4354;max-width:70ch}
.pillar-range{font-size:14px;line-height:1.6;color:#5C6172;background:var(--paper);border:1px solid var(--hairline);border-radius:12px;padding:14px 18px;max-width:70ch}
.pillar-range .lbl{display:block;font-size:12px;font-weight:600;letter-spacing:.01em;color:#9BA0AE;margin-bottom:5px}
.seq-band{background:#fff;border:1px solid var(--hairline);border-radius:18px;padding:44px}
.seq-band .lede{max-width:72ch}
.closer-line{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:24px 0 0;font-size:16px;color:#4A4F60}

/* Story cards */
.story-card{background:#fff;border:1px solid var(--hairline);border-top:4px solid var(--sc);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:14px}
.story-sector{font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--sc);background:var(--scbg);align-self:flex-start;padding:5px 12px;border-radius:999px}
.story-body{margin:0;font-size:16px;line-height:1.65;color:#3E4354}
.story-outcome{margin-top:auto;padding-top:14px;border-top:1px dashed var(--hairline);font-size:14px;color:var(--ink)}
.story-pending{color:#B3261E;font-size:14px;font-style:italic}

/* Accelerators */
.way-card{padding:32px;gap:14px;cursor:pointer}
.way-n{font-family:var(--font-display);font-size:22px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.way-card p{margin:0;font-size:16px;line-height:1.65;color:#4A4F60}
.build-band{background:var(--ia-dark-blue);color:#fff;border-radius:18px;padding:56px}
.build-band .eyebrow{color:var(--ia-light-blue)}
.build-lede{margin:14px 0 0;font-size:20px;line-height:1.65;color:rgba(255,255,255,.86);max-width:74ch}
.build-kicker{margin:22px 0 0;font-size:22px;line-height:1.5;color:#fff;font-weight:500;letter-spacing:-.01em}
.after-card{padding:32px;gap:12px}
.after-h{font-family:var(--font-display);font-size:20px;font-weight:600;color:var(--ink)}
.after-card p{margin:0;font-size:16px;line-height:1.65;color:#4A4F60}
.after-card--alt{background:var(--pl-enable-bg);border-color:transparent}

/* How we work — the journey as a connected spine */
.journey{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-direction:column}
.journey-step{display:grid;grid-template-columns:78px 1fr;gap:32px;padding:0 0 36px;position:relative}
.journey-step:last-child{padding-bottom:0}
.journey-rail{position:relative;display:flex;justify-content:center}
.journey-dot{width:46px;height:46px;border-radius:50%;background:#fff;border:2px solid var(--jt);color:var(--jt);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;z-index:1;flex:none}
.journey-step:not(:last-child) .journey-rail::after{content:"";position:absolute;top:48px;bottom:-36px;left:50%;transform:translateX(-50%);width:2px;background:linear-gradient(var(--jt),var(--jn))}
.journey-body{padding-top:10px}
.journey-name{margin:0 0 8px;font-size:22px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.journey-body p{margin:0;font-size:16px;line-height:1.68;color:#3E4354;max-width:76ch}
/* How we work — beliefs: claim large, detail small */
.believe{display:flex;flex-direction:column;margin-top:8px}
.blf{padding:30px 0;border-bottom:1px solid var(--hairline);display:flex;flex-direction:column;align-items:flex-start}
.blf:first-child{padding-top:0}
.blf-k{font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--bl);margin-bottom:14px}
.blf-big{margin:0;font-size:clamp(23px,2.4vw,28px);font-weight:300;line-height:1.32;letter-spacing:-.028em;color:var(--ia-dark-blue);max-width:26ch;text-wrap:pretty}
.blf-big strong{font-weight:600}
.blf-sm{margin:14px 0 0;font-size:14px;line-height:1.7;color:#5C6172;max-width:64ch;text-wrap:pretty}
.blf .linkout{margin-top:14px}
.value-card{background:#fff;border:1px solid var(--hairline);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:10px}
.value-name{font-family:var(--font-display);font-size:20px;font-weight:600;color:var(--ink)}
.value-card p{margin:0;font-size:16px;line-height:1.65;color:#4A4F60}

/* Decisions index — superseded list */
.sup-list{display:flex;flex-direction:column;border-top:1px solid var(--hairline)}
.sup-row{display:grid;grid-template-columns:230px 1fr 44px 20px;gap:18px;align-items:center;padding:16px 4px;border-bottom:1px solid var(--hairline);background:none;border-left:0;border-right:0;border-top:0;cursor:pointer;font-family:inherit;text-align:left}
.sup-row:hover{background:var(--paper)}
.sup-name{font-size:16px;font-weight:600;color:var(--ink)}
.sup-note{font-size:14px;color:#5C6172}
.sup-dec{font-size:12px;font-weight:600;color:#8A6A12;background:#FBEFCE;border-radius:999px;padding:3px 8px;text-align:center}

@media (max-width:900px){
  .door-grid,.svc-hero,.pillar-row,.journey-step,.sup-row{grid-template-columns:1fr}
  .svc-hero-tri{justify-self:start;max-width:280px}
}

/* Nav fit — brief v4 header carries more items than the old one.
   The nav uses its own wider, full-bleed track rather than .container. */
.nav .nav-inner{max-width:none;width:100%;padding-inline:clamp(16px,2.4vw,40px);gap:clamp(10px,1.6vw,24px)}
.nav-brand{flex:none}
.nav-logo{height:clamp(24px,2.2vw,30px);width:auto}
.nav-links{flex:0 1 auto;min-width:0;justify-content:center;gap:clamp(0px,.5vw,6px);flex-wrap:nowrap;margin:0 auto}
.nav-links .nav-link{white-space:nowrap;font-size:clamp(13px,1.05vw,15px);padding:8px 11px;border-radius:9px}
.nav-cta{flex:none;gap:10px}
.nav-decisions{padding:5px 9px;font-size:12px;gap:6px}
.nav-cta .btn{white-space:nowrap;font-size:clamp(12.5px,1vw,14px)}
.nav-burger{display:none;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;border:1px solid var(--hairline);background:#fff;color:var(--ink);cursor:pointer;flex:none}
.nav-panel{display:flex;flex-direction:column;border-top:1px solid var(--hairline);background:#fff;padding:8px clamp(16px,2.4vw,40px) 16px}
.nav-panel-item{text-align:left;font-family:inherit;font-size:16px;color:var(--ink);background:none;border:0;border-bottom:1px solid var(--hairline);padding:13px 2px;cursor:pointer;text-decoration:none}
.nav-panel-item:last-child{border-bottom:0}
.nav-panel-item.active{color:var(--ia-blue);font-weight:600}
/* The full nav is worth keeping as long as it fits: tighten it twice before
   collapsing, so the hamburger is a genuine small-screen fallback. */
@media (max-width:1080px){.nav-links .nav-link{font-size:14px;padding:8px 9px}.nav-cta .btn--ghost{display:none}}
@media (max-width:1040px){.nav-links .nav-link{font-size:12px;padding:7px 7px;letter-spacing:-.01em}.nav-inner{gap:8px}}
/* With the links out of flow, space-between would strand the burger mid-header,
   so it sits hard against the brand instead. */
@media (max-width:1000px){.nav-links{display:none}.nav-burger{display:inline-flex;margin-right:auto}}

/* Home — philosophy + recognition band */
.home-philosophy{display:grid;grid-template-columns:1.4fr .6fr;gap:48px;align-items:center}
.philosophy-line{margin:14px 0 16px;font-size:20px;line-height:1.6;color:var(--ink);max-width:60ch;letter-spacing:-.01em}
.recognition{display:flex;flex-direction:column;gap:10px}
@media (max-width:900px){.home-philosophy{grid-template-columns:1fr}}

/* Toolbox — "formerly ..." helper tag on relabelled categories (retirable later) */
.former-tag{font-size:12px;color:#9BA0AE;letter-spacing:.01em;white-space:nowrap}
.filter-chip{gap:5px;padding-inline:11px}
.filter-chip .former-tag{margin-left:0;font-size:12px;opacity:.85}
.filter-chip--active .former-tag{color:rgba(255,255,255,.55)}

/* Our Work — one library, two content types */
.entry-kind{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.01em;color:#8A8F9E}
.entry-kind-dot{width:8px;height:8px;border-radius:2px}
.entry-kind-dot--case{background:var(--pl-enable-fg)}
.entry-kind-dot--paper{background:var(--ia-blue);border-radius:50%}
.entry-kind-note{font-weight:400;letter-spacing:.02em;text-transform:none;color:#9BA0AE;font-size:12px}
.work-card--paper{background:#fff}
.work-card--paper .work-card-body{padding-top:26px}
.pending-pill{display:inline-block;margin-left:8px;font-size:12px;font-weight:600;letter-spacing:.04em;color:#B3261E;background:#FBE9EB;border-radius:999px;padding:2px 8px;vertical-align:middle}
.entry-row{display:grid;grid-template-columns:180px 1fr;gap:48px}
.entry-p{font-size:18px;line-height:1.62;color:var(--ink);margin:0;max-width:70ch}
.entry-pending{margin:0;font-size:16px;font-style:italic;color:#B3261E}
.entry-quote{margin:0;font-size:20px;font-style:normal;font-family:var(--font-body);line-height:1.45;color:var(--ink);border-left:3px solid var(--ia-blue);padding-left:24px;font-weight:500}
.entry-quote footer{margin-top:14px;font-size:14px;color:#5C6172;font-weight:400}
@media (max-width:900px){.entry-row{grid-template-columns:1fr;gap:14px}}

/* Card summaries clamp honestly rather than guillotining */
.work-card-summary{display:-webkit-box;-webkit-box-orient:vertical}

/* About — recognition band */
.about-recognition{display:grid;grid-template-columns:1.25fr .75fr;gap:72px;align-items:center}
@media (max-width:900px){.about-recognition{grid-template-columns:1fr;gap:36px}}
/* Recognition reads as a moment, not a footnote: navy band, statement type,
   badges at a size where a real logo can actually be read. */
.recognition-band{background:var(--ia-dark-blue);padding-top:104px;padding-bottom:104px}
.recognition-band .eyebrow{color:var(--ia-light-blue)}
.recognition-band .eyebrow:before{background:var(--ia-light-blue)}
.recognition-statement{margin:22px 0 0;font-size:clamp(26px,3.1vw,40px);line-height:1.32;font-weight:300;letter-spacing:-.025em;color:#fff;max-width:24ch;text-wrap:pretty}
.recognition-statement em{font-style:normal;font-weight:500;color:var(--ia-light-blue)}
.recognition-band .badge-row{gap:22px;margin-top:0;justify-content:flex-end}
.recognition-band .badge-slot{width:190px;height:120px;border-color:rgba(255,255,255,.16);border-radius:16px;background:rgba(255,255,255,.06)}
@media (max-width:900px){.recognition-band{padding-top:72px;padding-bottom:72px}.recognition-band .badge-row{justify-content:flex-start}}

/* About asides: an invitation and a footnote, not two matching cards. */
.about-asides{display:grid;grid-template-columns:1.45fr 1fr;gap:56px;align-items:stretch}
@media (max-width:900px){.about-asides{grid-template-columns:1fr;gap:32px}}.aside--ask{padding:44px;gap:16px;display:flex;flex-direction:column;align-items:flex-start}
.aside-lead{margin:0;font-size:20px;line-height:1.5;font-weight:400;letter-spacing:-.016em;color:var(--ia-dark-blue);text-wrap:pretty}
.aside--proof{padding:6px 0 6px 30px;border-left:2px solid var(--ia-light-blue);display:flex;flex-direction:column;align-items:flex-start;gap:12px;justify-content:center}
.aside-note{margin:0;font-size:16px;line-height:1.68;color:#5C6172;text-wrap:pretty}

/* Contact — note or booking */
.contact-switch{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--hairline);border-radius:999px;background:#fff;margin:0 auto 28px;display:flex;width:max-content}
.contact-switch-btn{font-family:inherit;font-size:14px;color:#5C6172;background:none;border:0;border-radius:999px;padding:9px 20px;cursor:pointer;white-space:nowrap}
.contact-switch-btn.is-on{background:var(--ia-blue);color:#fff;font-weight:500}
.contact-form-wrap{max-width:680px;margin:0 auto}
.contact-form{display:flex;flex-direction:column;gap:18px;background:#fff;border:1px solid var(--hairline);border-radius:18px;padding:36px}
/* Honeypot: parked off-screen rather than display:none, which some bots skip.
   Kept out of the tab order and hidden from assistive tech. */
.form-gotcha{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
/* A send that fails has to say so — the thank-you panel must never be a guess. */
.form-error{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:10px;
  background:#FBE9EB;color:#A8171F;font-size:var(--fs-14);line-height:1.45}
.form-error a{color:#A8171F;text-decoration:underline}
.btn.is-busy{opacity:.65;pointer-events:none}

/* Home sticker board — stack the chips before they collide (board is too narrow below ~1100px) */
@media (max-width:1140px){
  .hero-board{height:auto!important;min-height:0;display:flex;flex-direction:column;gap:12px;padding:0}
  .hero-board>div[style]{position:static!important;inset:auto!important;width:auto!important;min-width:0!important;transform:none!important}
  .hero-board>div[aria-hidden],.hero-board>div:not(.hero-chip){display:none}
  .hero-board .hero-chip{position:static!important;inset:auto!important;width:100%!important;min-width:0!important}
}


/* ============================================================
   HOME HERO — Dark Blue slab, deck-inspired (brand palette only:
   #001A55 ground, #4BE4F8 accent, #0119B7 for the primary action)
   ============================================================ */
.hero--slab{background:var(--ia-dark-blue);color:#fff;padding:0;overflow:hidden;position:relative}
.hero--slab::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(75,228,248,.13) 1px,transparent 1px);background-size:22px 22px;background-position:-1px -1px;pointer-events:none}
.hero--slab::after{content:"";position:absolute;top:-140px;right:-160px;width:620px;height:620px;background:url(../assets/graphics/ia-base-graphic-full.png) center/cover no-repeat;opacity:.16;mask-image:radial-gradient(ellipse at center,black 35%,transparent 72%);-webkit-mask-image:radial-gradient(ellipse at center,black 35%,transparent 72%);pointer-events:none}
.hero--slab .container{position:relative;z-index:1}
.hero--slab .hero-grid{padding:104px 0 132px;align-items:center;gap:72px}
/* The slab meets the white strip on a soft curve rather than a straight cut */
.hero--slab .hero-fade{position:absolute;left:0;right:0;bottom:-1px;height:120px;pointer-events:none;z-index:2;line-height:0}
.hero--slab .hero-fade svg{display:block;width:100%;height:100%}

/* Accent rule above the eyebrow — the deck's signature opener */
.hero-rule{width:64px;height:3px;background:var(--ia-light-blue);border-radius:2px;margin-bottom:22px}
.hero--slab .eyebrow{color:var(--ia-light-blue)}
.hero--slab .eyebrow::before{display:none}
.hero--slab .h-display{color:#fff;font-size:clamp(42px,4.9vw,68px);line-height:1.05;margin-top:14px;letter-spacing:-.025em}
.hero--slab .h-display em{font-style:normal;color:var(--ia-light-blue);background:none;padding:0}
.hero--slab .lede{color:rgba(255,255,255,.78);font-size:20px;line-height:1.62;margin-top:24px;max-width:52ch}
.hero--slab .cta-row{margin-top:36px}

/* Bracketed board — the deck's inline-def corners, as the chip frame */
.hero--slab .hero-board{padding:0;min-height:470px}
.hero--slab .hero-board::before{display:none}
.hero--slab .hero-chip{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.14);box-shadow:none;backdrop-filter:blur(6px);border-radius:12px;padding:16px 18px;min-width:216px;transition:border-color .25s ease,transform .25s ease,background .25s ease}
.hero--slab .hero-chip:hover{border-color:rgba(75,228,248,.55);background:rgba(255,255,255,.09);transform:translateY(-3px)}
.hero--slab .hero-chip::before,.hero--slab .hero-chip::after{content:"";position:absolute;width:13px;height:13px;border:2px solid var(--ia-light-blue);opacity:.85}
.hero--slab .hero-chip::before{top:-1px;left:-1px;border-right:0;border-bottom:0;border-radius:12px 0 0 0}
.hero--slab .hero-chip::after{bottom:-1px;right:-1px;border-left:0;border-top:0;border-radius:0 0 12px 0}
.hero--slab .hero-chip .chip-meta{color:var(--ia-light-blue);font-size:12px;font-weight:600;letter-spacing:.01em;}
.hero--slab .hero-chip .chip-row{color:rgba(255,255,255,.7);margin-top:7px}
.hero--slab .hero-chip .chip-row strong{color:#fff;font-size:16px}
.hero--slab .hero-chip>div:last-child{color:rgba(255,255,255,.6)!important;margin-top:3px}

/* Ground the slab against the white logo strip below */
.hero-slab-foot{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.12);padding:20px 0 24px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hero-slab-foot .lbl{font-size:12px;font-weight:600;letter-spacing:.01em;color:var(--ia-light-blue)}
.hero-slab-foot .val{font-size:16px;color:rgba(255,255,255,.8)}
.hero--slab .crumbs{color:rgba(255,255,255,.45)}
@media (max-width:1140px){.hero--slab .hero-grid{padding:72px 0 76px;gap:44px}.hero--slab .hero-board{min-height:0}}
.chip-dot--cyan{width:8px;height:8px;border-radius:50%;background:var(--ia-light-blue);flex:none}
.chip-dot--teal{width:8px;height:8px;border-radius:50%;background:#00968F;flex:none}

/* Hero visual — the journey line (option A) */
.hero-journey{width:100%;max-width:460px;margin-left:auto}
.hero-journey svg{display:block;width:100%;height:auto;overflow:visible;font-family:var(--font-body)}
.hero-journey .hj-dash{animation:hj-travel 2.6s linear infinite}
@keyframes hj-travel{to{stroke-dashoffset:-32}}
.hero-journey .hj-pulse{animation:hj-pulse 3.2s ease-in-out infinite}
@keyframes hj-pulse{0%,100%{opacity:.9;r:19}50%{opacity:.32;r:24}}
@media (prefers-reduced-motion:reduce){.hero-journey .hj-dash,.hero-journey .hj-pulse{animation:none}}
@media (max-width:1140px){.hero-journey{margin-left:0;max-width:none}}
.hero-journey{position:relative}
.hj-labels{position:absolute;inset:0;pointer-events:none}
.hj-label{position:absolute;transform:translate(calc(-100% - 18px),-50%);font-size:14px;letter-spacing:.02em;color:rgba(255,255,255,.72);white-space:nowrap}
.hj-label--end{color:var(--ia-light-blue);font-weight:600}
/* Hero journey: the line draws itself, waypoints land as it passes. */
.hero-journey .hj-path{stroke-dasharray:1;stroke-dashoffset:1;animation:hj-draw 2.6s cubic-bezier(.16,.84,.24,1) .25s forwards}
@keyframes hj-draw{to{stroke-dashoffset:0}}
.hero-journey .hj-path{stroke-width:5.4}
.hero-journey .hj-dot{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.35);animation:hj-pop .62s cubic-bezier(.18,1.5,.36,1) forwards}
@keyframes hj-pop{to{opacity:1;transform:scale(1)}}
.hj-label{opacity:0;animation:hj-fade .7s cubic-bezier(.16,.84,.24,1) forwards}
@keyframes hj-fade{from{opacity:0;transform:translate(calc(-100% - 26px),-50%)}to{opacity:1;transform:translate(calc(-100% - 18px),-50%)}}
.hero-journey .hj-end-pulse{animation:hj-endpulse 3.6s ease-in-out 3.3s infinite}
@keyframes hj-endpulse{0%,100%{opacity:.55;r:14}50%{opacity:0;r:26}}
/* Scroll reveal */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s cubic-bezier(.22,.7,.3,1)}
.reveal--in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.hero-journey .hj-path{animation:none;stroke-dashoffset:0}.hero-journey .hj-dot,.hj-label{animation:none;opacity:1;transform:scale(1)}.hj-label{transform:translate(calc(-100% - 18px),-50%)}.hero-journey .hj-end-pulse{animation:none;opacity:0}}

/* Logo strip → paper: ramp white into the paper tone so the join is invisible.
   The marquee lives inside this section, so the ramp runs across the whole band. */
.logo-strip-band{background:linear-gradient(to bottom,#fff 0%,#fff 38%,#FDFDFA 72%,var(--paper) 100%)}
.logo-strip-band .logo-marquee{background:transparent}
/* Same softening wherever a white section hands off to paper */
.section--white:has(+.section--paper){background:linear-gradient(to bottom,#fff 0%,#fff 82%,var(--paper) 100%)}

/* Home — the philosophy, set as a statement rather than a paragraph */
.philosophy-quote{position:relative;margin:20px 0 22px;padding-left:30px;max-width:24ch;font-size:clamp(26px,2.7vw,38px);line-height:1.28;font-weight:600;letter-spacing:-.025em;color:var(--ia-dark-blue);text-wrap:pretty}
.philosophy-quote::before{content:"";position:absolute;left:0;top:.18em;bottom:.1em;width:4px;border-radius:2px;background:var(--ia-blue)}
/* Deck pattern: the subordinate clause drops to a lighter italic in a quieter tone */
.philosophy-quote em{font-style:italic;font-weight:400;color:var(--ia-blue);letter-spacing:-.015em}
.home-philosophy{grid-template-columns:1.5fr .5fr}
@media (max-width:900px){.philosophy-quote{max-width:none;padding-left:22px}}

/* Home — closing statement band */
.home-close{position:relative;background:var(--ia-dark-blue);color:#fff;overflow:hidden;padding:132px 0 124px;text-align:center}
.home-close::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(75,228,248,.13) 1px,transparent 1px);background-size:22px 22px;pointer-events:none}
.home-close::after{content:"";position:absolute;bottom:-200px;left:50%;transform:translateX(-50%);width:760px;height:520px;background:url(../assets/graphics/ia-base-graphic-full.png) center/cover no-repeat;opacity:.13;mask-image:radial-gradient(ellipse at center,black 32%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at center,black 32%,transparent 70%);pointer-events:none}
.home-close-curve{position:absolute;top:-1px;left:0;right:0;height:110px;line-height:0;z-index:1}
.home-close-curve svg{display:block;width:100%;height:100%}
.home-close-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
.home-close .hero-rule{margin-bottom:22px}
.home-close-answer{margin:20px 0 0;font-size:clamp(19px,1.9vw,25px);font-style:italic;font-weight:400;line-height:1.4;color:rgba(255,255,255,.72);letter-spacing:-.015em}
.home-close-title{margin:0;font-family:var(--font-body);font-size:clamp(38px,4.6vw,62px);font-weight:600;letter-spacing:-.03em;line-height:1.08;color:#fff;max-width:16ch;text-wrap:pretty}
.home-close-title em{font-style:normal;color:var(--ia-light-blue)}
.home-close-cta{display:inline-flex;align-items:center;gap:10px;margin-top:38px;font-family:inherit;font-size:18px;font-weight:600;letter-spacing:-.01em;color:var(--ia-dark-blue);background:var(--ia-light-blue);border:0;border-radius:999px;padding:19px 34px;cursor:pointer;transition:transform .2s var(--ease-standard),box-shadow .2s var(--ease-standard),background .2s}
.home-close-cta:hover{background:#6CECFF;transform:translateY(-2px);box-shadow:0 16px 38px rgba(75,228,248,.24)}
.home-close-cta .arrow{transition:transform .2s var(--ease-standard)}
.home-close-cta:hover .arrow{transform:translateX(4px)}
.home-close-sub{margin:22px 0 0;font-size:16px;color:rgba(255,255,255,.6)}
@media (max-width:900px){.home-close{padding:96px 0 92px}}


/* Home — the two doors as a full-bleed split */
.door-split{display:grid;grid-template-columns:1fr 1fr;border-radius:20px;overflow:hidden}
.door-half{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:0;padding:52px 44px;min-height:420px;border:0;cursor:pointer;font-family:inherit;color:#fff;transition:filter .25s var(--ease-standard)}
.door-half:hover{filter:brightness(1.07)}
.door-half--e{background:var(--pl-enable-fg)}
.door-half--b{background:var(--ia-dark-blue)}
.door-half--b::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(75,228,248,.13) 1px,transparent 1px);background-size:22px 22px;pointer-events:none}
.door-half>*{position:relative;z-index:1}
.door-num{font-size:12px;font-weight:700;letter-spacing:.01em;color:#fff}
.door-half--b .door-num{color:var(--ia-light-blue)}
.door-h3{font-family:var(--font-body);font-size:clamp(28px,2.9vw,36px);font-weight:600;letter-spacing:-.028em;line-height:1.1;margin-top:18px}
.door-p{font-size:16px;line-height:1.62;margin-top:16px;max-width:34ch;color:#fff}
.door-half--b .door-p{color:rgba(255,255,255,.82)}
.door-route{margin-top:26px;width:100%;font-size:16px;display:flex;align-items:center;gap:9px;color:#fff}
.door-rule{margin-top:26px;height:1px;width:100%;background:rgba(255,255,255,.24)}
.door-half--b .door-route{color:var(--ia-light-blue)}
.door-route .arrow{transition:transform .2s var(--ease-standard)}
.door-half:hover .door-route .arrow{transform:translateX(4px)}
@media (max-width:860px){.door-split{grid-template-columns:1fr}.door-half{min-height:0;padding:40px 30px}}

/* Home — industries served, under the trusted-by label */
/* Hero subtext, under the opening statement */
.hero--slab .delivered-across{margin:34px 0 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.16);font-size:16px;line-height:1.55;color:rgba(255,255,255,.62);max-width:46ch}
.hero--slab .delivered-across strong{color:rgba(255,255,255,.92);font-weight:500}
.door-route em{font-style:italic;font-weight:400}
.door-route{justify-content:space-between}

/* Foundations — "no fixed order" cycle */
.cyc{display:grid;grid-template-columns:400px 1fr;gap:80px;align-items:center;margin-top:26px}
.cyc-svg{width:100%;height:auto;display:block}
.cyc-copy .lede{margin-top:18px;font-size:clamp(17px,1.5vw,19px)}
.cyc-copy .h-section{font-size:clamp(32px,3.6vw,46px)}
@media (max-width:860px){.cyc{grid-template-columns:1fr;gap:28px}.cyc-svg{max-width:260px}}

/* Foundations — "recognise yourself" zig zag */
.zig{display:flex;flex-direction:column;margin-top:22px;border-radius:16px;overflow:hidden}
.zg{display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
.zg-q{padding:36px 42px;display:flex;align-items:center;background:var(--paper);border:1px solid var(--hairline)}
.zg-q p{margin:0;font-size:clamp(19px,1.9vw,23px);line-height:1.36;font-style:italic;font-weight:500;color:var(--ia-dark-blue);letter-spacing:-.02em;text-wrap:pretty}
.zg-a{padding:32px 38px;display:flex;flex-direction:column;justify-content:center;gap:11px;background:#fff;border:1px solid var(--hairline);border-left:0}
.zg--rev .zg-q{order:2;border-left:0}
.zg--rev .zg-a{order:1;border-left:1px solid var(--hairline);border-right:0}
.zg-k{font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--zt)}
.zg-a p{margin:0;font-size:14px;line-height:1.62;color:#3E4354}
.zg-res{font-size:16px;font-weight:700;color:var(--ia-dark-blue);letter-spacing:-.015em}
.zg-pend{color:#A8171F;border-bottom:2px dashed #A8171F;padding-bottom:1px}
.zg-cs{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.08em;color:#A8171F;background:#FBE3E4;border-radius:5px;padding:2px 7px;margin-left:8px;vertical-align:middle}
.zg-who{font-size:12px;color:#5C6172;display:flex;align-items:center;gap:14px;margin-top:2px}
.zg-lg{width:120px;height:44px;flex:none;display:block;overflow:hidden;border-radius:6px}
.zg-lg image-slot{width:100%;height:100%;display:block}
/* Rows abut, so collapse the doubled internal seams. */
.zg + .zg .zg-q,.zg + .zg .zg-a{border-top:0}
@media (max-width:860px){
  .zg,.zg--rev{grid-template-columns:1fr}
  .zg-q,.zg--rev .zg-q{order:1;padding:26px 24px;border-bottom:0}
  .zg-a,.zg--rev .zg-a{order:2;padding:24px;border-left:1px solid var(--hairline);border-right:1px solid var(--hairline)}
}

/* Foundations — closer: one panel, handoff above, commercial note below */
.fnd-closer{background:#fff;border:1px solid var(--hairline);border-radius:18px;overflow:hidden}
.fnd-closer-main{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center;padding:40px 44px}
.fnd-closer-copy .eyebrow{margin-bottom:12px}
.fnd-closer-title{margin:0;font-size:clamp(20px,2.1vw,25px);font-weight:600;line-height:1.38;letter-spacing:-.02em;color:var(--ia-dark-blue);max-width:52ch;text-wrap:pretty}
.fnd-closer-title em{font-style:normal;font-weight:700;color:var(--ia-blue)}
.fnd-closer-main .btn{white-space:nowrap}
.fnd-closer-foot{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:20px 44px;border-top:1px solid var(--hairline);background:var(--paper);font-size:14px;color:#5C6172}
@media (max-width:860px){
  .fnd-closer-main{grid-template-columns:1fr;gap:24px;padding:30px 26px}
  .fnd-closer-main .btn{justify-self:start}
  .fnd-closer-foot{padding:18px 26px}
}

/* Accelerators — brief-structure prose blocks, no card scaffolding */
.svc-hero--solo{grid-template-columns:minmax(0,1fr)}

/* The two ways in — fork diagram beside the copy, mirroring the Foundations cycle */
.fork-lay{display:grid;grid-template-columns:300px 1fr;gap:56px;align-items:center;margin-top:26px}
.fork-svg{width:100%;height:auto;display:block}
/* Route rails: two labelled lines, three stops vs none, same endpoint. */
.rails{display:flex;flex-direction:column;gap:20px}
.rail-svg{width:100%;height:auto;display:block}
.rail-k{font-size:12px;font-weight:700;letter-spacing:.01em;}
.rail-k--found{color:#00655F}
.rail-k--direct{color:var(--ia-blue)}
.rail-n{font-size:16px;font-weight:600;color:var(--ia-dark-blue);margin-top:3px;letter-spacing:-.01em}
.fork-copy .lede{margin-top:14px;max-width:62ch}
.fork-links{display:flex;flex-wrap:wrap;gap:26px;margin-top:20px}

/* Build stories — hairline gallery, icon-led */
.build-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hairline);border:1px solid var(--hairline);margin-top:22px}
.build-cell{background:#fff;padding:34px 30px;display:flex;flex-direction:column;transition:background .2s var(--ease-standard)}
.build-cell:hover{background:var(--paper)}
.build-cell-ic{width:38px;height:38px;margin-bottom:20px}
.build-cell-ic svg{width:38px;height:38px;display:block}
.build-cell-k{font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--bt);margin-bottom:9px}
.build-cell-name{font-size:18px;font-weight:500;color:var(--ia-dark-blue);line-height:1.28;letter-spacing:-.018em;margin-bottom:13px}
.build-cell p{margin:0;font-size:14px;line-height:1.66;color:#5C6172;flex:1}
.build-cell-f{margin-top:22px;padding-top:15px;border-top:1px solid var(--hairline);display:flex;flex-direction:column;gap:10px}
.build-cell-lg{width:96px;height:30px;display:block;overflow:hidden;border-radius:4px}
.build-cell-lg image-slot{width:100%;height:100%;display:block}
.build-cell-o{font-size:12px}
.build-cell-pend{color:#A8171F;border-bottom:1.5px dashed #A8171F;padding-bottom:1px}
.build-cell-cs{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.1em;color:#A8171F;margin-left:9px;vertical-align:middle}
@media (max-width:900px){.build-gal{grid-template-columns:minmax(0,1fr)}}

/* Build stories — ruled rows (retired) */
.story-rows{display:flex;flex-direction:column;border-top:1px solid var(--hairline);margin-top:22px}
.story-row{display:grid;grid-template-columns:270px 1fr;gap:44px;padding:30px 2px;border-bottom:1px solid var(--hairline);align-items:start}
.story-row-head{display:flex;flex-direction:column;gap:10px}
.story-row-kind{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--sr)}
.story-row-sector{font-size:16px;font-weight:600;color:var(--ia-dark-blue);line-height:1.3;letter-spacing:-.015em}
.story-row-lg{width:120px;height:40px;display:block;overflow:hidden;border-radius:6px}
.story-row-lg image-slot{width:100%;height:100%;display:block}
.story-row-body p{margin:0;font-size:16px;line-height:1.65;color:#3E4354;max-width:74ch}
.story-row-out{margin-top:14px;font-size:16px;font-weight:600;color:var(--ia-dark-blue)}
.story-row-pend{color:#A8171F;border-bottom:2px dashed #A8171F;padding-bottom:1px}
.story-row-cs{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.08em;color:#A8171F;background:#FBE3E4;border-radius:5px;padding:2px 7px;margin-left:9px;vertical-align:middle}

@media (max-width:900px){
  .fork-lay{grid-template-columns:minmax(0,1fr);gap:26px}
  .fork-svg{max-width:280px}
  .story-row{grid-template-columns:minmax(0,1fr);gap:16px}
}
.acc-closer{margin:34px 0 0;padding-top:26px;border-top:1px solid var(--hairline);font-size:16px;line-height:1.65;color:#5C6172;max-width:70ch}

/* Accelerators — after the build: statement with a note beside it */
.atb{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:end;margin-top:26px}
.atb-statement{margin:0;font-size:clamp(20px,2.2vw,27px);line-height:1.34;font-weight:300;letter-spacing:-.028em;color:var(--ia-dark-blue);max-width:30ch;text-wrap:pretty}
.atb-statement strong{font-weight:600}
.atb-statement em{font-style:italic;font-weight:400;color:var(--ia-blue)}
.atb-note p{margin:0;font-size:16px;line-height:1.7;color:#5C6172;text-wrap:pretty}
.atb-links{display:flex;flex-wrap:wrap;gap:24px;margin-top:16px}
@media (max-width:900px){.atb{grid-template-columns:minmax(0,1fr);gap:26px;align-items:start}}

/* How we work — closer: statement left, action right, on a rule */
.hww-closer{display:grid;grid-template-columns:1fr auto;gap:56px;align-items:end;padding-top:36px;border-top:1px solid var(--hairline)}
.hww-closer-t{margin:0;font-size:clamp(20px,2.2vw,27px);line-height:1.34;font-weight:300;letter-spacing:-.03em;color:var(--ia-dark-blue);max-width:26ch;text-wrap:pretty}
.hww-closer-t em{font-style:italic;font-weight:400;color:var(--ia-blue)}
.hww-closer .btn{white-space:nowrap}
@media (max-width:860px){.hww-closer{grid-template-columns:minmax(0,1fr);gap:26px;align-items:start}.hww-closer .btn{justify-self:start}}

/* How we work — values as a dark band */
.values-band{position:relative;overflow:hidden;background:var(--ia-dark-blue);color:#fff;padding:72px 0}
.values-band::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.055) 1px,transparent 1px);background-size:26px 26px;pointer-events:none}
.values-band .container{position:relative;z-index:1}
.values-band .eyebrow{color:var(--ia-light-blue)}
.values-band-h{margin:0 0 34px;font-family:var(--font-body);font-size:clamp(26px,3vw,32px);font-weight:600;letter-spacing:-.032em;color:#fff;line-height:1.2}
.values-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.values-cols>div{padding:0 34px}
.values-cols>div:first-child{padding-left:0}
.values-cols>div:last-child{padding-right:0}
.values-cols>div+div{border-left:1px solid rgba(255,255,255,.16)}
.values-cols b{display:block;font-size:20px;font-weight:700;color:#fff;letter-spacing:-.022em;margin-bottom:12px}
.values-cols p{margin:0;font-size:16px;line-height:1.68;color:rgba(255,255,255,.8);font-weight:400;text-wrap:pretty}
.values-band-flags{margin-top:34px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
@media (max-width:860px){.values-cols{grid-template-columns:minmax(0,1fr);gap:26px}.values-cols>div{padding:0}.values-cols>div+div{border-left:0;border-top:1px solid rgba(255,255,255,.16);padding-top:26px}}

/* Nav dropdown fixes: it must sit above page content, the hover bridge must
   cover the full 8px gap, and the panel must not run off the right edge. */
.nav{position:sticky;top:0;z-index:80}
.nav-dropwrap::after{height:16px}
.nav-dropwrap:last-of-type .nav-drop,.nav-links>.nav-dropwrap:nth-last-child(-n+2) .nav-drop{left:auto;right:-16px}

/* Dropdown reads as a floating panel, not a card dropped on the copy:
   more air inside, a softer edge and a deeper, wider shadow. */
.nav-drop{padding:18px;border-radius:18px;box-shadow:0 24px 60px rgba(0,26,85,.16),0 4px 12px rgba(0,26,85,.06);border-color:#EDF0F6}
.nav-drop-group{padding:6px}
.nav-drop-item{padding:14px 18px;border-radius:11px}
.nav-drop-children{margin-top:3px}
.nav-drop-children .nav-drop-item{padding:11px 16px;border-radius:9px}
.nav-drop-parent{padding:13px 18px;border-radius:11px}

/* Closer folded into the values band: one colour change into the footer. */
.values-band{padding-bottom:56px}
.hww-closer--dark{margin-top:44px;padding-top:40px;border-top:1px solid rgba(255,255,255,.2)}
.hww-closer--dark .hww-closer-t{color:#fff;font-weight:300}
.hww-closer--dark .hww-closer-t em{color:rgba(255,255,255,.7)}
.hww-closer--dark .btn--primary{background:#fff;color:var(--ia-dark-blue);border-color:transparent}
.hww-closer--dark .btn--primary:hover{background:#EDF1F8}

/* Toolbox — affiliate disclosure (brief §6) */
.affil-line{margin:0 0 22px;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.affil-line button{display:flex;align-items:center;gap:12px;width:100%;padding:11px 2px;background:none;border:0;cursor:pointer;font-family:inherit;text-align:left}
.affil-k{font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--ia-blue);flex:none}
.affil-s{font-size:14px;color:#5C6172;flex:1}
.affil-line.is-open{padding-bottom:14px}
.affil-line p{margin:0 0 0 2px;font-size:14px;line-height:1.68;color:#5C6172;max-width:88ch;text-wrap:pretty}

/* FAQs — numbered accordion, one question per anchor */
.qa-list{border-top:1px solid var(--hairline)}
.qa-item{border-bottom:1px solid var(--hairline)}
.qa-q{display:grid;grid-template-columns:52px 1fr 22px;gap:18px;align-items:center;width:100%;text-align:left;background:none;border:0;padding:22px 4px;cursor:pointer;font-family:inherit}
.qa-q:hover{background:var(--paper)}
.qa-n{font-size:12px;font-weight:600;letter-spacing:.14em;color:#9BA0AE}
.qa-t{font-size:20px;font-weight:500;letter-spacing:-.02em;color:var(--ia-dark-blue);line-height:1.32;text-wrap:pretty}
.qa-item.is-open .qa-t{color:var(--ia-blue)}
.qa-a{padding:0 40px 26px 74px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.qa-a p{margin:0;font-size:16px;line-height:1.75;color:#3E4354;max-width:78ch;text-wrap:pretty}
.qa-note{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin:28px 0 0;font-size:14px;color:#5C6172}
@media (max-width:760px){.qa-q{grid-template-columns:36px 1fr 20px;gap:12px}.qa-a{padding-left:48px;padding-right:0}}

/* How we work — values in reference register (light ruled rows).
   Navy stays reserved for the two service pages. */
/* (0,2,1)+ so it beats the inline html[data-density] .section rule, which
   otherwise wins on source order. */
html[data-bp2="on"] .section.values-sec{padding-top:32px}
.values-sec .values-band-h{margin:0 0 22px;font-family:var(--font-body);font-size:clamp(23px,2.5vw,28px);font-weight:600;letter-spacing:-.028em;color:var(--ia-dark-blue);line-height:1.18}
/* Heading held in the left margin: the beliefs above run full width with the
   heading on top, so the structure change reads before the words do. */
.values-lay{display:grid;grid-template-columns:280px 1fr;gap:64px;align-items:start}
.values-lay-head .values-band-h{margin:0;font-size:clamp(28px,3.2vw,38px);font-weight:700;letter-spacing:-.04em;line-height:1.06;color:var(--ia-dark-blue)}
.values-rows{display:flex;flex-direction:column;gap:22px}
.values-row{display:grid;grid-template-columns:14px 1fr;gap:16px;align-items:start}
.values-dot{width:10px;height:10px;border-radius:50%;background:var(--vt);margin-top:7px}
.values-row b{display:block;font-size:18px;font-weight:600;color:var(--ia-dark-blue);letter-spacing:-.018em;margin-bottom:6px}
.values-row p{margin:0;font-size:14px;line-height:1.7;color:#5C6172;max-width:64ch;text-wrap:pretty}
.values-sec .values-band-flags{margin-top:24px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.values-sec .hww-closer{margin-top:34px}
/* The closer follows the light values rows, so it takes the heavier weight. */
.values-sec .hww-closer-t{font-weight:600;color:var(--ia-dark-blue)}
.values-sec .hww-closer-t em{font-weight:400}
@media (max-width:860px){.values-lay{grid-template-columns:minmax(0,1fr);gap:26px}}

/* (0,2,1)+ to beat the inline html[data-density] .section rule. */
html[data-bp2="on"] .section.believe-sec{padding-top:32px}

/* Home — the philosophy quote gets the section to itself. */
.home-philosophy--solo{display:block}
.home-philosophy--solo .philosophy-quote{max-width:30ch}
/* Recognition moves down beside the proof. */
.recognition--row{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:26px;padding-top:22px;border-top:1px solid var(--hairline)}
.recognition--row .badge-row{margin-top:0}
/* Two testimonials: the 3-column, feature-spans-2-rows track was sized for
   1 feature + 3 shorts. With one short card, drop to two columns and stop the
   feature spanning. */
@media (min-width:981px){
.testimonial-grid:has(.testimonial:nth-child(2):last-child){grid-template-columns:1.4fr 1fr}
.testimonial-grid:has(.testimonial:nth-child(2):last-child) .testimonial--feature{grid-row:auto}
}

/* Home — thesis held in the left margin, doors stacked equal-width beside it.
   Frames the pair rather than reading as door one's pitch, and equal widths
   cancel the 34-vs-20-word asymmetry between the two doors. */
/* Home — the thesis is the section's own statement, so it frames both doors
   instead of sitting under a heading that promises the router. The doors keep
   the full-width side-by-side split. */
.thesis-head{margin-bottom:96px;padding:0 0 6px;text-align:center}
.thesis-head .eyebrow{justify-content:center}
.thesis-head .eyebrow:before{display:none}
.thesis-statement{margin:20px auto 22px;font-size:clamp(21px,2.4vw,30px);line-height:1.4;font-weight:300;letter-spacing:-.024em;color:var(--ia-dark-blue);max-width:34ch;text-wrap:pretty}
/* The thesis holds until it is scrolled to, then rises in. */
.thesis-head .thesis-statement,.thesis-head .thesis-sub{opacity:0;transform:translateY(20px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.thesis-head.thesis-in .thesis-statement,.thesis-head.thesis-in .thesis-sub{opacity:1;transform:none}
.thesis-head.thesis-in .thesis-sub{transition-delay:.14s}
@media (prefers-reduced-motion:reduce){.thesis-head .thesis-statement,.thesis-head .thesis-sub{opacity:1;transform:none;transition:none}}
.thesis-statement em{font-style:italic;font-weight:400;color:var(--ia-blue)}

/* Service Finder, reference register: a bordered panel, no dark ground. */
.finder{background:#fff;border:1px solid var(--hairline);border-radius:18px;padding:38px 40px;max-width:820px}
.finder-head{padding-bottom:22px;border-bottom:1px solid var(--hairline)}
.finder-lede{margin:10px 0 0;font-size:18px;line-height:1.6;color:#5C6172}
.finder-steps{display:flex;align-items:center;gap:8px;margin-top:18px}
.finder-pip{width:26px;height:3px;border-radius:2px;background:var(--hairline);transition:background .2s var(--ease-standard)}
.finder-pip.is-on{background:var(--ia-blue)}
.finder-reset{margin-left:auto;background:none;border:0;padding:0;cursor:pointer;font-family:inherit;font-size:12px;color:#8A8F9E}
.finder-reset:hover{color:var(--ia-blue)}
.finder-q{padding-top:24px}
.finder-qt{margin:0 0 18px;font-size:clamp(20px,2.1vw,24px);line-height:1.35;font-weight:600;letter-spacing:-.024em;color:var(--ia-dark-blue)}
.finder-opts{display:flex;flex-direction:column;gap:8px}
.finder-opt{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;text-align:left;background:var(--paper);border:1px solid var(--hairline);border-radius:11px;padding:15px 18px;cursor:pointer;font-family:inherit;font-size:16px;color:var(--ink);transition:border-color .18s var(--ease-standard),background .18s var(--ease-standard)}
.finder-opt:hover{border-color:var(--ia-blue);background:#fff;color:var(--ia-blue)}
.finder-opt .arrow{opacity:0;transition:opacity .18s var(--ease-standard),transform .18s var(--ease-standard)}
.finder-opt:hover .arrow{opacity:1;transform:translateX(3px)}
.finder-res{padding-top:26px}
.finder-res-k{font-size:12px;font-weight:600;letter-spacing:.01em;color:#9BA0AE}
.finder-res-n{margin:8px 0 0;font-size:clamp(26px,2.8vw,32px);font-weight:600;letter-spacing:-.03em;line-height:1.1}
.finder-res-b{margin:12px 0 0;font-size:16px;line-height:1.68;color:#3E4354;max-width:62ch;text-wrap:pretty}
.finder-res-cta{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:22px}
.finder-res-note{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--hairline);font-size:14px;line-height:1.65;color:#8A8F9E;max-width:62ch}
@media (max-width:640px){.finder{padding:28px 24px}}

.thesis-head .linkout{display:inline-flex}

/* Home — the two doors run full bleed. Colour to the page edges, copy still
   on the page grid so it aligns with the thesis above. */
.door-split--bleed{border-radius:0;margin-top:40px;grid-template-columns:1fr 1fr}
.door-split--bleed .door-half{min-height:400px;padding:56px 0;align-items:stretch}
.door-split--bleed .door-half>*{width:100%;max-width:592px}
.door-split--bleed .door-half--e>*{margin-left:auto;padding-right:56px;padding-left:28px}
.door-split--bleed .door-half--b>*{margin-right:auto;padding-left:56px;padding-right:28px}
.door-split--bleed .door-h3{font-size:clamp(30px,3.1vw,38px)}
@media (max-width:860px){
  .door-split--bleed{grid-template-columns:1fr}
  .door-split--bleed .door-half{min-height:0;padding:40px 0}
  .door-split--bleed .door-half--e>*,.door-split--bleed .door-half--b>*{margin:0;padding:0 24px;max-width:none}
}

/* Door colour options (Tweaks → Home doors). The modifier only sets the two
   surface colours; every door style reads --d1/--d2. */
.door-split{--d1:var(--pl-enable-fg);--d1-ink:var(--pl-enable-fg);--d1-fill:var(--d1);--d2:var(--ia-dark-blue);--d2-ink:var(--ia-dark-blue);--d2-fill:var(--d2)}
.door-split--dc-navypair{--d1:var(--ia-blue);--d1-ink:var(--ia-blue);--d2:var(--ia-dark-blue)}
.door-split--dc-tealblue{--d1:var(--pl-enable-accent);--d1-ink:var(--pl-enable-fg);--d2:var(--ia-blue);--d2-ink:var(--ia-blue)}
.door-split--dc-onenavy{--d1:#0A2A72;--d2:var(--ia-dark-blue)}
.door-split--dc-lightdark{--d1:var(--pl-enable-accent);--d1-ink:var(--pl-enable-fg);--d1-fill:var(--pl-enable-bg);--d2:var(--ia-dark-blue)}
.door-half--e{background:var(--d1-fill,var(--d1))}
.door-half--b{background:var(--d2-fill,var(--d2))}
.door-split--dc-lightdark .door-half--e .door-h3,.door-split--dc-lightdark .door-half--e .door-route,.door-split--dc-lightdark .door-half--e .door-num{color:var(--ink)}
.door-split--dc-lightdark .door-half--e .door-p{color:#3C4457}
.door-split--dc-lightdark .door-half--e .door-go{color:var(--pl-enable-fg)}

/* Door styles that aren't the full-bleed two-tone band. All keep the pale +
   navy pairing; they differ in structure. */
.door-split--soft{max-width:1240px;margin:40px auto 0;padding:0 28px;gap:24px;border-radius:0;background:none;overflow:visible}
.door-split--soft .door-half{border-radius:18px;padding:40px 36px;min-height:0;overflow:hidden}
.door-split--cards .door-half--e{background:var(--d1-fill,var(--d1));border:1px solid color-mix(in oklch,var(--d1) 18%,#fff);box-shadow:0 1px 2px rgba(0,26,85,.05)}
.door-split--cards .door-half--b{background:color-mix(in oklch,var(--d2) 10%,#fff);border:1px solid color-mix(in oklch,var(--d2) 18%,#fff);box-shadow:0 1px 2px rgba(0,26,85,.05)}
.door-split--soft.door-split--cards .door-half--b .door-h3,.door-split--soft.door-split--cards .door-half--b .door-route{color:var(--ink)}
.door-split--soft.door-split--cards .door-half--b .door-p{color:#454B5E}
.door-split--soft.door-split--cards .door-half--b .door-go{color:var(--d2-ink,var(--d2))}
.door-split--soft.door-split--cards .door-half--b .door-rule{background:rgba(11,16,36,.12)}
.door-split--cards .door-half:hover{filter:none;box-shadow:0 18px 40px rgba(0,26,85,.10)}
/* Type follows the surface: ink on the pale half, white on the navy half. */
.door-split--soft .door-half--e .door-h3,.door-split--soft .door-half--e .door-route{color:var(--ink)}
.door-split--soft .door-half--e .door-p{color:#454B5E}
.door-split--soft .door-p{max-width:40ch}
.door-split--soft .door-half--b .door-p{color:rgba(255,255,255,.82)}
.door-split--soft .door-half--e .door-go{color:var(--d1-ink,var(--d1))}
.door-split--soft .door-half--b .door-go{color:var(--ia-light-blue)}
.door-split--soft .door-half--e .door-rule{background:rgba(11,16,36,.12)}
.door-split--soft .door-half--b::before{display:none}
@media (max-width:860px){.door-split--soft{grid-template-columns:1fr;padding:0 24px}}

/* The copy wrapper is transparent to layout except in the question styles,
   where it becomes the white panel under the question. */
.door-body{display:contents}

/* I1 — question above the name, hairline rule, no container. */
.door-split--qruled{max-width:1240px;margin:40px auto 0;padding:0 28px;gap:64px;grid-template-columns:1fr 1fr;background:none;border-radius:0;overflow:visible}
.door-split--qruled .door-half{display:flex;flex-direction:column;align-items:flex-start;grid-row:auto;grid-template-rows:none;background:none;border:0;border-top:2px solid;border-radius:0;padding:22px 0 0;min-height:0;overflow:visible}
.door-split--qruled .door-half--e{border-color:var(--pl-enable-accent)}
.door-split--qruled .door-half--b{border-color:var(--ia-dark-blue)}
.door-split--qruled .door-half:hover{filter:none}
.door-split--qruled .door-half:hover .door-go{text-decoration:underline;text-underline-offset:3px}

/* I3 — question in a tinted head, the answer on white beneath. */
.door-split--qcard{max-width:1440px;margin:40px auto 0;padding:0 28px;gap:24px;grid-template-columns:1fr 1fr;background:none;border-radius:0;overflow:visible}
.door-split--qcard .door-half{display:flex;flex-direction:column;align-items:stretch;grid-row:auto;grid-template-rows:none;background:#fff;border:1px solid var(--hairline);border-radius:18px;padding:0;min-height:0;overflow:hidden}
.door-split--qcard .door-half:hover{filter:none;box-shadow:0 18px 40px rgba(0,26,85,.10)}
.door-split--qcard .door-q{padding:26px 30px}
.door-split--qcard .door-half--e .door-q{background:var(--pl-enable-bg)}
.door-split--qcard .door-half--b .door-q{background:var(--pl-strategy-bg)}
.door-split--qcard .door-body{display:flex;flex-direction:column;align-items:flex-start;padding:26px 30px 32px}

/* I2 — full-width rows: the question held left, the answer set beside it. */
.door-split--qrows{max-width:1240px;margin:40px auto 0;padding:0 28px;gap:0;grid-template-columns:1fr;background:none;border-radius:0;overflow:visible}
.door-split--qrows .door-half{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);column-gap:56px;align-items:start;grid-row:auto;background:none;border:0;border-top:1px solid var(--hairline);border-radius:0;padding:32px 0;min-height:0;overflow:visible}
.door-split--qrows .door-half--b{border-bottom:1px solid var(--hairline)}
.door-split--qrows .door-half:hover{filter:none}
.door-split--qrows .door-half:hover .door-go{text-decoration:underline;text-underline-offset:3px}
.door-split--qrows .door-q{grid-column:1;font-size:clamp(21px,2vw,26px);max-width:20ch;margin:0}
.door-split--qrows .door-body{grid-column:2;display:flex;flex-direction:column;align-items:flex-start}
.door-split--qrows .door-p{max-width:60ch}

/* Shared by the question styles */
.door-split--q .door-q{display:block;margin:0;font-size:clamp(19px,1.7vw,23px);line-height:1.4;font-style:italic;font-weight:500;letter-spacing:-.02em;text-wrap:pretty}
.door-split--qruled .door-q,.door-split--qrows .door-q{max-width:26ch}
.door-split--qcard .door-q>*{max-width:26ch}
.door-split--qruled .door-q{margin-bottom:18px}
.door-split--q .door-half--e .door-q{color:var(--pl-enable-fg)}
.door-split--q .door-half--b .door-q{color:var(--ia-dark-blue)}
.door-split--q .door-h3{color:var(--ink);font-size:clamp(22px,2.1vw,26px);margin-top:0}
.door-split--q .door-half--e .door-p,.door-split--q .door-half--b .door-p{color:#454B5E;margin-top:12px;max-width:54ch}
.door-split--q .door-half--e .door-h3,.door-split--q .door-half--b .door-h3{color:var(--ink)}
.door-split--q .door-half--e .door-go{color:var(--pl-enable-fg)}
.door-split--q .door-half--b .door-go{color:var(--ia-dark-blue)}
.door-split--q .door-half--b::before{display:none}
@media (max-width:860px){.door-split--qruled,.door-split--qcard{grid-template-columns:1fr;padding:0 24px;gap:32px}.door-split--qrows .door-half{grid-template-columns:1fr;row-gap:14px}.door-split--qrows .door-q,.door-split--qrows .door-body{grid-column:1}}

/* Doors run to the section edge: no paper strip between them and the white
   philosophy section below. */
html[data-bp2="on"] .section--paper:has(.door-split--bleed){padding-bottom:0}

/* (0,2,1)+ to beat the inline html[data-density] .section rule. */
html[data-bp2="on"] .section.fnd-faq{padding-top:32px}

html[data-bp2="on"] .section.fnd-offramp{padding-bottom:32px}



/* Hero journey, reference-image treatment: one solid climbing curve over a
   layered field. The dash animation no longer applies to a solid stroke. */
/* Dashed travelling line, as in the reference. */

/* The arc field intentionally extends past the artwork box; clip it there
   rather than letting the hero section crop it. */
html[data-bp2="on"] .hero-journey svg{overflow:visible}

/* The hairline above "delivered across" runs on to meet the journey line:
   one continuous rule from the copy column into the artwork. */
/* Anchor the artwork so its curve entry lands on that rule. */


/* The line and the rule share one baseline: both columns bottom-align, and the
   flat run sits one "delivered across" height above that shared edge. */

/* Blog cards — titles link out to the live posts */
.article-body{align-items:flex-start}
.article-title a{color:inherit;text-decoration:none}
.article-title a:hover{color:var(--ia-blue)}
.article-card .article-meta{border-top:0;padding-top:4px;margin-top:auto}
.article-card .article-body{flex:1 1 auto}

/* Article reader */
.post-meta{display:flex;align-items:center;gap:12px;margin-top:20px;font-size:14px;color:#5C6172}
.post-meta-dot{width:3px;height:3px;border-radius:999px;background:#C7CCD8}
.post-body{max-width:720px;font-size:18px;line-height:1.7;color:#2C3140}
.post-body p{margin:0 0 20px}
.post-h{font-size:24px;font-weight:600;letter-spacing:-0.01em;color:var(--ink);margin:36px 0 14px;line-height:1.25}
.post-body>.post-h:first-child{margin-top:0}
.post-list{margin:0 0 22px;padding-left:22px;display:flex;flex-direction:column;gap:10px}
.post-list li{padding-left:4px}
.post-note{background:var(--paper);border:1px solid var(--hairline);border-radius:14px;padding:20px 22px;margin:8px 0 24px;font-size:16px;line-height:1.6}
.post-table-wrap{overflow-x:auto;margin:0 0 26px}
.post-table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.5}
.post-table th{text-align:left;font-weight:600;color:var(--ink);padding:12px 14px;border-bottom:1px solid var(--ink);vertical-align:bottom}
.post-table td{padding:12px 14px;border-bottom:1px solid var(--hairline);vertical-align:top;color:#3A3F50}
.article-card--link{cursor:pointer}
.article-card--link:hover{border-color:#C7CCD8}
.article-card--link:hover .article-title{color:var(--ia-blue)}

.post-cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.card .post-cover-img{position:absolute}
.post-hero-img{max-width:720px;margin:0 0 40px;border-radius:16px;overflow:hidden;border:1px solid var(--hairline);background:var(--paper)}
.post-hero-img img{width:100%;height:auto;display:block}

/* Australian AI Awards 2024 finalist seals */
.badge-row{display:flex;gap:34px;flex-wrap:wrap;align-items:center}
.badge-item{display:flex;align-items:center;gap:13px}
.badge-item img{height:76px;width:auto;display:block;flex:none}
.badge-cap{display:flex;flex-direction:column;gap:1px;font-size:14px;line-height:1.3;color:var(--ink);max-width:19ch}
.badge-cap b{font-weight:600;font-size:12px;letter-spacing:.01em;color:var(--ia-blue);margin-bottom:3px}
.badge-cap-awards{font-size:12px;color:#7A7F8E;margin-top:3px}
.recognition-band .badge-row{gap:40px}
.recognition-band .badge-item img{height:96px}
.recognition-band .badge-cap{color:#fff;font-size:16px}
.recognition-band .badge-cap b{color:var(--ia-light-blue)}
.recognition-band .badge-cap-awards{color:rgba(255,255,255,.6)}
.footer-badges{display:flex;gap:28px;align-items:center;margin-top:24px;flex-wrap:wrap}
.footer-badges .badge-item img{height:70px}
.footer-badges .badge-cap{color:rgba(255,255,255,.9);font-size:14px}
.footer-badges .badge-cap b{color:var(--ia-light-blue)}
.footer-badges .badge-cap-awards{color:rgba(255,255,255,.5);font-size:12px}

/* Home "What we are" \u2014 alternative treatments (Tweaks panel) */
.wwa-dark{background:var(--ia-dark-blue);padding:112px 0;position:relative;overflow:hidden}
.wwa-dark .eyebrow{color:var(--ia-light-blue)}
.wwa-dark .eyebrow::before{background:var(--ia-light-blue)}
.wwa-dark-q{margin:22px 0 0;font-size:clamp(26px,3vw,40px);line-height:1.34;font-weight:300;letter-spacing:-.025em;color:#fff;max-width:26ch;text-wrap:pretty}
.wwa-dark-q em{font-style:normal;font-weight:500;color:var(--ia-light-blue)}
.wwa-cols{display:grid;grid-template-columns:200px 1fr;gap:56px;align-items:start;padding-top:20px;border-top:1px solid var(--ink)}
.wwa-cols-label{font-size:12px;font-weight:600;letter-spacing:.01em;color:#7A7F8E;padding-top:8px}
.wwa-cols-q{margin:0;font-size:clamp(24px,2.6vw,34px);line-height:1.4;font-weight:300;letter-spacing:-.02em;color:var(--ink);max-width:30ch;text-wrap:pretty}
.wwa-cols-q em{font-style:normal;font-weight:500;color:var(--ia-blue)}
@media(max-width:820px){.wwa-cols{grid-template-columns:1fr;gap:20px}}
.wwa-flip{max-width:900px}
.wwa-flip-rule{width:56px;height:2px;background:var(--ia-light-blue);margin:0 0 26px}
.wwa-flip-neg{margin:0;font-size:18px;line-height:1.5;color:#8A8F9E;font-weight:400}
.wwa-flip-pos{margin:14px 0 0;font-size:clamp(28px,3.2vw,44px);line-height:1.28;font-weight:300;letter-spacing:-.026em;color:var(--ink);text-wrap:pretty}
.wwa-flip-pos em{font-style:normal;font-weight:500;color:var(--ia-blue)}


/* Footer lockup: tagline set to the logo's natural width, colour-matched. */
.footer-lockup{display:inline-block}
.footer-lockup img{display:block;height:34px;width:auto}
.footer-lockup .footer-tag{display:block;width:100%;margin:9px 0 0;font-size:12px;line-height:1.2;color:var(--ia-light-blue);white-space:nowrap;text-align:justify;text-align-last:justify;opacity:.9}
.footer-social{display:flex;flex-wrap:wrap;gap:14px;margin-top:18px}
.footer-social a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.16);border-radius:50%;color:rgba(255,255,255,.7);text-decoration:none;transition:color var(--dur-fast),border-color var(--dur-fast)}
.footer-social svg{flex:none;opacity:.85}
.footer-social a:hover{color:var(--ia-light-blue);border-color:rgba(75,228,248,.5)}

.footer-top .footer-h5{font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--ia-light-blue);margin:0 0 16px;padding:0;display:block}


/* Recognition band: badge column flush to the container edge so its left and
   right edges line up with the sections above and below. */
.recognition-band .badge-row{display:grid;grid-template-columns:1fr;gap:26px;width:100%;max-width:340px;margin-left:auto;flex-wrap:nowrap}
.recognition-band .badge-item{align-items:center}
.recognition-band .badge-cap{flex:1;max-width:none}

.recognition-band{padding-bottom:64px}
.recognition-band .hww-closer--dark{margin-top:56px}

/* Home carries the recognition band on paper, so the navy is saved for the footer. */
.recognition-band--light{background:var(--paper)}
.recognition-band--light .eyebrow{color:var(--ia-blue)}
.recognition-band--light .eyebrow:before{background:var(--ia-blue)}
.recognition-band--light .recognition-statement{color:var(--ia-dark-blue)}
.recognition-band--light .recognition-statement em{color:var(--ia-blue)}
.recognition-band--light .badge-cap{color:var(--ink)}
.recognition-band--light .badge-cap b{color:var(--ia-blue)}
.recognition-band--light .badge-cap-awards{color:#7A7F8E}
.recognition-band--light .hww-closer--dark{border-top-color:var(--hairline)}
.recognition-band--light .hww-closer--dark .hww-closer-t{color:var(--ia-dark-blue)}
.recognition-band--light .hww-closer--dark .hww-closer-t em{color:var(--ia-blue)}
.recognition-band--light .hww-closer--dark .btn--primary{background:var(--ia-blue);color:#fff}
.recognition-band--light .hww-closer--dark .btn--primary:hover{background:var(--ia-dark-blue)}

.recognition-band--light .recognition-statement{font-size:clamp(21px,2.1vw,28px);max-width:28ch}

/* On the light band the closer follows a light-weight statement, so it takes
   the heavier weight to read as an action rather than a second statement. */
.recognition-band--light .hww-closer-t{font-weight:600;color:var(--ia-dark-blue)}
.recognition-band--light .hww-closer-t em{font-weight:400}

.recognition-band--light .hww-closer{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:22px;margin-top:64px;padding-top:52px}
.recognition-band--light .hww-closer-t{max-width:32ch}

/* Home recognition demoted to a credential row: the closer owns the band. */
.recognition-band--light{padding-top:48px}
.recognition-slim{display:flex;align-items:center;justify-content:center;gap:24px}
.recognition-slim img{height:84px}
.recognition-slim p{margin:0 0 0 10px;font-size:14px;line-height:1.5;color:#5C6172;max-width:52ch}
.recognition-slim p b{font-weight:600;color:var(--ia-dark-blue)}
@media (max-width:700px){.recognition-slim{flex-wrap:wrap;text-align:center;justify-content:center}.recognition-slim p{margin-left:0}}
.recognition-band--light .hww-closer{margin-top:48px}
.recognition-band--light .hww-closer .btn{justify-self:center}

/* About asides — layout X: centred speaking statement + slim tools strip */
.speaking-centre{text-align:center;display:flex;flex-direction:column;align-items:center}
.speaking-centre .speaking-lead{margin:16px auto 0;max-width:54ch}
.speaking-centre button{margin-top:24px}
/* Uniform height, natural widths: the shots are a mix of portrait and
   landscape, and forcing a shared aspect ratio would crop the portrait badly. */
.speaking-shots{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin:44px auto 0}
.speaking-shot{height:340px;border-radius:14px;overflow:hidden;background:#F2F2EE;border:1px solid var(--hairline)}
.speaking-shot .site-img{width:auto;height:100%}
/* 800, not 760: below ~775 the two-shot row wraps to a ragged second line,
   so stack a little earlier and skip that band entirely. */
@media (max-width:800px){
  .speaking-shots{max-width:420px}
  .speaking-shot{height:auto;width:100%}
  .speaking-shot .site-img{width:100%;height:auto}
}
.builtwith-strip{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);background:var(--paper);padding:30px 0;position:relative}
.builtwith-strip::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ia-light-blue)}
.builtwith-strip-in{display:flex;justify-content:space-between;align-items:center;gap:32px}
.builtwith-strip p{margin:0;font-size:16px;line-height:1.6;color:#5C6172;max-width:74ch;text-wrap:pretty}
.builtwith-strip p b{display:block;margin-bottom:5px;font-size:20px;font-weight:600;letter-spacing:-.02em;color:var(--ia-dark-blue)}
@media (max-width:760px){.builtwith-strip-in{flex-direction:column;align-items:flex-start;gap:10px}}

/* Hero exhibit: ruled stages, one ascending line. */
.hero-journey .hj-grid line{stroke:rgba(255,255,255,.13);stroke-width:1}
.hero-journey .hj-nodes circle{fill:#fff}
.hero-journey .hj-path{stroke-width:2.75}
.hj-label--axis{left:0;font-size:12px;font-weight:600;letter-spacing:.01em;color:rgba(255,255,255,.5);transform:translate(0,calc(-100% - 9px));animation-name:hj-fade-axis}
.hj-label--axis.hj-label--end{color:var(--ia-light-blue);font-weight:600}
@keyframes hj-fade-axis{from{opacity:0;transform:translate(-10px,calc(-100% - 9px))}to{opacity:1;transform:translate(0,calc(-100% - 9px))}}

/* Hero: quiet geometry. Squares, hairline, generous space. */
.hero-journey .hj-nodes rect,.hero-journey .hj-dot--start{fill:#fff}
.hero-journey .hj-dot--acc{fill:var(--ia-light-blue)}
.hj-label--pt{left:auto;font-size:12px;font-weight:600;letter-spacing:.01em;color:rgba(255,255,255,.52);transform:none;animation-name:hj-fade-pt}
.hj-label--pt.hj-label--end{color:var(--ia-light-blue)}
@keyframes hj-fade-pt{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Hero: quadrant arc with ticked waypoints (option B5). */
.hero-journey svg text{font-family:var(--font-body)}
.hero-journey .hj-ticks path{opacity:0;animation:hj-fade-simple .5s ease forwards}
.hero-journey .hj-svg-labels text{opacity:0;animation:hj-fade-simple .6s ease forwards}
@keyframes hj-fade-simple{to{opacity:1}}
@media (prefers-reduced-motion:reduce){.hero-journey .hj-ticks path,.hero-journey .hj-svg-labels text{animation:none;opacity:1}}

.hero-journey .hj-path-ahead{opacity:0;animation:hj-fade-simple .8s ease 2.1s forwards}
@media (prefers-reduced-motion:reduce){.hero-journey .hj-path-ahead{animation:none;opacity:1}}

/* Contact hero: one column, the lede sitting under the headline so the band
   holds a complete thought instead of two words. */
.contact-hero-stack{position:relative;z-index:1}
.contact-hero-lede{margin:20px 0 0;font-size:18px;line-height:1.6;color:rgba(255,255,255,.72);max-width:48ch}

/* Nav links are real anchors so they can be opened in a new tab and crawled. */
.nav-link{text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.nav-dropwrap.is-open .nav-drop{opacity:1;pointer-events:auto;transform:translateY(0)}
.nav-dropwrap.is-open .chev{transform:rotate(180deg)}
.nav-link .chev{transition:transform var(--dur-fast)}

/* CTA review note — part of the Decisions layer, hidden with it. */
.cta-note{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;margin:18px auto 0;max-width:640px;padding:9px 14px;border-radius:12px;background:#EAF0FF;text-align:left;font-size:12px;line-height:1.5}
.cta-note-tag{font-weight:600;color:#2B4ACB;white-space:nowrap}
.cta-note-body{color:#3E4658;flex:1;min-width:220px}
html[data-decisions="off"] .cta-note{display:none}

/* Header height is fixed by .nav-inner; density padding must not inflate it. */
.nav .nav-inner{padding-block:0;height:68px}

/* Client Portal was 6px taller than the primary CTA beside it: it carries a
   1px border and a full line box where the button does not. Match heights. */
.nav-cta .nav-playground{padding-block:0;height:32.5px;line-height:1}
.nav-cta .nav-playground svg{flex:none}
@media (max-width:1000px){.nav-playground{font-size:12px;padding-inline:10px;gap:5px}}

/* --- Small-fix pass (Aug 2026) --- */
/* Doors declare their click: the routing line states who it is for, the go line
   states what happens. */
.door-go{margin-top:14px;display:inline-flex;align-items:center;gap:9px;font-size:16px;font-weight:500;color:#fff}
.door-half--b .door-go{color:var(--ia-light-blue)}
.door-go .arrow{transition:transform .2s var(--ease-standard)}
.door-half:hover .door-go .arrow{transform:translateX(5px)}
.door-route{justify-content:flex-start}

/* Build stories: the client's problem leads, as it does on Foundations. */
.build-cell-prob{font-size:18px!important;line-height:1.42!important;font-weight:400;letter-spacing:-.018em;color:var(--ia-dark-blue)!important;flex:0 0 auto!important;text-wrap:pretty}
.build-cell-lbl{margin:18px 0 8px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--bt)}
.build-cell-name{margin-top:16px;font-size:14px!important;font-weight:500;color:#5C6172!important}

/* Pending outcome lines belong to the review layer, not the public page. */
html[data-decisions="off"] .zg-res,html[data-decisions="off"] .build-cell-o{display:none}

/* Nav brand: the spelled-out lockup while there is room, the IA mark alone once the
   links start crowding it (above the burger breakpoint, so the full menu survives). */
.nav-mark{display:none;height:clamp(24px,2.2vw,30px);width:auto}
@media (max-width:1180px){.nav-logo{display:none}.nav-mark{display:block}}

/* Doors: both halves share one row track set, so the rule, the routing line and the
   go line align across the split no matter how the paragraphs wrap. */
/* Both halves share one row track set, so the italic routing line and the go line
   start at the same height whatever length the paragraph above them runs to. */
@media (min-width:861px){
  .door-split{grid-template-rows:auto auto auto auto 1fr}
  .door-half{display:grid;grid-row:1 / -1;grid-template-rows:subgrid}
  .door-route,.door-go{align-self:start}
}
/* Equal-height halves in both the split and the stacked layout, and a guaranteed
   gap between the paragraph and the italic routing line. */
.door-split,.door-split--bleed{align-items:stretch;grid-auto-rows:1fr}
.door-split .door-p+.door-route,.door-split--bleed .door-p+.door-route{margin-top:26px}
.door-split .door-route+.door-go,.door-split--bleed .door-route+.door-go{margin-top:26px}
@media (max-width:860px){
  .door-split--bleed .door-half,.door-split .door-half{min-height:340px}
}

/* Built-with strip: three treatments, chosen in the Tweaks panel. The band is the
   default; navy makes the strongest break in the page; card lifts it off as an aside. */
.builtwith-card{display:contents}
.builtwith-strip--navy{background:var(--ia-dark-blue);border-color:transparent;padding:34px 0}
.builtwith-strip--navy::before{display:none}
.builtwith-strip--navy p{color:rgba(255,255,255,.72)}
.builtwith-strip--navy p b{color:#fff;font-size:21px}
.builtwith-strip--navy .linkout{color:var(--ia-light-blue)}
.builtwith-strip--navy .linkout:hover{color:#fff}
.builtwith-strip--card{background:var(--paper);border-top:0;border-bottom:0;padding:40px 0}
.builtwith-strip--card::before{display:none}
.builtwith-strip--card .builtwith-strip-in{display:block}
.builtwith-strip--card .builtwith-card{display:flex;justify-content:space-between;align-items:center;gap:36px;background:#fff;border:1px solid var(--hairline);border-radius:14px;padding:30px 34px;box-shadow:0 1px 2px rgba(18,23,43,.04),0 8px 24px -12px rgba(18,23,43,.1)}
@media (max-width:760px){.builtwith-strip--card .builtwith-card{flex-direction:column;align-items:flex-start;gap:14px}}

/* Home closer when the awards have moved up beside the statement: it is the
   only thing in the band, so it needs no rule separating it from nothing. */
.hww-closer--norule{border-top:none;padding-top:0;margin-top:0}
.recognition-band--light:has(.hww-closer--norule){padding-top:44px}

/* ---------- Front-page scale ----------
   Every size on the home page is a hardcoded px value or an already-capped
   clamp(), so raising the root font-size moves nothing (verified). `zoom`
   scales type, spacing and artwork together, which is what browser zoom does
   and the look this page reads best at. Tune the one number below.

   The hero is the exception: its height is viewport-relative, and real browser
   zoom shrinks svh/vw while element zoom does not. Left alone the hero would
   grow from ~79% to ~87% of the screen and push the two doors under the fold,
   so the height is divided back out by the same factor. */
.home-page {
  --home-scale: 1.1;
  zoom: var(--home-scale);
}
.home-page .hero--v4.is-short {
  min-height: max(509px, min(78svh, 56vw)); /* = the original / 1.1 */
}
/* Phones are already at a comfortable size and have no width to spare. */
@media (max-width: 700px) {
  .home-page { --home-scale: 1; }
  .home-page .hero--v4.is-short { min-height: max(560px, min(86svh, 62vw)); }
}

/* ---------- Site imagery from Supabase Storage ----------
   SiteImage renders an <img> when the file exists and a captioned placeholder
   when it does not, so an un-uploaded slot reads as deliberate rather than
   broken. Both fill their container, which is what every call site expects. */
.site-img {
  display: block; width: 100%; height: 100%;
  background: var(--bg-subtle);
}
.site-img[data-rounded="1"] { border-radius: 50%; }
.img-ph {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; width: 100%; height: 100%; min-height: 120px;
  padding: 16px; box-sizing: border-box; text-align: center;
  background: #ECECE5;
  border: 1px dashed rgba(11, 16, 36, .18);
  color: var(--fg-subtle);
}
.img-ph[data-rounded="1"] { border-radius: 50%; }
.img-ph-cap {
  font-size: var(--fs-12); line-height: 1.35; max-width: 22ch;
  color: var(--fg-muted);
}
/* Avatar-sized slots have no room for a caption. */
@container (max-width: 150px) { .img-ph .img-ph-cap { display: none; } }


/* ==========================================================================
   MOBILE PASS (Aug 2026)
   Small-screen fixes only. Every rule below is inside a max-width query except
   the overflow-wrap one, which cannot change rendering while the text fits.
   The desktop layout is deliberately untouched.
   ========================================================================== */

/* --- 1. Grids that never reached one column -------------------------------
   .grid--3/--4 dropped to two columns at 980px and stayed two-up all the way
   down, so a 28px-padded card could not fit its share: Purpose, Mission &
   Values laid out 395px wide inside a 375px screen and the whole page scrolled
   sideways. One column below 620px, and slightly tighter cards to match. */
@media (max-width: 620px) {
  .grid--3, .grid--4 { grid-template-columns: 1fr; }
  .stepper, .stepper--three, .stepper--four { grid-template-columns: 1fr; }
  .acc-strip { grid-template-columns: 1fr; }
  .card { padding: 22px; }
  /* 36px of form padding is 72px of the 280px available at 320px wide, which
     on its own pushed the contact page 6px past the edge. */
  .contact-form { padding: 20px; }
}

/* --- 2. Long unbreakable strings -----------------------------------------
   info@intelligenceassist.com.au offers no break opportunity, so it set a
   334px min-content floor on the contact aside -- which fitted a 375px screen
   with 1px to spare and overflowed anything narrower. */
.alt-contact-val, .alt-contact-row { overflow-wrap: anywhere; }

/* --- 3. Touch targets ----------------------------------------------------
   44px minimum. Inline links get padding with a matching negative margin, so
   the tappable area grows without shifting the layout around it. Capped at
   800px, well below the 1000px point where the nav is already a burger. */
@media (max-width: 800px) {
  .nav-burger { width: 44px; height: 44px; }
  .nav-brand { min-height: 44px; }
  .nav-cta .btn { min-height: 44px; }
  /* The Client Portal pill carries a hard 32.5px height elsewhere. Raising only
     the button beside it left the pill looking squashed against a taller
     neighbour, so both grow to the same 44px. */
  .nav-cta .nav-playground { height: auto; min-height: 44px; }
  .footer-social a { width: 44px; height: 44px; }
  .footer-top a, .footer-top button:not(.footer-h5) { padding: 12px 0; }
  .contact-switch-btn { min-height: 44px; }
  .crumb-link { padding: 13px 2px; margin: -13px 0; }
  /* Inline links inside running text: vertical padding on an inline box grows
     the hit area without affecting line height, so the sentence does not move. */
  .contact-form a { padding-block: 14px; }
  /* Inline link-buttons sit at 25px. Padding plus an equal negative margin
     grows the tappable box without nudging the text around it. */
  .linkout { padding: 10px 0; margin: -10px 0; }
  .st-arrow { min-width: 44px; min-height: 44px; }
  .nav-brand { min-width: 44px; justify-content: center; }
  .footer-bottom .legal a { min-height: 44px; display: inline-flex; align-items: center; }
}


/* --- 4. Foundations figures ----------------------------------------------
   Once the two-column hero and cycle layouts collapse, both figures were left
   hard against the left edge with the copy full-width beneath, which read as a
   layout accident rather than a diagram. Centre them. */
@media (max-width: 900px) {
  .svc-hero-tri { justify-self: center; margin-inline: auto; }
}
@media (max-width: 860px) {
  .cyc-svg { margin-inline: auto; }
}

/* --- 5. Journey stepper (small screens only) ------------------------------
   .jstep is rendered alongside the pinned journey and hidden by default; below
   900px it takes over and the pinned version is removed, so the phone gets one
   part at a time instead of four stacked blocks of text. */
.jstep { display: none; }

@media (max-width: 900px) {
  .pin-wrap { display: none; }
  .jstep { display: block; }
  .jstep-head { margin: 0 0 20px; }

  .jstep-tabs { display: flex; gap: 8px; }
  .jstep-tab {
    flex: 1 1 0; min-height: 44px;
    font-family: inherit; font-size: 14px; font-weight: 600; letter-spacing: .02em;
    color: #8A90A2; background: #fff;
    border: 1px solid var(--hairline); border-radius: 10px; cursor: pointer;
    transition: color .25s var(--ease-standard), background .25s var(--ease-standard),
                border-color .25s var(--ease-standard);
  }
  .jstep-tab.is-on { color: #fff; background: var(--jt); border-color: var(--jt); }

  /* position:relative so each panel's offsetLeft is measured against the track,
     which is what the scroll handler compares with scrollLeft. */
  .jstep-track {
    position: relative; display: flex; gap: 14px; margin-top: 16px;
    overflow-x: auto; scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .jstep-track::-webkit-scrollbar { display: none; }

  .jstep-p {
    flex: 0 0 100%; scroll-snap-align: start;
    box-sizing: border-box; padding: 22px;
    background: #fff; border: 1px solid var(--hairline);
    border-top: 3px solid var(--jt); border-radius: 16px;
  }
  .jstep-p h3 {
    margin: 0 0 12px; font-size: 24px; font-weight: 600;
    letter-spacing: -.02em; line-height: 1.15; color: var(--ia-dark-blue);
  }
  .jstep-p p { margin: 0; font-size: 16px; line-height: 1.7; color: #454B5E; text-wrap: pretty; }
}

@media (prefers-reduced-motion: reduce) {
  .jstep-track { scroll-behavior: auto; }
}


/* --- 6. Client Portal in the burger menu ---------------------------------
   .nav-panel-item:last-child{border-bottom:0} drops the divider under the last
   plain menu item. The Client Portal item is an outlined button and happens to
   be last, so it lost the bottom edge of its own box and read as cut off. */
.nav-panel-item.nav-panel-item--playground { border-bottom: 1px solid var(--ia-blue); }
.nav-panel-item.nav-panel-item--playground:hover { border-bottom-color: var(--ia-dark-blue); }


/* --- 7. AI Foundations, small screens -------------------------------------
   Two things that only read as wrong once the page is one column wide. */
@media (max-width: 900px) {
  /* Every .pillar-row closes with a hairline, so the last one (Literacy) drew a
     rule 56px above the point where the background changes anyway -- two
     divisions doing one job. The rows above keep theirs. */
  .pillar-row:last-child { border-bottom: 0; }
}

@media (max-width: 860px) {
  /* 96px of section padding plus the grid's own 26px put 122px of nothing above
     the figure. */
  .cyc-sec { padding-top: 44px; padding-bottom: 64px; }
  .cyc { margin-top: 0; gap: 10px; }
  /* The figure's viewBox is 300x280 but the artwork stops at 238, so ~36px of
     the box is empty at this size. A matching negative margin closes the gap to
     the heading without touching the artwork itself. */
  .cyc-svg { margin-bottom: -18px; }
}


/* ---------- Legal / long-form documents (Terms, and future policy pages) -----
   A single measured column. No cards, no accents: the job is readability over a
   long scroll, and clause numbering that stays legible when it wraps. */
.legal-body { max-width: 74ch; font-size: 16px; line-height: 1.7; color: #2C3140; }

.legal-h2 {
  display: flex; gap: 12px;
  margin: 48px 0 18px;
  font-size: 24px; font-weight: 600; line-height: 1.25;
  letter-spacing: -0.01em; color: var(--ink);
  padding-top: 22px; border-top: 1px solid var(--hairline);
}
.legal-body > .legal-h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.legal-num { color: var(--ia-blue); font-variant-numeric: tabular-nums; }

.legal-h3 {
  margin: 28px 0 10px;
  font-size: 16px; font-weight: 600; color: var(--ink); letter-spacing: 0;
}

.legal-p, .legal-clause, .legal-def { margin: 0 0 14px; }

/* Hanging indent so a wrapped clause lines up under its own text, not under
   the (a) marker. */
.legal-clause { padding-left: 2.1em; text-indent: -2.1em; }
.legal-clause--sub { padding-left: 3.6em; text-indent: -1.5em; }

.legal-def { padding-left: 1.4em; text-indent: -1.4em; }
.legal-term { font-weight: 600; color: var(--ink); }

.legal-body a { color: var(--ia-blue); }

.legal-foot {
  margin-top: 48px; padding-top: 26px;
  border-top: 1px solid var(--hairline);
  font-size: 16px; line-height: 1.6;
}
.legal-foot p { margin: 0 0 14px; }
.legal-foot-name { font-weight: 600; color: var(--ink); }
.legal-copy { color: #5C6172; font-size: 14px; margin-bottom: 0; }

@media (max-width: 620px) {
  /* Clause markers get their own line rather than eating the measure. */
  .legal-clause, .legal-clause--sub, .legal-def { padding-left: 0; text-indent: 0; }
  .legal-h2 { margin-top: 36px; font-size: 20px; }
}


/* --- 8. Team hover panel capacity ----------------------------------------
   The bios outgrew the panel. It overlays only the 298px photo, which leaves
   254px of usable height after padding, and Zac's 419 characters need 282px --
   with .team-hover set to overflow:visible the text spilled outside the card.
   Anchoring the panel to the whole card instead of just the photo raises the
   usable height to roughly 336px, which clears the longest bio comfortably.
   The card is unchanged at rest; only the hover state covers more. Reverting is
   a matter of deleting the three rules below. */
.team-card { position: relative; }
/* Beats .team-photo{position:relative} in blueprint-align-v2.css, which loads
   after this file, so the panel resolves against the card. */
.team-card .team-photo { position: static; }
/* safe center keeps the start of the text reachable if a bio ever exceeds the
   panel again, instead of centring it and cutting off the top. overflow-y:auto
   is the backstop: a bio longer than the card can hold scrolls rather than being
   silently clipped by .team-card{overflow:hidden}. It should not be relied on --
   at four columns the panel holds roughly 430 characters, and anything past that
   reads as cut off even though it is reachable. */
.team-hover { align-items: safe center; overflow-y: auto; overscroll-behavior: contain; }
/* Hide the scrollbar chrome: a visible bar on a 281px card both looks wrong and
   steals content width, which reflowed the text taller and pushed a bio that
   previously fitted into overflowing as well. */
.team-hover { scrollbar-width: none; }
.team-hover::-webkit-scrollbar { display: none; }

/* One job title wraps to two lines (Arsh's) and the rest do not, which made the
   first grid row 18px taller than the second and gave the two rows different bio
   capacity -- a layout difference decided by how long one role happens to be.
   Reserving two lines for every role makes every card the same height, so a bio
   that fits in one row fits in the other. Costs 18px of space under the
   single-line roles, which is the same spacing row one already had. */
.team-role { min-height: 36px; }                     /* 2 lines at 12px/18px */
@supports (height: 1lh) { .team-role { min-height: 2lh; } }