/* GENERATED by scripts/copy-render-kit-runtime.mjs — do not edit by hand.
 * The www.infoc.one site sheet (CMS-D-215): the canonical CMS-D-054 kit,
 * then forms, then slider, then the ione skin LAST. No overrides.css, no
 * v6.css — the sites share nothing at the skin layer. */
/* Generated from the canonical CMS-D-054 stylesheet; only the remote font transport is replaced. */
@font-face{font-family:'Infoc Modern';font-style:normal;font-weight:400 800;font-display:swap;src:url('/fonts/infoc-modern-latin.woff2') format('woff2')}
@font-face{font-family:'Infoc Mono';font-style:normal;font-weight:400 600;font-display:swap;src:url('/fonts/infoc-mono-latin.woff2') format('woff2')}
@font-face{font-family:'Infoc Mark';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/infoc-mark-latin.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url('/fonts/infoc-modern-latin.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 600;font-display:swap;src:url('/fonts/infoc-mono-latin.woff2') format('woff2')}
@font-face{font-family:'Michroma';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/infoc-mark-latin.woff2') format('woff2')}
/* ---- absorbed from ioc-core.css (CMS-D-071) ---- */
/* ============================================================
   INFOC · Carbon-style design foundation
   Geist + 2x grid + INFOC interactive blue (#0001ff)
   Light theme (white / Gray 10). Shared across all directions.
   ============================================================ */


:root{
  /* Gray family (Carbon) */
  --ioc-white:#ffffff;
  --ioc-g10:#f4f4f4;
  --ioc-g20:#e0e0e0;
  --ioc-g30:#c6c6c6;
  --ioc-g40:#a8a8a8;
  --ioc-g50:#8d8d8d;
  --ioc-g60:#666666;
  --ioc-g70:#525252;
  --ioc-g80:#393939;
  --ioc-g90:#262626;
  --ioc-g100:#161616;

  /* Interactive — INFOC blue */
  --ioc-blue:#0001ff;--ioc-accent:#0001ff;--ioc-accent-hover:#0000c4;--ioc-accent-ink:#0001ff;
  /* CMS-D-095 ③: was #0e8a5f — 4.36:1 as text on white and 3.95:1 on the
     success tint, both AA failures. Green-70 reads 7.72:1 / 7.00:1. */
  --ioc-green:#0e6027;
  --ioc-blue-hover:#0000c4;
  --ioc-focus:#0001ff;

  /* Text */
  --ioc-text-primary:#161616;
  --ioc-text-secondary:#525252;
  --ioc-text-helper:#5c5c5c;
  --ioc-text-on-color:#ffffff;

  /* Lines */
  --ioc-border-subtle:#e0e0e0;
  --ioc-border-strong:#8d8d8d;

  /* Type */
  --ioc-sans:"Manrope", system-ui, -apple-system, sans-serif;
  --ioc-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  /* Carbon spacing scale */
  --ioc-s1:2px;  --ioc-s2:4px;  --ioc-s3:8px;  --ioc-s4:12px; --ioc-s5:16px;
  --ioc-s6:24px; --ioc-s7:32px; --ioc-s8:40px; --ioc-s9:48px; --ioc-s10:64px;
  --ioc-s11:80px; --ioc-s12:96px; --ioc-s13:160px;

  /* Layout */
  --ioc-maxw:1584px;
  --ioc-gutter:32px;
  /* ONE placeholder colour for every form input on the site (owner direction
     2026-08-28). Placeholders were set FIVE different ways — g50, g60, g70,
     an on-brand tint and a raw rgba — and `.field input::placeholder` sat on
     g50 (#8d8d8d), which is 3.4:1 on white and FAILS WCAG AA for the hint text
     a visitor reads to know what to type.
     Built from the existing scale rather than a new literal: it lands ~#757575,
     4.8:1 on white. Lighter than the g60 the campaign forms used (5.7:1), so it
     reads as a hint and not as a filled value, while keeping real headroom over
     the 4.5:1 floor — the lightest fully safe grey is about #767676, so there
     is no room to go lighter than this and stay compliant. */
  --ioc-placeholder:color-mix(in srgb,var(--ioc-g50) 38%,var(--ioc-g60));
  --ioc-container-prose:720px;
  --ioc-container-default:1200px;
  --ioc-container-wide:1440px;

  /* Elevation — subtle, engineered depth */
  --ioc-shadow-sm:0 1px 2px rgba(0,0,0,.05), 0 1px 1px rgba(0,0,0,.03);
  --ioc-shadow-md:0 4px 8px rgba(0,0,0,.06), 0 2px 4px rgba(0,0,0,.04);
  --ioc-shadow-lg:0 12px 24px rgba(0,0,0,.08), 0 4px 8px rgba(0,0,0,.04);
  --ioc-shadow-card:0 14px 34px -20px rgba(15,17,60,.30);
  --ioc-shadow-pop:0 24px 48px -24px rgba(10,12,60,.22);

  /* Motion */
  --ioc-dur-instant:100ms; --ioc-dur-fast:200ms; --ioc-dur-mid:250ms;
  --ioc-dur-slow:300ms; --ioc-dur-reveal:600ms;
  --ioc-ease:cubic-bezier(.2,.7,.3,1);
  --ioc-ease-out:cubic-bezier(.16,1,.3,1);
  --ioc-ease-in:cubic-bezier(.7,0,.84,0);
  --ioc-ease-inout:cubic-bezier(.65,0,.35,1);

  /* Z-index */
  --ioc-z-raised:10; --ioc-z-sticky:20; --ioc-z-dropdown:30; --ioc-z-tooltip:40;
  --ioc-z-overlay:50; --ioc-z-modal:60; --ioc-z-toast:70;
}

/* ---- P37 role layer (CMS-D-094/095) · literal-valued semantic roles ----
   Rules consume these instead of raw hex; the T16 gate ratchets the raw hex
   to zero across Wave T. Only LITERAL-valued roles may live at :root —
   an alias (a value containing var()) declared here substitutes on <html>
   and FREEZES at its code default, blind to the emitter's body.ioc-site
   overrides; aliases live in the body.ioc-site block below. Values with a
   deliberate delta from the literals they absorb (--ioc-success vs the
   #42be65 it replaces) are CMS-D-095 ③ decisions, applied at Wave T2b. */
:root{
  /* surfaces · light */
  --ioc-surface:#ffffff;
  --ioc-surface-subtle:#fbfbfb;
  --ioc-surface-cool:#f2f4f8;
  --ioc-surface-hover:#e8e8e8;
  --ioc-hover-wash:#f7faff;
  --ioc-selected-surface:#edf5ff;
  --ioc-selected-border:#c6d9ff;
  /* surfaces · inverse / brand */
  --ioc-surface-inverse-raised:#1c1c1c;
  --ioc-surface-brand:#001d6c;
  --ioc-surface-brand-deep:#001141;
  /* on-color text/border — the #fff split (CMS-D-094 ①) */
  /* T2b: the --blue-on-dark repair — four sites consumed a name declared
     NOWHERE (invalid at computed-value time; they rendered inherited
     colour) and now consume this declared role. Census-named. */
  --ioc-accent-on-inverse:#78a9ff;
  --ioc-border-on-color:#ffffff;
  /* Wave A: text on PRIMARY fills. Skin-derived by the emitter — dark's
     primary is Carbon blue-40, a light fill needing ink text (7.68:1),
     while white on it reads 2.3:1. Accent fills keep --ioc-text-on-color:
     family accents are AA-proven with white by the family spec. */
  --ioc-text-on-primary:#ffffff;
  --ioc-text-on-brand-soft:#e5e5ff;
  --ioc-text-on-brand-muted:#d0d0ff;
  --ioc-text-on-brand-deep:#d0e2ff;
  --ioc-accent-on-brand:#8c8cff;
  /* status */
  --ioc-danger:#da1e28;
  --ioc-danger-text:#a2191f;
  --ioc-danger-surface:#fff1f1;
  --ioc-danger-on-color:#ff8389;
  --ioc-success:#198038;
  --ioc-success-surface:#defbe6;
  /* family palette constants — code-owned; the [data-page-family] sources
     alias these at Wave T3 (a DIFFERENT name, so no var() self-reference) */
  --ioc-fam-academy:#6929c4;
  --ioc-fam-academy-hover:#55209c;
  --ioc-fam-talents:#1a7a52;
  --ioc-fam-talents-hover:#145f40;
  --ioc-fam-talents-ink:#146245;
  --ioc-fam-industries:#007d79;
  --ioc-fam-industries-ink:#005d5d;
  --ioc-fam-company:#4d5358;
  /* Wave C component roles — each bound to a tab field, each consumed
     below. The header surface keeps the kit's translucent-blur alpha; the
     emitter rebuilds it from a validated hex via color-mix. */
  --ioc-header-surface:rgba(255,255,255,.94);
  --ioc-header-active:#0001ff;
  --ioc-crumb:#5c5c5c;
  --ioc-crumb-current:#0001ff;
  /* residue constants (CMS-D-095 ⑤ — found, not named) */
  --ioc-magenta:#9f1853;
  --ioc-teal:#08bdba;
  --ioc-wash-pink:#fff1f7;
}
/* Aliased roles: substitution happens ON body, after the admin emitter's
   overrides cascade onto that same element, so a store change to the
   primitive flows through the role for every descendant. */
body.ioc-site{
  /* T2b freeze repair: at :root this substituted var(--ioc-blue) on <html>
     and froze — focus rings ignored the admin primary. Here it follows. */
  --ioc-shadow-focus:0 0 0 2px var(--ioc-surface,#ffffff), 0 0 0 5px var(--ioc-blue);
  --ioc-surface-sunken:var(--ioc-g10);
  --ioc-surface-inverse:var(--ioc-g100);
  --ioc-text-on-inverse-muted:var(--ioc-g30);
  /* Wave C: the footer follows the page surface (and therefore the skin)
     until its own field says otherwise. */
  --ioc-footer-surface:var(--ioc-surface);
}

body.ioc-site *{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
/* P36 / CMS-D-092 — the admin-governed tokens are CONSUMED here. Each carries
   the previous literal as its `var()` fallback, so a page rendered without the
   token block (anything outside the `[siteKey]` segment) is byte-identical to
   before. `--ioc-text-primary` was already a token and already inherited by
   headings, which is what makes item 6 reachable without an element-level
   heading colour rule that would break the inverse sections. */
body.ioc-site{
  /* CMS-D-093 — the `skin` field's OWN consumer. Without it the control would be
     stored, shown, and read by nothing (the CMS-D-081 dangling-store defect).
     This is what makes native controls, scrollbars and form widgets follow a
     dark site instead of staying stubbornly light against it. */
  color-scheme:var(--ioc-color-scheme,light);
  margin:0;
  font-family:var(--ioc-body-family,var(--ioc-sans));
  color:var(--ioc-text-primary);
  background:var(--ioc-white);
  font-size:var(--ioc-body-size,16px);
  line-height:var(--ioc-body-line-height,1.5);
  font-weight:var(--ioc-body-weight,400);
}
body.ioc-site a{color:inherit;text-decoration:none}
body.ioc-site img{max-width:100%;display:block}
body.ioc-site ::selection{background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff)}
:focus-visible{outline:none;box-shadow:var(--ioc-shadow-focus)}

/* Skip link — first focusable element on every page */
.skip-link{position:absolute;left:16px;top:-48px;z-index:var(--ioc-z-toast);background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff);padding:12px 20px;font-family:var(--ioc-sans);font-size:14px;font-weight:500;transition:top .15s var(--ioc-ease-out)}
.skip-link:focus-visible{top:16px;box-shadow:var(--ioc-shadow-focus)}

/* Metrics never shift layout while counting */
.statstrip .sn b,.a-stat .num,[data-countup],.tnum{font-variant-numeric:tabular-nums}

/* ---------- Type scale (Carbon productive/expressive) ---------- */
.eyebrow{
  font-family:var(--ioc-mono);
  font-size:12px;
  letter-spacing:.32px;
  text-transform:uppercase;
  color:var(--ioc-text-secondary);
  font-weight:400;
  margin:0;
}
.eyebrow .dot{color:var(--ioc-blue)}
/* P36 (CMS-D-092 phase) — `:where()` carries ZERO specificity, so this reads as
   the source's bare `h1,h2,h3,h4` (0-0-1) while keeping CMS-D-071 deviation #5's
   scoping intent. Written as `body.ioc-site h1` it scored 0-1-2 and silently
   outranked EVERY single-class block heading rule in this file; measured against
   the served design source, 8 of 41 headings on the home page rendered at 600
   instead of 700. The scope must not also be a priority. */
:where(body.ioc-site) h1,:where(body.ioc-site) h2,:where(body.ioc-site) h3,:where(body.ioc-site) h4{letter-spacing:-.01em;margin:0;line-height:1.12;font-family:var(--ioc-heading-family,inherit)}
/* Split per level so CMS-D-092's per-level weights have somewhere to land. The
   `600` fallbacks preserve the grouped rule this replaced, byte for byte, when
   no token block is present. Still 0-0-1: the scope must not be a priority. */
.display-xl{font-size:clamp(48px,6.6vw,104px);font-weight:600;line-height:.98;letter-spacing:-.03em}
.display-l{font-size:clamp(40px,4.6vw,72px);font-weight:600;line-height:1.04;letter-spacing:-.028em}
.display-m{font-size:clamp(30px,3.2vw,46px);font-weight:600;line-height:1.08;letter-spacing:-.015em}
.heading{font-size:clamp(22px,2vw,30px);font-weight:600;line-height:1.18;letter-spacing:-.01em}
.body-l{font-size:clamp(18px,1.4vw,21px);line-height:1.55;color:var(--ioc-text-secondary);font-weight:400;letter-spacing:-.003em;text-wrap:pretty}
.display-xl,.display-l,.display-m{text-wrap:balance}
.body{font-size:16px;line-height:1.55;color:var(--ioc-text-secondary)}
.body-s{font-size:14px;line-height:1.5;color:var(--ioc-text-secondary)}
.fw300{font-weight:300}
.thin-accent{color:var(--ioc-blue)}

/* ---------- Layout helpers ---------- */
.wrap{max-width:var(--ioc-maxw);margin:0 auto;padding:0 var(--ioc-gutter)}
.grid16{display:grid;grid-template-columns:repeat(16,1fr);gap:0}
.section{padding-top:112px;padding-bottom:112px}
.section-xl{padding-top:140px;padding-bottom:140px}
.rule{height:1px;background:var(--ioc-border-subtle);border:0;margin:0}
.rule-strong{height:1px;background:var(--ioc-border-strong)}

/* ---------- Buttons (Carbon) ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:space-between;
  gap:var(--ioc-s10);
  font-family:var(--ioc-sans);font-size:15px;font-weight:500;line-height:1.2;
  padding:16px 20px;min-width:200px;white-space:nowrap;
  border:1px solid transparent;cursor:pointer;
  transition:background .16s var(--ioc-ease), color .16s var(--ioc-ease), border-color .16s var(--ioc-ease), box-shadow .16s var(--ioc-ease);
  text-align:left;
}
.btn svg{width:18px;height:18px;flex:none;transition:transform .2s var(--ioc-ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-primary{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.btn-primary:hover{background:var(--ioc-accent-hover);box-shadow:var(--ioc-shadow-card)}
.btn-primary:active{background:var(--ioc-accent-hover)}
.btn-secondary{background:var(--ioc-g80);color:var(--ioc-text-on-color,#fff)}
.btn-secondary:hover{background:var(--ioc-g70)}
.btn-tertiary{background:transparent;color:var(--ioc-accent);border-color:var(--ioc-accent)}
.btn-tertiary:hover{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.btn-ghost{background:transparent;color:var(--ioc-accent);min-width:auto;padding:8px 0;gap:var(--ioc-s5)}
.btn-ghost:hover{color:var(--ioc-accent-hover)}
.btn-on-dark{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.btn-on-dark.is-ghost{background:transparent;border-color:var(--ioc-g70,#525252);color:var(--ioc-text-on-color,#fff);min-width:200px}
.btn-on-dark.is-ghost:hover{background:var(--ioc-text-on-color,#fff);color:var(--ioc-text-primary,#161616);border-color:var(--ioc-border-on-color,#fff)}

/* inline link with arrow */
.link-arrow{display:inline-flex;align-items:center;gap:8px;color:var(--ioc-link-color,var(--ioc-blue));font-size:15px;font-weight:400;font-family:var(--ioc-sans)}
.link-arrow svg{width:16px;height:16px;transition:transform .15s ease}
.link-arrow:hover svg{transform:translateX(4px)}

/* tag / chip */
.tag{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--ioc-mono);font-size:12px;letter-spacing:.4px;
  color:var(--ioc-text-secondary);
  border:1px solid var(--ioc-border-subtle);
  padding:6px 12px;background:var(--ioc-white);
  transition:border-color .14s var(--ioc-ease),color .14s var(--ioc-ease),background .14s var(--ioc-ease);
}
.tag:hover{border-color:var(--ioc-g40);color:var(--ioc-text-primary)}
.tag b{color:var(--ioc-blue);font-weight:500}

/* ========================================================
   GLOBAL SHARED SHELL  (INFOC V1 · matches approved reference)
   Header + mega menus + search + mobile drawer + footer +
   cookie consent + chat routing + back-to-top. Mapped to INFOC
   tokens and the locked Manrope / JetBrains Mono stack.
   Header/footer internals are scoped under .ioc-header/.ioc-footer.
   ======================================================== */

/* ---- scroll progress ---- */
.sh-progress{position:fixed;z-index:var(--ioc-z-toast);left:0;right:0;top:0;height:2px;pointer-events:none}
.sh-progress::before{content:"";display:block;width:calc(var(--sp,0) * 1%);height:100%;background:linear-gradient(90deg,var(--ioc-blue),var(--ioc-fam-talents,#1a7a52))}

/* ---- HEADER ---- */
.ioc-header{position:sticky;top:0;z-index:var(--ioc-z-sticky);background:var(--ioc-header-surface,rgba(255,255,255,.94));-webkit-backdrop-filter:saturate(140%) blur(14px);backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid var(--ioc-border-subtle);transition:box-shadow .25s var(--ioc-ease)}
.ioc-header.scrolled{box-shadow:0 10px 28px -18px rgba(15,17,60,.22)}
.ioc-header .header-row{display:flex;align-items:stretch;height:72px;max-width:none;margin:0 auto;padding:0 var(--ioc-gutter)}
.ioc-header .brand{display:inline-flex;align-items:center;color:var(--ioc-text-primary);margin-right:32px}
/* INFOC Michroma wordmark lockup (static master) */
.infoc-logo{display:inline-flex;align-items:baseline;font-family:"Michroma",sans-serif;font-weight:400;letter-spacing:.11em;line-height:1;padding-bottom:.26em;-webkit-text-stroke:.063em currentColor;paint-order:stroke fill;transform:none}
.infoc-logo .g{display:inline-block}
.infoc-logo .g:first-child{margin-right:-.07em}
.infoc-logo .g:nth-child(2){margin-right:-.04em}
.infoc-logo .gc{position:relative;color:var(--ioc-blue);margin-right:-.02em}
.infoc-logo .gc::after{content:"";position:absolute;left:0;top:calc(100% + .122em);width:calc(100% - .11em);height:.14em;background:currentColor}
.ioc-header .brand .infoc-logo{font-size:23px}
@media (prefers-reduced-motion:no-preference){.ioc-header .brand .infoc-logo .gc{animation:idcHdrInk 1.5s var(--ioc-ease) .25s both}}
@keyframes idcHdrInk{0%{color:var(--ioc-text-primary)}100%{color:var(--ioc-blue)}}
.ioc-header .nav{display:flex;margin-left:auto;align-items:stretch}
.ioc-header .nav-link,.ioc-header .nav-trigger{position:relative;display:flex;align-items:center;gap:6px;padding:0 15px;border:0;background:transparent;font-family:var(--ioc-sans);font-weight:600;font-size:14px;color:var(--ioc-text-secondary);white-space:nowrap;cursor:pointer;transition:color .16s var(--ioc-ease)}
.ioc-header .nav-link::after,.ioc-header .nav-trigger::after{content:"";position:absolute;left:15px;right:15px;bottom:0;height:2px;background:var(--ioc-header-active,#0001ff);transform:scaleX(0);transform-origin:left;transition:transform .2s var(--ioc-ease)}
.ioc-header .nav-link:hover,.ioc-header .nav-trigger:hover,.ioc-header .nav-trigger[aria-expanded="true"]{color:var(--ioc-text-primary)}
.ioc-header .nav-link:hover::after,.ioc-header .nav-trigger:hover::after,.ioc-header .nav-trigger[aria-expanded="true"]::after{transform:scaleX(1)}
.ioc-header .nav-link[aria-current="page"]{color:var(--ioc-header-active,#0001ff)}
.ioc-header .nav-link[aria-current="page"]::after{transform:scaleX(1)}
.ioc-header .ico-down{width:12px;height:12px;transition:transform .2s var(--ioc-ease)}
.ioc-header .nav-trigger[aria-expanded="true"] .ico-down{transform:rotate(180deg)}
.ioc-header .nav-link,.ioc-header .nav-trigger{text-decoration:none;cursor:pointer}
.mobile-sub .mobile-overview{font-weight:600;color:var(--ioc-blue)}
.ioc-header .nav-trigger[aria-current="page"]{color:var(--ioc-header-active,#0001ff)}
.ioc-header .nav-trigger[aria-current="page"]::after{transform:scaleX(1)}
.ioc-header .header-actions{display:flex;margin-left:6px}
.ioc-header .icon-btn{width:56px;display:grid;place-items:center;border:0;border-left:1px solid var(--ioc-border-subtle);background:transparent;color:var(--ioc-text-primary);cursor:pointer;transition:background .16s var(--ioc-ease),color .16s var(--ioc-ease)}
.ioc-header .icon-btn:hover{background:var(--ioc-g10);color:var(--ioc-blue)}
.ioc-header .icon-btn .ico{width:20px;height:20px}
.ioc-header .top-cta{min-width:176px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 20px;background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff);font-weight:600;font-size:13.5px;letter-spacing:-.01em;transition:background .16s var(--ioc-ease)}
.ioc-header .top-cta:hover{background:var(--ioc-blue-hover)}
.ioc-header .top-cta .ico{width:16px;height:16px;transition:transform .2s var(--ioc-ease)}
.ioc-header .top-cta:hover .ico{transform:translateX(3px)}
.ioc-header .mobile-toggle{display:none}

/* ---- mega panels ---- */
.ioc-header .backdrop{position:absolute;left:0;right:0;top:100%;height:100vh;background:rgba(22,22,22,.4);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s var(--ioc-ease),visibility .2s}
.ioc-header .backdrop.show{opacity:1;visibility:visible;pointer-events:auto}
.ioc-header .mega{display:block;position:absolute;left:0;right:0;width:auto;top:100%;background:var(--ioc-surface,#fff);border-bottom:1px solid var(--ioc-border-strong);box-shadow:0 24px 48px -24px rgba(10,12,60,.25);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);transition:opacity .2s var(--ioc-ease),transform .28s var(--ioc-ease),visibility .2s;max-height:calc(100vh - 72px);overflow:auto}
.ioc-header .mega.open{display:block;opacity:1;visibility:visible;pointer-events:auto;transform:none}
.ioc-header .mega-inner{width:100%;max-width:none;margin:0 auto;padding:26px var(--ioc-gutter)}
.ioc-header .sol-layout{display:grid;grid-template-columns:minmax(13rem,3fr) minmax(26rem,6fr) minmax(13rem,3fr);gap:clamp(20px,2vw,32px);align-items:start}
.ioc-header .simple-layout{display:grid;grid-template-columns:minmax(13rem,3fr) minmax(30rem,9fr);gap:clamp(20px,2vw,32px);align-items:start}
.ioc-header .featured{display:flex;flex-direction:column;padding:18px;background:var(--ioc-selected-surface,#edf5ff)}
.ioc-header .featured>svg{width:24px;height:24px;color:var(--ioc-blue)}
.ioc-header .featured .mega-label{margin-top:14px}
.ioc-header .featured h3{margin:6px 0 8px;font-size:18px;line-height:1.12;letter-spacing:-.02em;color:var(--ioc-text-primary)}
.ioc-header .featured p{margin:0;color:var(--ioc-text-secondary);font-size:12.5px;line-height:1.5}
.ioc-header .featured>a{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:16px;border-top:1px solid var(--ioc-selected-border,#c6d9ff);color:var(--ioc-blue);font-weight:600;font-size:14px}
.ioc-header .featured>a .ico{width:16px;height:16px}
.ioc-header .mega-label{color:var(--ioc-blue);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.ioc-header .mega-intro h2{font-size:clamp(19px,1.5vw,24px);line-height:1.08;letter-spacing:-.025em;margin:8px 0;max-width:16ch}
.ioc-header .mega-intro p{color:var(--ioc-text-secondary);line-height:1.5;font-size:13px;max-width:38ch}
.ioc-header .view-all{display:inline-flex;align-items:center;gap:8px;margin-top:12px;color:var(--ioc-blue);font-weight:600;font-size:13px}
.ioc-header .view-all .ico{width:16px;height:16px;transition:transform .2s var(--ioc-ease)}
.ioc-header .view-all:hover .ico{transform:translateX(3px)}
.ioc-header .group-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ioc-border-subtle);border-left:1px solid var(--ioc-border-subtle)}
.ioc-header .menu-group{padding:14px 16px;border-right:1px solid var(--ioc-border-subtle);border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-header .menu-group h3{margin:0 0 8px;color:var(--ioc-blue);font-family:var(--ioc-mono);font-size:11px;font-weight:400;letter-spacing:.12em;text-transform:uppercase}
.ioc-header .menu-group a{display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:12px;padding:9px 0;border-top:1px solid var(--ioc-border-subtle);color:var(--ioc-text-primary)}
.ioc-header .menu-group a:first-of-type{border-top:0}
.ioc-header .menu-group .mg-ico{margin-top:2px}
.ioc-header .menu-group .mg-ico svg{width:18px;height:18px;color:var(--ioc-blue)}
.ioc-header .menu-group strong{display:block;font-size:13.5px;font-weight:600;transition:color .14s var(--ioc-ease)}
.ioc-header .menu-group .mg-txt>span{display:block;margin-top:3px;color:var(--ioc-text-secondary);font-size:12px;font-weight:400;line-height:1.45}
.ioc-header .menu-group a>.ico{width:15px;height:15px;margin-top:2px;color:var(--ioc-blue);flex:none;transition:transform .16s var(--ioc-ease)}
.ioc-header .menu-group a:hover>.ico{transform:translateX(3px)}
.ioc-header .menu-group a:hover strong{color:var(--ioc-blue)}
.ioc-header .simple-links{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ioc-border-subtle);border-left:1px solid var(--ioc-border-subtle)}
.ioc-header .simple-links a{display:flex;flex-direction:column;justify-content:space-between;gap:8px;padding:16px;border-right:1px solid var(--ioc-border-subtle);border-bottom:1px solid var(--ioc-border-subtle);color:var(--ioc-text-primary);transition:background .16s var(--ioc-ease)}
.ioc-header .simple-links a .ico{width:22px;height:22px;color:var(--ioc-blue)}
.ioc-header .simple-links [data-tile]{display:block}
.ioc-header .simple-links [data-tile] svg{width:20px;height:20px;color:var(--ioc-blue)}
.ioc-header .simple-links .mega-label{margin-bottom:2px}
.ioc-header .simple-links strong{font-size:15px;font-weight:600}
.ioc-header .simple-links span{color:var(--ioc-text-secondary);font-size:12.5px;line-height:1.45}
.ioc-header .simple-links a:hover{background:var(--ioc-g10)}
.ioc-header .simple-links a:hover strong{color:var(--ioc-blue)}

/* ---- mobile drawer ---- */
.sh-drawer{position:fixed;z-index:var(--ioc-z-modal);inset:0 0 0 auto;width:min(92vw,28rem);background:var(--ioc-surface,#fff);transform:translateX(102%);transition:transform .32s var(--ioc-ease);box-shadow:-2rem 0 5rem rgba(0,0,0,.18);display:flex;flex-direction:column}
.sh-drawer.open{transform:none}
.sh-drawer .mobile-head{height:64px;display:flex;align-items:center;justify-content:space-between;padding-left:20px;border-bottom:1px solid var(--ioc-border-subtle)}
.sh-drawer .brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:700;letter-spacing:-.04em;color:var(--ioc-text-primary)}
.sh-drawer .brand .infoc-logo{font-size:21px}
.sh-drawer .icon-btn{width:56px;height:56px;display:grid;place-items:center;border:0;background:transparent;color:var(--ioc-text-primary);cursor:pointer}
.sh-drawer .icon-btn .ico{width:20px;height:20px}
.sh-drawer .mobile-nav{overflow:auto;flex:1}
.sh-drawer .mobile-nav>a,.sh-drawer .mobile-nav>button{width:100%;min-height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border:0;border-bottom:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff);text-align:left;font-family:var(--ioc-sans);font-weight:600;font-size:15px;color:var(--ioc-text-primary);cursor:pointer}
.sh-drawer .mobile-nav .ico-down{width:16px;height:16px;transition:transform .2s var(--ioc-ease)}
.sh-drawer .mobile-nav>button[aria-expanded="true"] .ico-down{transform:rotate(180deg)}
.sh-drawer .mobile-sub{display:grid;grid-template-rows:0fr;background:var(--ioc-g10);transition:grid-template-rows .25s var(--ioc-ease)}
.sh-drawer .mobile-sub.open{grid-template-rows:1fr}
.sh-drawer .mobile-sub>div{overflow:hidden}
.sh-drawer .mobile-sub a{display:block;padding:13px 28px;border-bottom:1px solid var(--ioc-border-subtle);color:var(--ioc-text-secondary);font-size:14px}
.sh-drawer .drawer-cta{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:18px 20px;background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff);font-weight:600}
.sh-drawer .drawer-cta .ico{width:16px;height:16px}

/* ---- search overlay ---- */
.sh-search{position:fixed;z-index:var(--ioc-z-overlay);inset:0;background:rgba(22,22,22,.65);display:grid;place-items:start center;padding-top:6rem;opacity:0;visibility:hidden;transition:opacity .2s var(--ioc-ease),visibility .2s}
.sh-search.show{opacity:1;visibility:visible}
.sh-search .search-panel{width:min(calc(100% - 2rem),54rem);background:var(--ioc-surface,#fff);box-shadow:0 2rem 6rem rgba(0,0,0,.25)}
.sh-search .search-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--ioc-border-subtle);font-family:var(--ioc-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper)}
.sh-search .icon-btn{width:40px;height:40px;display:grid;place-items:center;border:0;background:transparent;color:var(--ioc-text-primary);cursor:pointer}
.sh-search .icon-btn .ico{width:18px;height:18px}
.sh-search>.search-panel>label{display:block;padding:24px 24px 6px;font-size:20px;font-weight:600;letter-spacing:-.01em}
.sh-search .search-input{display:flex;align-items:center;gap:12px;margin:0 24px 16px;padding:0 14px;background:var(--ioc-g10);border-bottom:2px solid var(--ioc-text-primary)}
.sh-search .search-input .ico{width:18px;height:18px;color:var(--ioc-text-helper)}
.sh-search .search-input input{width:100%;height:60px;border:0;background:transparent;font-family:var(--ioc-sans);font-size:17px;outline:none;color:var(--ioc-text-primary)}
.sh-search .search-results{border-top:1px solid var(--ioc-border-subtle)}
.sh-search .search-results a{display:flex;align-items:center;justify-content:space-between;padding:15px 24px;border-bottom:1px solid var(--ioc-border-subtle);color:var(--ioc-text-primary);font-size:14.5px}
.sh-search .search-results a .ico{width:16px;height:16px;color:var(--ioc-blue);transition:transform .2s var(--ioc-ease)}
.sh-search .search-results a:hover{background:var(--ioc-g10);color:var(--ioc-blue)}
.sh-search .search-results a:hover .ico{transform:translateX(3px)}

/* ---- FOOTER ---- */
.ioc-footer{position:relative;border-top:1px solid var(--ioc-border-subtle);background:var(--ioc-footer-surface,#fff);color:var(--ioc-text-primary)}
.ioc-footer .fwrap{max-width:var(--ioc-maxw);margin:0 auto;padding:0 var(--ioc-gutter)}
.ioc-footer .footer-cta{background:linear-gradient(115deg,var(--ioc-selected-surface,#edf5ff) 0%,var(--ioc-hover-wash,#f7faff) 58%,var(--ioc-wash-pink,#fff1f7) 150%);border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-footer .footer-cta-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(2.5rem,5vw,5rem);align-items:start;padding-block:clamp(64px,7vw,112px)}
.ioc-footer .fcta-eyebrow{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-accent)}
.ioc-footer .footer-cta h2{max-width:11ch;font-size:clamp(40px,6vw,92px);line-height:.96;letter-spacing:-.045em;margin:14px 0 0;font-weight:800}
.ioc-footer .footer-cta h2 .em{color:var(--ioc-accent)}
.ioc-footer .footer-action{padding-left:clamp(1.5rem,3vw,3rem);border-left:1px solid var(--ioc-selected-border,#c6d9ff)}
.ioc-footer .footer-action .fa-k{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-accent)}
.ioc-footer .footer-action h3{font-size:clamp(22px,2.4vw,30px);line-height:1.08;letter-spacing:-.02em;margin:12px 0}
.ioc-footer .footer-action p{max-width:35rem;color:var(--ioc-text-secondary);line-height:1.6;font-size:14.5px;margin:0}
.ioc-footer .fa-tabs{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ioc-border-subtle);margin:14px 0 20px;max-width:36rem}
.ioc-footer .fa-tab{min-height:3rem;padding:0 1rem;background:var(--ioc-surface,#fff);border:0;border-right:1px solid var(--ioc-border-subtle);font:inherit;font-weight:600;font-size:13px;color:var(--ioc-text-secondary);cursor:pointer;text-align:left;transition:background .2s,color .2s}
.ioc-footer .fa-tab:last-child{border-right:0}
.ioc-footer .fa-tab[aria-selected="true"]{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.ioc-footer .fa-panel{display:none}
.ioc-footer .fa-panel.active{display:block}
.ioc-footer .footer-action-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:22px 0;background:var(--ioc-selected-border,#c6d9ff);border:1px solid var(--ioc-selected-border,#c6d9ff)}
.ioc-footer .footer-action-points span{min-height:4.25rem;padding:12px;background:rgba(255,255,255,.75);font-size:12px;line-height:1.4;color:var(--ioc-text-secondary)}
.ioc-footer .footer-action-points b{display:block;margin-bottom:4px;color:var(--ioc-accent);font-family:var(--ioc-mono);font-size:10px;font-weight:400;letter-spacing:.08em;text-transform:uppercase}
.ioc-footer .footer-button{display:flex;align-items:center;justify-content:space-between;width:min(100%,24rem);min-height:56px;padding:16px 18px;background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff);font-weight:600;transition:background .2s var(--ioc-ease),transform .2s var(--ioc-ease)}
.ioc-footer .footer-button:hover{background:var(--ioc-accent-hover);transform:translateY(-2px)}
.ioc-footer .footer-button .ico{width:16px;height:16px;transition:transform .2s var(--ioc-ease)}
.ioc-footer .footer-button:hover .ico{transform:translateX(3px)}
.ioc-footer .footer-routes{background:var(--ioc-surface,#fff);border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-footer .route-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-inline:1px solid var(--ioc-border-subtle)}
.ioc-footer .route{min-height:9rem;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:26px 28px;border-right:1px solid var(--ioc-border-subtle);color:var(--ioc-text-primary);transition:background .2s var(--ioc-ease),color .2s var(--ioc-ease)}
.ioc-footer .route:last-child{border-right:0}
.ioc-footer .route .rn{display:inline-flex;align-items:center;justify-content:center;color:var(--ioc-accent)}
.ioc-footer .route .rn svg{width:26px;height:26px;stroke-width:1.5}
.ioc-footer .route b{display:block;margin-bottom:4px;font-size:16px;letter-spacing:-.01em}
.ioc-footer .route small{display:block;color:var(--ioc-text-secondary);line-height:1.45;font-size:13px}
.ioc-footer .route .ico{width:18px;height:18px;color:var(--ioc-accent);transition:transform .2s var(--ioc-ease)}
.ioc-footer .route:hover{background:var(--ioc-g10);color:var(--ioc-accent)}
.ioc-footer .route:hover .ico{transform:translateX(3px)}
.ioc-footer .footer-main-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)) minmax(0,1.75fr);gap:clamp(28px,3.2vw,56px);align-items:start;padding-block:clamp(56px,6vw,88px)}
.ioc-footer .footer-brand{padding-right:clamp(24px,3vw,48px)}
.ioc-footer .footer-menu{padding-left:0}
.ioc-footer .footer-brand .brand{display:inline-flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:-.04em;color:var(--ioc-text-primary)}
.ioc-footer .footer-brand .brand .infoc-logo{font-size:30px}
.ioc-footer .footer-brand .brand.footer-lockup{display:inline-flex;align-items:center;gap:16px}
.ioc-footer .footer-lockup .navdiv{width:1px;height:1.9em;background:var(--ioc-border-subtle);flex:none}
.ioc-footer .footer-lockup .navword{font-family:var(--ioc-mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-text-primary);white-space:nowrap;opacity:0;transform:translateY(.4em);transition:opacity .5s var(--ioc-ease),transform .5s var(--ioc-ease)}
.ioc-footer .footer-lockup .navword.in{opacity:1;transform:none}
.ioc-footer .footer-lockup .infoc-logo.suffixing .gc::after{opacity:0;transition:opacity .3s var(--ioc-ease)}
.ioc-footer .footer-brand>p{max-width:30rem;color:var(--ioc-text-secondary);line-height:1.6;font-size:14px;margin:18px 0 0}
.ioc-footer .footer-menu-stack{display:flex;flex-direction:column;gap:28px}
.ioc-footer .footer-menu-stack nav>h3{margin-top:0}
.ioc-footer .footer-contact{display:flex;flex-direction:column;margin-top:2px}
.ioc-footer .footer-contact .fc-row{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:16px;padding:13px 0;border-top:1px solid var(--ioc-border-subtle)}
.ioc-footer .footer-contact .fc-row:first-child{border-top:0;padding-top:0}
.ioc-footer .footer-contact .fc-k{font-size:14px;color:var(--ioc-text-secondary);font-weight:500;letter-spacing:-.01em}
.ioc-footer .footer-contact .fc-v{justify-self:end;text-align:right;font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--ioc-text-primary);line-height:1.35;text-decoration:none}
.ioc-footer .footer-contact a.fc-v{transition:color .16s var(--ioc-ease)}
.ioc-footer .footer-contact a.fc-v:hover{color:var(--ioc-accent)}
.ioc-footer .footer-menu h3{margin:0 0 16px;font-family:var(--ioc-mono);font-size:11px;font-weight:400;color:var(--ioc-accent);letter-spacing:.12em;text-transform:uppercase}
.ioc-footer .footer-menu a{display:flex;align-items:center;min-height:32px;padding:4px 0;color:var(--ioc-g80,#393939);line-height:1.35;font-size:14px;transition:color .16s var(--ioc-ease),transform .16s var(--ioc-ease)}
.ioc-footer .footer-menu a:hover{color:var(--ioc-accent);transform:translateX(3px)}
.ioc-footer .footer-contact-band{border-top:1px solid var(--ioc-border-subtle)}
.ioc-footer .footer-contact-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(24px,3vw,56px);align-items:start;padding-block:clamp(28px,3vw,40px)}
.ioc-footer .fc-item{display:flex;flex-direction:column;gap:6px;min-width:0}
.ioc-footer .fc-label{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-accent)}
.ioc-footer .fc-value{color:var(--ioc-text-primary);font-size:15px;font-weight:600;line-height:1.4;word-break:break-word;text-decoration:none}
.ioc-footer a.fc-value:hover{color:var(--ioc-accent)}
@media(max-width:760px){.ioc-footer .footer-contact-grid{grid-template-columns:1fr 1fr}}
.ioc-footer .legal{background:var(--ioc-g100);color:var(--ioc-text-on-color,#fff)}
.ioc-footer .legal-row{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:16px;color:var(--ioc-g30,#c6c6c6);font-size:12.5px;flex-wrap:wrap}
.ioc-footer .legal-links{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.ioc-footer .legal-links span,.ioc-footer .legal-links a,.ioc-footer .legal-button{color:var(--ioc-g30,#c6c6c6);font-size:inherit}
.ioc-footer .legal-button{border:0;background:transparent;padding:0;cursor:pointer;font-family:var(--ioc-sans)}
.ioc-footer .legal-links a:hover,.ioc-footer .legal-button:hover{color:var(--ioc-text-on-color,#fff);text-decoration:underline}
.ioc-footer .social{display:flex;gap:8px}
.ioc-footer .social a,.ioc-footer .social button{width:34px;height:34px;border:1px solid var(--ioc-g80,#393939);display:flex;align-items:center;justify-content:center;color:var(--ioc-g30,#c6c6c6);background:transparent;cursor:pointer;padding:0}
.ioc-footer .social a:hover,.ioc-footer .social button:hover{border-color:var(--ioc-accent);color:var(--ioc-text-on-color,#fff);background:var(--ioc-accent)}
.ioc-footer .social button svg{width:16px;height:16px}
.ioc-footer .back-top{border:0;background:transparent;color:var(--ioc-text-on-color,#fff);display:flex;align-items:center;gap:8px;padding:6px;cursor:pointer;font-family:var(--ioc-sans);font-size:12.5px}
.ioc-footer .back-top .ico{width:16px;height:16px;transform:rotate(-90deg);transition:transform .2s var(--ioc-ease)}
.ioc-footer .back-top:hover .ico{transform:rotate(-90deg) translateX(3px)}

/* ---- cookie consent ---- */
/* C3 · corner card. A notice in the lower-left corner rather than a
   full-width curtain: the footer and the rest of the viewport stay
   readable, and it does not share the bottom-right with the chat
   launcher. Accept spans the card; reject sits beside preferences at
   the same size, so rejecting is still one click. */
.sh-cookie{position:fixed;z-index:var(--ioc-z-toast);left:20px;bottom:var(--lift-bottom,20px);transition:bottom .18s var(--ioc-ease);width:min(26rem,calc(100vw - 40px));background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-strong);border-top:3px solid var(--ioc-blue);box-shadow:0 1.5rem 4rem rgba(0,0,0,.18)}
.sh-cookie[hidden]{display:none}
.sh-cookie .cookie-grid{display:grid;grid-template-columns:1fr;gap:16px;padding:20px}
.sh-cookie .cookie-copy{max-width:none}
.sh-cookie .cookie-copy strong{display:block;margin-bottom:4px;font-size:15px}
.sh-cookie .cookie-copy p{margin:0;color:var(--ioc-text-secondary);font-size:13px;line-height:1.55}
.sh-cookie .cookie-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sh-cookie .cookie-actions .primary{grid-column:1/-1;order:-1}
.sh-cookie .cookie-actions .sh-cookie-btn{display:flex;align-items:center;justify-content:center;min-height:42px;font-size:13px;text-align:center}
.sh-cookie-btn{min-height:44px;padding:10px 16px;border:1px solid var(--ioc-text-primary);background:var(--ioc-surface,#fff);font-family:var(--ioc-sans);font-weight:600;font-size:13.5px;cursor:pointer;transition:background .16s var(--ioc-ease)}
.sh-cookie-btn:hover{background:var(--ioc-g10)}
.sh-cookie-btn.primary{border-color:var(--ioc-blue);background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff)}
.sh-cookie-btn.primary:hover{background:var(--ioc-blue-hover)}
.sh-cookie-dialog{width:min(calc(100% - 2rem),44rem);padding:0;border:0;background:var(--ioc-surface,#fff);box-shadow:0 2rem 6rem rgba(0,0,0,.35)}
.sh-cookie-dialog::backdrop{background:rgba(22,22,22,.64)}
.sh-cookie-dialog .cd-head{display:flex;align-items:flex-start;justify-content:space-between;gap:32px;padding:24px;border-bottom:1px solid var(--ioc-border-subtle)}
.sh-cookie-dialog .cd-k{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-blue)}
.sh-cookie-dialog .cd-head h2{margin:6px 0 0;font-size:26px;line-height:1.1;letter-spacing:-.02em}
.sh-cookie-dialog .icon-btn{width:44px;height:44px;display:grid;place-items:center;border:0;background:var(--ioc-surface,#fff);cursor:pointer}
.sh-cookie-dialog .icon-btn .ico{width:18px;height:18px}
.sh-cookie-dialog .cd-body{padding:24px}
.sh-cookie-dialog .cd-body>p{color:var(--ioc-text-secondary);line-height:1.6;font-size:14px;margin:0}
.sh-cookie-dialog .cookie-option{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;padding:16px 0;border-top:1px solid var(--ioc-border-subtle)}
.sh-cookie-dialog .cookie-option:first-of-type{margin-top:16px}
.sh-cookie-dialog .cookie-option strong{display:block;font-size:14.5px}
.sh-cookie-dialog .cookie-option small{display:block;margin-top:3px;color:var(--ioc-text-secondary);line-height:1.45;font-size:12.5px}
.sh-switch{position:relative;width:48px;height:26px;flex:none}
.sh-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.sh-switch .ui{position:absolute;inset:0;background:var(--ioc-g50,#8d8d8d);transition:background .2s var(--ioc-ease)}
.sh-switch .ui::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:var(--ioc-text-on-color,#fff);transition:transform .2s var(--ioc-ease)}
.sh-switch input:checked+.ui{background:var(--ioc-blue)}
.sh-switch input:checked+.ui::after{transform:translateX(22px)}
.sh-switch input:disabled+.ui{opacity:.6}
.sh-cookie-dialog .cd-actions{display:flex;justify-content:flex-end;gap:10px;padding:20px 24px;border-top:1px solid var(--ioc-border-subtle)}

/* ---- chat routing ---- */
/* --lift-bottom is written by ioc-site.js on both bottom-fixed overlays
   so each rides above whatever currently occupies the bottom of the
   viewport: the footer legal row, and for the launcher the consent
   card when they share a column. */
.sh-chat{position:fixed;z-index:var(--ioc-z-toast);right:20px;bottom:var(--lift-bottom,20px);transition:bottom .18s var(--ioc-ease)}
.sh-chat .chat-launcher{min-height:52px;display:flex;align-items:center;gap:10px;padding:12px 16px;border:0;background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff);font-family:var(--ioc-sans);font-weight:600;font-size:14px;box-shadow:0 12px 30px -10px rgba(0,1,255,.5);cursor:pointer;transition:background .2s var(--ioc-ease),transform .2s var(--ioc-ease),bottom .25s var(--ioc-ease)}
.sh-chat .chat-launcher:hover{background:var(--ioc-blue-hover);transform:translateY(-2px)}
.sh-chat .chat-launcher .ico{width:18px;height:18px}
.sh-chat .chat-panel{position:absolute;right:0;bottom:calc(100% + 12px);width:min(calc(100vw - 40px),23rem);background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);box-shadow:0 1.5rem 4rem rgba(0,0,0,.2);opacity:0;visibility:hidden;transform:translateY(10px) scale(.98);transform-origin:bottom right;transition:opacity .2s var(--ioc-ease),transform .25s var(--ioc-ease),visibility .2s}
.sh-chat .chat-panel.open{opacity:1;visibility:visible;transform:none}
.sh-chat .chat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px;border-bottom:1px solid var(--ioc-border-subtle)}
.sh-chat .chat-k{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-blue)}
.sh-chat .chat-head h2{margin:6px 0 0;font-size:22px;line-height:1.1;letter-spacing:-.02em}
.sh-chat .icon-btn{width:40px;height:40px;display:grid;place-items:center;border:0;background:var(--ioc-surface,#fff);cursor:pointer}
.sh-chat .icon-btn .ico{width:18px;height:18px}
.sh-chat .chat-body{padding:16px}
.sh-chat .chat-body>p{margin:2px 0 12px;color:var(--ioc-text-secondary);font-size:13px;line-height:1.55}
.sh-chat .chat-route{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid var(--ioc-border-subtle);color:var(--ioc-text-primary)}
.sh-chat .chat-route:first-of-type{border-top:0}
.sh-chat .chat-route strong{display:block;font-size:14px}
.sh-chat .chat-route small{display:block;margin-top:2px;color:var(--ioc-text-secondary);font-size:12px}
.sh-chat .chat-route .ico{width:16px;height:16px;color:var(--ioc-blue);transition:transform .2s var(--ioc-ease)}
.sh-chat .chat-route:hover{color:var(--ioc-blue)}
.sh-chat .chat-route:hover .ico{transform:translateX(3px)}
.sh-chat .chat-foot{padding:14px 16px;background:var(--ioc-g10);color:var(--ioc-text-secondary);font-size:12px;line-height:1.5}

/* ---- shell responsive ---- */
@media(max-width:1180px){
  .ioc-header .nav-link,.ioc-header .nav-trigger{padding:0 11px;font-size:13.5px}
  .ioc-header .brand{margin-right:18px}
}
@media(max-width:1000px){
  .ioc-header .nav,.ioc-header .search-open,.ioc-header .top-cta{display:none}
  .ioc-header .mobile-toggle{display:grid}
  .ioc-header .header-row{height:64px}
  .ioc-header .mega{display:none}
}
@media(max-width:900px){
  .ioc-footer .footer-cta-grid{grid-template-columns:1fr}
  .ioc-footer .footer-action{padding:32px 0 0;border-left:0;border-top:1px solid var(--ioc-selected-border,#c6d9ff)}
  .ioc-footer .route-grid{grid-template-columns:1fr;border-inline:0}
  .ioc-footer .route{border-right:0;border-top:1px solid var(--ioc-border-subtle)}
  .ioc-footer .route:first-child{border-top:0}
  .ioc-footer .footer-main-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,4vw,3rem)}
  .ioc-footer .footer-brand{grid-column:1/-1;padding-right:0;padding-bottom:28px;border-right:0;border-bottom:1px solid var(--ioc-border-subtle)}
  .ioc-footer .footer-menu{padding-left:0}
}
@media(max-width:560px){
  .ioc-footer .footer-action-points{grid-template-columns:1fr}
  .ioc-footer .footer-main-grid{grid-template-columns:1fr 1fr;column-gap:24px}
  .ioc-footer .footer-menu:last-child{grid-column:1/-1}
  .ioc-footer .legal-row{flex-direction:column;align-items:flex-start}
  /* Card and chat launcher share the bottom edge; on a narrow screen
     the card spans it and the launcher sits above. */
  .sh-cookie{left:12px;right:12px;width:auto}
  .sh-chat .chat-launcher span{display:none}
  .sh-chat .chat-launcher{width:52px;justify-content:center;padding:0}
}

/* ========================================================
   PAGE SHELL — breadcrumb, hero, section heads
   ======================================================== */
.crumb{border-bottom:1px solid var(--ioc-border-subtle)}
.crumb .crumb-inner{max-width:var(--ioc-maxw);margin:0 auto;padding:14px var(--ioc-gutter);display:flex;align-items:center;gap:10px;font-family:var(--ioc-mono);font-size:12px;letter-spacing:.3px;color:var(--ioc-text-helper)}
.crumb a{color:var(--ioc-text-helper)}
.crumb a:hover{color:var(--ioc-blue)}
.crumb .sep{color:var(--ioc-g30)}
.crumb .cur{color:var(--ioc-text-primary)}

/* refined in-hero breadcrumb: bordered back-chevron + path trail */
.ph-trail{display:flex;align-items:center;gap:14px;margin-bottom:32px}
.ph-trail .back{width:36px;height:36px;flex:none;border:1px solid var(--ioc-border-strong);display:flex;align-items:center;justify-content:center;color:var(--ioc-text-primary);transition:background .12s,color .12s,border-color .12s}
.ph-trail .back svg{width:16px;height:16px}
.ph-trail .back:hover{background:var(--ioc-blue);border-color:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff)}
.ph-trail .path{display:flex;align-items:center;gap:9px;font-family:var(--ioc-mono);font-size:12px;letter-spacing:.3px;text-transform:uppercase}
.ph-trail .path a{color:var(--ioc-crumb,#5c5c5c)}
.ph-trail .path a:hover{color:var(--ioc-blue)}
.ph-trail .path .sep{color:var(--ioc-g30)}
.ph-trail .path .cur{color:var(--ioc-crumb-current,#0001ff)}

.page-hero{border-bottom:1px solid var(--ioc-border-subtle)}
/* hero 07 — capability tags, single column */
.page-hero .ph-solo{padding:88px 0 80px}
.page-hero .ph-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}
.page-hero .ph-solo h1{max-width:18ch}
.page-hero .ph-solo .ph-lede{max-width:56ch}
.page-hero .ph-solo .ph-cta{display:flex;flex-wrap:wrap;gap:0;margin-top:36px}

/* hero — solo with side figure (uses .phf-frame) */
.page-hero .ph-solo.has-fig{display:grid;grid-template-columns:minmax(0,1fr) clamp(320px,38%,560px);column-gap:64px;align-items:center}
.ph-solo.has-fig>*{grid-column:1}
.ph-solo.has-fig .ph-fig{grid-column:2;grid-row:1/span 9;align-self:stretch;display:flex;border-left:1px solid var(--ioc-border-subtle);padding:0 0 0 48px}
.ph-solo.has-fig .ph-fig .phf-frame{flex:1;min-height:380px}
@media(max-width:980px){
  .page-hero .ph-solo.has-fig{display:block}
  .ph-solo.has-fig .ph-fig{border-left:0;padding:0;margin-top:44px}
  .ph-solo.has-fig .ph-fig .phf-frame{min-height:280px}
}

/* imagery motion — slow ken-burns on frame hover */
.phf-frame .pic img{transition:transform var(--ioc-dur-reveal) var(--ioc-ease-out)}
.phf-frame:hover .pic img{transform:scale(1.03)}

/* index — industry figures */
.indcell .indfig{margin-bottom:20px;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--ioc-border-subtle);background:var(--ioc-g10)}
.indcell .indfig img{width:100%;height:100%;object-fit:cover;transition:transform var(--ioc-dur-reveal) var(--ioc-ease-out)}
.indcell:hover .indfig img{transform:scale(1.04)}

/* hero — feature (image + focus strip) */
.page-hero.ph-feature .phf{display:grid;grid-template-columns:repeat(16,1fr);align-items:stretch}
.page-hero.ph-feature .phf-main{grid-column:1 / 9;padding:80px 48px 72px 0;display:flex;flex-direction:column;justify-content:center}
.page-hero.ph-feature .phf-main h1{max-width:16ch}
.page-hero.ph-feature .phf-main .ph-lede{max-width:50ch;margin-top:24px}
.page-hero.ph-feature .phf-main .ph-cta{display:flex;flex-wrap:wrap;gap:0;margin-top:36px}
.page-hero.ph-feature .phf-fig{grid-column:9 / 17;border-left:1px solid var(--ioc-border-subtle);padding:40px 0 40px 40px;display:flex}
.phf-frame{border:1px solid var(--ioc-border-subtle);flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:400px}
.phf-frame .cap{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--ioc-border-subtle);background:var(--ioc-g10);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.3px;text-transform:uppercase;color:var(--ioc-text-helper)}
.phf-frame .cap .dots{display:flex;gap:6px}
.phf-frame .cap .dots i{width:8px;height:8px;border:1px solid var(--ioc-g40);display:block}
.phf-frame .cap .dots i:first-child{background:var(--ioc-blue);border-color:var(--ioc-blue)}
.phf-frame .pic{flex:1;position:relative;background:var(--ioc-g10);min-height:320px}
.phf-frame .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* focus / tags strip */
.page-hero.ph-feature .phf-bar{display:grid;grid-template-columns:repeat(16,1fr);border-top:1px solid var(--ioc-border-strong);align-items:center}
.page-hero.ph-feature .phf-bar .bk{grid-column:1 / 4;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.3px;text-transform:uppercase;color:var(--ioc-text-helper);padding:22px 0}
.page-hero.ph-feature .phf-bar .bt{grid-column:4 / 17;display:flex;flex-wrap:wrap;gap:8px;padding:18px 0}
@media(max-width:980px){
  .page-hero.ph-feature .phf-main{grid-column:1/17;padding:64px 0 40px}
  .page-hero.ph-feature .phf-fig{grid-column:1/17;border-left:0;border-top:1px solid var(--ioc-border-subtle);padding:32px 0 0}
  .phf-frame{min-height:300px}
  .page-hero.ph-feature .phf-bar .bk{grid-column:1/17;padding:24px 0 0}
  .page-hero.ph-feature .phf-bar .bt{grid-column:1/17;padding:14px 0 24px}
}
.page-hero .ph-grid{display:grid;grid-template-columns:repeat(16,1fr);align-items:end}
.page-hero .ph-main{grid-column:1 / 12;padding:72px 32px 64px 0}
.page-hero .ph-side{grid-column:12 / 17;border-left:1px solid var(--ioc-border-subtle);padding:48px 0 56px 40px;align-self:stretch;display:flex;flex-direction:column;justify-content:flex-end;gap:24px}
.page-hero h1{margin:22px 0 0;max-width:18ch}
.page-hero .ph-lede{margin:26px 0 0;max-width:52ch}
.page-hero .ph-side .pk{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.4px;text-transform:uppercase;color:var(--ioc-text-helper)}
.page-hero .ph-side .pv{font-size:17px;margin-top:6px;font-weight:500;letter-spacing:-.01em}
.page-hero .ph-side .pv b{color:var(--ioc-blue)}
@media(max-width:980px){.page-hero .ph-main{grid-column:1/17;padding-right:0}.page-hero .ph-side{grid-column:1/17;border-left:0;border-top:1px solid var(--ioc-border-subtle);padding:32px 0 0;margin-top:32px;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;gap:40px}}

.sec-head{display:grid;grid-template-columns:repeat(16,1fr);align-items:end;padding-bottom:56px}
.sec-head .sh-l{grid-column:1 / 11}
.sec-head .sh-r{grid-column:12 / 17;display:flex;justify-content:flex-end;align-items:flex-end}
.sec-head h2{margin-top:18px;max-width:20ch}
@media(max-width:980px){.sec-head .sh-l,.sec-head .sh-r{grid-column:1/17}.sec-head .sh-r{justify-content:flex-start;margin-top:24px}}

/* ========================================================
   DATA TABLE (borrowed from Direction C)
   ======================================================== */
.dtable{border:1px solid var(--ioc-border-subtle)}
.dtable .dt-row{display:grid;align-items:center;border-bottom:1px solid var(--ioc-border-subtle);transition:background .16s var(--ioc-ease),box-shadow .16s var(--ioc-ease)}
.dtable .dt-row:last-child{border-bottom:0}
.dtable .dt-row:hover:not(.head){background:var(--ioc-g10);box-shadow:inset 3px 0 0 var(--ioc-blue)}
.dtable .dt-row:hover:not(.head) .tg svg{transform:translateX(3px)}
.dtable .tg svg{transition:transform .2s var(--ioc-ease)}
.dtable .dt-row.head{background:var(--ioc-g10);border-bottom:1px solid var(--ioc-border-strong)}
.dtable .dt-row.head>div{font-family:var(--ioc-mono);font-size:11px;text-transform:uppercase;letter-spacing:.3px;color:var(--ioc-text-helper);padding:12px 18px}
.dtable .dt-row>div{padding:20px 18px}
.dtable .ti{font-family:var(--ioc-mono);font-size:12px;color:var(--ioc-blue)}
.dtable .tn{font-weight:600;font-size:16px;letter-spacing:-.005em}
.dtable .td{font-size:14px;color:var(--ioc-text-secondary);line-height:1.5}
.dtable .tt{font-family:var(--ioc-mono);font-size:12px;color:var(--ioc-text-secondary)}
.dtable .tg{color:var(--ioc-blue);display:flex}

/* ========================================================
   CARD GRID + feature tiles
   ======================================================== */
/* Card grids — de-boxed: whitespace separates, hairlines reserved for data */
/* Card grids — de-boxed: whitespace separates, hairlines reserved for data */
.cardgrid{display:grid;gap:40px 32px}
.cardgrid.c2{grid-template-columns:repeat(2,1fr)}
.cardgrid.c3{grid-template-columns:repeat(3,1fr)}
.cardgrid.c4{grid-template-columns:repeat(4,1fr)}
.ucard{background:transparent;padding:24px 0 0;display:flex;flex-direction:column;min-height:0;position:relative;transition:color .18s var(--ioc-ease)}
.ucard::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--ioc-border-subtle)}
.ucard::after{content:"";position:absolute;top:0;left:0;height:2px;width:0;background:var(--ioc-accent);transition:width .45s var(--ioc-ease)}
.ucard:hover::after{width:100%}
.ucard:hover h4,.ucard:hover h3{color:var(--ioc-accent)}
.ucard .uk{width:44px;height:44px;border:1px solid var(--ioc-accent);color:var(--ioc-accent);margin-bottom:24px;display:flex;align-items:center;justify-content:center;transition:background .18s var(--ioc-ease),color .18s var(--ioc-ease)}
.ucard .uk svg{width:24px;height:24px;display:block}
.ucard:hover .uk{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.ucard .ueyebrow{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.4px;text-transform:uppercase;color:var(--ioc-text-helper);margin-bottom:12px}
.ucard h3{font-size:21px;letter-spacing:-.01em;max-width:18ch}
.ucard h4{font-size:18px;letter-spacing:-.005em}
.ucard p{margin:12px 0 0;font-size:14.5px;color:var(--ioc-text-secondary);line-height:1.55}
.ucard .ulink{margin-top:auto;padding-top:24px;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.3px;text-transform:uppercase;color:var(--ioc-blue);transition:letter-spacing .18s var(--ioc-ease)}
.ucard:hover .ulink{letter-spacing:.8px}
.ucard .tnum{font-family:var(--ioc-mono);font-size:12px;color:var(--ioc-blue);margin-bottom:14px}
@media(max-width:980px){.cardgrid.c3,.cardgrid.c4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.cardgrid.c2,.cardgrid.c3,.cardgrid.c4{grid-template-columns:1fr}}

/* stat strip */
.statstrip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--ioc-border-subtle)}
.statstrip .st{padding:40px 28px;border-left:1px solid var(--ioc-border-subtle)}
.statstrip .st:first-child{border-left:0}
.statstrip .st .sn{font-size:48px;font-weight:300;letter-spacing:-.02em;line-height:1}
.statstrip .st .sn b{color:var(--ioc-blue);font-weight:600}
.statstrip .st .sl{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.3px;text-transform:uppercase;color:var(--ioc-text-helper);margin-top:12px}
@media(max-width:780px){.statstrip{grid-template-columns:1fr 1fr}.statstrip .st:nth-child(odd){border-left:0}}

/* ========================================================
   PROSE (About / article body)
   ======================================================== */
.prose{max-width:none}
.prose p{font-size:17px;line-height:1.65;color:var(--ioc-text-secondary);margin:0 0 22px;font-weight:300}
.prose p.lead{font-size:clamp(19px,1.6vw,23px);color:var(--ioc-text-primary);font-weight:400;line-height:1.5}
.prose h3{font-size:26px;margin:48px 0 18px;letter-spacing:-.015em}
.prose h4{font-size:18px;margin:32px 0 10px}
.prose ul{margin:0 0 22px;padding:0;list-style:none}
.prose ul li{position:relative;padding:10px 0 10px 28px;font-size:16px;color:var(--ioc-text-secondary);border-bottom:1px solid var(--ioc-border-subtle);line-height:1.5}
.prose ul li::before{content:"";position:absolute;left:0;top:18px;width:10px;height:10px;background:var(--ioc-blue)}
.prose blockquote{margin:32px 0;padding:24px 0 24px 28px;border-left:2px solid var(--ioc-blue);font-size:clamp(20px,2vw,28px);font-weight:300;letter-spacing:-.01em;color:var(--ioc-text-primary);line-height:1.3}

/* ========================================================
   FORM (Contact) — Carbon fields
   ======================================================== */
.field{display:flex;flex-direction:column;margin-bottom:1px;background:var(--ioc-g10);border:1px solid var(--ioc-border-subtle);border-bottom:2px solid var(--ioc-g50);transition:border-color .14s var(--ioc-ease),background .14s var(--ioc-ease),box-shadow .14s var(--ioc-ease)}
.field:hover{border-bottom-color:var(--ioc-g70)}
.field:focus-within{background:var(--ioc-surface,#fff);border-color:var(--ioc-blue);box-shadow:inset 0 0 0 1px var(--ioc-blue)}
.field label{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.3px;text-transform:uppercase;color:var(--ioc-text-helper);padding:12px 16px 2px;transition:color .14s var(--ioc-ease)}
.field:focus-within label{color:var(--ioc-blue)}
.field input,.field select,.field textarea{font-family:var(--ioc-sans);font-size:15px;color:var(--ioc-text-primary);background:transparent;border:0;padding:6px 16px 13px;outline:none;width:100%}
.field input::placeholder,.field textarea::placeholder{color:var(--ioc-placeholder)}
.field textarea{resize:vertical;min-height:120px}
.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.formgrid .field{border:0;border-bottom:2px solid var(--ioc-g50)}
.formgrid .field:focus-within{box-shadow:inset 0 0 0 1px var(--ioc-blue)}
.formgrid .full{grid-column:1 / -1}
@media(max-width:640px){.formgrid{grid-template-columns:1fr}}

/* ========================================================
   CTA band (shared dark)
   ======================================================== */
.cta-band{background:var(--ioc-g100);color:var(--ioc-text-on-color,#fff)}
.cta-band .cta-grid{display:grid;grid-template-columns:repeat(16,1fr);align-items:center}
.cta-band .cta-l{grid-column:1 / 10;padding:96px 40px 96px 0}
.cta-band .cta-r{grid-column:10 / 17;border-left:1px solid var(--ioc-g80,#393939);padding:96px 0 96px 48px;display:flex;flex-direction:column;gap:1px}
.cta-band h2{color:var(--ioc-text-on-color,#fff);max-width:18ch;margin-top:20px}
.cta-band p{color:var(--ioc-g40,#a8a8a8);max-width:48ch;margin:24px 0 0;font-weight:300;font-size:18px}
.cta-band .eyebrow{color:var(--ioc-g50,#8d8d8d)}
@media(max-width:980px){.cta-band .cta-l,.cta-band .cta-r{grid-column:1/17}.cta-band .cta-r{border-left:0;border-top:1px solid var(--ioc-g80,#393939);padding:0 0 0}.cta-band .cta-l{padding-right:0}}

.section-g10{background:var(--ioc-g10)}
.img-figure{border:1px solid var(--ioc-border-subtle);background:var(--ioc-g10);overflow:hidden}
.img-figure img{width:100%;height:100%;object-fit:cover;display:block}

/* branded panel — product-screen abstraction (shared) */
.brandpanel{border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff);display:flex;flex-direction:column;overflow:hidden;width:100%}
.brandpanel .bp-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--ioc-border-subtle);background:var(--ioc-g10)}
.brandpanel .bp-bar .dots{display:flex;gap:6px}
.brandpanel .bp-bar .dots i{width:9px;height:9px;border:1px solid var(--ioc-g40);display:block}
.brandpanel .bp-bar .dots i:first-child{background:var(--ioc-blue);border-color:var(--ioc-blue)}
.brandpanel .bp-cap{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.3px;text-transform:uppercase;color:var(--ioc-text-helper)}
.brandpanel .bp-canvas{display:block}
.brandpanel .bp-canvas svg{width:100%;height:auto;display:block}

/* ========================================================
   BLOG CARD (shared) — insight tile
   ======================================================== */
.post2{background:var(--ioc-surface,#fff);display:flex;flex-direction:column;transition:background .18s var(--ioc-ease),box-shadow .18s var(--ioc-ease)}
.post2:hover{background:var(--ioc-surface,#fff);box-shadow:var(--ioc-shadow-card);position:relative;z-index:2}
.post2 .p2-thumb{aspect-ratio:16/10;border-bottom:1px solid var(--ioc-border-subtle);background:var(--ioc-g10);position:relative;overflow:hidden}
.post2 .p2-thumb .ln{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 23px,var(--ioc-border-subtle) 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,var(--ioc-border-subtle) 23px 24px)}
.post2 .p2-thumb .glyph{position:absolute;left:22px;bottom:18px;width:30px;height:30px;background:var(--ioc-blue)}
.post2 .p2-body{padding:24px 24px 28px;display:flex;flex-direction:column;flex:1;gap:14px}
.post2 .p2-cat{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.3px;text-transform:uppercase;color:var(--ioc-blue)}
.post2 h4{font-size:18px;line-height:1.28;letter-spacing:-.01em}
.post2 .p2-meta{margin-top:auto;font-family:var(--ioc-mono);font-size:12px;color:var(--ioc-text-helper)}
.post2:hover h4{color:var(--ioc-blue)}

/* ========================================================
   Scroll-reveal & motion: owned by ioc-motion.js (shared).
   ======================================================== */

/* Progressive disclosure — native details */
.disclose{border-top:1px solid var(--ioc-border-subtle);border-bottom:1px solid var(--ioc-border-subtle)}
.disclose summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:20px 0;font-weight:500;font-size:15px}
.disclose summary::-webkit-details-marker{display:none}
.disclose .chev{width:16px;height:16px;transition:transform .2s var(--ioc-ease)}
.disclose[open] .chev{transform:rotate(180deg)}
.disclose-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s var(--ioc-ease)}
.disclose[open] .disclose-body{grid-template-rows:1fr}
.disclose-body>*{overflow:hidden}

/* InvoiceNow — the ONLY amber on the site */
:root{--ioc-amber:#b45309;--ioc-amber-bg:#fdf6ec;--ioc-amber-line:#e8c79a}
.inv-band{background:var(--ioc-amber-bg);border-top:1px solid var(--ioc-amber-line);border-bottom:1px solid var(--ioc-amber-line)}
.inv-band .wrap{display:flex;gap:24px;align-items:baseline;padding:20px var(--ioc-gutter);flex-wrap:wrap}
.inv-band .ik{font-family:var(--ioc-mono);font-size:12px;letter-spacing:.4px;text-transform:uppercase;color:var(--ioc-amber);white-space:nowrap}
.inv-band p{margin:0;font-size:15px;color:var(--ioc-text-primary);max-width:70ch}
.inv-band a{color:var(--ioc-amber);border-bottom:1px solid currentColor;font-weight:500}

::marker{color:var(--ioc-blue)}

/* service page: spec band */
.specband{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--ioc-border-subtle);border-top:1px solid var(--ioc-border-subtle);border-bottom:1px solid var(--ioc-border-subtle)}
@media(max-width:900px){.specband{grid-template-columns:1fr 1fr}}
.specband .sp{background:var(--ioc-white);padding:28px 24px}
.specband .sp .k{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-blue);margin:0 0 10px}
.specband .sp .v{font-size:15px;color:var(--ioc-text-primary);font-weight:600;letter-spacing:-.01em;margin:0}
.specband .sp .d{font-size:13px;color:var(--ioc-text-secondary);margin:6px 0 0;line-height:1.5}

/* service page: FAQ */
.faq{border-top:1px solid var(--ioc-border-subtle)}
details.qa{border-bottom:1px solid var(--ioc-border-subtle)}
details.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:baseline;padding:22px 0;font-weight:600;font-size:17px;letter-spacing:-.01em;color:var(--ioc-text-primary)}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary .qi{font-family:var(--ioc-mono);font-size:13px;color:var(--ioc-blue);flex:none;transition:transform .2s var(--ioc-ease)}
details.qa[open] summary .qi{transform:rotate(45deg)}
details.qa .qa-a{padding:0 0 24px;max-width:70ch;color:var(--ioc-text-secondary);font-size:15px;line-height:1.65}

/* service page: related links */
.relrow{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
@media(max-width:760px){.relrow{grid-template-columns:1fr}}
.relrow a{background:var(--ioc-white);padding:26px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px;position:relative;overflow:hidden;transition:background .18s var(--ioc-ease)}
.relrow a::after{content:"";position:absolute;top:0;left:0;height:2px;width:0;background:var(--ioc-accent);transition:width .45s var(--ioc-ease)}
.relrow a:hover::after{width:100%}
.relrow a:hover{background:var(--ioc-g10)}
.relrow a .rl{font-weight:600;font-size:15.5px;letter-spacing:-.01em;color:var(--ioc-text-primary)}
.relrow a .rl small{display:block;font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-text-helper);margin-top:6px;font-weight:400}
.relrow a svg{width:18px;height:18px;color:var(--ioc-blue);flex:none;transition:transform .2s var(--ioc-ease)}
.relrow a:hover svg{transform:translateX(4px)}
.ioc-header{transition:box-shadow .25s var(--ioc-ease)}
.ioc-header.scrolled{box-shadow:0 10px 28px -18px rgba(15,17,60,.22)}


/* ========================================================
   Reduced motion — hard kill-switch (WCAG). Reveals render
   final; hover micro-interactions remain but are instant.
   ======================================================== */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  [data-reveal],[data-stagger]>*{opacity:1 !important;transform:none !important}
}

/* image placeholder — line grid + glyph (interim until custom SVG) */
.pic-ph{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 23px,var(--ioc-border-subtle) 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,var(--ioc-border-subtle) 23px 24px)}
.pic-ph .glyph{position:absolute;left:22px;bottom:18px;width:30px;height:30px;background:var(--ioc-blue)}

/* ========================================================
   INFOC V1 HERO PATTERNS (standard) — home + inner
   Two-panel copy/visual, outcome overlay, home rail,
   inner-page crumbs/meta/technical-visual/capability matrix.
   ======================================================== */
.v1hero{background:linear-gradient(180deg,var(--ioc-surface,#fff) 0%,var(--ioc-surface-subtle,#fbfbfb) 100%);border-bottom:1px solid var(--ioc-border-subtle);padding:clamp(20px,3vw,36px) 0 clamp(28px,4vw,44px)}
.v1hero .hero-shell{display:grid;gap:16px}
.v1hero .hero-main{display:grid;grid-template-columns:minmax(26rem,5fr) minmax(34rem,7fr);gap:16px;align-items:stretch}
.v1hero .copy-panel,.v1hero .inner-copy{min-width:0;background:var(--ioc-g10);border:1px solid var(--ioc-border-subtle);padding:clamp(28px,3vw,52px);display:flex;flex-direction:column;justify-content:center;min-height:36rem}
.v1hero .h-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 18px;color:var(--ioc-text-primary);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.v1hero .h-eyebrow::before{content:"";width:26px;height:2px;background:var(--ioc-blue);flex:none}
.v1hero h1{margin:0;max-width:13ch;font-size:clamp(44px,5.2vw,86px);font-weight:800;line-height:.96;letter-spacing:-.045em;text-wrap:balance}
.v1hero h1 .em{color:var(--ioc-blue)}
.v1hero .h-lede{max-width:36ch;margin:22px 0 0;color:var(--ioc-text-secondary);font-size:clamp(16px,1.2vw,19px);line-height:1.6;text-wrap:pretty}
.v1hero .h-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.v1hero .h-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 22px;border:1px solid var(--ioc-blue);background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff);font-weight:600;font-size:15px;transition:background .2s var(--ioc-ease),transform .2s var(--ioc-ease)}
.v1hero .h-btn svg{width:16px;height:16px;transition:transform .2s var(--ioc-ease)}
.v1hero .h-btn:hover{background:var(--ioc-blue-hover);transform:translateY(-1px)}
.v1hero .h-btn:hover svg{transform:translateX(3px)}
.v1hero .h-btn.ghost{background:transparent;color:var(--ioc-text-primary);border-color:var(--ioc-border-strong)}
.v1hero .h-btn.ghost:hover{background:var(--ioc-surface,#fff);border-color:var(--ioc-text-primary)}
.v1hero .proof-list{display:flex;flex-wrap:wrap;gap:12px 22px;margin:26px 0 0;list-style:none}
.v1hero .proof-list li{display:flex;align-items:center;gap:8px;color:var(--ioc-text-secondary);font-size:14px}
.v1hero .proof-list li::before{content:"";width:8px;height:8px;background:var(--ioc-green);flex:none}
.v1hero .visual-panel,.v1hero .tech-visual{position:relative;min-width:0;border:1px solid var(--ioc-border-subtle);background:var(--ioc-g20);overflow:hidden;min-height:36rem}
.v1hero .visual-panel img,.v1hero .tech-visual img{width:100%;height:100%;object-fit:cover;display:block}
.v1hero .img-caption{position:absolute;left:16px;bottom:16px;z-index:3;display:flex;justify-content:space-between;gap:16px;align-items:flex-end;width:calc(100% - 32px);color:var(--ioc-text-on-color,#fff);font-size:11px;text-shadow:0 1px 4px rgba(0,0,0,.4)}
.v1hero .img-caption strong{font-weight:600}
.v1hero .img-caption span{font-family:var(--ioc-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-g20,#e0e0e0);white-space:nowrap}
.v1hero .capability-strip{position:absolute;left:16px;right:16px;bottom:60px;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.94);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.18)}
.v1hero .hcap{min-width:0;display:grid;grid-template-columns:1.8rem 1fr;gap:11px;align-items:center;padding:13px 15px;border-right:1px solid var(--ioc-border-subtle)}
.v1hero .hcap:last-child{border-right:0}
.v1hero .hcap svg{width:22px;height:22px;color:var(--ioc-blue)}
.v1hero .hcap strong{display:block;font-size:13px;letter-spacing:-.005em}
.v1hero .hcap span{display:block;margin-top:2px;color:var(--ioc-text-secondary);font-size:11.5px;line-height:1.35}
.v1hero .hcap.is-blue{background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff)}
.v1hero .hcap.is-blue svg{color:var(--ioc-text-on-color,#fff)}
.v1hero .hcap.is-blue span{color:var(--ioc-text-on-brand-muted,#d0d0ff)}
.v1hero .outcome{position:absolute;right:16px;top:50%;transform:translateY(-50%);z-index:4;width:min(23rem,calc(100% - 32px));background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);box-shadow:0 16px 40px rgba(22,22,22,.18)}
.v1hero .outcome-head{display:flex;justify-content:space-between;align-items:center;min-height:48px;padding:0 16px;border-bottom:1px solid var(--ioc-border-subtle);font-family:var(--ioc-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper)}
.v1hero .outcome-head .live{color:var(--ioc-green);display:flex;gap:7px;align-items:center}
.v1hero .outcome-head .live::before{content:"";width:7px;height:7px;background:var(--ioc-green)}
.v1hero .route{position:relative;width:100%;display:grid;grid-template-columns:1.4rem 1fr auto;align-items:start;gap:11px;padding:14px 16px;border:0;border-bottom:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff);text-align:left;cursor:pointer;font-family:var(--ioc-sans);transition:background .18s var(--ioc-ease)}
.v1hero .route:hover{background:var(--ioc-hover-wash,#f7faff)}
.v1hero .route[aria-pressed="true"]{background:var(--ioc-selected-surface,#edf5ff)}
.v1hero .route[aria-pressed="true"]::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ioc-blue)}
.v1hero .route .rix{color:var(--ioc-blue);font-family:var(--ioc-mono);font-size:10px;padding-top:2px}
.v1hero .route strong{display:block;font-size:13.5px;line-height:1.2;color:var(--ioc-text-primary)}
.v1hero .route small{display:block;margin-top:3px;color:var(--ioc-text-secondary);font-size:12px;line-height:1.35}
.v1hero .route .rarr{width:16px;height:16px;color:var(--ioc-blue);transition:transform .18s var(--ioc-ease)}
.v1hero .route:hover .rarr{transform:translateX(2px)}
.v1hero .outcome-result{padding:16px;background:var(--ioc-g100);color:var(--ioc-text-on-color,#fff)}
.v1hero .outcome-result span{display:block;color:var(--ioc-g40,#a8a8a8);font-family:var(--ioc-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.v1hero .outcome-result strong{display:block;margin:6px 0 4px;font-size:16px;letter-spacing:-.01em}
.v1hero .outcome-result p{margin:0;color:var(--ioc-g30,#c6c6c6);font-size:12.5px;line-height:1.45}
.v1hero .home-rail{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:16px}
.v1hero .rail-card{min-width:0;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;min-height:6.5rem;padding:20px 22px;border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff)}
.v1hero .rail-card.soft{background:var(--ioc-g10)}
.v1hero a.rail-card.strong{background:var(--ioc-blue);border-color:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff);transition:background .2s var(--ioc-ease)}
.v1hero a.rail-card.strong:hover{background:var(--ioc-blue-hover)}
.v1hero .rail-card .rc-n{font-size:clamp(32px,2.8vw,48px);font-weight:700;line-height:.9;letter-spacing:-.05em;color:var(--ioc-text-primary);font-variant-numeric:tabular-nums}
.v1hero .rail-card .rc-ic{width:34px;height:34px;color:var(--ioc-text-on-color,#fff)}
.v1hero .rail-copy{min-width:0}
.v1hero .rail-copy span{display:block;margin-bottom:3px;font-family:var(--ioc-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--ioc-text-helper)}
.v1hero .rail-card.strong .rail-copy span{color:var(--ioc-text-on-brand-muted,#d0d0ff)}
.v1hero .rail-copy p{margin:0;color:var(--ioc-text-secondary);font-size:13px;line-height:1.45}
.v1hero .rail-card.strong .rail-copy p{color:var(--ioc-text-on-color,#fff);font-weight:600}
/* inner-page hero extras */
.v1hero .crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:16px;color:var(--ioc-text-helper);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.04em}
.v1hero .crumbs a{color:var(--ioc-text-helper)}
.v1hero .crumbs a:hover{color:var(--ioc-blue)}
.v1hero .crumbs .sep{color:var(--ioc-g30)}
.v1hero .crumbs .cur{color:var(--ioc-blue)}
.v1hero .inner-copy h1{max-width:12ch}
.v1hero .inner-copy .h-lede{max-width:34ch}
.v1hero .inner-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.v1hero .inner-meta div{display:flex;flex-direction:column;gap:5px;min-width:10.5rem;padding:12px 14px;border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff)}
.v1hero .inner-meta small{font-family:var(--ioc-mono);color:var(--ioc-text-helper);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.v1hero .inner-meta strong{font-size:14px;letter-spacing:-.005em}
.v1hero .tech-chip{position:absolute;left:16px;top:16px;z-index:3;display:inline-flex;flex-direction:column;gap:4px;max-width:20rem;padding:12px 14px;border:1px solid rgba(224,224,224,.85);background:rgba(255,255,255,.92);box-shadow:0 10px 24px rgba(22,22,22,.08)}
.v1hero .tech-chip strong{font-size:13px;line-height:1.3}
.v1hero .tech-chip span{color:var(--ioc-text-secondary);font-family:var(--ioc-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase}
.v1hero .cap-matrix{position:absolute;right:16px;bottom:16px;z-index:3;width:min(22rem,calc(100% - 32px));display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ioc-border-subtle);background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 16px 40px rgba(22,22,22,.12)}
.v1hero .cap{padding:14px;border-right:1px solid var(--ioc-border-subtle);border-bottom:1px solid var(--ioc-border-subtle);display:flex;flex-direction:column;min-height:7rem}
.v1hero .cap:nth-child(2n){border-right:0}
.v1hero .cap:nth-last-child(-n+2){border-bottom:0}
.v1hero .cap .cix{color:var(--ioc-blue);font-family:var(--ioc-mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase}
.v1hero .cap strong{margin:auto 0 3px;font-size:15px}
.v1hero .cap span:last-child{color:var(--ioc-text-secondary);font-size:12px;line-height:1.4}
@media(max-width:1100px){
  .v1hero .hero-main{grid-template-columns:1fr}
  .v1hero .copy-panel,.v1hero .inner-copy{min-height:auto}
  .v1hero .visual-panel,.v1hero .tech-visual{min-height:30rem}
  .v1hero .outcome{top:auto;bottom:16px;transform:none}
  .v1hero .home-rail{grid-template-columns:1fr}
}
@media(max-width:700px){
  .v1hero h1{font-size:clamp(40px,11vw,58px)}
  .v1hero .h-actions{display:grid}.v1hero .h-btn{width:100%}
  .v1hero .visual-panel,.v1hero .tech-visual{display:flex;flex-direction:column;overflow:visible;min-height:auto}
  .v1hero .visual-panel img,.v1hero .tech-visual img{height:20rem}
  .v1hero .outcome,.v1hero .cap-matrix{position:relative;right:auto;top:auto;bottom:auto;transform:none;width:100%;box-shadow:none}
  .v1hero .capability-strip{position:relative;left:auto;right:auto;bottom:auto;grid-template-columns:1fr;box-shadow:none}
  .v1hero .hcap{border-right:0;border-bottom:1px solid var(--ioc-border-subtle)}
  .v1hero .hcap:last-child{border-bottom:0}
  .v1hero .img-caption{position:static;width:auto;padding:12px 14px;background:var(--ioc-g100)}
  .v1hero .tech-chip{display:none}
  .v1hero .inner-meta{display:grid;grid-template-columns:1fr}
  .v1hero .cap-matrix{grid-template-columns:1fr}.v1hero .cap{border-right:0}
}

/* ========================================================
   INFOC WEB ELEMENTS (InfocBrandUI v1) — ui-* primitives
   Square, hairline, token-driven. One owner, no leakage.
   ======================================================== */
/* alerts / notices */
.ui-alert{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border:1px solid var(--ioc-border-subtle);border-left:3px solid var(--ioc-blue);background:var(--ioc-white)}
.ui-alert .ai{width:20px;height:20px;flex:none;color:var(--ioc-blue);margin-top:1px}
.ui-alert .at{font-weight:600;font-size:14.5px;letter-spacing:-.01em;margin:0 0 3px;color:var(--ioc-text-primary)}
.ui-alert .ad{margin:0;font-size:13.5px;color:var(--ioc-text-secondary);line-height:1.5}
.ui-alert.is-success{border-left-color:var(--ioc-green)}.ui-alert.is-success .ai{color:var(--ioc-green)}
.ui-alert.is-warning{border-left-color:var(--ioc-amber);background:var(--ioc-amber-bg)}.ui-alert.is-warning .ai{color:var(--ioc-amber)}
.ui-alert.is-danger{border-left-color:var(--ioc-danger,#da1e28)}.ui-alert.is-danger .ai{color:var(--ioc-danger,#da1e28)}
/* badges */
.ui-badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border:1px solid var(--ioc-border-subtle);color:var(--ioc-text-secondary);background:var(--ioc-white)}
.ui-badge.solid{background:var(--ioc-blue);border-color:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff)}
.ui-badge.on{color:var(--ioc-green);border-color:var(--ioc-green)}
.ui-badge.off{color:var(--ioc-g60);border-color:var(--ioc-g40)}
.ui-badge .dot{width:7px;height:7px;background:currentColor;flex:none}
/* breadcrumbs */
.ui-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font-family:var(--ioc-mono);font-size:12px;letter-spacing:.04em;color:var(--ioc-text-helper)}
.ui-crumbs a{color:var(--ioc-text-helper)}.ui-crumbs a:hover{color:var(--ioc-blue)}
.ui-crumbs .sep{color:var(--ioc-g30)}.ui-crumbs .cur{color:var(--ioc-blue)}
/* tabs */
.ui-tabs{display:flex;border-bottom:1px solid var(--ioc-border-subtle);overflow-x:auto}
.ui-tabs button{position:relative;border:0;background:transparent;font-family:var(--ioc-sans);font-weight:600;font-size:14px;color:var(--ioc-text-secondary);padding:14px 18px;white-space:nowrap;cursor:pointer;transition:color .16s var(--ioc-ease)}
.ui-tabs button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ioc-blue);transform:scaleX(0);transition:transform .2s var(--ioc-ease)}
.ui-tabs button:hover{color:var(--ioc-text-primary)}
.ui-tabs button[aria-selected="true"]{color:var(--ioc-blue)}
.ui-tabs button[aria-selected="true"]::after{transform:scaleX(1)}
.ui-tabpanel{padding:22px 2px;font-size:15px;color:var(--ioc-text-secondary);line-height:1.6}
.ui-tabpanel[hidden]{display:none}
/* switch */
.ui-switch{position:relative;display:inline-block;width:48px;height:26px;flex:none;vertical-align:middle}
.ui-switch input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.ui-switch .track{position:absolute;inset:0;background:var(--ioc-g50);transition:background .2s var(--ioc-ease)}
.ui-switch .track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:var(--ioc-text-on-color,#fff);transition:transform .2s var(--ioc-ease)}
.ui-switch input:checked+.track{background:var(--ioc-blue)}
.ui-switch input:checked+.track::after{transform:translateX(22px)}
.ui-switch input:focus-visible+.track{box-shadow:var(--ioc-shadow-focus)}
.ui-switch input:disabled+.track{opacity:.5;cursor:not-allowed}
/* checkbox + radio */
.ui-opt{display:inline-flex;align-items:center;gap:10px;font-size:14.5px;color:var(--ioc-text-primary);cursor:pointer;user-select:none}
.ui-opt input{position:absolute;opacity:0;width:0;height:0}
.ui-opt .mk{width:20px;height:20px;border:1px solid var(--ioc-border-strong);background:var(--ioc-surface,#fff);flex:none;display:grid;place-items:center;transition:background .14s var(--ioc-ease),border-color .14s var(--ioc-ease)}
.ui-opt.radio .mk{border-radius:50%!important}
.ui-opt .mk svg{width:13px;height:13px;color:var(--ioc-text-on-color,#fff);opacity:0;transition:opacity .12s var(--ioc-ease)}
.ui-opt.radio .mk::after{content:"";width:9px;height:9px;border-radius:50%!important;background:var(--ioc-text-on-color,#fff);transform:scale(0);transition:transform .14s var(--ioc-ease)}
.ui-opt input:checked+.mk{background:var(--ioc-blue);border-color:var(--ioc-blue)}
.ui-opt input:checked+.mk svg{opacity:1}
.ui-opt.radio input:checked+.mk::after{transform:scale(1)}
.ui-opt input:focus-visible+.mk{box-shadow:var(--ioc-shadow-focus)}
.ui-opt input:disabled+.mk{opacity:.5}
/* select */
.ui-select{position:relative;display:inline-flex;align-items:center;min-width:220px;background:var(--ioc-g10);border-bottom:1px solid var(--ioc-border-strong)}
.ui-select select{appearance:none;-webkit-appearance:none;width:100%;border:0;background:transparent;font-family:var(--ioc-sans);font-size:15px;color:var(--ioc-text-primary);padding:12px 40px 12px 16px;outline:none;cursor:pointer}
.ui-select::after{content:"";position:absolute;right:16px;width:9px;height:9px;border-right:2px solid var(--ioc-text-primary);border-bottom:2px solid var(--ioc-text-primary);transform:rotate(45deg) translateY(-3px);pointer-events:none}
.ui-select:focus-within{box-shadow:inset 0 0 0 2px var(--ioc-blue);background:var(--ioc-surface,#fff);border-bottom-color:var(--ioc-blue)}
/* pagination */
.ui-pager{display:flex;gap:0;border:1px solid var(--ioc-border-subtle);width:max-content}
.ui-pager a,.ui-pager span{min-width:44px;height:44px;display:grid;place-items:center;font-family:var(--ioc-mono);font-size:13px;color:var(--ioc-text-secondary);border-left:1px solid var(--ioc-border-subtle);transition:background .14s var(--ioc-ease),color .14s var(--ioc-ease)}
.ui-pager a:first-child,.ui-pager span:first-child{border-left:0}
.ui-pager a:hover{background:var(--ioc-g10);color:var(--ioc-text-primary)}
.ui-pager a[aria-current="page"]{background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff)}
.ui-pager .dots{color:var(--ioc-g40)}
/* tooltip */
.ui-tip{position:relative;display:inline-flex}
.ui-tip .tip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);background:var(--ioc-g100);color:var(--ioc-text-on-color,#fff);font-size:12px;line-height:1.4;padding:8px 11px;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s var(--ioc-ease),transform .16s var(--ioc-ease);z-index:var(--ioc-z-tooltip)}
.ui-tip .tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--ioc-g100)}
.ui-tip:hover .tip,.ui-tip:focus-within .tip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
/* progress */
.ui-progress{height:6px;background:var(--ioc-g20);overflow:hidden}
.ui-progress .bar{height:100%;background:var(--ioc-blue);transition:width .6s var(--ioc-ease-out)}
.ui-meter{display:flex;justify-content:space-between;font-family:var(--ioc-mono);font-size:11px;color:var(--ioc-text-helper);margin-bottom:8px;letter-spacing:.04em}
/* steps */
.ui-steps{display:flex;flex-wrap:wrap;gap:0}
.ui-steps .st{display:flex;align-items:center;gap:12px;padding-right:28px}
.ui-steps .sn{width:30px;height:30px;flex:none;display:grid;place-items:center;border:1px solid var(--ioc-border-strong);font-family:var(--ioc-mono);font-size:12px;color:var(--ioc-text-secondary)}
.ui-steps .st.done .sn{background:var(--ioc-blue);border-color:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff)}
.ui-steps .st.now .sn{border-color:var(--ioc-blue);color:var(--ioc-blue)}
.ui-steps .sl{font-size:14px;font-weight:600;letter-spacing:-.005em}
.ui-steps .st.now .sl{color:var(--ioc-blue)}
.ui-steps .st:not(:last-child)::after{content:"";width:36px;height:1px;background:var(--ioc-border-strong)}
/* avatar */
.ui-avatar{width:40px;height:40px;display:grid;place-items:center;background:var(--ioc-blue);color:var(--ioc-text-on-primary,#fff);font-weight:700;font-size:14px;flex:none}
.ui-avatar.g{background:var(--ioc-g80)}
.ui-avatar-stack{display:flex}
.ui-avatar-stack .ui-avatar{box-shadow:0 0 0 2px var(--ioc-surface,#fff);margin-left:-10px}
.ui-avatar-stack .ui-avatar:first-child{margin-left:0}
/* empty state */
.ui-empty{border:1px dashed var(--ioc-border-strong);background:var(--ioc-g10);padding:40px 24px;text-align:center}
.ui-empty .ei{width:40px;height:40px;color:var(--ioc-g40);margin:0 auto 14px}
.ui-empty h4{font-size:17px;letter-spacing:-.01em;margin:0 0 6px}
.ui-empty p{margin:0 auto 18px;font-size:14px;color:var(--ioc-text-secondary);max-width:40ch;line-height:1.55}
/* dropdown menu */
.ui-menu{border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff);box-shadow:var(--ioc-shadow-lg);min-width:220px;padding:6px 0}
.ui-menu a,.ui-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:11px 16px;border:0;background:transparent;font-family:var(--ioc-sans);font-size:14px;color:var(--ioc-text-primary);text-align:left;cursor:pointer;transition:background .12s var(--ioc-ease)}
.ui-menu a:hover,.ui-menu button:hover{background:var(--ioc-g10);color:var(--ioc-blue)}
.ui-menu .sep{height:1px;background:var(--ioc-border-subtle);margin:6px 0}
.ui-menu svg{width:16px;height:16px;color:var(--ioc-text-helper)}
/* toast */
.ui-toast{display:flex;align-items:flex-start;gap:12px;background:var(--ioc-g100);color:var(--ioc-text-on-color,#fff);padding:14px 16px;box-shadow:var(--ioc-shadow-lg);min-width:280px;max-width:380px;border-left:3px solid var(--ioc-green)}
.ui-toast .ti{width:18px;height:18px;color:var(--ioc-green);flex:none;margin-top:1px}
.ui-toast strong{display:block;font-size:14px}
.ui-toast p{margin:2px 0 0;font-size:12.5px;color:var(--ioc-g30,#c6c6c6);line-height:1.45}
/* modal */
.ui-modal-overlay{position:fixed;inset:0;background:rgba(22,22,22,.55);display:none;place-items:center;z-index:var(--ioc-z-modal);padding:24px}
.ui-modal-overlay.open{display:grid}
.ui-modal{width:min(100%,32rem);background:var(--ioc-surface,#fff);box-shadow:0 24px 60px -20px rgba(10,12,60,.4);border-top:3px solid var(--ioc-blue)}
.ui-modal .mh{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:22px 22px 0}
.ui-modal .mh h3{font-size:20px;letter-spacing:-.015em}
.ui-modal .mx{width:36px;height:36px;border:0;background:transparent;color:var(--ioc-text-primary);cursor:pointer;display:grid;place-items:center}
.ui-modal .mx:hover{color:var(--ioc-blue)}
.ui-modal .mb{padding:14px 22px 8px;color:var(--ioc-text-secondary);font-size:14.5px;line-height:1.6}
.ui-modal .mf{display:flex;justify-content:flex-end;gap:10px;padding:18px 22px 22px}
/* data table */
.ui-table{width:100%;border-collapse:collapse;border:1px solid var(--ioc-border-subtle)}
.ui-table th,.ui-table td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--ioc-border-subtle);font-size:14px}
.ui-table thead th{background:var(--ioc-g10);border-bottom:1px solid var(--ioc-border-strong);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-text-helper);font-weight:400}
.ui-table tbody tr:last-child td{border-bottom:0}
.ui-table tbody tr{transition:background .14s var(--ioc-ease)}
.ui-table tbody tr:hover{background:var(--ioc-g10)}
.ui-table td.num{font-family:var(--ioc-mono);font-variant-numeric:tabular-nums;text-align:right}

/* Family accent standard: Solutions=blue, Academy=purple, Talents Gateway=green,
   Industries=teal, Company=slate. --ioc-accent-ink is the AA-safe text value for
   each family (identical to the accent unless the accent is too light for body text). */
[data-page-family="Academy"]{--ioc-accent:var(--ioc-fam-academy);--ioc-accent-hover:var(--ioc-fam-academy-hover);--ioc-accent-ink:var(--ioc-fam-academy)}
[data-page-family="Talents Gateway"]{--ioc-accent:var(--ioc-fam-talents);--ioc-accent-hover:var(--ioc-fam-talents-hover);--ioc-accent-ink:var(--ioc-fam-talents-ink)}
/* Industries and Company have no page-wide accent yet: their values are scoped to
   the closing band only, so no live CTA or hero accent changes colour. */
[data-page-family="Industries"] .ioc-fam{--ioc-accent:var(--ioc-fam-industries);--ioc-accent-ink:var(--ioc-fam-industries-ink)}
[data-page-family="Company"] .ioc-fam{--ioc-accent:var(--ioc-fam-company);--ioc-accent-ink:var(--ioc-fam-company)}
.ioc-footer h3.fam-sol{color:var(--ioc-blue,#0001ff)}
.ioc-footer h3.fam-aca{color:var(--ioc-fam-academy,#6929c4)}
.ioc-footer h3.fam-tal{color:var(--ioc-fam-talents,#1a7a52)}
/* Family tint band: closing links section, driven by the family accent */
.ioc-fam{background:color-mix(in oklch,var(--ioc-accent) 10%,var(--ioc-surface));border-top:3px solid var(--ioc-accent)}
.ioc-fam .ioc-kicker{color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-fam .ioc-kicker::before{background:var(--ioc-accent)}
.ioc-fam .ioc-related{background:color-mix(in oklch,var(--ioc-accent) 24%,var(--ioc-surface));border-color:color-mix(in oklch,var(--ioc-accent) 24%,var(--ioc-surface))}
.ioc-fam .ioc-related a:hover{background:color-mix(in oklch,var(--ioc-accent) 6%,var(--ioc-surface))}
.ioc-fam .ioc-related .ioc-rel-k,.ioc-fam .ioc-related .ioc-rel-go{color:var(--ioc-accent-ink,var(--ioc-accent))}

/* ---- absorbed from ioc-blocks.css (CMS-D-071) ---- */
/* ============================================================
   InfocBrandUI v1 · inner-page block library (idc namespace)
   Loaded AFTER ioc-core.css on every inner page. Implements the
   governed CMS blocks (B-01..B-24) on carbon tokens: white-first,
   square controls, blue lead, short reveal motion. No gradients,
   particles or rounded startup cards.
   ============================================================ */

/* ---- shared section scaffold ---- */
.ioc-block{padding-top:clamp(64px,8vw,112px);padding-bottom:clamp(64px,8vw,112px)}
.ioc-block.tight{padding-top:clamp(48px,5vw,72px);padding-bottom:clamp(48px,5vw,72px)}
.ioc-block.soft{background:var(--ioc-g10)}
.ioc-block.dark{background:var(--ioc-g100);color:var(--ioc-text-on-color,#fff)}
.ioc-block.dark .body,.ioc-block.dark p{color:var(--ioc-g30)}
.ioc-block.dark h2,.ioc-block.dark h3,.ioc-block.dark b,.ioc-block.dark strong{color:var(--ioc-text-on-color,#fff)}

/* section header: heading left, supporting note right */
.ioc-head{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(20px,4vw,64px);align-items:end;margin-bottom:clamp(32px,4vw,56px)}
.ioc-head>p{margin:0;color:var(--ioc-text-secondary);font-size:16px;line-height:1.55;max-width:46ch}
.ioc-block.dark .ioc-head>p{color:var(--ioc-g30)}
.ioc-kicker{display:flex;align-items:center;gap:10px;font-family:var(--ioc-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-text-primary);margin:0 0 14px}
.ioc-kicker::before{content:"";width:22px;height:2px;background:var(--ioc-accent);flex:none}
.ioc-kicker.teal::before{background:var(--ioc-teal,#08bdba)}
.ioc-block.dark .ioc-kicker{color:var(--ioc-text-on-color,#fff)}
.ioc-head h2,.ioc-h2{margin:0;font-size:clamp(28px,3.2vw,46px);font-weight:700;line-height:1.06;letter-spacing:-.025em;text-wrap:balance}
@media(max-width:860px){.ioc-head{grid-template-columns:1fr;align-items:start}}

/* ---- B-02 Inner hero · Light Technical Split ---- */
.ioc-hero{background:linear-gradient(180deg,var(--ioc-surface,#fff) 0%,var(--ioc-surface-subtle,#fbfbfb) 100%);border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-hero .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,4vw,64px);align-items:center;padding-top:clamp(36px,4vw,60px);padding-bottom:clamp(36px,4vw,60px)}
.ioc-hero-copy{min-width:0}
.ioc-crumb{font-family:var(--ioc-mono);font-size:12px;letter-spacing:.04em;color:var(--ioc-text-helper);margin:0 0 20px}
.ioc-crumb a{color:var(--ioc-text-helper)}
.ioc-crumb a:hover{color:var(--ioc-accent)}
.ioc-hero h1{margin:0;font-size:clamp(34px,4.4vw,64px);font-weight:800;line-height:1.0;letter-spacing:-.035em;text-wrap:balance}
.ioc-hero h1 .em{color:var(--ioc-accent)}
.ioc-hero .ioc-lede{max-width:52ch;margin:20px 0 0;color:var(--ioc-text-secondary);font-size:clamp(16px,1.15vw,18px);line-height:1.6;text-wrap:pretty}
.ioc-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.ioc-chips{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:28px;max-width:100%}
.ioc-chips-label{display:inline-flex;align-items:center;margin-right:4px;font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-g60,#666666);white-space:nowrap}
.ioc-chip{position:relative;display:inline-flex;align-items:center;gap:9px;padding:10px 15px;background:var(--ioc-surface-cool,#f2f4f8);border:1px solid transparent;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-primary,#161616);text-decoration:none;white-space:nowrap;transition:background .18s var(--ioc-ease),color .18s var(--ioc-ease),border-color .18s var(--ioc-ease)}
.ioc-chip svg{flex:none;width:16px;height:16px;color:var(--ioc-accent-ink,var(--ioc-accent,#0001ff))}
.ioc-chip::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ioc-accent);transform:scaleX(0);transform-origin:left;transition:transform .24s var(--ioc-ease)}
a.ioc-chip:hover{background:var(--ioc-surface,#fff);border-color:var(--ioc-text-primary,#161616)}
a.ioc-chip:hover::after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.ioc-chip,.ioc-chip::after{transition:none}}
@media(max-width:640px){.ioc-chip{font-size:10.5px;padding:9px 12px}}
.ioc-hero-visual{position:relative;min-width:0;display:flex}
.ioc-hero-figure{position:relative;flex:1;border:1px solid var(--ioc-border-subtle);overflow:hidden;min-height:clamp(26rem,34vw,34rem);background:var(--ioc-g20);margin:0}
.ioc-hero-figure img{width:100%;height:100%;object-fit:cover;display:block}
.ioc-hero-figure::after{content:"";position:absolute;inset:56% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.52));pointer-events:none}
.ioc-hero-figure figcaption{position:absolute;left:16px;top:16px;right:16px;z-index:2;max-width:22rem;padding:13px 15px;border:1px solid rgba(224,224,224,.85);background:rgba(255,255,255,.94);box-shadow:0 10px 24px rgba(0,0,0,.08)}
.ioc-hero-figure figcaption b,.ioc-hero-figure figcaption strong{display:block;font-family:var(--ioc-sans);font-size:13px;font-weight:600;line-height:1.35;color:var(--ioc-text-primary);letter-spacing:-.005em;text-transform:none}
.ioc-hero-figure figcaption span{display:block;margin-top:4px;font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-matrix{position:absolute;right:16px;bottom:16px;z-index:3;width:min(23rem,calc(100% - 32px));display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle);box-shadow:0 16px 40px rgba(0,0,0,.14);backdrop-filter:blur(12px)}
.ioc-matrix>div{background:rgba(255,255,255,.96);padding:14px 16px;min-height:5.5rem;display:flex;flex-direction:column;justify-content:center}
.ioc-matrix b{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--ioc-text-primary);letter-spacing:-.01em}
.ioc-matrix b svg{flex:none;width:17px;height:17px;color:var(--ioc-accent-ink,var(--ioc-accent,#0001ff));stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ioc-matrix span{display:block;margin-top:4px;font-size:12.5px;color:var(--ioc-text-secondary);line-height:1.4}
/* Auto-spotlight: one tile lit at a time, light ground */
.ioc-matrix[data-spotlight]{box-shadow:0 20px 52px rgba(0,0,0,.26)}
.ioc-matrix[data-spotlight]>div{position:relative;overflow:hidden;background:var(--ioc-surface,#fff);cursor:pointer;transition:background .4s var(--ioc-ease,cubic-bezier(.2,.8,.2,1))}
.ioc-matrix[data-spotlight]>div b{color:var(--ioc-text-helper,#5c5c5c);transition:color .32s}
.ioc-matrix[data-spotlight]>div b svg{color:var(--ioc-g40,#a8a8a8);transition:color .32s,transform .42s var(--ioc-ease,cubic-bezier(.2,.8,.2,1))}
.ioc-matrix[data-spotlight]>div span{color:var(--ioc-g60,#666666);transform:translateY(3px);transition:color .32s,transform .42s var(--ioc-ease,cubic-bezier(.2,.8,.2,1))}
.ioc-matrix[data-spotlight]>div.on{background:var(--ioc-surface,#fff)}
.ioc-matrix[data-spotlight]>div.on b{color:var(--ioc-accent-ink,var(--ioc-accent,#0001ff))}
.ioc-matrix[data-spotlight]>div.on b svg{color:var(--ioc-accent-ink,var(--ioc-accent,#0001ff));transform:scale(1.1)}
.ioc-matrix[data-spotlight]>div.on span{color:var(--ioc-text-primary,#161616);transform:none}
.ioc-matrix[data-spotlight] .ioc-mx-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--ioc-accent,#0001ff);transform:scaleX(0);transform-origin:left}
.ioc-matrix[data-spotlight]>div.on .ioc-mx-bar{animation:iocMxBar 3.4s linear forwards}
@keyframes iocMxBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.ioc-matrix[data-spotlight]>div,.ioc-matrix[data-spotlight]>div b,.ioc-matrix[data-spotlight]>div b svg,.ioc-matrix[data-spotlight]>div span{transition:none}.ioc-matrix[data-spotlight]>div.on b svg{transform:none}.ioc-matrix[data-spotlight] .ioc-mx-bar{display:none}}
/* ---- Inner-page local section nav ---- */
.ioc-localnav{position:sticky;top:72px;z-index:80;background:rgba(255,255,255,.97);border-bottom:1px solid var(--ioc-border-subtle);backdrop-filter:blur(12px)}
.ioc-localnav .wrap{display:flex;overflow-x:auto;scrollbar-width:none;padding:0}
.ioc-localnav .wrap::-webkit-scrollbar{display:none}
.ioc-localnav a{display:flex;align-items:center;min-height:3.5rem;padding:0 18px;white-space:nowrap;border-right:1px solid var(--ioc-border-subtle);font-size:14px;font-weight:600;color:var(--ioc-text-secondary);transition:background .16s var(--ioc-ease),color .16s var(--ioc-ease)}
.ioc-localnav a:first-child{border-left:1px solid var(--ioc-border-subtle)}
.ioc-localnav a:hover{background:var(--ioc-g10);color:var(--ioc-accent)}
.ioc-localnav a.active,.ioc-localnav a[aria-current="true"]{color:var(--ioc-accent);box-shadow:inset 0 -3px var(--ioc-accent)}
.ioc-block[id],.ioc-hero[id]{scroll-margin-top:8rem}
@media(max-width:1000px){.ioc-localnav{top:64px}}
@media(max-width:860px){.ioc-hero .wrap{grid-template-columns:1fr;gap:28px}.ioc-hero-visual{order:2}.ioc-hero-figure{min-height:22rem}.ioc-hero-figure::after{display:none}.ioc-hero-figure figcaption{position:static;max-width:none;border:0;border-bottom:1px solid var(--ioc-border-subtle);box-shadow:none}.ioc-matrix{position:relative;right:auto;bottom:auto;width:100%;box-shadow:none;border-top:0}}

/* ---- B-06 Card grid ---- */
.ioc-cards{display:grid;gap:1px;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle)}
.ioc-cards>*{box-shadow:0 0 0 1px var(--ioc-border-subtle)}
.ioc-cards.two{grid-template-columns:repeat(2,1fr)}
.ioc-cards.three{grid-template-columns:repeat(3,1fr)}
.ioc-cards.four{grid-template-columns:repeat(4,1fr)}
.ioc-card{position:relative;background:var(--ioc-surface,#fff);padding:clamp(24px,2.4vw,34px);display:flex;flex-direction:column;min-width:0;transition:background .18s var(--ioc-ease)}
.ioc-card:hover{background:var(--ioc-g10)}
.ioc-card .ioc-card-ix{font-family:var(--ioc-mono);font-size:12px;letter-spacing:.08em;color:var(--ioc-accent);margin:0 0 18px}
.ioc-card .ioc-card-ix .ioc-cardicon{width:30px;height:30px;color:var(--ioc-accent);display:block}
.ioc-card .ioc-card-eyebrow{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper);margin:0 0 10px}
.ioc-card h3{margin:0 0 10px;font-size:clamp(18px,1.5vw,22px);font-weight:700;letter-spacing:-.015em}
.ioc-card p{margin:0;color:var(--ioc-text-secondary);font-size:15px;line-height:1.55;flex:1}
.ioc-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.ioc-tag{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.03em;border:1px solid var(--ioc-border-subtle);color:var(--ioc-text-secondary);padding:4px 8px}
.ioc-tag.ai{border-color:var(--ioc-accent);color:var(--ioc-accent)}
.ioc-card .ioc-card-link{display:inline-flex;align-items:center;gap:8px;margin-top:18px;color:var(--ioc-accent);font-weight:600;font-size:15px}
.ioc-card .ioc-card-link svg{width:16px;height:16px;transition:transform .18s var(--ioc-ease)}
.ioc-card:hover .ioc-card-link svg{transform:translateX(4px)}
.ioc-card.tap{cursor:pointer}
.ioc-card.tap::after{content:"";position:absolute;inset:0}
@media(max-width:960px){.ioc-cards.three,.ioc-cards.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.ioc-cards.two,.ioc-cards.three,.ioc-cards.four{grid-template-columns:1fr}}

/* ---- Feature grid (outcomes) ---- */
.ioc-features{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-feature{position:relative;background:var(--ioc-surface,#fff);padding:clamp(26px,2.4vw,34px);overflow:hidden;transition:background .3s var(--ioc-ease)}
.ioc-feature::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--ioc-accent);transform:scaleX(0);transform-origin:left;transition:transform .38s var(--ioc-ease)}
.ioc-feature:hover{background:var(--ioc-hover-wash,#f7faff)}
.ioc-feature:hover::before{transform:scaleX(1)}
.ioc-feature .ioc-fmark{width:auto;height:auto;display:block;border:0;margin-bottom:clamp(14px,1.4vw,20px);font-family:var(--ioc-mono);font-size:clamp(34px,3.4vw,46px);font-weight:400;line-height:.9;letter-spacing:-.04em;color:var(--ioc-g30,#c6c6c6);transition:color .3s var(--ioc-ease),transform .38s var(--ioc-ease);transform-origin:left center}
.ioc-feature:hover .ioc-fmark{color:var(--ioc-accent)}
.ioc-feature .ioc-fmark svg{width:30px;height:30px;display:block;color:var(--ioc-accent)}
.ioc-feature b{display:block;font-size:clamp(17px,1.35vw,20px);font-weight:700;margin-bottom:8px;letter-spacing:-.02em;line-height:1.2}
.ioc-feature p{margin:0;color:var(--ioc-text-secondary);font-size:14.5px;line-height:1.55;text-wrap:pretty}
@media(max-width:900px){.ioc-features{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.ioc-features{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.ioc-feature,.ioc-feature::before,.ioc-feature .ioc-fmark,.ioc-chip,.ioc-chip::after{transition:none}}

/* ---- B-11 Delivery lifecycle / process ---- */
.ioc-process{display:grid;grid-template-columns:repeat(6,1fr);gap:0;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);overflow:hidden}
.ioc-step{box-shadow:1px 1px 0 0 var(--ioc-border-subtle)}
.ioc-block.dark .ioc-process{background:var(--ioc-surface-inverse-raised,#1c1c1c);border-color:var(--ioc-g80);overflow:hidden}
.ioc-block.dark .ioc-step{box-shadow:1px 1px 0 0 var(--ioc-g80)}
.ioc-step{background:var(--ioc-surface,#fff);padding:clamp(20px,1.8vw,26px);display:flex;flex-direction:column;gap:10px}
.ioc-block.dark .ioc-step{background:var(--ioc-g90)}
.ioc-step .ioc-step-n{font-family:var(--ioc-mono);font-size:clamp(20px,1.8vw,26px);font-weight:500;letter-spacing:.02em;line-height:1;font-variant-numeric:tabular-nums;color:var(--ioc-accent)}
.ioc-block.dark .ioc-step .ioc-step-n{color:var(--ioc-accent-on-inverse)}
.ioc-step b{font-size:15px;font-weight:700;letter-spacing:-.01em}
.ioc-step p{margin:0;font-size:13px;line-height:1.5;color:var(--ioc-text-secondary)}

/* B-11 step shading: each stage a step lighter than the last, so the strip reads as one path. */
.dark .ioc-process .ioc-step:nth-child(1){background:var(--ioc-surface-inverse-raised,#1c1c1c)}
.dark .ioc-process .ioc-step:nth-child(2){background:color-mix(in srgb,var(--ioc-surface-inverse-raised) 97.8%,white)}
.dark .ioc-process .ioc-step:nth-child(3){background:var(--ioc-g90,#262626)}
.dark .ioc-process .ioc-step:nth-child(4){background:color-mix(in srgb,var(--ioc-surface-inverse-raised) 93.39%,white)}
.dark .ioc-process .ioc-step:nth-child(5){background:color-mix(in srgb,var(--ioc-surface-inverse-raised) 91.19%,white)}
.dark .ioc-process .ioc-step:nth-child(6){background:color-mix(in srgb,var(--ioc-surface-inverse-raised) 88.99%,white)}
.ioc-block:not(.dark) .ioc-step b{color:var(--ioc-text-primary)}
.ioc-block:not(.dark) .ioc-step p{color:var(--ioc-text-secondary)}
.ioc-block:not(.dark) .ioc-process .ioc-step:nth-child(1){background:var(--ioc-surface,#fff)}
.ioc-block:not(.dark) .ioc-process .ioc-step:nth-child(2){background:color-mix(in oklch,var(--ioc-accent) 2%,var(--ioc-surface))}
.ioc-block:not(.dark) .ioc-process .ioc-step:nth-child(3){background:color-mix(in oklch,var(--ioc-accent) 4%,var(--ioc-surface))}
.ioc-block:not(.dark) .ioc-process .ioc-step:nth-child(4){background:color-mix(in oklch,var(--ioc-accent) 6%,var(--ioc-surface))}
.ioc-block:not(.dark) .ioc-process .ioc-step:nth-child(5){background:color-mix(in oklch,var(--ioc-accent) 8%,var(--ioc-surface))}
.ioc-block:not(.dark) .ioc-process .ioc-step:nth-child(6){background:color-mix(in oklch,var(--ioc-accent) 10%,var(--ioc-surface))}

@media(max-width:1080px){.ioc-process{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.ioc-process{grid-template-columns:1fr}}

/* ---- B-08 Capability matrix ---- */
.ioc-cap{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-cap>div{background:var(--ioc-surface,#fff);padding:clamp(22px,2vw,30px)}
.ioc-cap h3{margin:0 0 8px;font-size:18px;font-weight:700;letter-spacing:-.01em}
.ioc-cap ul{margin:12px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.ioc-cap li{position:relative;padding-left:20px;font-size:14px;color:var(--ioc-text-secondary);line-height:1.5}
.ioc-cap li::before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;background:var(--ioc-accent)}
@media(max-width:720px){.ioc-cap{grid-template-columns:1fr}}

/* ---- B-05 Outcome navigator ---- */
.ioc-nav-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle);margin-bottom:0}
.ioc-nav-btn{background:var(--ioc-surface,#fff);border:0;text-align:left;padding:18px 20px;cursor:pointer;display:block;transition:background .16s var(--ioc-ease)}
.ioc-nav-btn:hover{background:var(--ioc-g10)}
.ioc-nav-btn[aria-pressed="true"]{background:var(--ioc-selected-surface,#edf5ff);box-shadow:inset 3px 0 0 var(--ioc-accent)}
.ioc-nav-btn b{display:block;font-size:15px;font-weight:700;letter-spacing:-.01em;margin-bottom:4px}
.ioc-nav-btn span{display:block;font-size:13px;color:var(--ioc-text-secondary);line-height:1.45}
.ioc-rec{border:1px solid var(--ioc-accent);background:var(--ioc-hover-wash,#f7faff);padding:clamp(24px,2.4vw,32px);display:flex;flex-direction:column;gap:8px;justify-content:center}
.ioc-rec .ioc-rec-k{font-family:var(--ioc-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-accent)}
.ioc-rec h3{margin:0;font-size:clamp(20px,2vw,26px);font-weight:700;letter-spacing:-.015em}
.ioc-rec p{margin:0;color:var(--ioc-text-secondary);font-size:15px;line-height:1.55}
.ioc-rec a{margin-top:8px;align-self:flex-start}
.ioc-nav-split{display:grid;grid-template-columns:1.3fr 1fr;gap:16px;align-items:stretch}
@media(max-width:860px){.ioc-nav-split{grid-template-columns:1fr}.ioc-nav-grid{grid-template-columns:1fr}}

/* ---- B-12 CTA band ---- */
.ioc-cta{background:linear-gradient(115deg,var(--ioc-selected-surface,#edf5ff) 0%,var(--ioc-hover-wash,#f7faff) 58%,var(--ioc-wash-pink,#fff1f7) 150%);color:var(--ioc-text-primary);border-top:1px solid var(--ioc-border-subtle)}
.ioc-cta .ioc-cta-panel{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(28px,4vw,64px);align-items:center}
.ioc-cta .ioc-kicker{color:var(--ioc-accent)}
.ioc-cta h2{margin:0;font-size:clamp(26px,3vw,42px);font-weight:700;line-height:1.08;letter-spacing:-.02em;color:var(--ioc-text-primary);text-wrap:balance}
.ioc-cta p{margin:16px 0 0;color:var(--ioc-text-secondary);font-size:16px;line-height:1.6;max-width:52ch}
.ioc-cta-actions{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:860px){.ioc-cta .ioc-cta-panel{grid-template-columns:1fr}}
.ioc-cta-panel.has-form{grid-template-columns:1fr 1fr;align-items:start}
.ioc-cta-panel.has-form>div:first-child{align-self:center}
.ioc-cta-form{position:relative;display:flex;flex-direction:column;gap:16px;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);box-shadow:0 1px 2px rgba(16,22,60,.05);padding:clamp(20px,2.2vw,28px)}
.ioc-cta-form::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--ioc-accent)}
.ioc-cta-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ioc-cta-field{display:flex;flex-direction:column;gap:7px}
.ioc-cta-field>span{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-secondary)}
.ioc-cta-field input{border:1px solid var(--ioc-g30);background:var(--ioc-surface,#fff);color:var(--ioc-text-primary);font-family:var(--ioc-sans);font-size:15px;padding:12px 14px}
.ioc-cta-field input::placeholder{color:var(--ioc-placeholder)}
.ioc-cta-field input:focus{outline:0;border-color:var(--ioc-accent);box-shadow:0 0 0 3px rgba(0,1,255,.14);background:var(--ioc-surface,#fff)}
.ioc-cta-field.invalid input{border-color:var(--ioc-danger,#da1e28);box-shadow:0 0 0 3px rgba(218,30,40,.14)}
.ioc-cta-form>.btn{align-self:stretch;justify-content:space-between;min-height:52px;font-weight:700}
.ioc-cta-reassure{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0}
.ioc-cta-reassure span{display:inline-flex;align-items:center;gap:8px;font-size:13px;line-height:1.4;color:var(--ioc-text-secondary)}
.ioc-cta-reassure span svg{width:16px;height:16px;flex:none;color:var(--ioc-green)}
.ioc-cta-form.is-sent .ioc-cta-reassure{display:none}
.ioc-cta-note{margin:0;font-family:var(--ioc-mono);font-size:12px;line-height:1.55;color:var(--ioc-text-secondary)}
.ioc-cta-note a{color:var(--ioc-accent);text-decoration:underline}
.ioc-cta-confirm{display:none;margin:0;font-size:16px;line-height:1.5;color:var(--ioc-text-primary)}
.ioc-cta-confirm b{display:block;font-family:var(--ioc-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-accent);margin-bottom:8px;font-weight:400}
.ioc-cta-form.is-sent .ioc-cta-fields,.ioc-cta-form.is-sent>.btn,.ioc-cta-form.is-sent .ioc-cta-note{display:none}
.ioc-cta-form.is-sent .ioc-cta-confirm{display:block}
@media(max-width:860px){.ioc-cta-panel.has-form{grid-template-columns:1fr}.ioc-cta-fields{grid-template-columns:1fr}}

/* ---- B-16 FAQ ---- */
.ioc-faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(28px,4vw,64px);align-items:start}
.ioc-faq-list{display:flex;flex-direction:column;border-top:1px solid var(--ioc-border-subtle)}
.ioc-faq-item{border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 0;font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--ioc-text-primary)}
.ioc-faq-item summary::-webkit-details-marker{display:none}
.ioc-faq-item summary .ioc-faq-sign{flex:none;width:22px;height:22px;position:relative;transition:transform .2s var(--ioc-ease)}
.ioc-faq-item summary .ioc-faq-sign::before,.ioc-faq-item summary .ioc-faq-sign::after{content:"";position:absolute;background:var(--ioc-accent)}
.ioc-faq-item summary .ioc-faq-sign::before{left:0;top:10px;width:22px;height:2px}
.ioc-faq-item summary .ioc-faq-sign::after{left:10px;top:0;width:2px;height:22px;transition:transform .2s var(--ioc-ease)}
.ioc-faq-item[open] summary .ioc-faq-sign::after{transform:scaleY(0)}
.ioc-faq-item p{margin:0 0 20px;color:var(--ioc-text-secondary);font-size:15px;line-height:1.6;max-width:60ch}
@media(max-width:860px){.ioc-faq{grid-template-columns:1fr;gap:24px}}

/* ---- B-17 Related pages ---- */
.ioc-related{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-related a{background:var(--ioc-surface,#fff);padding:clamp(22px,2.2vw,30px);display:flex;flex-direction:column;gap:8px;transition:background .16s var(--ioc-ease)}
.ioc-related a:hover{background:var(--ioc-g10)}
.ioc-related .ioc-rel-k{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-related b{font-size:17px;font-weight:700;letter-spacing:-.01em}
.ioc-related span.d{color:var(--ioc-text-secondary);font-size:14px;line-height:1.5}
.ioc-related .ioc-rel-go{margin-top:auto;color:var(--ioc-accent);font-weight:600;font-size:14px;display:inline-flex;gap:6px;align-items:center}
.ioc-related .ioc-rel-go svg{width:16px;height:16px;flex:none;transition:transform .18s var(--ioc-ease)}
.ioc-related a:hover .ioc-rel-go svg{transform:translateX(3px)}
@media(max-width:860px){.ioc-related{grid-template-columns:1fr}}

/* ---- B-09 Media split ---- */
.ioc-media{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:center}
.ioc-media.flip .ioc-media-fig{order:2}
.ioc-media-fig{border:1px solid var(--ioc-border-subtle);overflow:hidden;background:var(--ioc-surface,#fff)}
.ioc-media-fig img{display:block;width:100%;aspect-ratio:5/4;object-fit:cover;background:var(--ioc-g20)}
.ioc-media-fig figcaption{padding:12px 14px;border-top:1px solid var(--ioc-border-subtle);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-secondary);line-height:1.5}
.ioc-media ul{margin:18px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.ioc-media li{position:relative;padding-left:22px;font-size:15px;color:var(--ioc-text-secondary);line-height:1.5}
.ioc-media li::before{content:"";position:absolute;left:0;top:7px;width:9px;height:9px;background:var(--ioc-accent)}
@media(max-width:860px){.ioc-media{grid-template-columns:1fr;gap:24px}.ioc-media.flip .ioc-media-fig{order:0}}

/* ---- B-19 KPI / evidence strip ---- */
.ioc-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-kpi{background:var(--ioc-surface,#fff);padding:clamp(22px,2.2vw,30px)}
.ioc-block.dark .ioc-kpi{background:var(--ioc-g90)}
.ioc-kpi .n{font-size:clamp(30px,3.4vw,48px);font-weight:700;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.ioc-kpi .l{margin-top:10px;font-size:14px;color:var(--ioc-text-secondary);line-height:1.45}
@media(max-width:820px){.ioc-kpis{grid-template-columns:repeat(2,1fr)}}

/* ---- B-13 Search / filter directory ---- */
.ioc-dir-controls{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.ioc-dir-search{flex:1;min-width:220px;display:flex;align-items:center;gap:10px;border:1px solid var(--ioc-border-strong);background:var(--ioc-surface,#fff);padding:0 14px;height:48px}
.ioc-dir-search svg{width:18px;height:18px;color:var(--ioc-text-helper);flex:none}
.ioc-dir-search input{flex:1;border:0;outline:0;font-family:var(--ioc-sans);font-size:15px;background:transparent;color:var(--ioc-text-primary)}
.ioc-filter{display:inline-flex;align-items:center;height:48px;padding:0 16px;border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff);font-family:var(--ioc-mono);font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--ioc-text-secondary);cursor:pointer;transition:all .15s var(--ioc-ease)}
.ioc-filter[aria-pressed="true"]{border-color:var(--ioc-accent);color:var(--ioc-accent);background:var(--ioc-hover-wash,#f7faff)}
.ioc-dir{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-dir-item{background:var(--ioc-surface,#fff);padding:clamp(20px,2vw,28px);display:flex;flex-direction:column;gap:8px}
.ioc-dir-item[hidden]{display:none}
.ioc-dir-item .ioc-dir-meta{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-dir-item h3{margin:0;font-size:18px;font-weight:700;letter-spacing:-.01em}
.ioc-dir-item p{margin:0;font-size:14px;color:var(--ioc-text-secondary);line-height:1.5}
@media(max-width:760px){.ioc-dir{grid-template-columns:1fr}}

/* ---- B-22 Role directory / B-23 cert catalog (list rows) ---- */
.ioc-rows{border:1px solid var(--ioc-border-subtle)}
.ioc-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr) auto;gap:20px;align-items:center;padding:20px 24px;border-bottom:1px solid var(--ioc-border-subtle);transition:background .15s var(--ioc-ease)}
.ioc-row:last-child{border-bottom:0}
.ioc-row:hover{background:var(--ioc-g10)}
.ioc-row .ioc-row-t b{display:block;font-size:16px;font-weight:700;letter-spacing:-.01em}
.ioc-row .ioc-row-t span{display:block;margin-top:3px;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-row .ioc-row-d{font-size:14px;color:var(--ioc-text-secondary);line-height:1.5}
.ioc-row .ioc-row-go{color:var(--ioc-accent);font-weight:600;font-size:14px;white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
.ioc-row .ioc-row-go svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;transition:transform .2s var(--ioc-ease)}
.ioc-row:hover .ioc-row-go svg{transform:translateX(3px)}
@media(max-width:760px){.ioc-row{grid-template-columns:1fr;gap:8px}.ioc-row .ioc-row-go{justify-self:start}}

/* ---- B-14 Lead form ---- */
.ioc-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ioc-field{display:flex;flex-direction:column;gap:8px}
.ioc-field.full{grid-column:1/-1}
.ioc-field label{font-size:13px;font-weight:600;color:var(--ioc-text-primary)}
.ioc-field label .req{color:var(--ioc-accent)}
.ioc-field input,.ioc-field select,.ioc-field textarea{border:1px solid var(--ioc-border-strong);background:var(--ioc-surface,#fff);padding:13px 14px;font-family:var(--ioc-sans);font-size:15px;color:var(--ioc-text-primary);transition:border-color .15s var(--ioc-ease),box-shadow .15s var(--ioc-ease)}
.ioc-field input:focus,.ioc-field select:focus,.ioc-field textarea:focus{outline:0;border-color:var(--ioc-accent);box-shadow:var(--ioc-shadow-focus)}
.ioc-field textarea{min-height:120px;resize:vertical}
/* The site-standard field had NO placeholder rule, so every .ioc-form on the
   site (the thin campaign landers, the chat panel) fell to the browser default
   -- black at 50% alpha, which is exactly the "hint reads as a value" report
   the shared token exists to end. The audit that found it was per-page, which
   is why a token that covered four field classes still missed the fifth. */
.ioc-field input::placeholder,.ioc-field textarea::placeholder{color:var(--ioc-placeholder)}
/* The two search boxes carry a STORE-backed placeholder (search.placeholder,
   with a registered fallback) and had no rule either. The coverage test in
   form-placeholder-contract found them; a class that styles its input must
   style its hint. */
.ioc-search-field input::placeholder,.search-field input::placeholder{color:var(--ioc-placeholder)}
.ioc-form-note{font-size:13px;color:var(--ioc-text-helper);line-height:1.5;margin:0}
@media(max-width:620px){.ioc-form-grid{grid-template-columns:1fr}}

/* ---- B-15 Location / map ---- */
.ioc-map{display:grid;grid-template-columns:1fr 1.4fr;gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-map-info{background:var(--ioc-surface,#fff);padding:clamp(24px,2.4vw,34px);display:flex;flex-direction:column;gap:14px}
.ioc-map-info h3{margin:0;font-size:20px;font-weight:700;letter-spacing:-.01em}
.ioc-map-info p,.ioc-map-info a{margin:0;font-size:15px;color:var(--ioc-text-secondary);line-height:1.55}
.ioc-map-info a:hover{color:var(--ioc-accent)}
.ioc-map-frame{background:var(--ioc-g20);min-height:320px;position:relative}
.ioc-map-frame img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:760px){.ioc-map{grid-template-columns:1fr}}

/* ---- B-24 Newsletter ---- */
.ioc-news{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(28px,4vw,56px);align-items:center;border:1px solid var(--ioc-border-subtle);background:var(--ioc-g10);padding:clamp(28px,3vw,48px)}
.ioc-news h2{margin:0;font-size:clamp(24px,2.6vw,36px);font-weight:700;letter-spacing:-.02em;line-height:1.1}
.ioc-news p{margin:12px 0 0;color:var(--ioc-text-secondary);font-size:15px;line-height:1.55}
.ioc-news form{display:flex;gap:10px;flex-wrap:wrap}
.ioc-news input{flex:1;min-width:200px;border:1px solid var(--ioc-border-strong);background:var(--ioc-surface,#fff);padding:14px;font-family:var(--ioc-sans);font-size:15px}
.ioc-news input:focus{outline:0;border-color:var(--ioc-accent);box-shadow:var(--ioc-shadow-focus)}
@media(max-width:760px){.ioc-news{grid-template-columns:1fr}}

/* ---- B-18 Photo band ---- */
.ioc-photoband{position:relative;min-height:clamp(280px,32vw,440px);overflow:hidden;background:var(--ioc-g100)}
.ioc-photoband img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.ioc-photoband .wrap{position:relative;z-index:2;display:flex;align-items:center;min-height:inherit;padding-top:48px;padding-bottom:48px}
.ioc-photoband h2{color:var(--ioc-text-on-color,#fff);font-size:clamp(26px,3.4vw,48px);font-weight:700;letter-spacing:-.02em;line-height:1.06;max-width:20ch;text-wrap:balance}
.ioc-photoband p{color:var(--ioc-text-on-color,#fff);opacity:.86;font-size:17px;line-height:1.6;max-width:52ch;margin-top:16px}

/* ---- B-21 Source / status note ---- */
.ioc-note{border:1px solid var(--ioc-amber-line);background:var(--ioc-amber-bg);padding:18px 22px;display:flex;gap:16px;align-items:baseline;flex-wrap:wrap}
.ioc-note .ioc-note-k{font-family:var(--ioc-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-amber);white-space:nowrap}
.ioc-note p{margin:0;font-size:14px;color:var(--ioc-text-primary);line-height:1.5;max-width:78ch}
.ioc-note a{color:var(--ioc-amber);text-decoration:underline}

/* ---- B-04 Persona switcher ---- */
.ioc-persona-tabs{display:flex;flex-wrap:wrap;gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle);margin-bottom:0}
.ioc-persona-tab{flex:1;min-width:150px;background:var(--ioc-surface,#fff);border:0;padding:16px 18px;text-align:left;cursor:pointer;transition:background .15s var(--ioc-ease)}
.ioc-persona-tab:hover{background:var(--ioc-g10)}
.ioc-persona-tab[aria-selected="true"]{background:var(--ioc-g100);color:var(--ioc-text-on-color,#fff)}
.ioc-persona-tab b{display:block;font-size:15px;font-weight:700;letter-spacing:-.01em}
.ioc-persona-tab span{display:block;margin-top:3px;font-size:12px;color:var(--ioc-text-helper)}
.ioc-persona-tab[aria-selected="true"] span{color:var(--ioc-g40)}
.ioc-persona-panel{border:1px solid var(--ioc-border-subtle);border-top:0;padding:clamp(24px,2.6vw,36px)}
.ioc-persona-panel[hidden]{display:none}
.ioc-persona-panel p{margin:0;font-size:16px;line-height:1.6;color:var(--ioc-text-secondary);max-width:70ch}

/* reveal hooks respected by ioc-motion.js; safe default visible */
.no-js [data-reveal]{opacity:1}

/* ============================================================
   NEW TEMPLATES · article, landing, search states, block states
   ============================================================ */

/* ---- Article / guide detail ---- */
.ioc-article{padding-top:clamp(40px,4vw,64px);padding-bottom:clamp(48px,6vw,88px)}
.ioc-article .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,17rem);gap:clamp(32px,4vw,64px);align-items:start}
.ioc-arthead{border-bottom:1px solid var(--ioc-border-subtle);padding-bottom:clamp(24px,3vw,36px);margin-bottom:clamp(28px,3vw,44px)}
.ioc-arthead h1{margin:14px 0 0;font-size:clamp(30px,3.8vw,52px);font-weight:800;line-height:1.03;letter-spacing:-.03em;text-wrap:balance;max-width:20ch}
.ioc-artmeta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px;align-items:center;font-family:var(--ioc-mono);font-size:12px;letter-spacing:.03em;color:var(--ioc-text-helper)}
.ioc-artmeta .ioc-who{display:flex;align-items:center;gap:10px;font-family:var(--ioc-sans);font-size:14px;color:var(--ioc-text-primary);font-weight:600}
.ioc-artmeta .ioc-avatar{width:34px;height:34px;border-radius:50%!important;background:var(--ioc-g20);border:1px solid var(--ioc-border-subtle);flex:none;display:flex;align-items:center;justify-content:center;font-family:var(--ioc-mono);font-size:11px;color:var(--ioc-text-helper)}
.ioc-share{display:flex;gap:8px;margin-left:auto}
.ioc-share a{width:34px;height:34px;border:1px solid var(--ioc-border-subtle);display:flex;align-items:center;justify-content:center;color:var(--ioc-text-secondary)}
.ioc-share a:hover{border-color:var(--ioc-accent);color:var(--ioc-accent)}
.ioc-share svg{width:16px;height:16px}
.ioc-prose{max-width:66ch;font-size:clamp(16px,1.15vw,18px);line-height:1.7;color:var(--ioc-text-primary)}
.ioc-prose>*+*{margin-top:1.15em}
.ioc-prose h2{font-size:clamp(22px,2.2vw,30px);font-weight:700;letter-spacing:-.02em;margin-top:1.8em;line-height:1.15}
.ioc-prose h3{font-size:clamp(18px,1.6vw,22px);font-weight:700;letter-spacing:-.01em;margin-top:1.5em}
.ioc-prose p{color:var(--ioc-text-secondary)}
.ioc-prose ul,.ioc-prose ol{padding-left:1.3em;color:var(--ioc-text-secondary)}
.ioc-prose li+li{margin-top:.5em}
.ioc-prose a{color:var(--ioc-accent);text-decoration:underline;text-underline-offset:2px}
.ioc-prose figure{margin:1.8em 0}
.ioc-prose figure img{width:100%;display:block;border:1px solid var(--ioc-border-subtle)}
.ioc-prose figcaption{margin-top:10px;font-size:13px;color:var(--ioc-text-helper);font-family:var(--ioc-mono)}
.ioc-callout{border-left:3px solid var(--ioc-accent);background:var(--ioc-g10);padding:20px 24px;font-size:17px;line-height:1.55;color:var(--ioc-text-primary)}
.ioc-callout .ioc-callout-k{display:block;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-accent);margin-bottom:8px}
.ioc-aside{position:sticky;top:7rem;display:flex;flex-direction:column;gap:22px;font-size:14px}
.ioc-toc b,.ioc-aside-card b{display:block;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper);margin-bottom:12px}
.ioc-toc{border-top:2px solid var(--ioc-text-primary);padding-top:16px}
.ioc-toc a{display:block;padding:6px 0;color:var(--ioc-text-secondary);line-height:1.4;border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-toc a:hover{color:var(--ioc-accent)}
.ioc-aside-card{border:1px solid var(--ioc-border-subtle);padding:20px}
.ioc-aside-card p{margin:0 0 14px;color:var(--ioc-text-secondary);line-height:1.5}
@media(max-width:900px){.ioc-article .wrap{grid-template-columns:1fr}.ioc-aside{position:static;order:2}}

/* ---- Landing: reduced shell ---- */
body.ioc-lp .ioc-header .nav,body.ioc-lp .ioc-header .search-open,body.ioc-lp .ioc-header .mobile-toggle{display:none}
body.ioc-lp .footer-routes,body.ioc-lp .footer-main{display:none}
.ioc-lp-offer{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-lp-offer>div{background:var(--ioc-surface,#fff);padding:clamp(22px,2.4vw,32px)}
.ioc-lp-offer .n{font-family:var(--ioc-mono);font-size:12px;color:var(--ioc-accent);letter-spacing:.08em}
.ioc-lp-offer b{display:block;margin:10px 0 6px;font-size:18px;font-weight:700;letter-spacing:-.01em}
.ioc-lp-offer p{margin:0;font-size:14px;color:var(--ioc-text-secondary);line-height:1.5}
@media(max-width:820px){.ioc-lp-offer{grid-template-columns:1fr}}
.ioc-lp-proof{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center;padding:22px 0;border-top:1px solid var(--ioc-border-subtle);border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-lp-proof span{font-family:var(--ioc-mono);font-size:13px;color:var(--ioc-text-secondary);letter-spacing:.03em}

/* ---- Search results states ---- */
.ioc-searchbar{display:flex;align-items:center;gap:12px;border:1px solid var(--ioc-border-strong);background:var(--ioc-surface,#fff);padding:0 16px;height:56px;max-width:640px}
.ioc-searchbar svg{width:20px;height:20px;color:var(--ioc-text-helper);flex:none}
.ioc-searchbar input{flex:1;border:0;outline:0;background:transparent;font-family:var(--ioc-sans);font-size:17px;color:var(--ioc-text-primary)}
.ioc-resultmeta{margin:20px 0 8px;font-family:var(--ioc-mono);font-size:13px;color:var(--ioc-text-helper)}
.ioc-result-list{border-top:1px solid var(--ioc-border-subtle)}
.ioc-result{display:block;padding:22px 0;border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-result .k{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-result h3{margin:6px 0 4px;font-size:20px;font-weight:700;letter-spacing:-.015em}
.ioc-result h3 a:hover{color:var(--ioc-accent)}
.ioc-result p{margin:0;color:var(--ioc-text-secondary);font-size:15px;line-height:1.55;max-width:76ch}
.ioc-result .u{margin-top:8px;font-family:var(--ioc-mono);font-size:12px;color:var(--ioc-accent)}
.ioc-empty{border:1px dashed var(--ioc-border-strong);background:var(--ioc-g10);padding:clamp(32px,4vw,56px);text-align:center}
.ioc-empty h3{margin:0 0 10px;font-size:22px;font-weight:700;letter-spacing:-.015em}
.ioc-empty p{margin:0 auto 20px;color:var(--ioc-text-secondary);font-size:15px;line-height:1.6;max-width:52ch}
.ioc-empty .ioc-empty-topics{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}

/* ---- Block states (form / feed) ---- */
.ioc-statebanner{display:flex;gap:14px;align-items:flex-start;padding:16px 20px;border:1px solid var(--ioc-border-subtle);font-size:15px;line-height:1.5}
.ioc-statebanner .ioc-sb-ico{width:22px;height:22px;flex:none;border-radius:50%!important;display:flex;align-items:center;justify-content:center;color:var(--ioc-text-on-color,#fff);font-size:13px;font-weight:700}
.ioc-statebanner b{display:block;font-weight:700;margin-bottom:2px}
.ioc-statebanner p{margin:0;color:var(--ioc-text-secondary)}
.ioc-statebanner.ok{border-color:color-mix(in srgb,var(--ioc-success) 30%,var(--ioc-surface));background:var(--ioc-success-surface,#defbe6)}.ioc-statebanner.ok .ioc-sb-ico{background:var(--ioc-green,#0e6027)}
.ioc-statebanner.err{border-color:color-mix(in srgb,var(--ioc-danger) 30%,var(--ioc-surface));background:var(--ioc-danger-surface,#fff1f1)}.ioc-statebanner.err .ioc-sb-ico{background:var(--ioc-danger,#da1e28)}
.ioc-statebanner.info{border-color:color-mix(in srgb,var(--ioc-blue) 30%,var(--ioc-surface));background:var(--ioc-selected-surface,#edf5ff)}.ioc-statebanner.info .ioc-sb-ico{background:var(--ioc-accent)}
.ioc-field.invalid input,.ioc-field.invalid select,.ioc-field.invalid textarea{border-color:var(--ioc-danger,#da1e28);box-shadow:0 0 0 3px rgba(194,29,29,.12)}
.ioc-field .ioc-err{font-size:12px;color:var(--ioc-danger,#da1e28);font-weight:600}
.ioc-skel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ioc-border-subtle);border:1px solid var(--ioc-border-subtle)}
.ioc-skel{background:var(--ioc-surface,#fff);padding:clamp(22px,2.2vw,30px)}
.ioc-skel span{display:block;height:12px;border-radius:2px!important;background:linear-gradient(90deg,var(--ioc-g10),var(--ioc-g20),var(--ioc-g10));background-size:200% 100%;animation:idcshimmer 1.3s infinite;margin-bottom:10px}
.ioc-skel span.s1{width:40%;height:10px}.ioc-skel span.s2{width:90%}.ioc-skel span.s3{width:70%}
@keyframes idcshimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media(max-width:900px){.ioc-skel-grid{grid-template-columns:1fr}}
.ioc-btn-loading{position:relative;pointer-events:none;opacity:.75}
.ioc-spin{display:inline-block;width:15px;height:15px;border:2px solid rgba(255,255,255,.4);border-top-color:var(--ioc-border-on-color,#fff);border-radius:50%!important;animation:idcspin .7s linear infinite;vertical-align:-2px}
@keyframes idcspin{to{transform:rotate(360deg)}}

/* ---- Landing lead-capture split (B-14 on landing) ---- */
.ioc-lp-capture{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:start}
.ioc-lp-capture .ioc-lp-cap-copy h2{margin:0;font-size:clamp(26px,3vw,40px);font-weight:700;letter-spacing:-.02em;line-height:1.08}
.ioc-lp-capture .ioc-lp-cap-copy .lede{margin:16px 0 24px}
.ioc-lp-cap-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.ioc-lp-cap-list li{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--ioc-text-secondary);line-height:1.5}
.ioc-lp-cap-list li svg{width:20px;height:20px;flex:none;color:var(--ioc-accent);margin-top:1px}
.ioc-lp-cap-form{border:1px solid var(--ioc-border-strong);background:var(--ioc-surface,#fff);padding:clamp(24px,2.6vw,36px)}
.ioc-lp-cap-form h3{margin:0 0 4px;font-size:20px;font-weight:700;letter-spacing:-.015em}
.ioc-lp-cap-form .sub{margin:0 0 20px;font-size:14px;color:var(--ioc-text-secondary)}
@media(max-width:820px){.ioc-lp-capture{grid-template-columns:1fr}}

/* ---- 404 / error page ---- */
.ioc-404{text-align:center;max-width:640px;margin:0 auto;padding:clamp(48px,8vw,96px) 0}
.ioc-404 .code{font-family:var(--ioc-mono);font-size:clamp(72px,14vw,150px);font-weight:600;line-height:.9;letter-spacing:-.03em;color:var(--ioc-accent)}
.ioc-404 h1{margin:20px 0 12px;font-size:clamp(28px,4vw,44px);font-weight:800;letter-spacing:-.025em}
.ioc-404 p{margin:0 auto 28px;color:var(--ioc-text-secondary);font-size:16px;line-height:1.6;max-width:46ch}
.ioc-404 .ioc-searchbar{margin:0 auto 28px}
.ioc-404-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}

/* hero kicker as iconic breadcrumb: home / PAGE */
.ioc-kicker-crumb{gap:9px}
.ioc-kicker-crumb::before{display:none}
.ioc-home{display:inline-flex;align-items:center;color:var(--ioc-text-primary);padding-bottom:3px;border-bottom:2px solid var(--ioc-accent);line-height:1;transition:color .16s var(--ioc-ease)}
.ioc-home svg{width:16px;height:16px;display:block}
.ioc-home:hover{color:var(--ioc-accent)}
.ioc-kicker-crumb .ioc-sep{color:var(--ioc-text-helper);margin:0 3px}

/* ---- B-12 CTA action patterns (light band) ---- */
.ioc-cta-act{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.ioc-cta-act>.btn{align-self:stretch;justify-content:space-between;min-height:52px}
.ioc-cta-note{font-size:12.5px;color:var(--ioc-text-secondary);margin:0}
.ioc-cta-slots{display:flex;flex-wrap:wrap;gap:8px}
.ioc-cta-slots span{font-family:var(--ioc-mono);font-size:12.5px;color:var(--ioc-text-primary);border:1px solid var(--ioc-g30);padding:8px 12px;transition:border-color .15s,color .15s}
.ioc-cta-aud{display:flex;flex-wrap:wrap;gap:10px;width:100%}
.ioc-cta-aud button{flex:1 1 42%;border:1px solid var(--ioc-g30);background:var(--ioc-surface,#fff);color:var(--ioc-text-primary);padding:12px;text-align:left;cursor:pointer;font:inherit;transition:background .15s,color .15s,border-color .15s}
.ioc-cta-aud button[aria-selected=true]{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff);border-color:var(--ioc-accent)}
.ioc-cta-aud b{display:block;font-size:14px}
.ioc-cta-aud small{display:block;font-size:12px;opacity:.82;margin-top:3px}
.ioc-cta-stats{display:flex;gap:26px;flex-wrap:wrap}
.ioc-cta-stats b{display:block;font-size:26px;font-weight:800;letter-spacing:-.03em;color:var(--ioc-text-primary)}
.ioc-cta-stats span{font-size:12px;color:var(--ioc-text-secondary)}
.ioc-cta-guar{display:flex;flex-direction:column;gap:8px}
.ioc-cta-guar span{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ioc-text-secondary)}
.ioc-cta-guar svg{width:15px;height:15px;color:var(--ioc-green);flex:none}

/* ---- B-14 Reassurance panel (beside the enquiry form) ---- */
.ioc-reassure{display:flex;flex-direction:column;gap:14px;padding:clamp(22px,2.4vw,30px);background:var(--ioc-g10);border:1px solid var(--ioc-border-subtle)}
.ioc-rea-k{font-family:var(--ioc-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-rea-card{display:flex;gap:13px;padding:16px 18px;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle)}
.ioc-rea-card svg{flex:none;width:18px;height:18px;color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-rea-card b{display:block;font-size:14.5px;font-weight:700;letter-spacing:-.01em;margin-bottom:3px}
.ioc-rea-card span{display:block;font-size:13.5px;line-height:1.5;color:var(--ioc-text-secondary)}
.ioc-rea-direct{margin-top:auto;padding-top:16px;border-top:1px solid var(--ioc-border-subtle);display:flex;flex-direction:column;gap:4px}
.ioc-rea-direct a{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:14.5px;font-weight:600;color:var(--ioc-text-primary);text-decoration:none}
.ioc-rea-direct a svg{width:16px;height:16px;color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-rea-direct a:hover{color:var(--ioc-accent-ink,var(--ioc-accent))}

/* ---- B-14 panel sits in the narrow first column ---- */
#enquiry .ioc-nav-split{grid-template-columns:minmax(18rem,23rem) minmax(0,1fr)}
@media(max-width:900px){#enquiry .ioc-nav-split{grid-template-columns:1fr}}
/* ---- B-15 Office: split card with map. Country tabs are ready for a second
   office: repeat .ioc-office and re-add the tablist when one exists. ---- */
.ioc-office-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.ioc-office-tabs button{padding:10px 16px;background:var(--ioc-surface-cool,#f2f4f8);border:1px solid transparent;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-primary);cursor:pointer;transition:background .18s var(--ioc-ease),color .18s var(--ioc-ease),border-color .18s var(--ioc-ease)}
.ioc-office-tabs button:hover{background:var(--ioc-surface,#fff);border-color:var(--ioc-text-primary)}
.ioc-office-tabs button[aria-selected="true"]{background:var(--ioc-accent);border-color:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.ioc-office{display:grid;grid-template-columns:minmax(19rem,26rem) 1fr;border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff)}
.ioc-office[hidden]{display:none}
.ioc-office-info{padding:clamp(24px,2.4vw,32px);display:flex;flex-direction:column}
.ioc-office-co{margin:0 0 4px;font-size:clamp(19px,1.7vw,23px);font-weight:800;letter-spacing:-.025em}
.ioc-office-reg{margin:0 0 22px;font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-office-row{display:flex;gap:13px;padding:14px 0;border-top:1px solid var(--ioc-border-subtle)}
.ioc-office-row svg{flex:none;width:17px;height:17px;margin-top:2px;color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-office-row .k{display:block;font-family:var(--ioc-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-text-helper);margin-bottom:3px}
.ioc-office-row a,.ioc-office-row .v{font-size:15px;line-height:1.45;font-weight:600;color:var(--ioc-text-primary);text-decoration:none}
.ioc-office-row a:hover{color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-office-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:22px}
.ioc-office-acts a{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;background:var(--ioc-surface-cool,#f2f4f8);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-primary);text-decoration:none;transition:background .18s,color .18s}
.ioc-office-acts a svg{width:15px;height:15px;color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-office-acts a:hover{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.ioc-office-acts a:hover svg{color:var(--ioc-text-on-color,#fff)}
.ioc-office-map{position:relative;min-height:22rem;border-left:1px solid var(--ioc-border-subtle);background:var(--ioc-g20);display:flex;align-items:center;justify-content:center}
.ioc-office-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(1) contrast(1.05)}
.ioc-office-badge{position:absolute;left:16px;top:16px;z-index:2;padding:8px 12px;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-text-primary);font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase}
.ioc-office-empty{padding:0 24px;text-align:center;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-secondary);line-height:1.6}
@media(max-width:900px){.ioc-office{grid-template-columns:1fr}.ioc-office-map{border-left:0;border-top:1px solid var(--ioc-border-subtle);min-height:16rem}}
@media(prefers-reduced-motion:reduce){.ioc-office-tabs button,.ioc-office-acts a,.ioc-rea-direct a{transition:none}}

/* ---- B-14 Route cards: tinted by the family the enquiry goes to ---- */
.ioc-cards [data-route-fam]{--rf:var(--ioc-accent);--rfi:var(--ioc-accent-ink,var(--ioc-accent));position:relative;background:color-mix(in oklch,var(--rf) 4%,var(--ioc-surface));border-top:2px solid var(--rf)!important;transition:background .2s var(--ioc-ease)}
.ioc-cards [data-route-fam="sol"]{--rf:var(--ioc-blue);--rfi:var(--ioc-blue)}
.ioc-cards [data-route-fam="aca"]{--rf:var(--ioc-fam-academy);--rfi:var(--ioc-fam-academy)}
.ioc-cards [data-route-fam="tal"]{--rf:var(--ioc-fam-talents);--rfi:var(--ioc-fam-talents-ink)}
.ioc-cards [data-route-fam="sup"]{--rf:var(--ioc-fam-company);--rfi:var(--ioc-fam-company)}
.ioc-cards [data-route-fam="com"]{--rf:var(--ioc-fam-company);--rfi:var(--ioc-fam-company)}
.ioc-cards [data-route-fam="ind"]{--rf:var(--ioc-fam-industries);--rfi:var(--ioc-fam-industries-ink)}
.ioc-cards [data-route-fam="tec"],.ioc-cards [data-route-fam="ins"]{--rf:var(--ioc-blue);--rfi:var(--ioc-blue)}
.ioc-cards [data-route-fam] .ioc-card-eyebrow{color:var(--rfi)}
.ioc-cards [data-route-fam] .ioc-cardicon,.ioc-cards [data-route-fam] .ioc-card-link{color:var(--rfi)}
.ioc-cards [data-route-fam]:hover{background:color-mix(in oklch,var(--rf) 9%,var(--ioc-surface))}
.ioc-cards [data-route-fam]:focus-visible{outline:3px solid var(--rf);outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.ioc-cards [data-route-fam]{transition:none}}

/* ---- B-15b Regions served: tabs + market grid with per-market mailbox ---- */
.ioc-regions{margin-top:clamp(22px,2.4vw,32px)}
.ioc-region-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.ioc-region-tabs button{display:inline-flex;align-items:center;gap:9px;padding:10px 15px;background:var(--ioc-surface-cool,#f2f4f8);border:1px solid transparent;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-primary);cursor:pointer;transition:background .18s var(--ioc-ease),color .18s var(--ioc-ease),border-color .18s var(--ioc-ease)}
.ioc-region-tabs button .n{font-size:10px;color:var(--ioc-text-helper)}
.ioc-region-tabs button:hover{background:var(--ioc-surface,#fff);border-color:var(--ioc-text-primary)}
.ioc-region-tabs button[aria-selected="true"]{background:var(--ioc-accent);border-color:var(--ioc-accent);color:var(--ioc-text-on-color,#fff)}
.ioc-region-tabs button[aria-selected="true"] .n{color:rgba(255,255,255,.78)}
.ioc-region-panel[hidden]{display:none}
.ioc-region-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:14px}
.ioc-region-head b{font-size:16px;font-weight:700;letter-spacing:-.015em}
.ioc-region-head span{font-size:14px;color:var(--ioc-text-secondary)}
.ioc-markets{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle)}
.ioc-markets>div{box-shadow:0 0 0 1px var(--ioc-border-subtle);background:var(--ioc-surface,#fff);padding:15px 17px}
.ioc-markets b{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.ioc-markets .tag{font-style:normal;font-family:var(--ioc-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-on-color,#fff);background:var(--ioc-accent);padding:2px 6px}
.ioc-markets a{display:flex;align-items:center;gap:7px;margin-top:7px;font-family:var(--ioc-mono);font-size:11px;color:var(--ioc-text-secondary);text-decoration:none;word-break:break-all}
.ioc-markets a svg{flex:none;width:14px;height:14px;color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-markets a:hover{color:var(--ioc-accent-ink,var(--ioc-accent))}
@media(max-width:900px){.ioc-markets{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.ioc-markets{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.ioc-region-tabs button{transition:none}}

/* ---- Section header · right column lead sentence ---- */
.ioc-head .ioc-sh-lead{align-self:end}
.ioc-sh-lead p{margin:0;font-size:clamp(16px,1.25vw,19px);line-height:1.5;color:var(--ioc-text-primary);max-width:36ch;text-wrap:pretty}
.ioc-sh-lead p b{font-weight:700}
.ioc-sh-lead .meta{display:block;margin-top:12px;font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper);line-height:1.6}
.ioc-block.dark .ioc-sh-lead p{color:var(--ioc-g10,#f4f4f4)}
.ioc-block.dark .ioc-sh-lead .meta{color:var(--ioc-g40,#a8a8a8)}
@media(max-width:860px){.ioc-sh-lead p{max-width:none}}

/* Section-header route link, used inside .ioc-sh-lead */
.ioc-sh-link{display:inline-flex;align-items:center;gap:.5rem;margin-top:.7rem;color:var(--ioc-accent,#0001ff);font-weight:600;font-size:.9rem;text-decoration:none}
.ioc-sh-link svg{width:1rem;height:1rem;transition:transform .18s ease}
.ioc-sh-link:hover svg{transform:translateX(4px)}
.dark .ioc-sh-link{color:var(--ioc-accent-on-inverse)}


/* ============================================================
   Reserved blocks, now built · B-07, B-08, B-12, B-14, B-16,
   B-18, B-19, B-20, B-23, B-24. Same contract as the rest of
   the library: white-first, square, 1px #e0e0e0, mono meta,
   family accent via var(--ioc-accent), container-clipped grids
   so a short final row never shows a divider block.
   ============================================================ */

/* ---- B-07 · Logo wall ---- */
.ioc-logowall{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);overflow:hidden}
.ioc-logowall .ioc-lw{display:flex;align-items:center;justify-content:center;min-height:112px;padding:24px 28px;box-shadow:1px 1px 0 0 var(--ioc-border-subtle);position:relative}
.ioc-logowall img{max-width:100%;max-height:40px;width:auto;height:auto;filter:grayscale(1);opacity:.62;transition:filter .18s ease,opacity .18s ease}
.ioc-logowall .ioc-lw:hover img{filter:none;opacity:1}
.ioc-logowall .ioc-lw-name{font-family:var(--ioc-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-secondary)}
.ioc-logowall-note{margin:14px 0 0;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-block.dark .ioc-logowall{background:var(--ioc-surface-inverse-raised,#1c1c1c);border-color:var(--ioc-g80,#393939)}
.ioc-block.dark .ioc-logowall .ioc-lw{box-shadow:1px 1px 0 0 var(--ioc-g80,#393939)}
.ioc-block.dark .ioc-logowall img{filter:grayscale(1) invert(1);opacity:.7}
.ioc-block.dark .ioc-logowall .ioc-lw-name{color:var(--ioc-g40,#a8a8a8)}

/* ---- B-08 · Testimonial ---- */
.ioc-quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);overflow:hidden}
.ioc-quote{padding:clamp(24px,3vw,36px);box-shadow:1px 1px 0 0 var(--ioc-border-subtle);display:flex;flex-direction:column;gap:20px;border-top:3px solid var(--ioc-accent)}
.ioc-quote blockquote{margin:0;font-size:clamp(17px,1.5vw,21px);line-height:1.5;font-weight:600;letter-spacing:-.015em;color:var(--ioc-text-primary);text-wrap:pretty}
.ioc-quote blockquote::before{content:"";display:block}
.ioc-quote figcaption{display:flex;align-items:center;gap:14px;margin-top:auto}
.ioc-quote figcaption img{width:44px;height:44px;object-fit:cover;flex:none}
.ioc-quote .ioc-q-who{display:flex;flex-direction:column;gap:3px;min-width:0}
.ioc-quote .ioc-q-who b{font-size:14px;font-weight:700;color:var(--ioc-text-primary)}
.ioc-quote .ioc-q-who span{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-secondary)}
.ioc-quote .ioc-q-src{font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-quote.lead{grid-column:1/-1}
.ioc-quote.lead blockquote{font-size:clamp(22px,2.6vw,34px);font-weight:700;line-height:1.24}
.ioc-block.dark .ioc-quotes{background:var(--ioc-surface-inverse-raised,#1c1c1c);border-color:var(--ioc-g80,#393939)}
.ioc-block.dark .ioc-quote{box-shadow:1px 1px 0 0 var(--ioc-g80,#393939)}
.ioc-block.dark .ioc-quote blockquote{color:var(--ioc-text-on-color,#fff)}
.ioc-block.dark .ioc-quote .ioc-q-who span,.ioc-block.dark .ioc-quote .ioc-q-src{color:var(--ioc-g40,#a8a8a8)}

/* ---- B-12 · Table ---- */
.ioc-tablewrap{border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff);overflow-x:auto}
.ioc-tablewrap table{width:100%;border-collapse:collapse;font-size:14px;min-width:640px}
.ioc-tablewrap caption{text-align:left;padding:14px 18px;border-bottom:1px solid var(--ioc-border-subtle);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-secondary)}
.ioc-tablewrap th{text-align:left;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;color:var(--ioc-text-secondary);background:var(--ioc-g10);padding:12px 18px;border-bottom:1px solid var(--ioc-border-subtle);white-space:nowrap;position:sticky;top:0}
.ioc-tablewrap td{padding:14px 18px;border-bottom:1px solid var(--ioc-border-subtle);color:var(--ioc-text-secondary);line-height:1.55;vertical-align:top}
.ioc-tablewrap tbody tr:last-child td{border-bottom:0}
.ioc-tablewrap tbody tr:hover td{background:var(--ioc-g10)}
.ioc-tablewrap td:first-child{color:var(--ioc-text-primary);font-weight:600}
.ioc-tablewrap td.num,.ioc-tablewrap th.num{text-align:right;font-family:var(--ioc-mono);font-variant-numeric:tabular-nums}
.ioc-tablewrap .ioc-td-yes{color:var(--ioc-accent-ink,var(--ioc-accent));font-weight:700}
.ioc-tablewrap .ioc-td-no{color:var(--ioc-text-helper)}
.ioc-table-note{margin:12px 0 0;font-family:var(--ioc-mono);font-size:11px;color:var(--ioc-text-helper)}

/* ---- B-14 · Timeline ---- */
.ioc-timeline{display:grid;gap:0;border-left:2px solid var(--ioc-border-subtle);margin-left:8px}
.ioc-tl{position:relative;padding:0 0 clamp(28px,3vw,40px) clamp(24px,3vw,36px)}
.ioc-tl:last-child{padding-bottom:0}
.ioc-tl::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;background:var(--ioc-surface,#fff);border:2px solid var(--ioc-border-strong,#8d8d8d)}
.ioc-tl.done::before{background:var(--ioc-accent);border-color:var(--ioc-accent)}
.ioc-tl.now::before{background:var(--ioc-accent);border-color:var(--ioc-accent);box-shadow:0 0 0 4px color-mix(in oklch,var(--ioc-accent) 18%,var(--ioc-surface))}
.ioc-tl-when{display:block;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper);margin-bottom:6px}
.ioc-tl.now .ioc-tl-when,.ioc-tl.done .ioc-tl-when{color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-tl b{display:block;font-size:clamp(16px,1.4vw,19px);font-weight:700;letter-spacing:-.015em;color:var(--ioc-text-primary);margin-bottom:6px}
.ioc-tl p{margin:0;font-size:14px;line-height:1.65;color:var(--ioc-text-secondary);max-width:62ch}
.ioc-block.dark .ioc-timeline{border-left-color:var(--ioc-g80,#393939)}
.ioc-block.dark .ioc-tl::before{background:var(--ioc-surface-inverse,#161616);border-color:var(--ioc-g60,#666666)}
.ioc-block.dark .ioc-tl p{color:var(--ioc-g30)}

/* ---- B-16 · Job listings ---- */
.ioc-jobs{display:grid;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);overflow:hidden}
.ioc-job{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 24px;align-items:center;padding:22px 24px;box-shadow:0 1px 0 0 var(--ioc-border-subtle);text-decoration:none;color:inherit;transition:background .16s ease}
.ioc-job:hover{background:var(--ioc-g10)}
.ioc-job:hover h3{color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-job-meta{display:flex;flex-wrap:wrap;gap:8px 16px;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-helper);margin-bottom:8px}
.ioc-job-meta .ioc-job-fam{color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-job h3{margin:0 0 6px;font-size:clamp(16px,1.4vw,19px);font-weight:700;letter-spacing:-.015em;transition:color .16s ease}
.ioc-job p{margin:0;font-size:13.5px;line-height:1.6;color:var(--ioc-text-secondary);max-width:70ch}
.ioc-job-go{display:inline-flex;align-items:center;gap:8px;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-accent-ink,var(--ioc-accent));white-space:nowrap}
.ioc-job-go svg{width:16px;height:16px;transition:transform .18s ease}
.ioc-job:hover .ioc-job-go svg{transform:translateX(4px)}
.ioc-jobs-empty{padding:32px 24px;font-size:14px;color:var(--ioc-text-secondary)}
@media(max-width:640px){.ioc-job{grid-template-columns:1fr}}

/* ---- B-18 · Code / spec ---- */
.ioc-code{border:1px solid var(--ioc-g80,#393939);background:var(--ioc-surface-inverse,#161616);overflow:hidden}
.ioc-code-bar{display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--ioc-g90,#262626);border-bottom:1px solid var(--ioc-g80,#393939);font-family:var(--ioc-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-g40,#a8a8a8)}
.ioc-code-bar b{color:var(--ioc-text-on-color,#fff);font-weight:500;letter-spacing:.04em}
.ioc-code-bar .ioc-code-lang{margin-left:auto;color:var(--ioc-accent-on-inverse)}
.ioc-code pre{margin:0;padding:20px 18px;overflow-x:auto;font-family:var(--ioc-mono);font-size:12.5px;line-height:1.9;color:var(--ioc-g20,#e0e0e0);tab-size:2}
.ioc-code pre b{color:var(--ioc-accent-on-inverse);font-weight:500}
.ioc-code pre i{color:var(--ioc-g60,#666666);font-style:normal}
.ioc-code pre em{color:var(--ioc-success,#198038);font-style:normal}
.ioc-code-foot{padding:12px 16px;border-top:1px solid var(--ioc-g80,#393939);font-family:var(--ioc-mono);font-size:11px;color:var(--ioc-g50,#8d8d8d);line-height:1.7}

/* ---- B-19 · Comparison ---- */
.ioc-compare{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);overflow:hidden}
.ioc-cmp{padding:clamp(22px,2.4vw,30px);box-shadow:1px 1px 0 0 var(--ioc-border-subtle);display:flex;flex-direction:column;gap:14px;border-top:3px solid var(--ioc-border-subtle)}
.ioc-cmp.pick{border-top-color:var(--ioc-accent);background:color-mix(in oklch,var(--ioc-accent) 4%,var(--ioc-surface))}
.ioc-cmp-k{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-cmp.pick .ioc-cmp-k{color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-cmp h3{margin:0;font-size:clamp(17px,1.6vw,22px);font-weight:700;letter-spacing:-.02em}
.ioc-cmp>p{margin:0;font-size:14px;line-height:1.65;color:var(--ioc-text-secondary)}
.ioc-cmp ul{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--ioc-border-subtle)}
.ioc-cmp li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;padding:10px 0;border-bottom:1px solid var(--ioc-border-subtle);font-size:13.5px;line-height:1.55;color:var(--ioc-text-secondary)}
.ioc-cmp li svg{width:16px;height:16px;margin-top:2px;flex:none;color:var(--ioc-accent-ink,var(--ioc-accent))}
.ioc-cmp li.no{color:var(--ioc-text-helper)}
.ioc-cmp li.no svg{color:var(--ioc-g40,#a8a8a8)}
.ioc-cmp .ioc-cmp-when{margin-top:auto;padding-top:6px;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-primary)}

/* ---- B-20 · Banner ---- */
.ioc-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px 20px;align-items:center;padding:16px 20px;background:color-mix(in oklch,var(--ioc-accent) 6%,var(--ioc-surface));border-top:3px solid var(--ioc-accent);border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-banner>svg{width:22px;height:22px;color:var(--ioc-accent-ink,var(--ioc-accent));flex:none}
.ioc-banner p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ioc-text-primary)}
.ioc-banner p b{font-weight:700}
.ioc-banner .ioc-banner-k{display:block;font-family:var(--ioc-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-accent-ink,var(--ioc-accent));margin-bottom:4px}
.ioc-banner a.ioc-banner-go{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ioc-accent-ink,var(--ioc-accent));text-decoration:none;white-space:nowrap}
.ioc-banner a.ioc-banner-go svg{width:16px;height:16px;transition:transform .18s ease}
.ioc-banner a.ioc-banner-go:hover svg{transform:translateX(4px)}
.ioc-banner .ioc-banner-x{background:none;border:0;padding:6px;cursor:pointer;color:var(--ioc-text-secondary);line-height:0}
.ioc-banner .ioc-banner-x svg{width:16px;height:16px}
.ioc-banner .ioc-banner-x:hover{color:var(--ioc-text-primary)}
.ioc-banner.warn{background:var(--ioc-amber-bg,#fdf6ec);border-top-color:var(--ioc-amber,#b45309)}
.ioc-banner.warn>svg,.ioc-banner.warn .ioc-banner-k,.ioc-banner.warn a.ioc-banner-go{color:var(--ioc-amber,#b45309)}
@media(max-width:640px){.ioc-banner{grid-template-columns:auto minmax(0,1fr);}.ioc-banner a.ioc-banner-go{grid-column:2}}

/* ---- B-23 · Embed ---- */
.ioc-embed{border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff)}
.ioc-embed-frame{position:relative;aspect-ratio:16/9;background:var(--ioc-surface-inverse,#161616);overflow:hidden}
.ioc-embed-frame iframe,.ioc-embed-frame video,.ioc-embed-frame img{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.ioc-embed-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;padding:14px 18px;border-top:1px solid var(--ioc-border-subtle)}
.ioc-embed-cap b{font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.ioc-embed-cap span{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-embed-cap .ioc-embed-src{margin-left:auto}
.ioc-embed-consent{padding:14px 18px;border-top:1px solid var(--ioc-border-subtle);font-size:12.5px;line-height:1.7;color:var(--ioc-text-secondary)}
.ioc-embed-consent button{font:inherit;font-weight:600;color:var(--ioc-accent-ink,var(--ioc-accent));background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* ---- B-24 · Divider ---- */
.ioc-divider{border:0;height:1px;background:var(--ioc-border-subtle);margin:clamp(40px,6vw,80px) 0}
.ioc-divider.strong{height:2px;background:var(--ioc-text-primary)}
.ioc-divider.accent{height:3px;background:var(--ioc-accent);width:64px;margin-left:0}
.ioc-divider-label{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center;margin:clamp(40px,6vw,80px) 0}
.ioc-divider-label span{font-family:var(--ioc-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-text-helper)}
.ioc-divider-label::after{content:"";height:1px;background:var(--ioc-border-subtle)}
.ioc-block.dark .ioc-divider{background:var(--ioc-g80,#393939)}
.ioc-block.dark .ioc-divider-label::after{background:var(--ioc-g80,#393939)}
.ioc-block.dark .ioc-divider-label span{color:var(--ioc-g50,#8d8d8d)}
@media(prefers-reduced-motion:reduce){.ioc-logowall img,.ioc-job,.ioc-job-go svg,.ioc-banner a.ioc-banner-go svg{transition:none}}

/* Icon sizing for link and question contracts (was missing) */
.ioc-cardlink svg{width:16px;height:16px;flex:none;transition:transform .15s var(--ioc-ease)}
.ioc-cardlink:hover svg{transform:translateX(3px)}
.ioc-faq-q svg{width:20px;height:20px;flex:none}

/* ---- absorbed from ioc-forms.css (CMS-D-071) ---- */
/* ============================================================
   INFOC Simple CTA Forms · v3.0.0 · styling
   Light only. Builds on the B-17 .ioc-field / .ioc-form-grid
   contract already in ioc-blocks.css rather than replacing it,
   so a preset-rendered form and a hand-written one look the same.
   Only the parts B-17 does not cover are defined here.
   ============================================================ */

.ioc-form{background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-subtle);padding:clamp(24px,2.6vw,36px);display:flex;flex-direction:column;gap:22px}
/* The renderer wraps the fields, action, reassurance and consent in
   [data-form-body] so the success state can replace them in one node.
   That wrapper owns their rhythm; .ioc-form's gap does not reach them. */
.ioc-form [data-form-body]{display:flex;flex-direction:column;gap:22px}
.ioc-form-title{font-size:clamp(21px,2vw,27px);line-height:1.15;letter-spacing:-.02em;margin:0}
.ioc-form-copy{margin:-10px 0 0;color:var(--ioc-text-secondary);font-size:16px;line-height:1.55;max-width:54ch}

/* ---- ask line · sets the length of the ask before the first field ---- */
/* No separator glyph. Any divider attached to an item, whether a border
   or a pseudo-element, is placed by DOM position and cannot know where
   the flex line breaks, so it dangles on a wrapped row. Spacing alone
   separates these three at 11px uppercase mono. */
.ioc-form-ask{display:flex;flex-wrap:wrap;column-gap:26px;row-gap:8px;margin:-6px 0 0;padding:0;list-style:none}
.ioc-form-ask span{white-space:nowrap;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc-text-secondary);line-height:1.2}

/* ---- reassurance · under the action, never above it.
   Named .ioc-form-sure, not .ioc-reassure: that name already belongs to
   the padded B-17 reassurance panel in ioc-blocks.css. ---- */
.ioc-form-sure{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px 24px;margin:0;padding:18px 0 0;list-style:none;border-top:1px solid var(--ioc-border-subtle)}
.ioc-form-sure li{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;line-height:1.45;color:var(--ioc-text-secondary)}
.ioc-form-sure svg{width:16px;height:16px;flex:0 0 auto;margin-top:2px;color:var(--ioc-accent);fill:none;stroke:currentColor;stroke-width:2}

/* ---- error summary · focus lands here on a failed submit ---- */
.ioc-form-errors{border:1px solid var(--ioc-danger,#da1e28);border-left:3px solid var(--ioc-danger,#da1e28);background:var(--ioc-danger-surface,#fff1f1);padding:16px 20px}
.ioc-form-errors:focus{outline:2px solid var(--ioc-focus);outline-offset:2px}
.ioc-form-errors h4{margin:0 0 8px;font-size:15px;letter-spacing:-.01em}
.ioc-form-errors ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.ioc-form-errors a{color:var(--ioc-danger-text,#a2191f);font-size:14px}

/* ---- field error state ---- */
.ioc-field.is-error input,.ioc-field.is-error select,.ioc-field.is-error textarea{border-color:var(--ioc-danger,#da1e28)}
.ioc-choicegroup.is-error .ioc-choices{border-color:var(--ioc-danger,#da1e28)}
.ioc-field-error{margin:0;color:var(--ioc-danger-text,#a2191f);font-size:13px;font-family:var(--ioc-mono);letter-spacing:.01em}
.ioc-opt{color:var(--ioc-text-helper);font-weight:400;font-family:var(--ioc-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase}

/* ---- radio group · one required state for the whole group ---- */
.ioc-choicegroup{grid-column:1/-1;border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ioc-choicegroup legend{padding:0;font-size:13px;font-weight:600;color:var(--ioc-text-primary)}
.ioc-choicegroup legend .req{color:var(--ioc-accent)}
.ioc-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-border-strong);overflow:hidden}
.ioc-choices:has(>:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(220px,1fr))}
.ioc-choice{background:var(--ioc-surface,#fff);box-shadow:1px 1px 0 0 var(--ioc-border-subtle);padding:14px 16px;display:flex;gap:12px;align-items:flex-start;cursor:pointer;min-height:44px;transition:background var(--ioc-dur-fast) var(--ioc-ease)}
.ioc-choice:hover{background:var(--ioc-g10)}
.ioc-choice input{margin:3px 0 0;accent-color:var(--ioc-accent);width:16px;height:16px;flex:0 0 auto}
.ioc-choice b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em}
.ioc-choice small{display:block;margin-top:2px;color:var(--ioc-text-secondary);font-size:13px;line-height:1.4}
.ioc-choice:has(input:checked){background:color-mix(in oklch,var(--ioc-accent) 5%,var(--ioc-surface));box-shadow:inset 3px 0 0 0 var(--ioc-accent)}
.ioc-choice:focus-within{outline:2px solid var(--ioc-focus);outline-offset:-2px}

/* ---- collapsed secondary qualification ---- */
.ioc-more{grid-column:1/-1;border:1px solid var(--ioc-border-subtle);background:var(--ioc-surface,#fff)}
.ioc-more>summary{cursor:pointer;padding:13px 16px;font-size:14px;font-weight:600;letter-spacing:-.01em;display:flex;gap:8px;align-items:center;min-height:44px}
.ioc-more>summary:hover{background:var(--ioc-g10)}
.ioc-more>summary:focus-visible{outline:2px solid var(--ioc-focus);outline-offset:-2px}
.ioc-more[open]>summary{border-bottom:1px solid var(--ioc-border-subtle)}
.ioc-more .ioc-form-grid{padding:20px 16px}

/* ---- file input · limits stated before the picker opens ---- */
.ioc-filefield input[type="file"]{padding:11px 14px;font-size:14px;font-family:var(--ioc-sans)}
.ioc-filefield input[type="file"]::file-selector-button{font:inherit;font-size:12px;font-family:var(--ioc-mono);letter-spacing:.04em;text-transform:uppercase;background:var(--ioc-surface,#fff);border:1px solid var(--ioc-text-primary);color:var(--ioc-text-primary);padding:7px 13px;margin-right:12px;cursor:pointer}
.ioc-filefield input[type="file"]::file-selector-button:hover{background:var(--ioc-text-primary);color:var(--ioc-text-on-color,#fff)}
.ioc-fhint{color:var(--ioc-text-helper);font-size:12px;font-family:var(--ioc-mono);letter-spacing:.02em}

/* ---- consent · separate, optional, unticked ---- */
.ioc-marketing{display:flex;gap:12px;align-items:flex-start;font-size:13.5px;color:var(--ioc-text-secondary);line-height:1.5;cursor:pointer;min-height:44px;padding:0;margin-top:-6px}
.ioc-marketing input{margin:2px 0 0;accent-color:var(--ioc-accent);width:16px;height:16px;flex:0 0 auto}
.ioc-privacy{margin:0;font-size:12.5px;color:var(--ioc-text-helper);line-height:1.55;max-width:66ch}

/* ---- actions ---- */
.ioc-form-actions{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}
.ioc-form-actions .ioc-form-note{max-width:46ch;font-size:13.5px;line-height:1.5;color:var(--ioc-text-secondary)}
.ioc-form-actions .btn{flex:0 0 auto;padding-block:15px;font-size:15.5px}

/* ---- success · replaces the body, does not sit under it ---- */
.ioc-form-success[hidden],.ioc-form [hidden]{display:none}
.ioc-form-success{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:8px 0}
.ioc-form-success:focus{outline:2px solid var(--ioc-focus);outline-offset:4px}
.ioc-form-success h3{margin:0;font-size:clamp(20px,1.8vw,26px);letter-spacing:-.02em}
.ioc-form-success p{margin:0;color:var(--ioc-text-secondary);max-width:52ch}
.ioc-form-ok{width:44px;height:44px;display:grid;place-items:center;background:var(--ioc-accent);margin:0}
.ioc-form-ok svg{width:24px;height:24px;color:var(--ioc-text-on-color,#fff);fill:none}
.ioc-form-success .btn{margin-top:8px}

/* ---- honeypot ---- */
.ioc-hp{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- compact presets · newsletter, download, event ---- */
.ioc-form.compact{gap:16px;padding:clamp(20px,2vw,28px)}
.ioc-form.compact [data-form-body]{gap:16px}
.ioc-form.compact .ioc-form-grid{grid-template-columns:1fr}
.ioc-form.compact .ioc-form-actions{justify-content:flex-start}

/* ---- on a dark band the form stays a light card ---- */
.ioc-block.dark .ioc-form,.cta-band .ioc-form{background:var(--ioc-surface,#fff);color:var(--ioc-text-primary)}
.ioc-block.dark .ioc-form-title,.cta-band .ioc-form-title{color:var(--ioc-text-primary)}
.ioc-block.dark .ioc-form p,.cta-band .ioc-form p{color:var(--ioc-text-secondary)}

@media(max-width:640px){
  .ioc-form-actions{flex-direction:column;align-items:stretch}
  .ioc-form-actions .btn{width:100%;justify-content:center;order:-1}
  .ioc-form-sure{gap:8px}
  .ioc-choices{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.ioc-choice{transition:none}}

/* arrow inside form buttons · the sprite is stroked, not filled */
.ioc-form .btn svg{width:18px;height:18px;flex:0 0 auto;fill:none;stroke:currentColor;transition:transform var(--ioc-dur-fast) var(--ioc-ease)}
.ioc-form .btn:hover svg{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.ioc-form .btn:hover svg{transform:none}}


/* CMS-D-071 D-9: the source set this inline on the legal row; carried as a class. */
.legal-actions{display:flex;align-items:center;gap:16px}

/* ==========================================================================
   CMS-D-071 W6 — empty-segment collapse for owned overlay item templates.
   Fixed item templates emit every optional segment; a segment whose bound
   value is empty must not paint (tags, eyebrows, notes, link stubs, glyphs).
   ========================================================================== */
.infoc-cms .ioc-tag:empty{display:none}
.infoc-cms .ioc-card-eyebrow:empty{display:none}
.infoc-cms .ioc-card-tags:not(:has(.ioc-tag:not(:empty))){display:none}
.infoc-cms .ioc-note:has(> p:empty){display:none}
.infoc-cms .ioc-sh-lead:has(> p:empty){display:none}
.infoc-cms .ioc-fmark svg:has(use[href$="#"]){display:none}
.infoc-cms .ioc-card-ix svg:has(use[href$="#"]){display:none}
.infoc-cms .ioc-card-link[href="#"]{display:none}
.infoc-cms .ioc-card[data-route-fam=""]{--rf:initial;--rfi:initial;background:var(--ioc-surface,#fff);border-top:0!important}

/* CMS-D-071 W7 — the talents role-family rowgroup styles, absorbed VERBATIM
   from the page-local <style> shared by talents/professionals.html and
   talents/employers.html (W2 skipped them as dead; the W6 fixed variants
   B-11-V07/V08 now emit this markup). */
.ioc-rowgroup{margin-bottom:28px}.ioc-rowgroup>h3{font-size:clamp(18px,1.8vw,24px);font-weight:700;letter-spacing:-.015em;margin:0 0 14px}.ioc-rowgroup>h3 span{font-family:var(--ioc-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-text-helper);margin-left:10px}

/* ==========================================================================
   CMS-D-071 W11 — the home page design, absorbed VERBATIM from the six
   inline <style> blocks of docs/designs/infoc-site/index.html (the home
   design lives nowhere else). .showcase is rewritten to .showcase —
   the render wrapper carries the scope classes on the home page.
   ========================================================================== */

.infoc-logo{display:inline-flex;align-items:baseline;font-family:"Michroma",sans-serif;font-weight:400;letter-spacing:.11em;line-height:1;padding-bottom:.26em;-webkit-text-stroke:.063em currentColor;paint-order:stroke fill}.infoc-logo .g{display:inline-block}.infoc-logo .g:first-child{margin-right:-.07em}.infoc-logo .g:nth-child(2){margin-right:-.04em}.infoc-logo .gc{position:relative;color:var(--ioc--blue);margin-right:-.02em}.infoc-logo .gc::after{content:"";position:absolute;left:0;top:calc(100% + .122em);width:calc(100% - .11em);height:.14em;background:currentColor}.logo .logo-sub{margin-left:.65rem;padding-left:.65rem;border-left:1px solid var(--ioc--g20);color:var(--ioc--g70);font-family:"JetBrains Mono",monospace;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;align-self:center}
.architecture-table-wrap{overflow-x:auto;border-top:1px solid var(--ioc--g20)}.architecture-table{width:100%;border-collapse:collapse;font-size:.85rem}.architecture-table th,.architecture-table td{text-align:left;padding:1rem;border-bottom:1px solid var(--ioc--g20);vertical-align:top}.architecture-table th{font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc--g70)}.assessment-result{display:none}.assessment-result.active{display:block}.score-ring{width:6rem;height:6rem;border:3px solid var(--ioc--blue);border-radius:50%;display:grid;place-items:center;margin-bottom:1.5rem}.score-ring strong{font-size:1.6rem;font-weight:600;color:var(--ioc--blue)}.result-notification{margin:1.5rem 0;padding:1.25rem;background:var(--ioc--g10);border-left:4px solid var(--ioc--blue)}.result-notification strong{display:block;margin-bottom:.35rem}.result-notification p{margin:0;color:var(--ioc--g70);font-size:.85rem}

    /* Legacy --ioc--* names alias the canonical --ioc-* tokens in ioc-core.css.
   Never give one of these a literal value: two namespaces with two values is how
   the same grey ended up painted twice on one page. */
body.ioc-site{--ioc--blue:var(--ioc-blue);--ioc--g100:var(--ioc-g100);--ioc--g70:var(--ioc-g70);--ioc--g60:var(--ioc-g60);--ioc--g30:var(--ioc-g30);--ioc--g20:var(--ioc-g20);--ioc--g10:var(--ioc-g10);--ioc--white:var(--ioc-white);--ioc--black:var(--ioc-g100);--ioc--focus:var(--ioc-focus);--ioc--ease:var(--ioc-ease);--ioc--max:1440px;--ioc--gutter:clamp(1.25rem,4vw,4rem);--ioc--section:clamp(5rem,9vw,9rem)}
    *{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:5rem}body{margin:0;background:var(--ioc--white);color:var(--ioc--g100);font-family:"Manrope","Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}::selection{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff)}.skip-link{position:fixed;left:1rem;top:-5rem;z-index:1000;background:var(--ioc--blue);color:var(--ioc-text-on-primary,#fff);padding:.75rem 1rem}.skip-link:focus{top:1rem}:focus-visible{outline:3px solid var(--ioc--focus);outline-offset:3px}.container{width:min(100%,var(--ioc--max));margin-inline:auto;padding-inline:var(--ioc--gutter)}.eyebrow{display:flex;align-items:center;gap:.75rem;margin:0 0 1.25rem;text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;font-weight:600}.eyebrow:before{content:"";width:2rem;height:2px;background:var(--ioc--blue)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:400;letter-spacing:-.035em;line-height:1.02}h1{font-size:clamp(3rem,6.8vw,7.25rem)}h2{font-size:clamp(2.35rem,4.7vw,5rem)}h3{font-size:clamp(1.35rem,2.1vw,2rem)}.lede{max-width:48rem;color:var(--ioc--g70);font-size:clamp(1.08rem,1.5vw,1.35rem);line-height:1.55}.section{padding-block:var(--ioc--section);border-top:1px solid var(--ioc--g20)}.section-head{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr);gap:clamp(2rem,6vw,7rem);align-items:end;margin-bottom:clamp(3rem,6vw,6rem)}.section-head p{margin:0;color:var(--ioc--g70);font-size:1.05rem}.section-kicker{font-family:"JetBrains Mono",monospace;color:var(--ioc--blue);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase}.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:2.5rem;min-height:3.5rem;padding:.9rem 1rem;border:1px solid transparent;border-radius:0;background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);font-weight:600;cursor:pointer;transition:background .2s,color .2s,transform .2s var(--ioc--ease)}.btn:hover{background:var(--ioc-blue-hover,#0000c4)}.btn:active{transform:translateY(1px)}.btn .icon{width:1.25rem}.btn-secondary{background:transparent;border-color:var(--ioc--g100);color:var(--ioc--g100)}.btn-secondary:hover{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.text-link{display:inline-flex;align-items:center;gap:.6rem;color:var(--ioc-link-color,var(--ioc--blue));font-weight:600}.text-link .icon{width:1.1rem;transition:transform .2s}.text-link:hover .icon{transform:translateX(.3rem)}.tag{display:inline-flex;padding:.35rem .6rem;background:var(--ioc--g10);font-size:.75rem;letter-spacing:.04em}.icon{width:1.5rem;height:1.5rem;flex:0 0 auto}
    .site-header{position:sticky;top:0;z-index:100;height:4rem;background:rgba(255,255,255,.94);border-bottom:1px solid var(--ioc--g20);backdrop-filter:blur(14px)}.nav-wrap{height:100%;display:flex;align-items:center}.logo{display:flex;align-items:center;align-self:stretch;min-width:10rem;font-size:1.45rem;font-weight:700;letter-spacing:-.08em}.logo-mark{color:var(--ioc--blue)}.nav{display:flex;align-self:stretch;margin-left:auto}.nav-item{position:relative}.nav-trigger,.nav-link{height:100%;display:flex;align-items:center;gap:.4rem;padding:0 1rem;border:0;background:transparent;font-size:.875rem;cursor:pointer}.nav-trigger:hover,.nav-link:hover,.nav-trigger[aria-expanded="true"]{background:var(--ioc--g10)}.nav-trigger .icon{width:1rem;transition:transform .2s}.nav-trigger[aria-expanded="true"] .icon{transform:rotate(180deg)}.nav-actions{display:flex;align-self:stretch;margin-left:.5rem}.nav-actions .btn{min-height:auto;height:100%;gap:1.5rem}.menu-toggle{display:none;width:4rem;height:4rem;border:0;border-left:1px solid var(--ioc--g20);background:var(--ioc-surface,#fff);align-items:center;justify-content:center}.menu-toggle .icon{width:1.5rem}.mega.open{display:grid;animation:menuIn .22s var(--ioc--ease)}.mega a:hover{background:var(--ioc--g10)}.mega span{color:var(--ioc--g70);font-size:.85rem}@keyframes menuIn{from{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:none}}
    .hero{position:relative;overflow:hidden}.hero-grid{min-height:calc(100vh - 4rem);min-height:calc(100svh - 4rem);display:grid;grid-template-columns:minmax(0,7fr) minmax(22rem,5fr);align-items:stretch}.hero-copy{padding:clamp(4rem,9vw,8rem) var(--ioc--gutter) 3rem max(var(--ioc--gutter),calc((100vw - var(--ioc--max))/2 + var(--ioc--gutter)));display:flex;flex-direction:column;justify-content:space-between}.hero h1{max-width:65rem;margin-bottom:2rem}.hero h1 em{color:var(--ioc--blue);font-style:normal}.hero-copy-bottom{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:end}.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}.hero-meta{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;padding-top:1.5rem;border-top:1px solid var(--ioc--g20);font-size:.78rem;color:var(--ioc--g70)}.hero-panel{position:relative;background:var(--ioc--black);color:var(--ioc-text-on-color,#fff);padding:2rem;display:flex;flex-direction:column;justify-content:space-between;min-height:38rem}.panel-label{display:flex;justify-content:space-between;font-family:"JetBrains Mono",monospace;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ioc-g30,#c6c6c6)}.panel-label:after{content:"● LIVE";color:var(--ioc-success,#198038)}.system-map{position:relative;aspect-ratio:1/1;max-height:32rem;margin:auto;width:100%}.system-map:before,.system-map:after{content:"";position:absolute;background:var(--ioc-g80,#393939)}.system-map:before{left:50%;top:10%;bottom:10%;width:1px}.system-map:after{top:50%;left:10%;right:10%;height:1px}.map-core,.map-node{position:absolute;border:1px solid var(--ioc-g70,#525252);background:var(--ioc--black);padding:1rem}.map-core{z-index:2;left:50%;top:50%;width:9rem;height:9rem;transform:translate(-50%,-50%);background:var(--ioc--blue);border-color:var(--ioc--blue);display:flex;flex-direction:column;justify-content:space-between}.map-core span{font-weight:700;letter-spacing:-.05em}.map-core strong{font-weight:400}.map-node{width:41%;min-height:6rem}.map-node small{color:var(--ioc-g50,#8d8d8d)}.map-node strong,.map-node span{display:block}.map-node strong{margin-top:.5rem;font-weight:500}.map-node span{color:var(--ioc-g40,#a8a8a8);font-size:.75rem}.node-a{left:0;top:0}.node-b{right:0;top:0}.node-c{left:0;bottom:0}.node-d{right:0;bottom:0}
    .proof{background:var(--ioc--g10);border-top:1px solid var(--ioc--g20);border-bottom:1px solid var(--ioc--g20)}.proof-grid{display:grid;grid-template-columns:repeat(4,1fr)}.proof-item{padding:2rem;border-left:1px solid var(--ioc--g20);min-height:10rem}.proof-item:first-child{border-left:0}.proof-item strong{display:block;font-size:clamp(2rem,4vw,3.75rem);font-weight:300;letter-spacing:-.05em;line-height:1;color:var(--ioc--blue)}.proof-item span{display:block;margin-top:1rem;color:var(--ioc--g70);font-size:.85rem;max-width:12rem}
    .solution-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ioc--g20);border-left:1px solid var(--ioc--g20)}.solution-card{position:relative;min-height:25rem;padding:2rem;border-right:1px solid var(--ioc--g20);border-bottom:1px solid var(--ioc--g20);display:flex;flex-direction:column;overflow:hidden;transition:background .25s,color .25s}.solution-card:hover{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.solution-card:hover p{color:var(--ioc-g30,#c6c6c6)}.solution-card .icon{margin:auto 0;color:var(--ioc--blue);width:3.5rem;height:3.5rem}.solution-card h3{margin-bottom:1rem}.solution-card p{color:var(--ioc--g70);font-size:.9rem}.solution-card .card-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:1.5rem;border-top:1px solid var(--ioc--g20);font-size:.78rem}.solution-card .card-foot .icon{width:1.1rem;height:1.1rem;margin:0}.solution-card:hover .card-foot{border-color:var(--ioc-g70,#525252)}
    .ai-section{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.ai-section .section-head p{color:var(--ioc-g30,#c6c6c6)}.ai-layout{display:grid;grid-template-columns:minmax(16rem,1fr) minmax(0,3fr);border-top:1px solid var(--ioc-g80,#393939)}.tabs{border-right:1px solid var(--ioc-g80,#393939)}.tab{width:100%;min-height:5rem;padding:1rem 1.25rem;border:0;border-bottom:1px solid var(--ioc-g80,#393939);background:transparent;color:var(--ioc-g30,#c6c6c6);text-align:left;display:flex;justify-content:space-between;align-items:center;cursor:pointer}.tab:hover{background:var(--ioc-g90,#262626)}.tab[aria-selected="true"]{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff)}.tab-panel{display:none;min-height:30rem;padding:clamp(2rem,5vw,5rem)}.tab-panel.active{display:grid;grid-template-columns:1.3fr .7fr;gap:3rem;animation:panelIn .35s var(--ioc--ease)}@keyframes panelIn{from{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:none}}.tab-panel h3{font-size:clamp(2rem,4vw,4rem);max-width:42rem}.tab-panel p{color:var(--ioc-g30,#c6c6c6);max-width:42rem}.cap-list{align-self:end;list-style:none;margin:0;padding:0}.cap-list li{padding:1rem 0;border-top:1px solid var(--ioc-g80,#393939);display:flex;gap:.75rem}.cap-list .icon{width:1.1rem;color:var(--ioc-success,#198038)}
    .industry-strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ioc--g20);border-left:1px solid var(--ioc--g20)}.industry{min-height:19rem;padding:1.5rem;border-right:1px solid var(--ioc--g20);border-bottom:1px solid var(--ioc--g20);display:flex;flex-direction:column;justify-content:space-between;transition:background .2s}.industry:hover{background:var(--ioc--g10)}.industry .icon{color:var(--ioc--blue);width:2rem;height:2rem}.industry p{color:var(--ioc--g70);font-size:.85rem;margin-bottom:0}.industry strong{font-size:1.25rem;font-weight:500}.industry span{font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--ioc--g60)}
    .process{background:var(--ioc--g10)}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);counter-reset:steps}.step{position:relative;padding:2rem 2rem 4rem 0;border-top:2px solid var(--ioc--g100);counter-increment:steps}.step:before{content:"0" counter(steps);display:block;margin-bottom:4rem;color:var(--ioc--blue);font-family:"JetBrains Mono",monospace;font-size:.75rem}.step:not(:last-child):after{content:"";position:absolute;right:0;top:-5px;width:8px;height:8px;background:var(--ioc--blue)}.step h3{font-size:1.45rem}.step p{color:var(--ioc--g70);font-size:.9rem;max-width:17rem}
    .gateways{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ioc--g20);border:1px solid var(--ioc--g20)}.gateway{background:var(--ioc-surface,#fff);min-height:35rem;padding:clamp(2rem,5vw,5rem);display:flex;flex-direction:column;justify-content:space-between;transition:background .25s,color .25s}.gateway:hover{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff)}.gateway .gateway-top{display:flex;justify-content:space-between}.gateway .icon{width:2.5rem;height:2.5rem}.gateway h3{font-size:clamp(2.5rem,5vw,5rem);margin-bottom:1rem}.gateway p{max-width:32rem;color:var(--ioc--g70)}.gateway:hover p{color:var(--ioc-text-on-color,#fff)}.gateway .text-link{color:inherit}.gateway-index{font-family:"JetBrains Mono",monospace;font-size:.75rem}
    .case-grid{display:grid;grid-template-columns:1.2fr .8fr;min-height:38rem;border:1px solid var(--ioc--g20)}.case-visual{position:relative;background:var(--ioc-surface-brand-deep,#001141);color:var(--ioc-text-on-color,#fff);padding:clamp(2rem,5vw,5rem);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.case-visual:after{content:"";position:absolute;width:24rem;height:24rem;right:-8rem;bottom:-8rem;border:5rem solid var(--ioc--blue);border-radius:50%;opacity:.7}.case-visual>.carbon-icon{position:relative;z-index:1;width:clamp(5rem,12vw,11rem);height:clamp(5rem,12vw,11rem);color:var(--ioc-text-on-color,#fff)}.case-visual p{position:relative;z-index:1;max-width:24rem;color:var(--ioc-text-on-brand-deep,#d0e2ff)}.case-copy{padding:clamp(2rem,5vw,5rem);display:flex;flex-direction:column;justify-content:space-between}.case-copy blockquote{font-size:clamp(1.5rem,2.5vw,2.6rem);line-height:1.25;letter-spacing:-.03em;margin:0}.case-copy cite{display:block;margin-top:2rem;color:var(--ioc--g70);font-size:.85rem;font-style:normal}.outcomes{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ioc--g20)}.outcomes div{padding:1rem 0}.outcomes strong{display:block;font-size:1.75rem;font-weight:400}.outcomes span{font-size:.75rem;color:var(--ioc--g70)}
    .insights{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ioc--g20)}.insight{padding:2rem 2rem 2rem 0;min-height:25rem;border-bottom:1px solid var(--ioc--g20);display:flex;flex-direction:column}.insight:not(:last-child){border-right:1px solid var(--ioc--g20);margin-right:2rem}.insight-meta{display:flex;justify-content:space-between;font-size:.72rem;color:var(--ioc--g60);text-transform:uppercase;letter-spacing:.06em}.insight-graphic{height:8rem;margin:2rem 0;background:var(--ioc--g10);position:relative;overflow:hidden}.insight-graphic:before{content:"";position:absolute;background:var(--ioc--blue);inset:auto 0 0;height:28%}.insight:nth-child(3) .insight-graphic:before{height:100%;left:66%;background:var(--ioc--g100)}.insight h3{font-size:1.45rem}.insight .text-link{margin-top:auto}
    .faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(3rem,8vw,9rem)}.faq-list{border-top:1px solid var(--ioc--g100)}.faq-item{border-bottom:1px solid var(--ioc--g20)}.faq-q{width:100%;border:0;background:transparent;padding:1.4rem 0;display:flex;justify-content:space-between;align-items:center;text-align:left;font-weight:500;cursor:pointer}.faq-q .icon{transition:transform .25s}.faq-q[aria-expanded="true"] .icon{transform:rotate(45deg)}.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s var(--ioc--ease)}.faq-a>div{overflow:hidden}.faq-a p{max-width:42rem;color:var(--ioc--g70);padding:0 2rem 1.5rem 0;margin:0}.faq-q[aria-expanded="true"]+.faq-a{grid-template-rows:1fr}
    .contact{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,9vw,10rem)}.contact h2{font-size:clamp(3rem,6vw,6.5rem)}.contact p{color:var(--ioc-text-on-brand-soft,#e5e5ff);max-width:38rem}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.field{display:flex;flex-direction:column;gap:.5rem}.field.full{grid-column:1/-1}.field label{font-size:.75rem}.field input,.field select,.field textarea{width:100%;border:0;border-bottom:1px solid var(--ioc-border-on-color,#fff);background:rgba(255,255,255,.1);border-radius:0;color:var(--ioc-text-on-color,#fff);padding:1rem;outline:0}.field select option{color:var(--ioc--g100)}.field textarea{min-height:8rem;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{box-shadow:inset 0 -3px var(--ioc-border-on-color,#fff);background:rgba(255,255,255,.16)}.field input::placeholder,.field textarea::placeholder{color:var(--ioc-text-on-brand-muted,#d0d0ff)}.contact-form .btn{grid-column:1/-1;background:var(--ioc-text-on-color,#fff);color:var(--ioc--blue);margin-top:.5rem}.contact-form .btn:hover{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.form-note{grid-column:1/-1;font-size:.72rem;color:var(--ioc-text-on-brand-soft,#e5e5ff)}
    footer{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff);padding-top:4rem}.footer-top{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:3rem;padding-bottom:5rem}.footer-brand .logo{height:auto}.footer-brand p{color:var(--ioc-g40,#a8a8a8);max-width:22rem;margin-top:1.5rem}.footer-col h3{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-g50,#8d8d8d)}.footer-col a{display:block;padding:.35rem 0;color:var(--ioc-g30,#c6c6c6);font-size:.9rem}.footer-col a:hover{color:var(--ioc-text-on-color,#fff);text-decoration:underline}.footer-bottom{display:flex;justify-content:space-between;gap:2rem;padding:1.5rem 0;border-top:1px solid var(--ioc-g80,#393939);color:var(--ioc-g50,#8d8d8d);font-size:.75rem}.footer-bottom div{display:flex;gap:1.5rem}.back-top{border:0;background:transparent;color:var(--ioc-text-on-color,#fff);display:flex;gap:.5rem;cursor:pointer}.back-top .icon{transform:rotate(-90deg);width:1rem}
    .reveal{opacity:0;transform:translateY(1.5rem);transition:opacity .7s var(--ioc--ease),transform .7s var(--ioc--ease)}.reveal.visible{opacity:1;transform:none}.stagger>*{opacity:0;transform:translateY(1rem);transition:opacity .55s var(--ioc--ease),transform .55s var(--ioc--ease)}.stagger.visible>*{opacity:1;transform:none}.stagger.visible>*:nth-child(2){transition-delay:.07s}.stagger.visible>*:nth-child(3){transition-delay:.14s}.stagger.visible>*:nth-child(4){transition-delay:.21s}.stagger.visible>*:nth-child(5){transition-delay:.28s}.stagger.visible>*:nth-child(6){transition-delay:.35s}
    /* Direction 02: editorial composition */
    .editorial{--ioc--blue:var(--ioc-blue)}.editorial h1,.editorial h2{letter-spacing:-.055em}.editorial .site-header{height:5rem}.editorial .hero-grid{grid-template-columns:1fr;min-height:auto}.editorial .hero-copy{min-height:calc(100svh - 5rem);padding-top:clamp(5rem,10vw,10rem);display:grid;grid-template-columns:minmax(0,1.7fr) minmax(19rem,.3fr);column-gap:4rem}.editorial .hero-copy>.eyebrow{grid-column:1/-1;align-self:start}.editorial .hero h1{font-size:clamp(4rem,8.6vw,9.25rem);grid-column:1/-1;align-self:center;max-width:85rem}.editorial .hero-copy-bottom{grid-column:1/-1}.editorial .hero-panel{min-height:30rem;background:var(--ioc-surface,#fff);color:var(--ioc--g100);border-top:1px solid var(--ioc--g20);padding:var(--ioc--gutter);margin-inline:auto;width:min(100%,var(--ioc--max))}.editorial .panel-label{color:var(--ioc--g70)}.editorial .editorial-visual{display:grid;grid-template-columns:.4fr 1.6fr;gap:2rem;align-items:start}.quote-mark{font-size:14rem;line-height:.6;color:var(--ioc--blue);font-family:Georgia,serif;margin:0}.manifesto{font-size:clamp(2rem,4.5vw,5rem);line-height:1.1;letter-spacing:-.045em;max-width:62rem}.manifesto-foot{grid-column:2;display:flex;gap:2rem;border-top:1px solid var(--ioc--g20);padding-top:1rem;font-family:"JetBrains Mono",monospace;font-size:.72rem}.editorial .proof{background:var(--ioc-surface,#fff)}.editorial .proof-grid{border-top:1px solid var(--ioc--g20)}.editorial .proof-item{min-height:13rem;padding-top:3rem}.editorial .solution-grid{grid-template-columns:1fr 1fr}.editorial .solution-card{min-height:30rem}.editorial .solution-card:nth-child(3n){grid-column:span 2;min-height:22rem}.editorial .gateway{min-height:42rem}
    /* Direction 03: modular control system */
    .modular{--ioc--g10:var(--ioc-g10)}.modular .hero{background:var(--ioc--g10)}.modular .hero-grid{padding:var(--ioc--gutter);gap:1rem;grid-template-columns:1.05fr .95fr;min-height:calc(100svh - 4rem)}.modular .hero-copy{background:var(--ioc-surface,#fff);padding:clamp(3rem,6vw,6rem);border:1px solid var(--ioc--g20)}.modular .hero-panel{background:var(--ioc-surface,#fff);color:var(--ioc--g100);border:1px solid var(--ioc--g20);min-height:auto}.modular .panel-label{color:var(--ioc--g70)}.modular .control-centre{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;gap:1rem;margin:auto 0}.cc-top,.cc-main,.cc-small,.cc-wide{border:1px solid var(--ioc--g20);padding:1.5rem}.cc-top{grid-column:1/-1;display:flex;align-items:center;gap:.75rem}.cc-top strong{margin-left:auto;font-size:1.75rem;font-weight:400}.status-dot{width:.65rem;height:.65rem;background:var(--ioc-success,#198038);border-radius:50%;box-shadow:0 0 0 .3rem var(--ioc-success-surface,#defbe6)}.cc-main{grid-row:2;min-height:17rem;display:flex;flex-direction:column}.cc-main strong{font-size:4rem;font-weight:300;color:var(--ioc--blue)}.bars{display:flex;gap:.4rem;align-items:end;height:7rem;margin-top:auto}.bars i{flex:1;background:var(--ioc--blue)}.cc-small{display:flex;flex-direction:column;justify-content:space-between}.cc-small strong{font-size:3rem;font-weight:300}.cc-wide{grid-column:1/-1}.progress{height:.4rem;background:var(--ioc--g20);margin:1rem 0 .6rem}.progress i{display:block;width:80%;height:100%;background:var(--ioc--blue)}.cc-wide small{color:var(--ioc--g70)}.modular .solution-grid{gap:1rem;border:0;background:var(--ioc--g10);padding:1rem}.modular .solution-card{border:1px solid var(--ioc--g20);background:var(--ioc-surface,#fff)}.modular .solution-card:hover{background:var(--ioc--blue)}.modular .industry-strip{gap:1rem;border:0}.modular .industry{border:1px solid var(--ioc--g20)}.modular .process-grid{gap:1rem}.modular .step{background:var(--ioc-surface,#fff);padding:2rem;border:1px solid var(--ioc--g20)}.modular .step:before{margin-bottom:6rem}.modular .step:after{display:none}.modular .case-grid{gap:1rem;border:0;background:var(--ioc--g10);padding:1rem}.modular .case-visual,.modular .case-copy{border:1px solid var(--ioc--g20);background:var(--ioc-surface,#fff);color:var(--ioc--g100)}.modular .case-visual p{color:var(--ioc--g70)}
    @media(max-width:1024px){.nav{display:none}.nav-actions .btn-secondary{display:none}.menu-toggle{display:flex}.site-header.mobile-open{height:auto}.site-header.mobile-open .nav-wrap{height:auto;min-height:4rem;flex-wrap:wrap}.site-header.mobile-open .nav{display:flex;order:4;width:100%;margin:0;flex-direction:column;border-top:1px solid var(--ioc--g20)}.site-header.mobile-open .nav-item,.site-header.mobile-open .nav-link,.site-header.mobile-open .nav-trigger{width:100%;height:auto;min-height:3.5rem}.site-header.mobile-open .mega{position:static;width:100%;box-shadow:none;border-inline:0;grid-template-columns:1fr 1fr}.hero-grid,.modular .hero-grid{grid-template-columns:1fr;min-height:auto}.hero-copy{min-height:45rem;padding-left:var(--ioc--gutter)}.hero-panel{min-height:36rem}.editorial .hero-copy{grid-template-columns:1fr}.editorial .hero-panel{width:100%}.solution-grid{grid-template-columns:1fr 1fr}.proof-grid{grid-template-columns:1fr 1fr}.proof-item:nth-child(3){border-left:0;border-top:1px solid var(--ioc--g20)}.proof-item:nth-child(4){border-top:1px solid var(--ioc--g20)}.ai-layout{grid-template-columns:1fr}.tabs{border-right:0;display:grid;grid-template-columns:repeat(4,1fr)}.tab{font-size:.8rem;border-right:1px solid var(--ioc-g80,#393939)}.tab-panel.active{grid-template-columns:1fr}.industry-strip{grid-template-columns:1fr 1fr}.process-grid{grid-template-columns:1fr 1fr}.step:before{margin-bottom:2rem}.footer-top{grid-template-columns:1fr 1fr}.editorial .solution-card:nth-child(3n){grid-column:auto}.editorial .solution-grid{grid-template-columns:1fr 1fr}.editorial .editorial-visual{grid-template-columns:.25fr 1.75fr}}
    @media(max-width:700px){:root{--ioc--section:4.5rem}.container{padding-inline:1.25rem}.section-head{grid-template-columns:1fr;gap:1.5rem;margin-bottom:3rem}.site-header{height:4rem}.logo{min-width:auto}.nav-actions .btn{display:none}.hero-copy{min-height:auto;padding:4.5rem 1.25rem 3rem}.hero-copy-bottom{grid-template-columns:1fr}.hero-panel{min-height:31rem;padding:1.25rem}.hero-meta{margin-top:2rem}.hero h1{font-size:clamp(2.8rem,14vw,4.75rem)}.proof-grid{grid-template-columns:1fr 1fr}.proof-item{padding:1.25rem;min-height:9rem}.solution-grid,.editorial .solution-grid{grid-template-columns:1fr}.solution-card,.editorial .solution-card{min-height:22rem}.tabs{display:flex;overflow-x:auto}.tab{min-width:11rem}.tab-panel{padding:2rem 1.25rem}.industry-strip{grid-template-columns:1fr}.industry{min-height:14rem}.process-grid{grid-template-columns:1fr}.step{padding-right:0}.step:not(:last-child):after{display:none}.gateways{grid-template-columns:1fr}.gateway{min-height:28rem}.case-grid{grid-template-columns:1fr}.case-visual{min-height:26rem}.insights{grid-template-columns:1fr}.insight:not(:last-child){border-right:0;margin-right:0}.faq-wrap{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr}.contact-form{grid-template-columns:1fr}.field,.field.full{grid-column:1}.footer-top{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column}.editorial .hero-copy{display:flex;min-height:auto}.editorial .hero h1{font-size:clamp(3.2rem,15vw,5rem)}.editorial .hero-panel{min-height:30rem}.editorial .editorial-visual{grid-template-columns:1fr}.editorial .quote-mark{font-size:8rem}.editorial .manifesto-foot{grid-column:1;flex-wrap:wrap}.modular .hero-grid{padding:1rem}.modular .hero-copy{padding:3rem 1.25rem}.control-centre{gap:.5rem}.cc-top,.cc-main,.cc-small,.cc-wide{padding:1rem}.cc-main strong{font-size:3rem}.cc-small strong{font-size:2rem}.site-header.mobile-open .mega{grid-template-columns:1fr}.mega a{min-height:6rem}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}[data-reveal],[data-stagger]>*{opacity:1;transform:none}}
    .bars .b1{height:28%}.bars .b2{height:42%}.bars .b3{height:55%}.bars .b4{height:72%}.bars .b5{height:88%}

    /* INFOC definitive Carbon showcase */
    .showcase{--ioc--green:#198038}[data-reveal],[data-stagger]>*{opacity:1;transform:none}.js .reveal{opacity:0;transform:translateY(1.5rem)}.js .reveal.visible{opacity:1;transform:none}.js .stagger>*{opacity:0;transform:translateY(1rem)}.js .stagger.visible>*{opacity:1;transform:none}
    .announcement{min-height:2.5rem;background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff);font-size:.75rem}.announcement .container{min-height:2.5rem;display:flex;align-items:center;justify-content:center;gap:1rem;text-align:center}.announcement strong{font-weight:600}.announcement a{display:inline-flex;align-items:center;gap:.35rem;color:var(--ioc-accent-on-inverse,#78a9ff)}.announcement .icon{width:.9rem;height:.9rem}
    
    .showcase .site-header{top:0}.showcase .logo{letter-spacing:-.07em}.showcase .logo-sub{margin-left:.65rem;padding-left:.65rem;border-left:1px solid var(--ioc--g20);color:var(--ioc--g70);font-family:"JetBrains Mono",monospace;font-size:.62rem;font-weight:400;letter-spacing:.08em;text-transform:uppercase}
    .showcase-hero{position:relative;min-height:calc(100svh - 6.5rem);border-bottom:1px solid var(--ioc--g20);overflow:hidden}.showcase-hero .container{min-height:inherit;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(28rem,.8fr);gap:clamp(3rem,7vw,8rem);align-items:center;padding-block:clamp(5rem,9vw,9rem)}.showcase-hero h1{font-size:clamp(3.75rem,7.5vw,8rem);max-width:72rem;margin-bottom:2rem}.showcase-hero h1 em{font-style:normal;color:var(--ioc--blue)}.showcase-hero .lede{max-width:45rem}.showcase-hero .hero-actions{margin:2.25rem 0}.hero-trust{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;margin:0;padding:1.25rem 0 0;border-top:1px solid var(--ioc--g20);list-style:none;color:var(--ioc--g70);font-size:.78rem}.hero-trust li{display:flex;align-items:center;gap:.45rem}.hero-trust .icon{width:1rem;color:var(--ioc--green)}
    .decision-console{position:relative;border:1px solid var(--ioc--g20);background:var(--ioc-surface,#fff);box-shadow:1.5rem 1.5rem 0 var(--ioc--g10);min-height:36rem}.console-bar{height:3rem;display:flex;align-items:center;justify-content:space-between;padding:0 1rem;border-bottom:1px solid var(--ioc--g20);font-family:"JetBrains Mono",monospace;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}.console-status{display:flex;align-items:center;gap:.5rem;color:var(--ioc--green)}.console-status:before{content:"";width:.5rem;height:.5rem;background:var(--ioc-success,#198038);border-radius:50%}.console-body{padding:1.5rem}.console-question{margin:0 0 1rem;color:var(--ioc--g70);font-size:.8rem}.console-route{width:100%;border:1px solid var(--ioc--g20);border-bottom:0;background:var(--ioc-surface,#fff);padding:1rem;display:grid;grid-template-columns:2.5rem 1fr auto;gap:1rem;align-items:center;text-align:left;cursor:pointer}.console-route:last-of-type{border-bottom:1px solid var(--ioc--g20)}.console-route:hover,.console-route[aria-pressed="true"]{position:relative;z-index:1;border-color:var(--ioc--blue);background:var(--ioc-selected-surface,#edf5ff)}.console-route[aria-pressed="true"]:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--ioc--blue)}.console-route>.carbon-icon:first-child{width:1rem;height:1rem;color:var(--ioc--blue)}.console-route strong{display:block;font-weight:500}.console-route small{color:var(--ioc--g70)}.console-route .icon{width:1.1rem}.console-result{margin-top:1.5rem;padding:1.25rem;background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.console-result-label{display:block;color:var(--ioc-g40,#a8a8a8);font-family:"JetBrains Mono",monospace;font-size:.67rem;text-transform:uppercase;letter-spacing:.08em}.console-result strong{display:block;margin:.65rem 0;font-size:1.2rem;font-weight:500}.console-result p{color:var(--ioc-g30,#c6c6c6);font-size:.8rem;margin-bottom:0}
    .logo-proof{border-bottom:1px solid var(--ioc--g20)}.logo-proof .container{display:grid;grid-template-columns:1fr repeat(4,auto);gap:2rem;align-items:center;min-height:5.5rem}.logo-proof p{margin:0;color:var(--ioc--g70);font-size:.75rem}.proof-mark{display:flex;align-items:center;gap:.55rem;padding-left:2rem;border-left:1px solid var(--ioc--g20);white-space:nowrap;font-size:.75rem;font-weight:600}.proof-mark .icon{width:1rem;color:var(--ioc--blue)}
    .persona-section{background:var(--ioc--g10)}.content-switcher{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--ioc--g20);margin-bottom:1rem}.persona-tab{min-height:4rem;padding:1rem;border:0;border-right:1px solid var(--ioc--g20);background:var(--ioc-surface,#fff);text-align:left;cursor:pointer}.persona-tab:last-child{border-right:0}.persona-tab:hover{background:var(--ioc-surface-hover,#e8e8e8)}.persona-tab[aria-selected="true"]{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.persona-panel{display:none;background:var(--ioc-surface,#fff);border:1px solid var(--ioc--g20);min-height:28rem}.persona-panel.active{display:grid;grid-template-columns:1.25fr .75fr;animation:panelIn .3s var(--ioc--ease)}.persona-copy{padding:clamp(2rem,5vw,5rem)}.persona-copy h3{font-size:clamp(2.25rem,4.2vw,4.5rem);max-width:48rem}.persona-copy p{max-width:42rem;color:var(--ioc--g70);font-size:1.05rem}.persona-outcomes{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);padding:clamp(2rem,4vw,4rem);display:flex;flex-direction:column}.persona-outcomes>span{font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}.persona-outcomes ul{list-style:none;padding:0;margin:auto 0 0}.persona-outcomes li{display:flex;gap:.75rem;padding:1rem 0;border-top:1px solid rgba(255,255,255,.3)}.persona-outcomes .icon{width:1.1rem}
    .journey-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--ioc--g20);border-left:1px solid var(--ioc--g20)}.journey{border-right:1px solid var(--ioc--g20);border-bottom:1px solid var(--ioc--g20);background:var(--ioc-surface,#fff)}.journey summary{list-style:none;min-height:17rem;padding:2rem;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer}.journey summary::-webkit-details-marker{display:none}.journey summary:hover{background:var(--ioc--g10)}.journey[open] summary{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.journey-top{display:flex;justify-content:space-between}.journey-top span{display:inline-flex;align-items:center;gap:.5rem;font-family:"JetBrains Mono",monospace;color:var(--ioc--blue);font-size:.72rem}.journey-top span>.carbon-icon{width:1rem;height:1rem}.journey[open] .journey-top span{display:inline-flex;align-items:center;gap:.5rem;color:var(--ioc-accent-on-inverse,#78a9ff)}.journey-top span>.carbon-icon{width:1rem;height:1rem}.journey summary h3{max-width:28rem;margin:2rem 0 0}.journey-toggle{box-sizing:border-box;width:2rem;height:2rem;padding:.375rem;border:1px solid currentColor;transition:transform .2s}.journey[open] .journey-toggle{transform:rotate(45deg)}.journey-detail{padding:2rem;border-top:1px solid var(--ioc--g20);display:grid;grid-template-columns:1fr 1fr;gap:2rem}.journey-detail p{color:var(--ioc--g70)}.journey-detail ul{margin:0;padding:0;list-style:none}.journey-detail li{padding:.65rem 0;border-top:1px solid var(--ioc--g20);display:flex;gap:.6rem;font-size:.85rem}.journey-detail .icon{width:1rem;color:var(--ioc--green)}
    .architecture{background:var(--ioc-surface,#fff)}.architecture-shell{border:1px solid var(--ioc--g20);display:grid;grid-template-columns:17rem 1fr}.process-nav{background:var(--ioc--g10);border-right:1px solid var(--ioc--g20);padding:1rem}.process-button{width:100%;min-height:3.5rem;border:0;border-bottom:1px solid var(--ioc--g20);background:transparent;padding:.75rem;text-align:left;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.process-button:hover{background:var(--ioc-surface-hover,#e8e8e8)}.process-button[aria-selected="true"]{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff)}.architecture-view{min-width:0;padding:clamp(1.5rem,4vw,4rem)}.architecture-title{display:flex;align-items:start;justify-content:space-between;gap:2rem;margin-bottom:3rem}.architecture-title h3{font-size:clamp(2rem,4vw,4rem);margin-bottom:.75rem}.architecture-title p{max-width:42rem;color:var(--ioc--g70)}.info-button{position:relative;border:0;background:transparent;color:var(--ioc--blue);padding:.5rem;cursor:help}.info-button .icon{width:1.3rem}.info-button:focus:after,.info-button:hover:after{content:attr(data-tooltip);position:absolute;right:0;top:100%;z-index:5;width:16rem;background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff);padding:.75rem;text-align:left;font-size:.72rem;font-weight:400}.layer-map{display:grid;grid-template-columns:repeat(5,1fr);align-items:stretch}.layer{position:relative;min-height:15rem;padding:1.25rem;border:1px solid var(--ioc--g20);border-right:0;display:flex;flex-direction:column;justify-content:space-between}.layer:last-child{border-right:1px solid var(--ioc--g20)}.layer:after{content:"";position:absolute;left:100%;top:50%;z-index:2;width:1rem;height:1px;background:var(--ioc--g100)}.layer:last-child:after{display:none}.layer>.carbon-icon{width:1.25rem;height:1.25rem;color:var(--ioc--g70)}.layer strong{font-size:1rem;font-weight:500}.layer span{color:var(--ioc--g70);font-size:.75rem}.layer.active{background:var(--ioc--blue);border-color:var(--ioc--blue);color:var(--ioc-text-on-color,#fff)}.layer.active>.carbon-icon,.layer.active span{color:var(--ioc-text-on-brand-deep,#d0e2ff)}.architecture-table-wrap{margin-top:2rem;overflow-x:auto}.architecture-table{width:100%;border-collapse:collapse;font-size:.82rem}.architecture-table th,.architecture-table td{padding:1rem;text-align:left;border-bottom:1px solid var(--ioc--g20)}.architecture-table th{background:var(--ioc--g10);font-weight:600}.architecture-table td:first-child{font-weight:600}.architecture-table .tag{white-space:nowrap}
    .value-section{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.value-section .section-head p{color:var(--ioc-g30,#c6c6c6)}.value-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ioc-g80,#393939);border:1px solid var(--ioc-g80,#393939)}.value-card{min-height:22rem;background:var(--ioc--g100);padding:2rem;display:flex;flex-direction:column}.value-card:hover{background:var(--ioc-g90,#262626)}.value-card>.carbon-icon{width:1.25rem;height:1.25rem;color:var(--ioc-accent-on-inverse,#78a9ff)}.value-card strong{display:block;margin:auto 0 1rem;font-size:clamp(2rem,4vw,4rem);font-weight:300;letter-spacing:-.05em}.value-card p{color:var(--ioc-g30,#c6c6c6);max-width:28rem}.value-card footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 0 0;border-top:1px solid var(--ioc-g70,#525252);background:transparent;font-size:.75rem}.value-card .icon{width:1rem}
    .assessment-section{background:var(--ioc--g10)}.assessment-shell{display:grid;grid-template-columns:.72fr 1.28fr;border:1px solid var(--ioc--g20);background:var(--ioc-surface,#fff);min-height:38rem}.assessment-aside{padding:clamp(2rem,4vw,4rem);background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);display:flex;flex-direction:column}.assessment-aside h3{font-size:clamp(2rem,4vw,4rem)}.assessment-aside p{color:var(--ioc-text-on-brand-soft,#e5e5ff)}.progress-steps{list-style:none;margin:auto 0 0;padding:0}.progress-steps li{display:grid;grid-template-columns:1.5rem 1fr;gap:.75rem;padding:.8rem 0;color:var(--ioc-text-on-brand-muted,#d0d0ff)}.progress-steps li:before{content:"";width:.75rem;height:.75rem;margin-top:.35rem;border:1px solid currentColor;border-radius:50%}.progress-steps li.current{color:var(--ioc-text-on-color,#fff);font-weight:600}.progress-steps li.current:before{background:var(--ioc-text-on-color,#fff);box-shadow:inset 0 0 0 3px var(--ioc--blue)}.progress-steps li.done:before{background:var(--ioc-success,#198038);border-color:var(--ioc-success,#198038)}.assessment-main{padding:clamp(2rem,5vw,5rem);display:flex;flex-direction:column}.assessment-step{display:none;border:0;padding:0;margin:0}.assessment-step.active{display:block;animation:panelIn .25s var(--ioc--ease)}.assessment-step legend{font-size:clamp(1.65rem,3vw,2.75rem);line-height:1.15;letter-spacing:-.03em;margin-bottom:2rem}.choice{position:relative;display:flex;gap:1rem;padding:1rem;border:1px solid var(--ioc--g20);border-bottom:0;cursor:pointer}.choice:last-child{border-bottom:1px solid var(--ioc--g20)}.choice:hover{background:var(--ioc--g10)}.choice input{position:absolute;opacity:0}.radio-ui{width:1.25rem;height:1.25rem;border:1px solid var(--ioc--g100);border-radius:50%;flex:0 0 auto}.choice input:checked+.radio-ui{background:var(--ioc--blue);box-shadow:inset 0 0 0 4px var(--ioc-border-on-color,#fff);border-color:var(--ioc--blue)}.choice:has(input:focus-visible){outline:3px solid var(--ioc--focus);outline-offset:2px}.choice-text strong,.choice-text small{display:block}.choice-text strong{font-weight:500}.choice-text small{color:var(--ioc--g70);margin-top:.2rem}.assessment-actions{margin-top:auto;padding-top:2rem;display:flex;justify-content:space-between;gap:1rem}.assessment-actions .btn[disabled]{background:var(--ioc-g30,#c6c6c6);color:var(--ioc-g60,#666666);cursor:not-allowed}.assessment-result{display:none}.assessment-result.active{display:block}.score-ring{width:10rem;height:10rem;border:1.5rem solid var(--ioc--g10);border-top-color:var(--ioc--blue);border-right-color:var(--ioc--blue);border-radius:50%;display:grid;place-items:center;margin-bottom:2rem}.score-ring strong{font-size:2.4rem;font-weight:300}.result-notification{border-left:4px solid var(--ioc--blue);background:var(--ioc-selected-surface,#edf5ff);padding:1rem;margin:1.5rem 0}.result-notification strong{display:block}.result-notification p{margin:.35rem 0 0;color:var(--ioc--g70)}
    .resource-toolbar{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2rem}.search-field{position:relative;width:min(100%,28rem)}.search-field label{display:block;margin-bottom:.4rem;font-size:.75rem}.search-field input{width:100%;height:3.5rem;padding:0 3rem 0 1rem;border:0;border-bottom:1px solid var(--ioc--g100);background:var(--ioc--g10)}.search-field .icon{position:absolute;right:1rem;bottom:1rem;width:1.25rem;pointer-events:none}.filter-status{color:var(--ioc--g70);font-size:.78rem}.insight[hidden]{display:none}.empty-state{display:none;padding:3rem;background:var(--ioc--g10);text-align:center}.empty-state.visible{display:block}
    .trust-centre{background:var(--ioc-surface,#fff)}.trust-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);border:1px solid var(--ioc--g20)}.trust-intro,.trust-item{min-height:18rem;padding:2rem;border-right:1px solid var(--ioc--g20)}.trust-item:last-child{border-right:0}.trust-intro{background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff)}.trust-intro h3{font-size:2rem}.trust-intro p{color:var(--ioc-g30,#c6c6c6)}.trust-item{display:flex;flex-direction:column}.trust-item .icon{color:var(--ioc--blue);width:2rem;height:2rem}.trust-item strong{margin:auto 0 .75rem;font-size:1.2rem;font-weight:500}.trust-item p{color:var(--ioc--g70);font-size:.82rem;margin:0}
    .sticky-conversion{position:fixed;z-index:90;left:50%;bottom:1rem;transform:translate(-50%,calc(100% + 2rem));width:min(calc(100% - 2rem),58rem);background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff);border:1px solid var(--ioc-g70,#525252);box-shadow:0 1rem 3rem rgba(0,0,0,.25);display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:.75rem .75rem .75rem 1.25rem;transition:transform .35s var(--ioc--ease)}.sticky-conversion.visible{transform:translate(-50%,0)}.sticky-conversion p{margin:0;font-size:.82rem}.sticky-conversion .btn{min-height:2.75rem;padding:.65rem .9rem;gap:1rem}.sticky-close{border:0;background:transparent;color:var(--ioc-text-on-color,#fff);padding:.5rem;cursor:pointer}.sticky-close .icon{width:1rem}
    .carbon-dialog{width:min(calc(100% - 2rem),52rem);max-height:90vh;padding:0;border:0;background:var(--ioc-surface,#fff);color:var(--ioc--g100);box-shadow:0 2rem 6rem rgba(0,0,0,.35)}.carbon-dialog::backdrop{background:rgba(0,0,0,.65)}.dialog-head{display:flex;align-items:start;justify-content:space-between;padding:1.5rem;border-bottom:1px solid var(--ioc--g20)}.dialog-head h2{font-size:2rem;margin:0}.dialog-close{width:3rem;height:3rem;border:0;background:transparent;display:grid;place-items:center;cursor:pointer}.dialog-body{padding:clamp(1.5rem,4vw,3rem)}.dialog-body>p{color:var(--ioc--g70)}.dialog-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.dialog-grid .field.full{grid-column:1/-1}.dialog-grid .field input,.dialog-grid .field select,.dialog-grid .field textarea{background:var(--ioc--g10);color:var(--ioc--g100);border-bottom:1px solid var(--ioc--g100)}.dialog-grid .field input::placeholder,.dialog-grid .field textarea::placeholder{color:var(--ioc--g70)}.checkbox{display:flex;gap:.75rem;align-items:start;font-size:.75rem;color:var(--ioc--g70)}.checkbox input{margin-top:.2rem;width:1rem;height:1rem}.dialog-actions{display:flex;justify-content:flex-end;gap:.75rem;margin-top:2rem}
    .showcase .contact{position:relative;overflow:hidden}.showcase .contact:after{content:"INFOC";position:absolute;right:-1rem;bottom:-3rem;color:rgba(255,255,255,.09);font-size:20vw;font-weight:700;letter-spacing:-.1em;line-height:.7;pointer-events:none}.showcase .contact-grid{position:relative;z-index:1}
    @media(max-width:1100px){.showcase-hero .container{grid-template-columns:1fr}.decision-console{max-width:46rem}.logo-proof .container{grid-template-columns:1fr 1fr}.logo-proof p{grid-column:1/-1;padding-top:1.25rem}.proof-mark{padding:0 0 1.25rem;border-left:0}.architecture-shell{grid-template-columns:1fr}.process-nav{display:flex;overflow-x:auto;border-right:0;border-bottom:1px solid var(--ioc--g20)}.process-button{min-width:10rem}.layer-map{grid-template-columns:repeat(3,1fr)}.layer:nth-child(3){border-right:1px solid var(--ioc--g20)}.layer:nth-child(n+4){border-top:0}.assessment-shell{grid-template-columns:1fr}.progress-steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:2rem}.trust-grid{grid-template-columns:1fr 1fr}.trust-intro,.trust-item{border-bottom:1px solid var(--ioc--g20)}}
    @media(max-width:700px){.announcement .container{padding-block:.55rem}.announcement strong{display:none}.showcase .logo-sub{display:none}.showcase-hero .container{padding-block:4rem;gap:3rem}.showcase-hero h1{font-size:clamp(3rem,14vw,5rem)}.decision-console{min-height:auto;box-shadow:.75rem .75rem 0 var(--ioc--g10)}.console-route{grid-template-columns:2rem 1fr}.console-route .icon{display:none}.logo-proof .container{grid-template-columns:1fr 1fr;gap:0}.logo-proof p{padding:1.25rem 0}.proof-mark{min-height:4rem;padding:0;border-top:1px solid var(--ioc--g20);font-size:.68rem}.content-switcher{grid-template-columns:1fr 1fr}.persona-tab:nth-child(2){border-right:0}.persona-tab:nth-child(-n+2){border-bottom:1px solid var(--ioc--g20)}.persona-panel.active{grid-template-columns:1fr}.persona-outcomes{min-height:19rem}.journey-grid{grid-template-columns:1fr}.journey summary{min-height:14rem}.journey-detail{grid-template-columns:1fr}.architecture-title{flex-direction:column}.layer-map{grid-template-columns:1fr}.layer,.layer:nth-child(3){min-height:9rem;border-right:1px solid var(--ioc--g20);border-top:0}.layer:first-child{border-top:1px solid var(--ioc--g20)}.layer:after{display:none}.value-grid{grid-template-columns:1fr}.value-card{min-height:18rem}.progress-steps{grid-template-columns:1fr 1fr}.assessment-main{min-height:34rem}.resource-toolbar{align-items:stretch;flex-direction:column}.trust-grid{grid-template-columns:1fr}.trust-intro,.trust-item{min-height:14rem;border-right:0}.sticky-conversion p{display:none}.sticky-conversion{width:auto;right:1rem;left:1rem;transform:translateY(calc(100% + 2rem))}.sticky-conversion.visible{transform:none}.dialog-grid{grid-template-columns:1fr}.dialog-grid .field.full{grid-column:1}.dialog-actions{flex-direction:column-reverse}.dialog-actions .btn{width:100%}}

    /* INFOC corporate typography system: IBM Plex hierarchy */
    :root{--ioc--font-sans:"Manrope","Helvetica Neue",Arial,sans-serif;--ioc--font-mono:"JetBrains Mono","SFMono-Regular",Consolas,monospace;--ioc--measure:68ch}
    .showcase{font-family:var(--ioc--font-sans);font-weight:400;line-height:1.6;text-rendering:optimizeLegibility;font-kerning:normal;font-synthesis:none;font-feature-settings:"kern" 1,"liga" 1,"calt" 1}
    .showcase :is(h1,h2,h3,h4,h5){margin-top:0;font-family:var(--ioc--font-sans);text-wrap:balance}
    /* P36 — `div.showcase` scores 0-1-2, the specificity these rules had in the
       source, where the scope class sat on the BODY element. (The selector is
       not spelled out here: the W11 spec asserts the absorbed sheet no longer
       contains that string, and a comment counts.) The absorption flattened
       them to a bare
       `.showcase h*` (0-1-1), which lost to the `body.ioc-site` generic above and
       tied with every block rule; the comment two blocks up still reads
       "`.showcase` is rewritten to `.showcase`", the fingerprint of the
       find/replace that ate its own subject. `div` is not decoration: the scope
       class rides a wrapper DIV here rather than <body>, and restoring the
       element part is what restores the source's cascade. Verified against the
       served source: all 41 headings match. */
    div.showcase h1{font-size:clamp(3.6rem,7vw,7.5rem);font-weight:var(--ioc-h1-weight,700);line-height:.96;letter-spacing:-.055em}
    div.showcase h2{font-size:clamp(2.35rem,4.7vw,5rem);font-weight:var(--ioc-h2-weight,700);line-height:1.03;letter-spacing:-.045em}
    div.showcase h3{font-size:clamp(1.4rem,2.2vw,2.2rem);font-weight:var(--ioc-h3-weight,600);line-height:1.14;letter-spacing:-.025em}
    div.showcase h4{font-size:clamp(1.1rem,1.5vw,1.35rem);font-weight:var(--ioc-h4-weight,600);line-height:1.25;letter-spacing:-.015em}
    div.showcase h5{font-size:.875rem;font-weight:600;line-height:1.35;letter-spacing:.045em;text-transform:uppercase}
    .showcase p{line-height:1.65;text-wrap:pretty}
    .showcase .lede{max-width:60ch;font-size:clamp(1.125rem,1.55vw,1.375rem);font-weight:400;line-height:1.58;letter-spacing:-.008em}
    .showcase .section-head>p{max-width:52ch;font-size:1.0625rem;line-height:1.65}
    .showcase :is(.eyebrow,.section-kicker,.panel-label,.num,.value-index,.gateway-index,.insight-meta,.layer small,.architecture-table th){font-family:var(--ioc--font-mono)}
    .showcase :is(strong,b){font-weight:600}
    .showcase .showcase-hero h1{max-width:13ch}
    .showcase .showcase-hero h1 em{font-weight:700}
    .showcase .solution-card h3{font-size:clamp(1.5rem,2.1vw,2rem);font-weight:600;line-height:1.18}
    .showcase .insight h3,.showcase .step h3{font-size:1.45rem;font-weight:600;line-height:1.18}
    .showcase .gateway h3{font-size:clamp(2.5rem,5vw,5rem);font-weight:600}
    .showcase .persona-copy h3{font-size:clamp(2.25rem,4.2vw,4.5rem);font-weight:600}
    .showcase .tab-panel h3,.showcase .architecture-title h3{font-size:clamp(2rem,4vw,4rem);font-weight:600}
    .showcase .assessment-aside h3{font-size:clamp(2rem,4vw,4rem);font-weight:600}
    .showcase .layer h4{margin:1rem 0 .45rem;font-size:1rem;line-height:1.25}
    .showcase .industry h3{margin:.55rem 0 .75rem;font-size:1.25rem;line-height:1.2}
    .showcase .trust-intro h2{font-size:2rem;line-height:1.1;letter-spacing:-.03em}
    .showcase .trust-item h3{margin:auto 0 .75rem;font-size:1.2rem;line-height:1.2}
    .showcase .footer-col h3{margin-bottom:1rem;color:var(--ioc-g40,#a8a8a8);font-size:.75rem;line-height:1.35;letter-spacing:.1em;text-transform:uppercase}
    .showcase .footer-col h5{margin-bottom:1rem;color:var(--ioc-g40,#a8a8a8)}
    .showcase .dialog-head h2{font-size:2rem;line-height:1.1}
    /* P36 — must track the `div.showcase` restoration above: left at 0-1-1 these
   responsive sizes would LOSE to the 0-1-2 base rules and mobile headings would
   silently keep their desktop clamp. */
@media(max-width:700px){div.showcase h1{font-size:clamp(3rem,14vw,5rem)}div.showcase h2{font-size:clamp(2.2rem,10vw,3.6rem)}div.showcase .showcase-hero h1{max-width:11ch}}

    /* Review refinement layer: homepage only */
    .review-index{--ioc--max:1360px;--ioc--gutter:clamp(1.25rem,3.4vw,3.5rem);--ioc--section:clamp(4.75rem,7.2vw,7.5rem);--ioc--g30:var(--ioc-g30);--ioc--nav-offset:7rem}
    .review-index section[id]{scroll-margin-top:var(--ioc--nav-offset)}
    .review-index .announcement{background:var(--ioc-surface-brand-deep,#001141)}
    .review-index .announcement a{font-weight:600}
    .review-index .site-header{box-shadow:0 1px 0 rgba(0,0,0,.04)}
    .review-index .nav-actions .btn{min-width:10.5rem;background:var(--ioc--blue)}
    .review-index .nav-actions .btn:hover{background:var(--ioc-blue-hover,#0000c4)}
    .review-index .showcase-hero{min-height:auto;background:linear-gradient(180deg,var(--ioc-surface,#fff) 0%,var(--ioc-surface,#fff) 78%,var(--ioc-surface-subtle,#fbfbfb) 100%)}
    .review-index .showcase-hero .container{grid-template-columns:minmax(0,1.08fr) minmax(26rem,.92fr);gap:clamp(3rem,6vw,6.5rem);padding-block:clamp(5.25rem,8vw,7.75rem)}
    .review-index .showcase-hero h1{max-width:11ch;font-size:clamp(3.8rem,7vw,7.25rem)}
    .review-index .showcase-hero .lede{max-width:58ch}
    .review-index .hero-note{max-width:42rem;margin:0 0 .75rem;color:var(--ioc--g100);font-size:.86rem;font-weight:600}
    .review-index .decision-console{min-height:32rem;box-shadow:1rem 1rem 0 var(--ioc--g10)}
    .review-index .console-body{padding:1.25rem}
    .review-index .console-route{padding:.9rem 1rem;transition:background .18s,border-color .18s,transform .18s var(--ioc--ease)}
    .review-index .console-route:hover{transform:translateX(.2rem)}
    .review-index .console-result{margin-top:1.25rem}
    .review-index .logo-proof .container{min-height:4.75rem}
    .review-index .page-nav{position:sticky;top:4rem;z-index:85;background:rgba(255,255,255,.96);border-bottom:1px solid var(--ioc--g20);backdrop-filter:blur(14px)}
    .review-index .page-nav-inner{display:flex;overflow-x:auto;scrollbar-width:none}
    .review-index .page-nav-inner::-webkit-scrollbar{display:none}
    .review-index .page-nav a{position:relative;display:flex;align-items:center;min-height:3.25rem;padding:0 1rem;white-space:nowrap;color:var(--ioc--g70);font-size:.78rem;font-weight:600}
    .review-index .page-nav a:hover{background:var(--ioc--g10);color:var(--ioc--g100)}
    .review-index .page-nav a.active{color:var(--ioc--blue)}
    .review-index .page-nav a.active:after{content:"";position:absolute;left:1rem;right:1rem;bottom:0;height:3px;background:var(--ioc--blue)}
    .review-index .proof-item{min-height:8.75rem;padding:1.5rem 2rem}
    .review-index .proof-item strong{font-size:clamp(2rem,3.4vw,3.25rem)}
    .review-index .section-head{gap:clamp(2rem,5vw,5.5rem);margin-bottom:clamp(2.75rem,5vw,4.75rem)}
    .review-index .persona-panel{min-height:24rem}
    .review-index .persona-copy{padding:clamp(2rem,4vw,4rem)}
    .review-index .persona-outcomes{padding:clamp(2rem,3.5vw,3.5rem)}
    .review-index .journey summary{min-height:13.5rem;padding:1.75rem}
    .review-index .journey-detail{padding:1.75rem}
    .review-index .solution-card{min-height:21.5rem;padding:1.75rem;transition:background .22s,color .22s,transform .22s var(--ioc--ease),box-shadow .22s}
    .review-index .solution-card .icon{width:3rem;height:3rem;margin:2.75rem 0 2rem}
    .review-index .solution-card:hover{background:var(--ioc-surface-brand,#001d6c);transform:translateY(-3px);box-shadow:0 1rem 2.5rem rgba(0,29,108,.14)}
    .review-index .architecture-view{padding:clamp(1.5rem,3.5vw,3.5rem)}
    .review-index .architecture-title{margin-bottom:2.25rem}
    .review-index .layer{min-height:12.5rem}
    .review-index .tab-panel{min-height:25rem;padding:clamp(2rem,4vw,4rem)}
    .review-index .industry{min-height:15.5rem}
    .review-index .step{padding-bottom:2.5rem}
    .review-index .step:before{margin-bottom:2.75rem}
    .review-index .gateway{min-height:28rem;padding:clamp(2rem,4vw,4rem)}
    .review-index .gateway h3{font-size:clamp(2.2rem,4.25vw,4rem)}
    .review-index .gateway:hover{background:var(--ioc-surface-brand,#001d6c)}
    .review-index .gateway.talent:hover{background:var(--ioc-magenta,#9f1853)}
    .review-index .value-card{min-height:18rem}
    .review-index .case-grid{min-height:30rem}
    .review-index .case-visual,.review-index .case-copy{padding:clamp(2rem,4vw,4rem)}
    .review-index .insight{min-height:21rem}
    .review-index .assessment-shell{min-height:34rem}
    .review-index .assessment-main{padding:clamp(2rem,4vw,4rem)}
    .review-index .result-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}
    .review-index .result-actions .btn{margin:0}
    .review-index .trust-intro,.review-index .trust-item{min-height:15.5rem}
    .review-index .proof-trust{margin-top:clamp(2.25rem,4vw,3.5rem)}
    .review-index .proof-trust .trust-grid{grid-template-columns:repeat(4,1fr)}
    .review-index .proof-marks{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--ioc--g20);border-top:0;background:var(--ioc-surface,#fff)}
    .review-index .proof-marks .proof-mark{display:flex;align-items:center;gap:.55rem;margin:0;padding:1.1rem 1.25rem;border-right:1px solid var(--ioc--g20);font-size:.85rem;font-weight:600;color:var(--ioc--g100)}
    .review-index .proof-marks .proof-mark:last-child{border-right:0}
    .review-index .proof-marks .carbon-icon{color:var(--ioc--blue)}
    .review-index .industry{display:flex;flex-direction:column;gap:.75rem;color:inherit;text-decoration:none;transition:background .2s,transform .2s}
    .review-index .industry:hover{background:var(--ioc--g10)}
    .review-index .industry .industry-cta{margin-top:auto;padding-top:1.1rem;display:inline-flex;align-items:center;gap:.4rem;color:var(--ioc--blue);font-weight:600;font-size:.85rem}
    .review-index .industry .industry-cta .carbon-icon{transition:transform .18s var(--ioc--ease)}
    .review-index .industry:hover .industry-cta .carbon-icon{transform:translateX(.2rem)}
    .review-index .ca-tabs{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ioc--g20);margin-bottom:1.25rem;max-width:46rem}
    .review-index .ca-tab{min-height:3.6rem;padding:0 1.35rem;background:var(--ioc-surface,#fff);border:0;border-right:1px solid var(--ioc--g20);font:inherit;font-weight:600;color:var(--ioc--g70);cursor:pointer;text-align:left;transition:background .2s,color .2s}
    .review-index .ca-tab:last-child{border-right:0}
    .review-index .ca-tab[aria-selected="true"]{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff)}
    .review-index .ca-panel{display:none}
    .review-index .ca-panel.active{display:block;animation:panelIn .25s var(--ioc--ease)}
    .review-index #assessment{padding-bottom:clamp(2.5rem,4vw,3.5rem)}
    .review-index #proof{padding-block:var(--ioc--section)}
    .review-index .v1hero .wrap{max-width:none;width:100%;padding-inline:clamp(1.25rem,3.4vw,3.5rem)}
    .review-index .sec-num{position:absolute;top:.85rem;left:clamp(1.25rem,3.4vw,3.5rem);z-index:6;font-family:var(--ioc--font-mono,ui-monospace,monospace);font-size:.72rem;font-weight:600;letter-spacing:.14em;color:inherit;opacity:.32;pointer-events:none}
    .ioc-footer .footer-cta-grid.gs-full{padding-block:clamp(2.75rem,4vw,4.25rem)}
    .review-index .architecture-shell{box-shadow:0 1px 0 var(--ioc--g20)}
    .review-index .architecture-view .layer{transition:background .2s var(--ioc--ease),transform .2s var(--ioc--ease)}
    .review-index .architecture-view .layer:not(.active):hover{background:var(--ioc--g10);transform:translateY(-2px)}
    .review-index .architecture-table tbody tr{transition:background .18s}
    .review-index .architecture-table tbody tr:hover{background:var(--ioc--g10)}
    .review-index .process-button{transition:background .18s,color .18s}
    .ioc-footer .footer-cta-grid.gs-full{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(2rem,4vw,4rem);align-items:start;max-width:none}
    .ioc-footer .footer-cta-grid.gs-full .footer-action{border-left:1px solid var(--ioc-selected-border,#c6d9ff);padding-left:clamp(1.5rem,3vw,3rem)}
    .ioc-footer #get-started .assessment-shell,.ioc-footer #get-started .contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
    .ioc-footer #get-started .contact h2{font-size:clamp(1.75rem,2.8vw,2.75rem)}
    .ioc-footer #get-started .ca-tabs{margin:0 0 1.25rem;max-width:36rem}
    .review-index .assessment-aside p{color:var(--ioc-text-on-brand-soft,#e5e5ff)}
    .review-index #get-started .contact,.review-index #get-started .contact p,.review-index #get-started .contact label,.review-index #get-started .contact .hero-meta span{color:var(--ioc-text-on-color,#fff)}
    .review-index .contact{background:var(--ioc-surface-brand,#001d6c)}
    .review-index .contact-form .btn{color:var(--ioc-surface-brand,#001d6c)}
    .review-index .contact-form .btn:hover{color:var(--ioc-text-on-color,#fff)}
    .review-index .sticky-conversion{bottom:max(1rem,env(safe-area-inset-bottom));padding:.65rem .65rem .65rem 1rem}
    .review-index .reveal{transform:translateY(.85rem);transition-duration:.55s}
    .review-index .stagger>*{transform:translateY(.6rem);transition-duration:.48s}
    .review-index .toast{position:fixed;right:1rem;bottom:1rem;z-index:300;max-width:24rem;padding:1rem 1.25rem;background:var(--ioc--g100);color:var(--ioc-text-on-color,#fff);border-left:4px solid var(--ioc-success,#198038);box-shadow:0 1rem 3rem rgba(0,0,0,.2)}
    .review-index .toast.visible{display:block}
    @media(hover:hover){.review-index .btn:hover .icon{transform:translateX(.2rem)}.review-index .btn .icon{transition:transform .18s var(--ioc--ease)}}
    @media(max-width:1180px){.review-index .nav-link[href="#insights"]{display:none}.review-index .showcase-hero .container{grid-template-columns:1fr}.review-index .decision-console{max-width:48rem}}
    @media(max-width:700px){.review-index{--ioc--section:4.1rem;--ioc--nav-offset:7rem}.review-index .showcase-hero .container{padding-block:3.75rem}.review-index .showcase-hero h1{font-size:clamp(3rem,14vw,4.75rem)}.review-index .hero-actions .btn{width:100%}.review-index .hero-note{margin-top:.25rem}.review-index .page-nav{top:4rem}.review-index .page-nav a{min-height:3rem;padding:0 .8rem}.review-index .proof-item{padding:1.1rem;min-height:8rem}.review-index .solution-card{min-height:19rem}.review-index .solution-card .icon{margin:2.25rem 0 1.5rem}.review-index .gateway{min-height:23rem}.review-index .sticky-conversion{gap:.5rem}.review-index .result-actions{flex-direction:column}.review-index .result-actions .btn{width:100%}}


    /* Real photography system: selected commercial-use Pexels photography, not AI-generated */
    .review-index .media-frame{position:relative;margin:0;overflow:hidden;background:var(--ioc-g20,#e0e0e0);border:1px solid var(--ioc--g20)}
    .review-index .media-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.02);transition:transform .8s var(--ioc--ease),filter .35s ease}
    .review-index .media-frame:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 45%,rgba(15,15,16,.72) 100%)}
    .review-index .media-frame figcaption{position:absolute;z-index:2;left:1.25rem;right:1.25rem;bottom:1rem;display:flex;align-items:end;justify-content:space-between;gap:1rem;color:var(--ioc-text-on-color,#fff)}
    .review-index .media-frame figcaption span{display:block;max-width:34rem;font-size:.82rem;font-weight:600;line-height:1.4}
    .review-index .media-frame figcaption small{color:var(--ioc-g30,#c6c6c6);font-family:var(--ioc--font-mono);font-size:.62rem;letter-spacing:.04em;text-align:right}
    @media(hover:hover){.review-index .media-frame:hover img{transform:scale(1.018);filter:saturate(1) contrast(1.03)}}

    .review-index .hero-visual{align-self:stretch;display:grid;grid-template-rows:minmax(16rem,1fr) auto;background:var(--ioc-surface,#fff);border:1px solid var(--ioc--g20);box-shadow:1rem 1rem 0 var(--ioc--g10)}
    .review-index .hero-photo{min-height:18rem;border:0;border-bottom:1px solid var(--ioc--g20)}
    .review-index .hero-photo img{object-position:center 38%}
    .review-index .hero-visual .decision-console{min-height:0;border:0;box-shadow:none}
    .review-index .hero-visual .console-bar{background:var(--ioc-surface,#fff)}

    .review-index .section-photo{aspect-ratio:16/5.4;margin:0 0 1.5rem}
    .review-index .section-photo img{object-position:center}
    .review-index .section-photo--operations img{object-position:center 53%}
    .review-index .section-photo--industry img{object-position:center 48%}
    .review-index .section-photo--dark{border-color:var(--ioc-g80,#393939);background:var(--ioc-g90,#262626)}
    .review-index .section-photo--dark:after{background:linear-gradient(180deg,rgba(22,22,22,.05) 35%,rgba(22,22,22,.86) 100%)}
    .review-index .ai-section .section-photo{margin-bottom:1px}

    .review-index .gateway{padding:0;overflow:hidden}
    .review-index .gateway-photo{flex:0 0 auto;aspect-ratio:16/7.2;border:0;border-bottom:1px solid var(--ioc--g20)}
    .review-index .gateway-photo:after{background:linear-gradient(180deg,transparent 55%,rgba(15,15,16,.62) 100%)}
    .review-index .gateway-photo img{object-position:center}
    .review-index .gateway:first-child .gateway-photo img{object-position:center 44%}
    .review-index .gateway.talent .gateway-photo img{object-position:center 40%}
    .review-index .gateway-content{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:2.5rem;padding:clamp(2rem,4vw,4rem)}
    .review-index .gateway:hover .gateway-photo img{transform:scale(1.025)}
    .review-index .gateway:hover .gateway-photo:after{background:linear-gradient(180deg,rgba(0,1,255,.1),rgba(0,29,108,.78))}
    .review-index .gateway.talent:hover .gateway-photo:after{background:linear-gradient(180deg,rgba(255,0,119,.08),rgba(159,24,83,.8))}
    body.review-index .gateway h3{font-size:clamp(1.7rem,2.4vw,2.5rem);line-height:1.12}
    .review-index .gateway{min-height:auto}
    .review-index .gateway-photo{aspect-ratio:16/6}
    .review-index .gateway-content{gap:1.5rem;padding:clamp(1.75rem,3vw,2.75rem)}

    .review-index .photo-sources{padding:1rem 0;border-top:1px solid var(--ioc-g80,#393939);color:var(--ioc-g50,#8d8d8d);font-size:.68rem;line-height:1.55}
    .review-index .photo-sources a{color:var(--ioc-g30,#c6c6c6);text-decoration:underline;text-underline-offset:2px}

    @media(max-width:1100px){
      .review-index .hero-visual{max-width:48rem}
      .review-index .section-photo{aspect-ratio:16/7}
    }
    @media(max-width:700px){
      .review-index .hero-visual{grid-template-rows:15rem auto;box-shadow:.65rem .65rem 0 var(--ioc--g10)}
      .review-index .hero-photo{min-height:15rem}
      .review-index .media-frame figcaption{left:1rem;right:1rem;bottom:.8rem;align-items:start;flex-direction:column;gap:.25rem}
      .review-index .media-frame figcaption small{text-align:left}
      .review-index .section-photo{aspect-ratio:4/3;margin-bottom:1rem}
      .review-index .gateway-photo{aspect-ratio:16/9}
      .review-index .gateway-content{padding:2rem 1.25rem}
    }

  .carbon-icon{display:block;width:1.5rem;height:1.5rem;flex:0 0 auto;fill:currentColor}

/* ===== HOME · harmonized to inner-page (idc) standard ===== */
.showcase .container{width:min(100%,1584px);padding-inline:clamp(20px,4vw,32px)}
.showcase .section{padding-block:clamp(64px,8vw,112px)}
#constraints{background:var(--ioc--g10)}
#constraints .vh-cgrid{background:var(--ioc--white)}
#constraints .vh-c:hover{background:var(--ioc-surface-hover,#e8e8e8)}
#delivery{background:var(--ioc--g10)}
#delivery .vh-steps{background:var(--ioc--white);border:1px solid var(--ioc--g20);padding:2rem}
#delivery .vh-step{padding:1.5rem;margin:0 -2rem;transition:background .2s}
#delivery .vh-step:first-child{padding-top:1.5rem}
#delivery .vh-step:hover{background:var(--ioc-surface-hover,#e8e8e8)}
#delivery .vh-dgrid{align-items:stretch}
#delivery .vh-out{background:var(--ioc-g80,#393939);border-color:var(--ioc-g80,#393939);align-content:stretch;height:100%}
#delivery .vh-out div{background:var(--ioc--g100)}
#delivery .vh-out svg{color:var(--ioc-accent-on-brand,#8c8cff)}
#delivery .vh-out strong{color:var(--ioc-text-on-color,#fff)}
#delivery .vh-out span{color:var(--ioc-g30,#c6c6c6)}
#delivery .vh-out div:hover{background:var(--ioc-g90,#262626)}
.showcase .section-head{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(20px,4vw,64px);margin-bottom:clamp(32px,4vw,56px)}
.showcase .section-head>div>h2,.showcase .section-head h2{font-size:clamp(28px,3.2vw,46px);font-weight:700;line-height:1.06;letter-spacing:-.025em;text-wrap:balance}
.showcase .section-head p{font-size:16px;line-height:1.55;max-width:46ch}
.showcase .section-kicker{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.12em;color:var(--ioc--g100)}
.showcase .section-kicker::before{content:"";width:22px;height:2px;background:var(--ioc--blue);flex:none}
.showcase .ai-section .section-kicker,.showcase .value-section .section-kicker{color:var(--ioc-text-on-color,#fff)}
/* tame oversized module headings to the restrained idc scale */
.showcase .persona-copy h3{font-size:clamp(24px,2.6vw,34px);font-weight:700;letter-spacing:-.02em;line-height:1.1}
.showcase .persona-copy p{font-size:16px}
.showcase .architecture-title h3{font-size:clamp(22px,2.4vw,32px);font-weight:700;letter-spacing:-.02em;line-height:1.1}
.showcase .assessment-aside h3{font-size:clamp(20px,2vw,26px);font-weight:700;line-height:1.15}
.showcase .assessment-step legend{font-size:clamp(18px,2vw,24px);font-weight:600;line-height:1.2}
.showcase .value-card strong{font-size:clamp(22px,2.4vw,30px);font-weight:700;letter-spacing:-.02em}
.showcase .contact h2{font-size:clamp(28px,3.2vw,46px);font-weight:700;line-height:1.06;letter-spacing:-.025em}
.showcase .trust-intro h2{font-size:clamp(24px,2.8vw,38px);font-weight:700;letter-spacing:-.02em}
@media(max-width:860px){.showcase .section-head{grid-template-columns:1fr;align-items:start}}



/* ---- Get-started CTA polish (home #assessment + footer #get-started) ---- */
.review-index .ca-tabs{max-width:46rem;border-color:var(--ioc--g20);box-shadow:0 1px 0 var(--ioc--g20)}
.review-index .ca-tab{position:relative;letter-spacing:-.01em;transition:background .2s var(--ioc--ease),color .2s var(--ioc--ease)}
.review-index .ca-tab:hover:not([aria-selected="true"]){background:var(--ioc--g10);color:var(--ioc--g100)}
.review-index .ca-tab[aria-selected="true"]:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--ioc--g100)}
/* Aside */
.review-index .assessment-aside{position:relative;background:linear-gradient(160deg,var(--ioc--blue) 0%,var(--ioc-blue-hover,#0000c4) 100%);overflow:hidden}
.review-index .assessment-aside>div:first-child{position:relative;z-index:1}
.review-index .assessment-aside .carbon-icon{width:2.25rem;height:2.25rem;padding:.5rem;background:rgba(255,255,255,.14);margin-bottom:1.25rem}
.review-index .assessment-aside p{max-width:34ch}
.review-index .progress-steps{counter-reset:astep;position:relative;z-index:1}
.review-index .progress-steps li{align-items:center;transition:color .2s}
.review-index .assessment-trust{position:relative;z-index:1;margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.22);display:flex;align-items:center;gap:.6rem;font-size:.78rem;color:var(--ioc-text-on-brand-soft,#e5e5ff);line-height:1.4}
.review-index .assessment-trust .carbon-icon{width:1.15rem;height:1.15rem;flex:0 0 auto;margin:0;padding:0;background:none;color:var(--ioc-text-on-color,#fff)}
/* Choices as confident cards */
.review-index .assessment-step legend{font-weight:600;text-wrap:balance}
.review-index .choice{gap:1.15rem;padding:1.15rem 1.25rem;align-items:center;transition:background .16s var(--ioc--ease),border-color .16s var(--ioc--ease),box-shadow .16s var(--ioc--ease)}
.review-index .choice+.choice{margin-top:-1px}
.review-index .choice:hover{background:var(--ioc--g10);border-color:var(--ioc--g60);z-index:1}
.review-index .choice:has(input:checked){background:var(--ioc-selected-surface,#edf5ff);border-color:var(--ioc--blue);box-shadow:inset 3px 0 0 var(--ioc--blue);z-index:2}
.review-index .choice:has(input:checked) .choice-text strong{font-weight:700}
.review-index .radio-ui{width:1.35rem;height:1.35rem;border-color:var(--ioc--g60);transition:border-color .16s,background .16s,box-shadow .16s}
.review-index .choice-text small{line-height:1.4}
/* Actions: confident primary */
.review-index .assessment-actions{align-items:center}
.review-index .assessment-next{min-width:12rem;gap:1.25rem;background:var(--ioc--blue)}
.review-index .assessment-next:not([disabled]):hover{background:var(--ioc-blue-hover,#0000c4)}
.review-index .assessment-back{min-width:8rem}
.review-index .assessment-progress-note{margin-right:auto;font-family:var(--ioc--font-mono,ui-monospace,monospace);font-size:.72rem;letter-spacing:.1em;color:var(--ioc--g60);text-transform:uppercase}
/* Result */
.review-index .assessment-result.active{display:flex;flex-direction:column}
.review-index .score-ring{transition:transform .4s var(--ioc--ease)}
/* Contact form: clearer focus + confidence */
.review-index #get-started .contact-form .field input,.review-index #get-started .contact-form .field select,.review-index #get-started .contact-form .field textarea,.review-index #ca-contact .field input,.review-index #ca-contact .field select,.review-index #ca-contact .field textarea{border-bottom-width:1px;border-bottom-color:rgba(255,255,255,.55);transition:border-color .18s,background .18s}
.review-index #ca-contact .field label,.review-index #get-started .contact-form .field label{font-family:var(--ioc--font-mono,ui-monospace,monospace);letter-spacing:.08em;text-transform:uppercase;font-size:.7rem;opacity:.9}
.review-index #ca-contact .field input:focus,.review-index #ca-contact .field select:focus,.review-index #ca-contact .field textarea:focus,.review-index #get-started .contact-form .field input:focus,.review-index #get-started .contact-form .field select:focus,.review-index #get-started .contact-form .field textarea:focus{border-bottom-color:var(--ioc-border-on-color,#fff);background:rgba(255,255,255,.18)}
.review-index #ca-contact .field input::placeholder,.review-index #ca-contact .field textarea::placeholder{color:rgba(255,255,255,.6)}
.review-index .contact-form .btn{margin-top:.5rem}
.review-index .form-reassure{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;margin-top:.35rem;font-size:.75rem;color:var(--ioc-text-on-brand-soft,#e5e5ff)}
.review-index .form-reassure span{display:inline-flex;align-items:center;gap:.4rem}
.review-index .form-reassure .carbon-icon{width:1rem;height:1rem;color:var(--ioc-text-on-color,#fff)}
@media(max-width:700px){.review-index .assessment-next{min-width:0;flex:1}.review-index .assessment-actions{flex-wrap:wrap}.review-index .assessment-progress-note{width:100%;order:-1;margin:0 0 .5rem}}


.section-head .ioc-sh-lead p{margin:0;font-size:clamp(16px,1.25vw,19px);line-height:1.5;color:var(--ioc--g100);max-width:36ch;text-wrap:pretty}
.section-head .ioc-sh-lead p b{font-weight:700}
.section-head .ioc-sh-lead .meta{display:block;margin-top:12px;font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc--g60);line-height:1.6}
.section-head .vh-sh-aside{gap:.9rem}
.section.dark .section-head .ioc-sh-lead p{color:var(--ioc-g10,#f4f4f4)}
.section.dark .section-head .ioc-sh-lead .meta{color:var(--ioc-g40,#a8a8a8)}
@media(max-width:860px){.section-head .ioc-sh-lead p{max-width:none}}


.review-index .v1hero{background:linear-gradient(100deg,var(--ioc-surface-subtle,#fbfbfb) 0%,var(--ioc-surface-subtle,#fbfbfb) 45%,var(--ioc-surface-cool,#f2f4f8) 100%);border-bottom:1px solid var(--ioc--g20)}
.v1hero .hero-main{grid-template-columns:minmax(24rem,42fr) minmax(34rem,58fr);gap:clamp(24px,3vw,56px)}
.v1hero .copy-panel{background:transparent;border:0;padding:clamp(24px,3vw,48px) 0 clamp(24px,3vw,48px) clamp(4px,2.5vw,40px);min-height:0;justify-content:center}
.v1hero .h-lede{max-width:40ch}
.v1hero .h-actions .h-btn{white-space:nowrap}
.v1hero .hero-visual-col{display:flex;flex-direction:column;gap:22px;min-width:0;padding-block:clamp(16px,2.2vw,32px)}
.v1hero .hero-slides{position:relative;margin:0;aspect-ratio:16/7.6;min-height:15rem;overflow:hidden;background:var(--ioc--g20)}
.v1hero .hs-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s var(--ioc--ease)}
.v1hero .hs-img.is-on{opacity:1}
.v1hero .hs-dots{position:absolute;right:14px;bottom:12px;z-index:3;display:flex;gap:7px}
.v1hero .hs-dots button{width:10px;height:10px;padding:0;border:0;background:rgba(255,255,255,.78);cursor:pointer}
.v1hero .hs-dots button.on{background:var(--ioc--blue)}
.v1hero .hero-lower{display:grid;grid-template-columns:minmax(0,1fr) minmax(14.5rem,19.5rem);gap:22px;align-items:stretch}
.v1hero .hero-lower .outcome{position:static;transform:none;width:auto;box-shadow:none;border:1px solid var(--ioc--g20);display:flex;flex-direction:column}
.v1hero .hero-lower .outcome-result{margin-top:auto}
.v1hero .foundation-card{display:flex;flex-direction:column;min-width:0;padding:22px;background:var(--ioc-surface-inverse,#161616);color:var(--ioc-text-on-color,#fff)}
.v1hero .fc-kicker{font-family:var(--ioc--font-mono,"JetBrains Mono",monospace);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-g40,#a8a8a8)}
.v1hero .fc-body{margin:auto 0;padding-block:1.4rem}
.v1hero .fc-body>svg{width:30px;height:30px;margin-bottom:14px;color:var(--ioc-text-on-color,#fff)}
.v1hero .fc-title{margin:0 0 10px;font-size:clamp(20px,1.6vw,26px);font-weight:700;letter-spacing:-.02em;line-height:1.12;color:var(--ioc-text-on-color,#fff)}
.v1hero .fc-sub{margin:0;color:var(--ioc-g30,#c6c6c6);font-size:14px;line-height:1.5}
.v1hero .fc-link{display:inline-flex;align-items:center;gap:10px;margin-top:auto;color:var(--ioc-text-on-color,#fff);font-weight:600;font-size:14px}
.v1hero .fc-link svg{width:16px;height:16px;fill:currentColor;transition:transform .18s var(--ioc--ease)}
.v1hero .fc-link:hover svg{transform:translateX(3px)}
@media(max-width:1040px){.v1hero .hero-main{grid-template-columns:1fr;gap:0}.v1hero .hero-visual-col{padding-block:0 clamp(16px,2.2vw,32px)}}
@media(max-width:1024px){.v1hero .copy-panel{padding-left:0}.v1hero .hero-lower{grid-template-columns:1fr}.v1hero .foundation-card{min-height:11rem}.v1hero .fc-body{padding-block:1rem}}


.vh-ribbon{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:clamp(2.5rem,5vw,4rem);font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ioc--g70)}
.vh-ribbon span{border:1px solid var(--ioc--g20);padding:.5rem .85rem}
.vh-agrid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ioc--g20);border-left:1px solid var(--ioc--g20)}
.vh-acard{padding:2rem;border-right:1px solid var(--ioc--g20);border-bottom:1px solid var(--ioc--g20);display:flex;flex-direction:column;gap:.55rem;min-height:16rem}
.vh-acard>svg{width:2rem;height:2rem;color:var(--ioc--blue);margin-bottom:.85rem}
.vh-acard .kx{font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc--blue)}
.vh-acard h3{font-size:1.18rem;font-weight:500;margin:0;letter-spacing:-.01em}
.vh-acard p{color:var(--ioc--g70);font-size:.88rem;margin:0;line-height:1.5}
.vh-cgrid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ioc--g20);border-left:1px solid var(--ioc--g20)}
.vh-c{position:relative;padding:2rem;border-right:1px solid var(--ioc--g20);border-bottom:1px solid var(--ioc--g20);display:flex;flex-direction:column;min-height:23rem;transition:background .2s}
.vh-c:hover{background:var(--ioc--g10)}
.vh-c .num{font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.06em;color:var(--ioc--g60)}
.vh-c>svg{width:2.25rem;height:2.25rem;color:var(--ioc--blue);margin:1.25rem 0}
.vh-c h3{font-size:1.3rem;font-weight:500;margin:0 0 .6rem;letter-spacing:-.01em}
.vh-c p{color:var(--ioc--g70);font-size:.9rem;margin:0 0 1.5rem;line-height:1.5}
.vh-c a{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;color:var(--ioc--blue);font-weight:600;font-size:.85rem}
.vh-c a svg{width:1rem;height:1rem}
.vh-pf{display:flex;flex-wrap:wrap;gap:1.5rem 2rem;align-items:center;justify-content:space-between;padding-top:1.5rem;border-top:1px solid var(--ioc--g20)}
.vh-pf p{color:var(--ioc--g70);max-width:52ch;margin:0;font-size:.9rem}
.vh-chips{display:flex;flex-wrap:wrap;gap:.5rem}
.vh-chips a{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--ioc--g20);padding:.45rem .85rem;font-size:.78rem;color:var(--ioc--g70);transition:background .15s var(--ioc--ease),border-color .15s,color .15s,transform .15s}
.vh-chips a svg{width:.85rem;height:.85rem;opacity:.45;transition:transform .15s,opacity .15s}
.vh-chips a:hover{background:var(--ioc--blue);border-color:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);transform:translateY(-1px)}
.vh-chips a:hover svg{opacity:1;transform:translateX(2px)}

.vh-ind{display:block;border-top:1px solid var(--ioc--g20);padding-top:1.5rem}


.vh-dgrid{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.vh-steps{display:flex;flex-direction:column}
.vh-step{display:flex;gap:1.25rem;padding:1.5rem 0;border-top:1px solid var(--ioc--g20)}
.vh-step:first-child{border-top:0;padding-top:0}
.vh-step .si{width:2.75rem;height:2.75rem;flex:none;border:1px solid var(--ioc--g20);display:flex;align-items:center;justify-content:center;color:var(--ioc--blue)}
.vh-step .si svg{width:1.35rem;height:1.35rem}
.vh-step h3{font-size:1.12rem;font-weight:500;margin:0 0 .35rem}
.vh-step p{color:var(--ioc--g70);font-size:.9rem;margin:0;line-height:1.5}
.vh-out{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ioc--g20);border:1px solid var(--ioc--g20)}
.vh-out div{background:var(--ioc-surface,#fff);padding:1.5rem;min-height:9.5rem;display:flex;flex-direction:column;gap:.3rem}
.vh-out svg{width:1.6rem;height:1.6rem;color:var(--ioc--blue);margin-bottom:.4rem}
.vh-out strong{font-weight:500;font-size:.96rem}
.vh-out span{color:var(--ioc--g60);font-size:.78rem;line-height:1.45}
.vh-cap{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ioc--g20);border:1px solid var(--ioc--g20)}
.vh-capcard{background:var(--ioc-surface,#fff);display:flex;flex-direction:column}
.vh-capcard .cm{aspect-ratio:16/9;overflow:hidden;background:var(--ioc--g10)}
.vh-capcard .cm img{width:100%;height:100%;object-fit:cover}
.vh-capcard .cb{padding:2rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.vh-capcard .kx{font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ioc--blue)}
.vh-capcard h3{font-size:1.55rem;font-weight:400;letter-spacing:-.02em;margin:0}
.vh-capcard p{color:var(--ioc--g70);font-size:.92rem;margin:0;line-height:1.55}
.vh-capcard a{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;color:var(--ioc--blue);font-weight:600;font-size:.85rem;padding-top:.5rem}
.vh-capcard a svg{width:1rem;height:1rem}
.vh-cpanel{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);padding:clamp(1.75rem,3.5vw,3rem)}
.vh-cpanel .eyebrow{color:var(--ioc-text-on-color,#fff);margin-bottom:.7rem}
.vh-cpanel .eyebrow:before{background:var(--ioc-text-on-color,#fff)}
.vh2-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.25rem 2rem;align-items:start;margin-bottom:clamp(1.5rem,3vw,2.25rem)}
.vh-cpanel .vh2-intro h2{font-size:clamp(1.5rem,2.4vw,2.1rem);font-weight:400;letter-spacing:-.025em;margin:0;color:var(--ioc-text-on-color,#fff);max-width:22ch}
.vh2-sub{color:var(--ioc-text-on-brand-soft,#e5e5ff);font-size:.92rem;line-height:1.5;margin:.6rem 0 0;max-width:58ch}
.vh2-trust{display:inline-flex;align-items:center;gap:.5rem;margin:1rem 0 0;font-size:.78rem;color:var(--ioc-text-on-brand-muted,#d0d0ff)}
.vh2-trust svg{width:1rem;height:1rem;color:var(--ioc-text-on-color,#fff);flex:none}
.vh-modetabs{display:flex;border:1px solid rgba(255,255,255,.55);align-self:start}
.vh-modetabs button{padding:.62rem 1.15rem;border:0;background:transparent;color:var(--ioc-text-on-color,#fff);font-weight:600;font-size:.82rem;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.vh-modetabs button[aria-selected="true"]{background:var(--ioc-text-on-color,#fff);color:var(--ioc--blue)}
.vh2-form{background:var(--ioc-surface,#fff);color:var(--ioc--g100);padding:clamp(1.5rem,2.6vw,2.35rem);display:grid;grid-template-columns:repeat(4,1fr);gap:1.35rem 1.25rem;align-items:start}
#conversion-form [hidden]{display:none!important}
.vh2-field{display:flex;flex-direction:column;gap:.4rem;min-width:0}
.vh2-full{grid-column:1/-1}
.vh2-field label{font-family:"JetBrains Mono",monospace;font-size:.66rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ioc--g70)}
.vh2-field .req{color:var(--ioc--blue)}
.vh2-field input,.vh2-field select,.vh2-field textarea{width:100%;background:var(--ioc-surface,#fff);border:1px solid var(--ioc--g30);padding:.7rem .8rem;color:var(--ioc--g100);font-size:.95rem;font-family:inherit;outline:0;border-radius:0;transition:border-color .15s,box-shadow .15s}
.vh2-field textarea{resize:vertical;min-height:4rem;line-height:1.5}
.vh2-field input:hover,.vh2-field select:hover,.vh2-field textarea:hover{border-color:var(--ioc--g60)}
.vh2-field input:focus,.vh2-field select:focus,.vh2-field textarea:focus{border-color:var(--ioc--blue);box-shadow:0 0 0 3px rgba(0,1,255,.14)}
.vh2-field input::placeholder,.vh2-field textarea::placeholder{color:var(--ioc-placeholder)}
.vh2-field.err input,.vh2-field.err select,.vh2-field.err textarea{border-color:var(--ioc-danger,#da1e28);box-shadow:0 0 0 3px rgba(218,30,40,.12)}
.vh2-err{font-size:.72rem;color:var(--ioc-danger,#da1e28)}
.vh2-err:empty{display:none}
.vh2-q{grid-column:1/-1;border:0;padding:0;margin:0;min-width:0}
.vh2-q legend{font-family:"JetBrains Mono",monospace;font-size:.67rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ioc--g70);margin-bottom:.55rem;padding:0}
.vh-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.vh-choices label{position:relative;display:flex;align-items:center;gap:.6rem;justify-content:flex-start;text-align:left;padding:.7rem .8rem;border:1px solid var(--ioc--g30);font-size:.82rem;line-height:1.25;color:var(--ioc--g70);cursor:pointer;transition:transform .15s var(--ioc--ease),background .15s,border-color .15s,color .15s}
.vh-choices label::before{content:"";width:22px;height:7px;flex:none;background:linear-gradient(90deg,var(--ioc--blue) var(--lvl,33%),var(--ioc--g20) 0)}
.vh-choices label:nth-child(1){--lvl:33%}
.vh-choices label:nth-child(2){--lvl:66%}
.vh-choices label:nth-child(3){--lvl:100%}
.vh-choices label:hover{border-color:var(--ioc--blue);color:var(--ioc--g100);transform:translateY(-1px)}
.vh-choices label:has(input:checked){background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);border-color:var(--ioc--blue);font-weight:600}
.vh-choices label:has(input:checked)::before{background:linear-gradient(90deg,var(--ioc-text-on-color,#fff) var(--lvl,33%),rgba(255,255,255,.35) 0)}
.vh-choices input{position:absolute;opacity:0;width:0;height:0}
.vh2-foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:1rem 2rem;flex-wrap:wrap;margin-top:.25rem;padding-top:1.35rem;border-top:1px solid var(--ioc--g20)}
.vh-consent{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:var(--ioc--g70);margin:0;cursor:pointer}
.vh-consent input{width:1.1rem;height:1.1rem;flex:none;accent-color:var(--ioc--blue)}
.vh2-submit{display:inline-flex;align-items:center;gap:1.5rem;background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);border:0;padding:.85rem 1.5rem;font-weight:600;font-size:.95rem;cursor:pointer;transition:background .15s}
.vh2-submit:hover{background:var(--ioc-blue-hover,#0000c4)}
.vh2-submit svg{width:1.1rem;height:1.1rem}
.vh2-submit[disabled]{opacity:.65;cursor:default}
.vh-status{grid-column:1/-1;font-size:.85rem;padding:.75rem .9rem;background:var(--ioc--g10);border-left:3px solid var(--ioc--blue);color:var(--ioc--g100);line-height:1.5}
.vh-status:empty{display:none}
.vh-status.ok{background:var(--ioc-success-surface,#defbe6);border-left-color:var(--ioc-green,#0e6027)}
.vh-status.bad{background:var(--ioc-danger-surface,#fff1f1);border-left-color:var(--ioc-danger,#da1e28)}
.vh-status strong{font-weight:600}
.vh2-note{grid-column:1/-1;font-size:.72rem;color:var(--ioc--g60)}
@media(max-width:820px){.vh2-head{grid-template-columns:1fr}.vh2-form{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vh2-form,.vh-choices{grid-template-columns:1fr}.vh-modetabs{width:100%}.vh-modetabs button{flex:1;text-align:center}.vh2-foot{flex-direction:column;align-items:stretch}.vh2-submit{justify-content:center}}
@media(max-width:1024px){.vh-agrid,.vh-cgrid{grid-template-columns:1fr 1fr}.vh-dgrid{grid-template-columns:1fr}.vh-cap{grid-template-columns:1fr}}
@media(max-width:700px){.vh-agrid,.vh-cgrid{grid-template-columns:1fr}.vh-out{grid-template-columns:1fr}.vh-modetabs{flex-direction:column}}

/* B-03 · layered stack (from Platform section options v2, option A) */
.pa{background:var(--ioc-g100);background-image:radial-gradient(120% 90% at 10% 0%,rgba(0,1,255,.32) 0%,rgba(0,1,255,0) 58%);color:var(--ioc-text-on-color,#fff);padding:clamp(1.75rem,3.5vw,3rem);border:1px solid var(--ioc-g80,#393939)}
.pa-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(1.5rem,3vw,3rem)}
.pa-stack{display:flex;flex-direction:column;gap:6px}
.pa-row{position:relative;display:grid;grid-template-columns:40px 1fr auto;gap:1rem;align-items:center;padding:.85rem 1.1rem;border:1px solid var(--ioc-g80,#393939);background:rgba(255,255,255,.035);text-decoration:none;color:var(--ioc-text-on-color,#fff);transition:border-color .2s,background .2s,transform .2s}
.pa-row:hover{border-color:var(--ioc-accent-on-brand,#8c8cff);background:rgba(140,140,255,.10);transform:translateX(4px)}
.pa-row.core{border-color:color-mix(in oklch,var(--ioc-blue) 62%,var(--ioc-border-on-color));background:linear-gradient(90deg,rgba(0,1,255,.5),rgba(0,1,255,.1))}
.pa-row .ic{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--ioc-g70,#525252)}
.pa-row.core .ic{border-color:rgba(255,255,255,.55)}
.pa-row .ic svg{width:20px;height:20px;color:var(--ioc-text-on-brand-muted,#d0d0ff)}
.pa-row .k{display:block;font-family:var(--ioc-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-g40,#a8a8a8)}
.pa-row strong{display:block;font-size:1.05rem;font-weight:500;letter-spacing:-.01em;margin:2px 0 3px}
.pa-row .d{display:block;font-size:.82rem;line-height:1.45;color:var(--ioc-g30,#c6c6c6);max-width:46ch}
.pa-row.core .d,.pa-row.core .k{color:var(--ioc-text-on-brand-soft,#e5e5ff)}
.pa-row .go{display:flex;align-items:center;gap:.5rem;font-family:var(--ioc-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ioc-g40,#a8a8a8);white-space:nowrap;transition:color .2s}
.pa-row:hover .go{color:var(--ioc-accent-on-brand,#8c8cff)}
.pa-row.core .go{color:var(--ioc-text-on-color,#fff)}
.pa-row:hover .ic{border-color:var(--ioc-accent-on-brand,#8c8cff)}
.pa-row:hover .ic svg{color:var(--ioc-accent-on-brand,#8c8cff)}
.pa-row .go svg{width:14px;height:14px;transition:transform .2s}
.pa-row:hover .go svg{transform:translateX(3px)}
.pa-side{display:flex;flex-direction:column;gap:1rem}
.pa-fig{position:relative;overflow:hidden;border:1px solid var(--ioc-g80,#393939);aspect-ratio:16/10;margin:0}
.pa-fig img{width:100%;height:100%;object-fit:cover;filter:grayscale(.35) contrast(1.05)}
.pa-fig::after{content:"";position:absolute;inset:0;background:linear-gradient(200deg,rgba(0,1,255,.4),rgba(22,22,22,.86))}
.pa-fig figcaption{position:absolute;left:0;right:0;bottom:0;padding:1rem 1.1rem;z-index:1}
.pa-fig figcaption b{display:block;font-size:1rem;font-weight:600}
.pa-fig figcaption span{font-family:var(--ioc-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ioc-text-on-brand-muted,#d0d0ff)}
.pa-rule{border:1px solid var(--ioc-g80,#393939);padding:1rem 1.1rem;background:rgba(255,255,255,.03)}
.pa-rule p{margin:0;font-size:.88rem;line-height:1.6;color:var(--ioc-g30,#c6c6c6)}
.pa-rule p b{color:var(--ioc-text-on-color,#fff);font-weight:600}
.pa-rule .k{margin:0 0 .5rem;font-family:var(--ioc-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ioc-text-on-brand-muted,#d0d0ff)}
.pa-links{display:grid;border:1px solid var(--ioc-g80,#393939);margin-top:auto}
.pa-links a{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 1.1rem;color:var(--ioc-text-on-color,#fff);text-decoration:none;border-bottom:1px solid var(--ioc-g80,#393939);font-size:.92rem;transition:background .18s,padding-left .18s}
.pa-links a:last-child{border-bottom:0}
.pa-links a:hover{background:rgba(0,1,255,.22);padding-left:1.45rem}
.pa-links svg{width:16px;height:16px}
@media(max-width:900px){.pa-grid{grid-template-columns:1fr}}
/* industry strip · option D */
.vh-dtabs{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--ioc-g20);border-top:0;margin-top:0}
.vh-dtabs button{flex:1 1 auto;appearance:none;background:var(--ioc-surface,#fff);border:0;box-shadow:1px 0 0 0 var(--ioc-g20);padding:.95rem 1.1rem;font:inherit;font-size:.85rem;font-weight:500;color:var(--ioc-g70);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;transition:background .15s,color .15s}
.vh-dtabs button svg{width:17px;height:17px;opacity:.55}
.vh-dtabs button:hover{background:var(--ioc-g10);color:var(--ioc-text-primary)}
.vh-dtabs button[aria-selected="true"]{background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff);box-shadow:1px 0 0 0 var(--ioc-accent)}
.vh-dtabs button[aria-selected="true"] svg{opacity:1}
.vh-dpanel{border:1px solid var(--ioc-g20);border-top:0;padding:1.6rem 1.5rem;display:grid;grid-template-columns:1fr auto;gap:1.5rem 2rem;align-items:center;background:var(--ioc-g10)}
.vh-dpanel p{margin:0;font-size:1.05rem;line-height:1.5;letter-spacing:-.01em;max-width:56ch}
.vh-dpanel .m{display:block;font-family:var(--ioc-mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ioc-g60);margin-top:.6rem}
.vh-dpanel a{display:inline-flex;align-items:center;gap:.5rem;background:var(--ioc-accent);color:var(--ioc-text-on-color,#fff);text-decoration:none;padding:.75rem 1.15rem;font-size:.85rem;font-weight:500;white-space:nowrap;min-height:44px;box-sizing:border-box}
.vh-dpanel a svg{width:16px;height:16px}
.vh-dpanel a:hover{background:var(--ioc-accent-hover)}
@media(max-width:700px){.vh-dtabs{flex-direction:column}.vh-dpanel{grid-template-columns:1fr}}
/* --- section hover + explore links --- */
.vh-acard>svg,.vh-c>svg{transition:transform .18s var(--ioc--ease)}
.vh-acard{transition:background .18s var(--ioc--ease)}
.vh-acard:hover{background:var(--ioc--g10)}
.vh-acard:hover>svg{transform:translateY(-3px)}
.vh-c a svg{transition:transform .18s var(--ioc--ease)}
.vh-c:hover a svg{transform:translateX(4px)}
.vh-c:hover>svg{transform:translateY(-3px)}
.vh-capcard .cm img{transition:transform .45s var(--ioc--ease)}
.vh-capcard:hover .cm img{transform:scale(1.05)}
.vh-capcard a svg{transition:transform .18s var(--ioc--ease)}
.vh-capcard:hover a svg{transform:translateX(4px)}
.vh-out div{transition:background .18s var(--ioc--ease)}
.vh-out div:hover{background:var(--ioc--g10)}
.vh-out svg{transition:transform .18s var(--ioc--ease)}
.vh-out div:hover svg{transform:scale(1.1)}
.vh-step .si{transition:background .18s var(--ioc--ease),color .18s,border-color .18s}
.vh-step:hover .si{background:var(--ioc--blue);color:var(--ioc-text-on-color,#fff);border-color:var(--ioc--blue)}
.vh-chips a{transition:border-color .15s,color .15s,transform .15s}
.vh-chips a:hover{transform:translateY(-1px)}
.vh-sh-aside{display:flex;flex-direction:column;gap:1.1rem;align-items:flex-start}
.vh-sh-aside>p{margin:0}
.vh-seclink{display:inline-flex;align-items:center;gap:.5rem;color:var(--ioc--blue);font-weight:600;font-size:.9rem}
.vh-seclink svg{width:1rem;height:1rem;transition:transform .18s var(--ioc--ease)}
.vh-seclink:hover svg{transform:translateX(4px)}
.vh-capcard{transition:background .2s var(--ioc--ease)}
.vh-capcard:first-child:hover{background:var(--ioc-fam-academy,#6929c4)}
.vh-capcard:last-child:hover{background:var(--ioc-fam-talents,#1a7a52)}
.vh-capcard:hover .kx,.vh-capcard:hover h3,.vh-capcard:hover p,.vh-capcard:hover a{color:var(--ioc-text-on-color,#fff)}
/* --- home footer-cta hosts the get-started form --- */
.ioc-footer .footer-cta .vh2-sub{color:var(--ioc-text-secondary,#525252);font-size:.95rem;line-height:1.55;margin:1.1rem 0 0;max-width:46ch}
.ioc-footer .footer-cta .vh2-trust{display:inline-flex;align-items:center;gap:.5rem;margin:1.1rem 0 0;font-size:.8rem;color:var(--ioc-text-secondary,#525252)}
.ioc-footer .footer-cta .vh2-trust svg{width:1rem;height:1rem;flex:none;color:var(--ioc-blue,#0001ff)}
.ioc-footer .footer-action .vh-modetabs{display:flex;border:1px solid var(--ioc-border-strong,#8d8d8d);margin:0 0 18px;width:max-content;max-width:100%}
.ioc-footer .footer-action .vh-modetabs button{padding:.62rem 1.15rem;border:0;background:var(--ioc-surface,#fff);color:var(--ioc-text-secondary,#525252);font-weight:600;font-size:.82rem;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.ioc-footer .footer-action .vh-modetabs button[aria-selected="true"]{background:var(--ioc-blue,#0001ff);color:var(--ioc-text-on-primary,#fff)}
.ioc-footer .footer-action .vh2-form{border:1px solid var(--ioc-border-subtle,#e0e0e0)}


.home-cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:200;background:var(--ioc--g100,#161616);color:var(--ioc-text-on-color,#fff);transform:translateY(100%);transition:transform .35s cubic-bezier(.2,0,0,1)}
.home-cta-bar.in{transform:none}
.hcb-wrap{width:min(100%,1440px);margin:0 auto;padding:16px clamp(1.25rem,4vw,4rem);display:flex;align-items:center;gap:20px}
.hcb-wrap p{margin:0;font-size:15px;flex:1;color:var(--ioc-g20,#e0e0e0);text-wrap:pretty}
.hcb-wrap p strong{color:var(--ioc-text-on-color,#fff);font-weight:700}
.hcb-btn{display:inline-flex;align-items:center;gap:14px;background:var(--ioc--blue,#0001ff);color:var(--ioc-text-on-color,#fff);font-weight:600;font-size:15px;padding:12px 20px;white-space:nowrap;transition:background .15s}
.hcb-btn:hover{background:var(--ioc-blue-hover,#0000c4)}
.hcb-btn svg{width:18px;height:18px}
.hcb-close{background:transparent;border:0;color:var(--ioc-g40,#a8a8a8);font-size:26px;line-height:1;cursor:pointer;padding:2px 6px}
.hcb-close:hover{color:var(--ioc-text-on-color,#fff)}
@media(max-width:760px){.hcb-wrap{flex-wrap:wrap;gap:12px}.hcb-wrap p{flex:1 1 100%}.hcb-btn{flex:1}}


/* CMS-D-071 · lead-capture failure state — a lead that was not stored must
   read as a failure, not a confirmation. */
.ioc-cta-confirm.is-error{color:var(--ioc-danger,#da1e28)}
.ioc-cta-panel .ioc-cta-confirm.is-error{color:var(--ioc-danger-on-color,#ff8389)}
.ioc-cta-confirm.is-error a{color:inherit;text-decoration:underline}

/* ==========================================================================
   P36 / CMS-D-092 — the per-level heading weights, DELIBERATELY LAST.
   Still 0-0-1, so every block rule (0-1-1) and the showcase system (0-1-2)
   continue to outrank them exactly as they do in the design source. Position
   is the whole point: an absorbed legacy reset further up this file declares
   a bare `h1,h2,h3{font-weight:400}` at the SAME 0-0-1, and at equal
   specificity the later rule wins. Declared beside the other generic rules
   these lost to it, and six header headings rendered at 400 — measured, after
   it happened, which is the only reason this comment exists.
   ========================================================================== */
:where(body.ioc-site) h1{font-weight:var(--ioc-h1-weight,600)}
:where(body.ioc-site) h2{font-weight:var(--ioc-h2-weight,600)}
:where(body.ioc-site) h3{font-weight:var(--ioc-h3-weight,600)}
:where(body.ioc-site) h4{font-weight:var(--ioc-h4-weight,600)}

/* INFOC forms — the multi-step pager (CMS-D-084 P5, owner decision B-1).
 *
 * A SEPARATE, OWNED sheet. `infoc-cms.css` is sha256-pinned by
 * `scripts/v5-ui-gate.mjs` (P15-PUBLIC-BOUNDARY) and must not be hand-edited, and
 * appending to the GENERATED `infoc-site-overrides.css` would be overwritten on
 * the next build. B-1 chose option (c) — a dedicated sheet — and verified none of
 * the selectors below collide with the frozen one.
 *
 * It is deliberately SMALL. Every field, label, error and button inside a step is
 * already styled by the frozen sheet's generic selectors; this adds only what a
 * pager needs and nothing a single-step form pays for.
 *
 * Design rules (CMS-D-066): radius 0, 1px hairlines, house blue #0001ff, no
 * shadows-as-structure.
 *
 * P37 T4 (CMS-D-094/095): tokenised. The role layer lives in the PUBLIC kit's
 * own :root/body.ioc-site since Wave T1 — the old "the public site does not
 * load the admin token layer" rationale is no longer true. Every var() here
 * CARRIES A FALLBACK on purpose: this is a separate file, and a page that
 * ever loaded it without the kit sheet must render the house values, not
 * transparent (CMS-D-078). `#0001ff` maps to --ioc-blue, NEVER --ioc-accent —
 * accent is variant-overridden and a form pager must not family-shift.
 */

/* The step itself. A real <fieldset>, so the legend names the step for a screen
   reader and `hidden` on a later step is what the engine's own `visible()`
   already understands. */
.ioc-form .ioc-step {
  border: 0;
  padding: 0;
  margin: 0;
  min-inline-size: 0; /* fieldset defaults to min-content; this lets the grid shrink */
}

.ioc-form .ioc-step > legend {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  padding: 0;
  margin: 0 0 10px;
}

/* Progress. One line, a hairline rule, and a bar that fills — no percentages
   shouted at the visitor, because the step count is already in the label. */
.ioc-form .ioc-form-progress {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  /* was #6f6f6f — the progress label is helper text on a light card, and
     helper's role value is #5c5c5c (ΔE 7.8, an approved §5 normalisation) */
  color: var(--ioc-text-helper, #5c5c5c);
  margin: 0 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ioc-border-subtle, #e0e0e0);
}

.ioc-form .ioc-form-progress__bar {
  position: absolute;
  left: 0;
  bottom: -1px;
  height: 2px;
  background: var(--ioc-blue, #0001ff);
  transition: width 160ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
  .ioc-form .ioc-form-progress__bar {
    transition: none;
  }
}

/* Back / Continue. Sits above the action row so the submit stays the last thing
   before the reassurance line on the final step. */
.ioc-form .ioc-form-steps {
  display: flex;
  gap: 8px;
  margin: 4px 0 14px;
}

.ioc-form .ioc-form-steps [hidden] {
  display: none;
}

/* The step LIST marker classes B-1 reserved. Used by the builder's preview and by
   any future step-list affordance; declared here so the two never diverge. */
.ioc-form-step--current {
  font-weight: 600;
  color: var(--ioc-text-primary, #161616);
}

.ioc-form-step--complete {
  color: var(--ioc-blue, #0001ff);
}

/* The success panel's REFERENCE and REPLY-BY lines (2026-09-04).
   The forms runtime injects both as <p class="ioc-form-ref"> after a
   successful submit, and until now that class had ZERO rules in any of the
   five concat parts, so a reference identifier rendered in Manrope at the
   same 16px as the sentence above it -- the one string a person may need to
   read back to us, set as prose.
   THREE THINGS HERE ARE LOAD-BEARING.
   (1) `p.ioc-form-ref` and not `.ioc-form-ref`: the generated correction
   layer emits `body.ioc-site .ioc-form-success p{color:...}` at (0,2,2), so
   a (0,2,1) rule loses on the element count before source order is ever
   consulted. `color` is deliberately NOT set here for the same reason -- it
   could not beat the dark-band rule at (0,4,2), and the inherited secondary
   grey is already correct.
   (2) `align-self:stretch`: the success panel is `align-items:flex-start`,
   so without it the divider spans only the text width, not the panel.
   (3) The adjacent-sibling rule: the runtime injects the class TWICE, so a
   plain `border-top` would paint a double divider between two meta lines.
   This lives in forms.css rather than the infoc.com skin on purpose -- it is
   in all three site concats, so infoc.ai and infoc.one get it too, and the
   win is by specificity rather than sheet order, which makes the placement
   safe either way. */
.ioc-form-success p.ioc-form-ref {
  align-self: stretch;
  border-top: 1px solid var(--ioc-border-subtle, #e0e0e0);
  padding-top: var(--ioc-s4, 12px);
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.02em;
}

.ioc-form-success p.ioc-form-ref + p.ioc-form-ref {
  border-top: 0;
  padding-top: 0;
}

/* The form summary is a section heading under the page title. */
.ioc-form-errors h2{margin:0 0 8px;font-size:15px;letter-spacing:-.01em}

/* NO BLUE BOX AROUND THE SUCCESS PANEL OR THE ERROR SUMMARY (owner report,
   2026-09-15). The runtime focuses `[data-success]` after a submit and
   `.ioc-form-errors` after a failed one, so a screen reader announces them.
   Both are tabindex="-1" CONTAINERS, not controls and not in the tab order,
   yet three rules painted a 2px house-blue box on them on every Site: the
   frozen kit's `.ioc-form-success:focus` / `.ioc-form-errors:focus` (ANY focus,
   so every mouse submit), each skin's `body.ioc-site :focus-visible` ring at
   (0,2,1), and the kit's focus box-shadow. The focus MOVE stays (it is the
   announcement); only the ring on these two containers goes. Every button,
   link and field keeps its ring, including "Send another" inside the panel.
   This sheet sits BEFORE every skin in each Site concat, so it wins by
   SPECIFICITY — (0,4,1) and (0,3,1) against (0,2,1) — never by order and never
   by !important. Pinned by `form-focus-target-ring.int.spec.ts`. */
body .ioc-form .ioc-form-success[data-success]:focus,
body .ioc-form .ioc-form-success[data-success]:focus-visible,
body .ioc-form .ioc-form-errors:focus,
body .ioc-form .ioc-form-errors:focus-visible {
  outline: none;
  box-shadow: none;
}

/* ============================================================
   INFOC ONE CMS — slider sheet (CMS-D-100 ④). OWNED, not vendored.

   `infoc-cms.css` is a SHA-pinned artifact referenced in eleven places and is
   NOT touched by this programme. This is a separate owned sheet, exactly as
   `infoc-forms.css` is, copied to apps/one/public by
   copy-render-kit-runtime.mjs (prebuild + predev) and linked from the frontend
   layout.

   LITERAL-HEX CEILING IS ZERO. Every colour is `var(--role, #fallback)` — the
   var()-fallback pattern is the end state (CMS-D-078), and it is what makes the
   appearance ratchet monotonic. The mock's ~200 literal hexes and its invented
   family accents (#a04a00, #00635f, #0f62fe) are VOID; the palette that exists
   is --ioc-fam-* in infoc-cms.css:123-129.

   ALIASES DECLARE ON body.ioc-site, NEVER :root. An alias (a value containing
   var()) declared at :root substitutes on <html> and freezes at its code
   default, blind to the emitter's body.ioc-site overrides — CMS-D-095, live
   instance --ioc-shadow-focus.

   MOTION IS DECLARATIVE. Every duration and easing comes from the custom
   properties `renderSliderMarkup` inlined on the mount, resolved server-side by
   `resolveMotion`. The runtime only toggles data-state; it never sets a
   duration, so JS and CSS cannot disagree about timing.
   ============================================================ */

/* Slider roles. Aliases (they contain var()), so they belong on body.ioc-site.
   Each names the base role it draws from, and carries the literal fallback that
   role resolves to today. */
body.ioc-site {
  --ioc-sl-accent: var(--ioc-accent, #0001ff);
  --ioc-sl-accent-hover: var(--ioc-accent-hover, #0000c4);
  --ioc-sl-surface: var(--ioc-surface, #ffffff);
  --ioc-sl-surface-cool: var(--ioc-surface-cool, #f2f4f8);
  --ioc-sl-text: var(--ioc-text-primary, #161616);
  --ioc-sl-text-2: var(--ioc-text-secondary, #525252);
  --ioc-sl-border: var(--ioc-border-subtle, #e0e0e0);
  --ioc-sl-on-color: var(--ioc-text-on-color, #ffffff);
  --ioc-sl-on-inverse-muted: var(--ioc-text-on-inverse-muted, #c6c6c6);
  --ioc-sl-surface-dark: var(--ioc-surface-inverse-raised, #1c1c1c);
  --ioc-sl-border-on-color: var(--ioc-border-on-color, #ffffff);
}

/* Family accents. The document's `family` picks one; where a page already
   declares [data-page-family] the slider inherits that instead. */
.ioc-sl[data-family='academy'] {
  --ioc-sl-accent: var(--ioc-fam-academy, #6929c4);
  --ioc-sl-accent-hover: var(--ioc-fam-academy-hover, #55209c);
}
.ioc-sl[data-family='talents'] {
  --ioc-sl-accent: var(--ioc-fam-talents, #1a7a52);
  --ioc-sl-accent-hover: var(--ioc-fam-talents-hover, #145f40);
}
.ioc-sl[data-family='industries'] {
  --ioc-sl-accent: var(--ioc-fam-industries, #007d79);
  --ioc-sl-accent-hover: var(--ioc-fam-industries-ink, #005d5d);
}

/* ── mount + stage ───────────────────────────────────────────────────────── */

.ioc-sl {
  position: relative;
  overflow: hidden;
  background: var(--ioc-sl-surface, #ffffff);
  /* Horizontal swipe is ours; a vertical drag must still scroll the page. */
  touch-action: pan-y;

  /* TIMELINE DEFAULTS — the same values as TL_DEFAULTS in layouts.ts.
     `renderSliderMarkup` inlines the document's resolved values on this
     element, and an inline style beats a class selector, so these are the
     floor rather than the norm.

     Declaring them here is not redundancy. It buys three things:
       1. The appearance gate can see them. A var() consumed but declared
          nowhere is invalid at computed-value time (T16 ②c), and the gate is
          right to refuse it — the inline style is not something it can read.
       2. The runtime reads --hold and --depth through getComputedStyle. With
          no declaration and no inline style it would get an empty string and
          fall back to a magic number in JS instead of the shared source.
       3. If a strict nonce-based CSP ever blocks the inline style attribute
          (deployment plan §J1), the slider degrades to correct default motion
          rather than to no motion at all. */
  --enter: 620ms;
  --exit: 420ms;
  --kd: 1;
  --line-dur: 780ms;
  --line-lead: 180ms;
  --lift-dur: 640ms;
  --lift-lead: 260ms;
  --unveil-dur: 900ms;
  --unveil-lead: 200ms;
  --data-lead: 420ms;
  --hold: 6200ms;
  --depth: 12px;
  --ease-in: cubic-bezier(0.22, 1, 0.36, 1);
  /* Per-item stagger index; the markup sets a real one on each staggered
     child, so this is only the floor for an item that carries none. */
  --i: 0;
}

.ioc-sl-stage {
  position: relative;
  display: grid;
  /* Every slide occupies the same cell, so the stage height is the tallest
     slide and nothing reflows when the active one changes. */
  grid-template-areas: 'slide';
  min-height: 34rem;
}

.ioc-sl-slide {
  grid-area: slide;
  position: relative;
  display: grid;
  gap: 3rem;
  align-items: center;
  padding: 4.75rem 4rem 6rem;
  color: var(--ioc-sl-text, #161616);
  background: var(--ioc-sl-surface, #ffffff);
}

.ioc-sl-slide[hidden] {
  display: none;
}

.ioc-sl-slide--dark {
  color: var(--ioc-sl-on-color, #ffffff);
  background: var(--ioc-sl-surface-dark, #1c1c1c);
}

.ioc-sl-slide--dark .ioc-sl-sub,
.ioc-sl-slide--dark .ioc-sl-stat-l {
  color: var(--ioc-sl-on-inverse-muted, #c6c6c6);
}

/* ── typography ──────────────────────────────────────────────────────────── */

.ioc-sl-kicker {
  margin: 0 0 1.125rem;
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ioc-sl-accent, #0001ff);
}

.ioc-sl-headline {
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -0.03em;
}

.ioc-sl-sub {
  margin: 0 0 1.5rem;
  max-width: 46ch;
  font-size: 1.0625rem;
  line-height: 1.55;
  color: var(--ioc-sl-text-2, #525252);
}

.ioc-sl-quote {
  margin: 0 0 1.25rem;
  padding-left: 1.25rem;
  border-left: 3px solid var(--ioc-sl-accent, #0001ff);
  font-size: 1.1875rem;
  line-height: 1.5;
  font-weight: 500;
  max-width: 40rem;
}

/* ── CTAs ────────────────────────────────────────────────────────────────── */

.ioc-sl-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0 0 1.5rem;
}

.ioc-sl-cta {
  display: inline-flex;
  align-items: center;
  height: 3rem;
  padding: 0 1.375rem;
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  /* Radius 0 everywhere (CMS-D-066). */
  border-radius: 0;
  transition: background 0.16s ease-out, color 0.16s ease-out;
}

.ioc-sl-cta--primary {
  background: var(--ioc-sl-accent, #0001ff);
  color: var(--ioc-sl-on-color, #ffffff);
}
.ioc-sl-cta--primary:hover {
  background: var(--ioc-sl-accent-hover, #0000c4);
}

.ioc-sl-cta--secondary {
  border: 1px solid currentColor;
  color: inherit;
}

.ioc-sl-cta:focus-visible,
.ioc-sl-dot:focus-visible {
  outline: 2px solid var(--ioc-sl-accent, #0001ff);
  outline-offset: 2px;
}

.ioc-sl-slide--dark .ioc-sl-cta:focus-visible,
.ioc-sl-slide--dark .ioc-sl-dot:focus-visible {
  outline-color: var(--ioc-sl-border-on-color, #ffffff);
}

/* ── stats ───────────────────────────────────────────────────────────────── */

.ioc-sl-stats {
  display: flex;
  gap: 2rem;
}

.ioc-sl-stat {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.ioc-sl-stat-v {
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ioc-sl-accent, #0001ff);
}

.ioc-sl-stat-l {
  font-size: 0.8125rem;
  color: var(--ioc-sl-text-2, #525252);
}

/* ── layout: 01-split ────────────────────────────────────────────────────── */

.ioc-sl-slide[data-layout='01-split'] {
  grid-template-columns: 1fr 1.02fr;
}

.ioc-sl-figure {
  margin: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid var(--ioc-sl-border, #e0e0e0);
}

.ioc-sl-figure img,
.ioc-sl-bleed img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── layout: 03-media ────────────────────────────────────────────────────── */

.ioc-sl-slide[data-layout='03-media'] {
  padding: 0;
  grid-template-columns: 1fr;
}

.ioc-sl-bleed {
  position: absolute;
  inset: 0;
}

.ioc-sl-scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
  /* A left-weighted scrim so overlay text keeps AA contrast over any image. */
  background: linear-gradient(
    90deg,
    var(--ioc-sl-surface-dark, #1c1c1c) 0%,
    transparent 68%
  );
  opacity: 0.86;
}

.ioc-sl-overlay {
  position: relative;
  max-width: 44rem;
  padding: 4.75rem 4rem 6rem;
}

/* ── nav dots ────────────────────────────────────────────────────────────── */

.ioc-sl-nav {
  display: flex;
  gap: 0.25rem;
  padding: 0.75rem 4rem 1.25rem;
  background: var(--ioc-sl-surface-cool, #f2f4f8);
  overflow-x: auto;
}

.ioc-sl-dot {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  height: 1.75rem;
  padding: 0 0.625rem;
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.6875rem;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 0;
  color: var(--ioc-sl-text-2, #525252);
  background: transparent;
  border: 1px solid transparent;
  transition: background 0.16s ease-out, color 0.16s ease-out;
}

.ioc-sl-dot:hover {
  border-color: var(--ioc-sl-border, #e0e0e0);
}

.ioc-sl-dot[aria-current='true'] {
  background: var(--ioc-sl-accent, #0001ff);
  color: var(--ioc-sl-on-color, #ffffff);
}

.ioc-sl-dot-name {
  /* Inherits the site body family — a slider never re-declares one. */
  font-size: 0.75rem;
}

/* ── entrance choreography ───────────────────────────────────────────────
   Durations and easing come from the custom properties resolveMotion inlined
   on the mount. `--kd` is the unitless stagger multiplier; `--i` is the item
   index the markup sets on each staggered child. */

.ioc-sl-slide[data-state='active'] [data-anim] {
  animation-duration: var(--lift-dur, 640ms);
  animation-timing-function: var(--ease-in, cubic-bezier(0.22, 1, 0.36, 1));
  animation-fill-mode: both;
}

.ioc-sl-slide[data-state='active'] [data-anim='lift'] {
  animation-name: iocSlLift;
  animation-delay: calc(var(--lift-lead, 260ms) * var(--kd, 1));
}

.ioc-sl-slide[data-state='active'] [data-anim='line'] {
  animation-name: iocSlLine;
  animation-duration: var(--line-dur, 780ms);
  animation-delay: calc(var(--line-lead, 180ms) * var(--kd, 1));
}

.ioc-sl-slide[data-state='active'] [data-anim='unveil'] {
  animation-name: iocSlUnveil;
  animation-duration: var(--unveil-dur, 900ms);
  animation-delay: calc(var(--unveil-lead, 200ms) * var(--kd, 1));
}

.ioc-sl-slide[data-state='active'] [data-anim='pop'] {
  animation-name: iocSlPop;
  animation-delay: calc((var(--data-lead, 420ms) + (var(--i, 0) * 60ms)) * var(--kd, 1));
}

@keyframes iocSlLift {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes iocSlLine {
  from {
    opacity: 0;
    transform: translateY(26px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes iocSlUnveil {
  from {
    opacity: 0;
    clip-path: inset(0 0 100% 0);
  }
  to {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
}

@keyframes iocSlPop {
  from {
    opacity: 0;
    transform: scale(0.94);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* ── slide transitions ───────────────────────────────────────────────────
   One rule per fx the register can emit (`FX` in layouts.ts). The entering
   slide animates over --enter; the leaving one over --exit. */

.ioc-sl-slide[data-state='active'] {
  animation-duration: var(--enter, 620ms);
  animation-timing-function: var(--ease-in, cubic-bezier(0.22, 1, 0.36, 1));
  animation-fill-mode: both;
}

.ioc-sl-slide[data-state='leaving'] {
  animation-duration: var(--exit, 420ms);
  animation-timing-function: var(--ease-in, cubic-bezier(0.22, 1, 0.36, 1));
  animation-fill-mode: both;
  /* The leaving slide must not swallow clicks meant for the entering one. */
  pointer-events: none;
}

.ioc-sl-slide[data-fx='shutter'][data-state='active'] {
  animation-name: iocSlShutterIn;
}
.ioc-sl-slide[data-fx='shutter'][data-state='leaving'] {
  animation-name: iocSlShutterOut;
}

.ioc-sl-slide[data-fx='rise'][data-state='active'] {
  animation-name: iocSlRiseIn;
}
.ioc-sl-slide[data-fx='rise'][data-state='leaving'] {
  animation-name: iocSlFadeOut;
}

.ioc-sl-slide[data-fx='split'][data-state='active'] {
  animation-name: iocSlSplitIn;
}
.ioc-sl-slide[data-fx='split'][data-state='leaving'] {
  animation-name: iocSlFadeOut;
}

.ioc-sl-slide[data-fx='fade'][data-state='active'] {
  animation-name: iocSlFadeIn;
}
.ioc-sl-slide[data-fx='fade'][data-state='leaving'] {
  animation-name: iocSlFadeOut;
}

.ioc-sl-slide[data-fx='zoom'][data-state='active'] {
  animation-name: iocSlZoomIn;
}
.ioc-sl-slide[data-fx='zoom'][data-state='leaving'] {
  animation-name: iocSlZoomOut;
}

@keyframes iocSlShutterIn {
  from {
    clip-path: inset(0 0 0 100%);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes iocSlShutterOut {
  from {
    clip-path: inset(0 0 0 0);
  }
  to {
    clip-path: inset(0 100% 0 0);
  }
}
@keyframes iocSlRiseIn {
  from {
    opacity: 0;
    transform: translateY(4%);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes iocSlSplitIn {
  from {
    clip-path: inset(50% 0 50% 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes iocSlFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes iocSlFadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes iocSlZoomIn {
  from {
    opacity: 0;
    transform: scale(1.06);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes iocSlZoomOut {
  from {
    opacity: 1;
    transform: scale(0.98);
  }
  to {
    opacity: 0;
    transform: scale(0.98);
  }
}

/* ── responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 60rem) {
  .ioc-sl-slide {
    padding: 3rem 1.5rem 4rem;
  }
  .ioc-sl-slide[data-layout='01-split'] {
    grid-template-columns: 1fr;
  }
  .ioc-sl-overlay {
    padding: 3rem 1.5rem 4rem;
  }
  .ioc-sl-nav {
    padding: 0.75rem 1.5rem 1rem;
  }
  .ioc-sl-stage {
    min-height: 28rem;
  }
}

@media (max-width: 30rem) {
  .ioc-sl-stats {
    flex-wrap: wrap;
    gap: 1.25rem;
  }
  .ioc-sl-dot-name {
    display: none;
  }
}

/* ── reduced motion ──────────────────────────────────────────────────────
   Not a softening — a kill. Every entrance, transition and ambient drift is
   removed, and the runtime independently disables autoplay and parallax. The
   preference is honoured in three layers because it is easy to claim and hard
   to notice broken. */

@media (prefers-reduced-motion: reduce) {
  .ioc-sl *,
  .ioc-sl-slide,
  .ioc-sl-slide [data-anim] {
    animation: none !important;
    transition: none !important;
  }
  .ioc-sl [data-ambient='drift'] {
    transform: none !important;
  }
}

/* ── layouts 02, 04-15 ───────────────────────────────────────────────────
   One block per layout, in register order. Every colour is a var() with its
   token's literal as the fallback; the ceiling is 0 and the gate enforces it. */

/* 02-statement — centred, four-up stats */
.ioc-sl-slide[data-layout='02-statement'] {
  justify-items: center;
  text-align: center;
}
.ioc-sl-centre {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 60rem;
}
.ioc-sl-stats--quad {
  gap: 3rem;
  justify-content: center;
  flex-wrap: wrap;
}

/* 04-showcase — media + composed preview */
.ioc-sl-slide[data-layout='04-showcase'] {
  grid-template-columns: 0.9fr 1.1fr;
}
.ioc-sl-figure--wide {
  aspect-ratio: 16 / 10;
}

/* 05-convert — copy + governed form mount */
.ioc-sl-slide[data-layout='05-convert'] {
  grid-template-columns: 1fr 0.92fr;
}
.ioc-sl-bullets {
  margin: 0 0 1.5rem;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.75rem;
}
.ioc-sl-bullet {
  padding-left: 1.25rem;
  border-left: 2px solid var(--ioc-sl-accent, #0001ff);
  font-size: 0.9375rem;
}
.ioc-sl-col--form {
  padding: 1.5rem;
  background: var(--ioc-sl-surface, #ffffff);
  border: 1px solid var(--ioc-sl-border, #e0e0e0);
  border-top: 3px solid var(--ioc-sl-accent, #0001ff);
}

/* 06-features — capability grid */
.ioc-sl-slide[data-layout='06-features'] {
  grid-template-columns: 0.86fr 1.14fr;
}
.ioc-sl-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 1px;
  background: var(--ioc-sl-border, #e0e0e0);
  border: 1px solid var(--ioc-sl-border, #e0e0e0);
}
.ioc-sl-card {
  padding: 1.125rem;
  background: var(--ioc-sl-surface, #ffffff);
}
.ioc-sl-card-n {
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.6875rem;
  color: var(--ioc-sl-accent, #0001ff);
}
.ioc-sl-card-t {
  margin: 0.5rem 0 0.25rem;
  font-size: 1.0625rem;
  font-weight: 600;
}
.ioc-sl-card-b {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ioc-sl-text-2, #525252);
}

/* 07-results — KPI evidence */
.ioc-sl-slide[data-layout='07-results'] {
  grid-template-columns: 0.82fr 1.18fr;
}
.ioc-sl-stats--kpi {
  flex-wrap: wrap;
  gap: 2rem 3rem;
  margin-bottom: 1.5rem;
}

/* Composed decoration — deterministic bars, never authored data. */
.ioc-sl-chart {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 7.5rem;
}
.ioc-sl-bar {
  flex: 1;
  /* The markup sets a real per-bar height inline; this is the floor for a bar
     that carries none, and it is what lets the gate see the property declared
     (T16 ②c) rather than consumed out of nowhere. */
  --h: 50%;
  height: var(--h, 50%);
  background: var(--ioc-sl-accent, #0001ff);
  opacity: 0.7;
}
.ioc-sl-slide--dark .ioc-sl-bar {
  background: var(--ioc-sl-on-color, #ffffff);
  opacity: 0.5;
}

/* 08-story — case study */
.ioc-sl-slide[data-layout='08-story'] {
  grid-template-columns: 0.8fr 1.2fr;
}
.ioc-sl-attrib {
  margin: 0 0 1.5rem;
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  color: var(--ioc-sl-text-2, #525252);
}

/* 09-journey — process timeline */
.ioc-sl-slide[data-layout='09-journey'] {
  grid-template-columns: 1fr;
  align-content: center;
}
.ioc-sl-head {
  max-width: 46rem;
}
.ioc-sl-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: 1.5rem;
  margin: 0 0 2rem;
  padding: 1.5rem 0 0;
  list-style: none;
  border-top: 2px solid var(--ioc-sl-accent, #0001ff);
}
.ioc-sl-step {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.ioc-sl-step-n {
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.6875rem;
  color: var(--ioc-sl-accent, #0001ff);
}
.ioc-sl-step-t {
  font-size: 0.9375rem;
  font-weight: 600;
}

/* 10-collection + 15-careers — adapter-resolved query mounts. Empty until the
   host adapter fills them: an empty region is honest, invented rows are not. */
.ioc-sl-slide[data-layout='10-collection'],
.ioc-sl-slide[data-layout='15-careers'] {
  grid-template-columns: 0.9fr 1.1fr;
}
.ioc-sl-collection,
.ioc-sl-roles {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  min-height: 12rem;
  background: var(--ioc-sl-border, #e0e0e0);
}

/* 11-compare — before / after */
.ioc-sl-slide[data-layout='11-compare'] {
  grid-template-columns: 1fr;
  align-content: center;
}
.ioc-sl-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}
.ioc-sl-panel {
  margin: 0;
  border: 1px solid var(--ioc-sl-border, #e0e0e0);
}
.ioc-sl-panel img {
  width: 100%;
  display: block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.ioc-sl-panel-l {
  padding: 0.625rem 0.875rem;
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.6875rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.ioc-sl-panel--after .ioc-sl-panel-l {
  background: var(--ioc-sl-accent, #0001ff);
  color: var(--ioc-sl-on-color, #ffffff);
}
.ioc-sl-stats--delta {
  gap: 2.5rem;
}

/* 12-video */
.ioc-sl-slide[data-layout='12-video'] {
  padding: 0;
  grid-template-columns: 1fr;
  align-items: end;
}
.ioc-sl-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ioc-sl-duration {
  margin: 0 0 1rem;
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
}

/* 13-proof-wall */
.ioc-sl-slide[data-layout='13-proof-wall'] {
  justify-items: center;
  text-align: center;
}
.ioc-sl-logos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
  gap: 2rem;
  align-items: center;
  margin: 0 0 2rem;
  width: 100%;
  max-width: 56rem;
}
.ioc-sl-logo img {
  max-width: 100%;
  height: 1.75rem;
  object-fit: contain;
  /* Mono-tone by contract (the register says mono-tone SVG wordmarks); the
     filter guarantees it even if an editor uploads a colour mark. */
  filter: grayscale(1);
  opacity: 0.75;
}

/* 14-announce */
.ioc-sl-slide[data-layout='14-announce'] {
  grid-template-columns: 1.15fr 0.85fr;
}
.ioc-sl-venue {
  margin: 0 0 1.5rem;
  font-size: 0.9375rem;
  color: var(--ioc-sl-on-inverse-muted, #c6c6c6);
}
.ioc-sl-when {
  display: block;
  font-family: var(--ioc-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: clamp(1.75rem, 3vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ioc-sl-accent, #0001ff);
}

/* 15-careers mosaic */
.ioc-sl-mosaic {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.ioc-sl-tile img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
}

/* ── inert-preview note (LOCKED CMS-D-106) ───────────────────────────────────
   The runtime mints this when a preview form is submitted; the copy is the
   decision's exact sentence, so it must read as a deliberate answer, not an
   unstyled default paragraph. */
.ioc-form-inert {
  margin: 0.75rem 0 0;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--ioc-sl-border, #e0e0e0);
  border-left: 3px solid var(--ioc-sl-accent);
  color: var(--ioc-sl-text-2);
  font-size: 0.8125rem;
  line-height: 1.4;
}

/* ── responsive, layouts 02-15 ───────────────────────────────────────────── */

@media (max-width: 60rem) {
  .ioc-sl-slide[data-layout='02-statement'],
  .ioc-sl-slide[data-layout='04-showcase'],
  .ioc-sl-slide[data-layout='05-convert'],
  .ioc-sl-slide[data-layout='06-features'],
  .ioc-sl-slide[data-layout='07-results'],
  .ioc-sl-slide[data-layout='08-story'],
  .ioc-sl-slide[data-layout='10-collection'],
  .ioc-sl-slide[data-layout='14-announce'],
  .ioc-sl-slide[data-layout='15-careers'] {
    grid-template-columns: 1fr;
  }
  .ioc-sl-compare {
    grid-template-columns: 1fr;
  }
  .ioc-sl-stats--quad {
    gap: 1.5rem;
  }
}

/* www.infoc.one — the authored skin (CMS-D-215). The ONLY file
 * `pnpm gate:ione-scale` (T23) grades: never the generated concat, which also
 * carries the kit, forms and slider sheets this site does not own.
 *
 * Ships LAST in site-infoc-one.css, so position is the specificity tiebreak
 * against kit quirks — the same rule site.css and site-infoc-ai.css follow.
 *
 * The system is `sites/infoc.one/design/DESIGN.md`. Eight type steps, four
 * line-height ratios, three letter-spacing ratios, four radius steps, and the
 * HOUSE space scale (a site-local scale is rejected for the CMS-D-214 ③
 * reason: it would make 12px, the most used value here, "off-scale" against a
 * rule no other file in the repo follows). */

/* Figtree, SIL OFL 1.1 — the licence text ships beside the files in
 * ./fonts/OFL.txt, which is what permits redistributing them at all.
 * Self-hosted and subset in-repo (latin 18.2 KB, latin-ext 8.6 KB): S4 refuses
 * a font CDN, so these bytes are committed and never fetched at runtime.
 * Variable wght 300–900 on both subsets, so one file covers every weight the
 * system uses. ONE family — module codes and figures ride `tabular-nums` plus
 * the tracking step, never a second webfont. */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url('/infoc-one-cms/fonts/figtree-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url('/infoc-one-cms/fonts/figtree-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
    U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* CMS-D-215 / 00-wiringsite: Inter carries UI and body copy. Self-hosted —
   the pack loads it from a font CDN, which S4 refuses. Two axes,
   read from the binaries rather than trusted from the CDN CSS:
   opsz 14-32 (the pack sets `font-optical-sizing: auto`, so it is live) and
   wght 100-900. Keeping opsz costs 24,664 B over a wght-only cut; it is kept
   because dropping it changes rendering at the pack’s display sizes. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/infoc-one-cms/fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/infoc-one-cms/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
    U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
    U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
    U+A720-A7FF;
}

:root {
  /* ── Families: Figtree for display, Inter for UI and body copy.
     JetBrains Mono comes from the app shell (fonts.css aliases it to the
     self-hosted infoc-mono binary, wght 400-800) — nothing to ship here. ── */
  --ione-sans: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* ── EIGHT type steps ──────────────────────────────────────────────── */
  --ione-t-micro: 12px;
  --ione-t-small: 14px;
  --ione-t-body: 16px;
  --ione-t-lead: 18px;
  --ione-t-h3: 22px;
  --ione-t-h2: 30px;
  --ione-t-h1: 40px;
  --ione-t-display: clamp(44px, 6vw, 88px);

  /* ── FOUR line-height ratios. Graded as RATIOS, never as computed px:
   *    four ratios across eight sizes legitimately produce many px values,
   *    and counting those would measure the system working (CMS-D-214 ⑥). ── */
  --ione-lh-display: 1.1;
  --ione-lh-tight: 1.25;
  --ione-lh-ui: 1.5;
  --ione-lh-prose: 1.65;

  /* ── THREE letter-spacing ratios. Same rule, and the reason is sharper
   *    here: -0.02em is a different pixel amount at every size, so these
   *    three resolved to SIX computed values on the approved preview. ────── */
  --ione-ls-tight: -0.02em;
  --ione-ls-none: 0;
  --ione-ls-track: 0.06em;

  /* ── FOUR radius steps. Size follows surface: the bigger the surface, the
   *    softer the corner. Nothing is square, nothing is rounder than its
   *    container. 999px is reserved for pills. ──────────────────────────── */
  --ione-r-sm: 8px;
  --ione-r-md: 12px;
  --ione-r-lg: 18px;
  --ione-r-pill: 999px;

  /* ── Colour. Every value solved against the ground it sits on, not picked.
   *    Contrast on --ione-cream: ink 13.4:1 · muted 5.55:1 · meta 4.94:1 ·
   *    accent 7.61:1 (AAA), and 8.04:1 for white on the accent fill.
   *    No blue: all four measured competitor accents are blue, which is why
   *    the live site's #0f44d7 read as nothing. ─────────────────────────── */
  --ione-cream: #faf9f1;
  --ione-card: #fffdf7;
  --ione-ink: #2e2b21;
  --ione-muted: #6b6455;
  --ione-meta: #736c5c;
  --ione-accent: #0a5c3e;
  --ione-accent-hover: #084a32;
  --ione-hairline: #e4dfd2;
  --ione-glow: rgba(10, 92, 62, 0.1);

  /* ── Motion. A ledger does not bounce. ─────────────────────────────────── */
  --ione-dur-micro: 120ms;
  --ione-dur-short: 200ms;
  --ione-dur-medium: 320ms;

  /* ── Layout ───────────────────────────────────────────────────────────── */
  --ione-wrap: 1280px;
}

/* ══════════════════════════════════════════════════════════════════════════
 * BASE. The site wrapper is `.ione`; everything below is scoped under it so
 * this sheet can load alongside the kit without reaching the admin or a
 * sibling site.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione {
  background: var(--ione-cream);
  color: var(--ione-ink);
  font-family: var(--ione-sans);
  font-size: var(--ione-t-body);
  line-height: var(--ione-lh-prose);
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}

.ione-wrap {
  max-width: var(--ione-wrap);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}

/* 32/32, so two abutting sections sit the documented 64px apart (DESIGN.md
 * §Spacing, "section rhythm 64px"). Measured before: 64/64 put 128px of flat
 * cream between every pair of sections on the home — and every gap on the page
 * was the same one, because the head-to-content gap was 24px and the section
 * gap was the only other value. The void read as the composition. */
.ione-section {
  padding-top: 32px;
  padding-bottom: 32px;
}

/* ══════════════════════════════════════════════════════════════════════════
 * TYPE. Eight steps, four line-height ratios, three tracking ratios.
 * Headings centre; body copy does not. The reference's own measured split is
 * 203 start-aligned text nodes to 21 centred, and that is the rule here too.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-display {
  font-family: var(--ione-sans);
  font-size: var(--ione-t-display);
  line-height: var(--ione-lh-display);
  letter-spacing: var(--ione-ls-tight);
  font-weight: 600;
  margin-top: 24px;
  margin-bottom: 16px;
}

.ione-h1 {
  font-family: var(--ione-sans);
  font-size: var(--ione-t-h1);
  line-height: var(--ione-lh-tight);
  letter-spacing: var(--ione-ls-tight);
  font-weight: 600;
}

.ione-h2 {
  font-family: var(--ione-sans);
  font-size: var(--ione-t-h2);
  line-height: var(--ione-lh-tight);
  letter-spacing: var(--ione-ls-tight);
  font-weight: 600;
}

.ione-h3 {
  font-family: var(--ione-sans);
  font-size: var(--ione-t-h3);
  line-height: var(--ione-lh-tight);
  letter-spacing: var(--ione-ls-none);
  font-weight: 600;
}

/* A measure, not a column. Measured before: the home's problem statement ran
 * 141 characters on ONE line, corner to corner of the 1232px wrap — at 18px
 * that reads as a ruled line, not a sentence. The 62ch cap existed, but only
 * inside `.ione-hero` and `.ione-band`, so every section lede escaped it.
 * `max-width` only ever narrows: a lede already inside a split column or a
 * card is unaffected. */
.ione-lead {
  font-size: var(--ione-t-lead);
  line-height: var(--ione-lh-prose);
  color: var(--ione-muted);
  max-width: 62ch;
}

.ione-small {
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  color: var(--ione-muted);
}

.ione-eyebrow {
  font-size: var(--ione-t-micro);
  line-height: var(--ione-lh-ui);
  letter-spacing: var(--ione-ls-track);
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ione-meta);
}

/* The accent word inside a display headline. One per page. */
.ione-em {
  font-style: normal;
  color: var(--ione-accent);
}

/* ══════════════════════════════════════════════════════════════════════════
 * BENTO. A 12-column grid of hairline cards on the warm ground.
 * THE DOMINANT-CELL RULE (CMS-D-215 ④): every bento section carries exactly
 * ONE `.ione-cell--lead`. A bento of equal cells is just a grid, and an equal
 * grid of seven is precisely what this site must not build — seven tiles are
 * a picture of seven things sitting under a claim about one.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 16px;
}

.ione-cell {
  grid-column: span 12;
  background: var(--ione-card);
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-lg);
  padding: 32px;
  transition: border-color var(--ione-dur-micro) ease-out;
}

.ione-cell:hover {
  border-color: var(--ione-accent);
}

/* The one cell that dominates. Flush, so a table can meet its edges. */
.ione-cell--lead {
  padding: 0;
  overflow: hidden;
}

.ione-cell__head {
  padding: 32px 32px 16px;
}

.ione-cell__head p {
  margin-top: 8px;
}

.ione-cell-4,
.ione-cell-5,
.ione-cell-6,
.ione-cell-7,
.ione-cell-8 {
  grid-column: span 12;
}

@media (min-width: 900px) {
  .ione-cell-4 { grid-column: span 4; }
  .ione-cell-5 { grid-column: span 5; }
  .ione-cell-6 { grid-column: span 6; }
  .ione-cell-7 { grid-column: span 7; }
  .ione-cell-8 { grid-column: span 8; }
}

/* ══════════════════════════════════════════════════════════════════════════
 * THE LEDGER. One surface, modules as ROWS. Never tiles.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-ledger {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
}

.ione-ledger th {
  text-align: left;
  padding: 12px 32px;
  font-size: var(--ione-t-micro);
  letter-spacing: var(--ione-ls-track);
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ione-meta);
  border-top: 1px solid var(--ione-hairline);
  border-bottom: 1px solid var(--ione-hairline);
  white-space: nowrap;
}

.ione-ledger td {
  padding: 12px 32px;
  border-bottom: 1px solid var(--ione-hairline);
  vertical-align: middle;
}

.ione-ledger tr:last-child td {
  border-bottom: 0;
}

.ione-ledger tbody tr {
  transition: background-color var(--ione-dur-micro) ease-out;
}

.ione-ledger tbody tr:hover {
  background: var(--ione-glow);
}

.ione-ledger__code {
  font-weight: 700;
  letter-spacing: var(--ione-ls-track);
  color: var(--ione-accent);
  font-size: var(--ione-t-micro);
  white-space: nowrap;
}

.ione-ledger__name { font-weight: 600; }
.ione-ledger__desc { color: var(--ione-muted); }
.ione-ledger__stat { text-align: right; white-space: nowrap; }

/* The row's name is its link (W7). Underlined on the accent so a link in a
 * table is a link without hover; an unlinked row's anchor collapses.
 * `body[class]` for the same reason as the token bridge below: the kit's
 * `body.ioc-site a { color: inherit; text-decoration: none }` sits at
 * (0,1,1) and beat a bare class — measured: the first cut rendered every
 * row name in ink with no underline, indistinguishable from plain text. */
body[class] .ione-ledger__link {
  color: var(--ione-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

body[class] .ione-ledger__link:hover {
  color: var(--ione-accent-hover);
}

body[class] .ione-ledger__link[href=""] {
  color: inherit;
  text-decoration: none;
  pointer-events: none;
}

/* ── THE SUITE LEDGER IS A SHOWCASE, NOT A DATA TABLE ──────────────────────
 * `--ione-t-small` is the right size for a table cell and the wrong size for
 * the sentence this whole site is built on. Measured before: "Eight apps. One
 * ledger." — the page's own claim — set its eight module names in the smallest
 * running text on the home page, under a 12px header, so the eye landed on the
 * row rules instead of the names.
 *
 * `:not(--calendar)` is exact rather than a guess: `ledger()` in pages.ts
 * DEFAULTS to B-12-V81, the calendar, and the suite is the single call site
 * that passes B-12-V80. One table on the site matches this, and the compliance
 * calendars keep 14px because they really are data.
 *
 * The underline stays. Accent green against warm ink does not clear 3:1, so
 * colour alone would leave these links undistinguished (WCAG 1.4.1). */
.ione-ledger:not(.ione-ledger--calendar) td {
  padding-top: 16px;
  padding-bottom: 16px;
}

.ione-ledger:not(.ione-ledger--calendar) .ione-ledger__name {
  font-size: var(--ione-t-h3);
  line-height: var(--ione-lh-tight);
}

.ione-ledger:not(.ione-ledger--calendar) .ione-ledger__desc {
  font-size: var(--ione-t-body);
  line-height: var(--ione-lh-ui);
}

/* ══════════════════════════════════════════════════════════════════════════
 * STATS
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
}

.ione-stat {
  background: var(--ione-card);
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-lg);
  padding: 24px;
  text-align: center;
}

.ione-stat__value {
  display: block;
  font-size: var(--ione-t-h1);
  line-height: var(--ione-lh-display);
  letter-spacing: var(--ione-ls-tight);
  font-weight: 700;
}

.ione-stat__value--accent {
  color: var(--ione-accent);
}

/* Sentence case, no tracking. DESIGN.md reserves uppercase + the tracking step
 * for "eyebrows and module codes"; a stat caption is neither. Measured before:
 * 12px uppercase tracked labels broke over three lines in a 144px column and
 * read LOUDER than the 40px numbers they were captioning, because there was
 * simply more of them. The source copy is already sentence case
 * ("Years engineering for Singapore SMEs"), so nothing here changes a word. */
.ione-stat__label {
  display: block;
  margin-top: 8px;
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  letter-spacing: var(--ione-ls-none);
  font-weight: 500;
  color: var(--ione-muted);
}

/* ══════════════════════════════════════════════════════════════════════════
 * CONTROLS. Radius follows surface: 8 inputs, 12 buttons, pill chips.
 * Motion on a control is a colour move only — no lift, no shadow, no scale.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione a.ione-btn,
.ione button.ione-btn {
  display: inline-block;
  border: 1px solid var(--ione-accent);
  border-radius: var(--ione-r-md);
  background: var(--ione-accent);
  color: var(--ione-card);
  padding: 12px 24px;
  font-family: var(--ione-sans);
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color var(--ione-dur-micro) ease-out,
    border-color var(--ione-dur-micro) ease-out,
    color var(--ione-dur-micro) ease-out;
}

.ione a.ione-btn:hover,
.ione button.ione-btn:hover {
  background: var(--ione-accent-hover);
  border-color: var(--ione-accent-hover);
}

.ione a.ione-btn--ghost,
.ione button.ione-btn--ghost {
  background: var(--ione-card);
  color: var(--ione-ink);
  border-color: var(--ione-hairline);
}

.ione a.ione-btn--ghost:hover,
.ione button.ione-btn--ghost:hover {
  background: var(--ione-card);
  border-color: var(--ione-accent);
  color: var(--ione-accent);
}

.ione-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-pill);
  background: var(--ione-card);
  padding: 4px 12px;
  font-size: var(--ione-t-micro);
  line-height: var(--ione-lh-ui);
  font-weight: 600;
  color: var(--ione-meta);
  white-space: nowrap;
}

/* Status is icon + WORD, never colour alone. Green is this site's brand
 * accent, so it cannot also carry state (WCAG 1.4.1, and the four-jobs rule
 * already required it). The tick is the icon half. */
.ione-chip--on {
  color: var(--ione-accent);
  border-color: var(--ione-accent);
}

.ione-chip--on::before {
  content: "\2713";
}

.ione-field {
  display: block;
  margin-bottom: 16px;
}

.ione-field label {
  display: block;
  font-size: var(--ione-t-micro);
  line-height: var(--ione-lh-ui);
  letter-spacing: var(--ione-ls-track);
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ione-meta);
  margin-bottom: 8px;
}

.ione-field input,
.ione-field select,
.ione-field textarea {
  width: 100%;
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-sm);
  background: var(--ione-cream);
  color: var(--ione-ink);
  font-family: var(--ione-sans);
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  padding: 12px;
}

.ione-field input:focus,
.ione-field select:focus,
.ione-field textarea:focus {
  outline: 2px solid var(--ione-accent);
  outline-offset: 1px;
  border-color: var(--ione-accent);
}

/* ══════════════════════════════════════════════════════════════════════════
 * HERO. Centred display over a STATIC radial glow. The glow never pulses,
 * drifts, or follows the cursor.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-hero {
  position: relative;
  overflow: hidden;
  padding-top: 64px;
  padding-bottom: 48px;
  text-align: center;
}

.ione-hero::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -40%;
  width: 100%;
  height: 100%;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(closest-side, var(--ione-glow), transparent 72%);
  pointer-events: none;
}

.ione-hero > .ione-wrap {
  position: relative;
}

.ione-hero .ione-display {
  margin-left: auto;
  margin-right: auto;
}

.ione-hero .ione-lead {
  margin-left: auto;
  margin-right: auto;
  max-width: 62ch;
}

.ione-hero__cta {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 32px;
}

/* ══════════════════════════════════════════════════════════════════════════
 * CONTENT BLOCKS — prose, figure, band, logos, accordion, steps, timeline,
 * cards, people, related, compare. Everything rides the tokens and the house
 * space scale; T23 grades this file and stays at zero.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-prose {
  max-width: 68ch;
}

/* One body binding carries the whole prose (richtext has no collection lane
 * in the mapper); the seeder joins paragraphs with blank lines and pre-line
 * turns them back into visible breaks. */
.ione-prose__body {
  margin-top: 16px;
  color: var(--ione-muted);
  white-space: pre-line;
}

.ione-figure {
  margin: 0;
  background: var(--ione-card);
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-lg);
  overflow: hidden;
}

.ione-figure__img {
  display: block;
  width: 100%;
  height: auto;
}

.ione-figure__cap {
  padding: 12px 24px;
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  color: var(--ione-muted);
  border-top: 1px solid var(--ione-hairline);
}

/* The restrained close of a page: one centred card, never a dark poster. */
.ione-band {
  background: var(--ione-card);
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-lg);
  padding: 48px 32px;
  text-align: center;
}

.ione-band .ione-lead {
  margin-left: auto;
  margin-right: auto;
  max-width: 62ch;
}

.ione-logos {
  list-style: none;
  margin: 0;
  padding: 24px 32px 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.ione-logo {
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-md);
  padding: 12px 24px;
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  font-weight: 600;
  color: var(--ione-muted);
}

.ione-acc {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

@media (min-width: 900px) {
  .ione-acc {
    grid-template-columns: 1fr 2fr;
    gap: 48px;
  }
}

.ione-acc__head {
  align-self: start;
}

.ione-acc__items {
  display: grid;
  gap: 12px;
}

.ione-acc__item {
  background: var(--ione-card);
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-md);
  padding: 16px 24px;
}

.ione-acc__q {
  cursor: pointer;
  font-weight: 600;
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  list-style: none;
}

.ione-acc__q::-webkit-details-marker {
  display: none;
}

.ione-acc__q::after {
  content: '+';
  float: right;
  color: var(--ione-accent);
  font-weight: 700;
}

.ione-acc__item[open] .ione-acc__q::after {
  content: '\2212';
}

.ione-acc__a {
  margin-top: 12px;
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  color: var(--ione-muted);
}

.ione-steps,
.ione-timeline {
  list-style: none;
  margin: 32px 0 0;
  padding: 0;
  display: grid;
  gap: 16px;
}

.ione-step,
.ione-tl {
  display: flex;
  gap: 24px;
  align-items: baseline;
  background: var(--ione-card);
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-lg);
  padding: 24px 32px;
}

.ione-step__num,
.ione-tl__when {
  flex: none;
  min-width: 48px;
  font-weight: 700;
  letter-spacing: var(--ione-ls-track);
  color: var(--ione-accent);
  font-variant-numeric: tabular-nums;
}

.ione-bento__rest {
  display: contents;
}

.ione-cards .ione-cardlink,
.ione-people .ione-cell {
  min-height: 100%;
}

.ione-cardlink {
  display: block;
  text-decoration: none;
  color: inherit;
}

.ione-cardlink:hover .ione-h3 {
  color: var(--ione-accent);
}

.ione-related__list {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.ione-related__link {
  display: inline-block;
  border: 1px solid var(--ione-hairline);
  border-radius: var(--ione-r-pill);
  background: var(--ione-card);
  padding: 8px 16px;
  font-size: var(--ione-t-small);
  line-height: var(--ione-lh-ui);
  font-weight: 600;
  color: var(--ione-ink);
  text-decoration: none;
  transition: border-color var(--ione-dur-micro) ease-out, color var(--ione-dur-micro) ease-out;
}

.ione-related__link:hover {
  border-color: var(--ione-accent);
  color: var(--ione-accent);
}

.ione-compare__ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: 24px 32px 32px;
}

/* ══════════════════════════════════════════════════════════════════════════
 * SECTION VARIANTS (CMS-D-215, the section-faithful port). A tight section
 * is a follow-on to the block above it — a ledger under its cards, a FAQ
 * under its plans, a band under its figures — and halves the rhythm.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-section--tight {
  padding-top: 8px;
  padding-bottom: 32px;
}

/* A clause of a legal document: no section padding, one reading rhythm. */
.ione-doc {
  padding-top: 8px;
  padding-bottom: 24px;
}

.ione-doc .ione-prose__body {
  margin-top: 8px;
}

/* Unfilled slots collapse. A variant declares every slot a page MIGHT fill;
 * the page decides which it does. Buttons especially: an empty <a> is a
 * same-page link with no accessible name, which the L5 ratchet counts. */
.ione .ione-eyebrow:empty,
.ione .ione-lead:empty,
.ione .ione-small:empty,
.ione .ione-h2:empty,
.ione .ione-h3:empty,
.ione .ione-chip:empty,
.ione .ione-figure__cap:empty,
.ione .ione-card__meta:empty,
.ione .ione-band__body:empty,
.ione .ione-ledger th:empty,
.ione a.ione-btn:empty {
  display: none;
}

.ione .ione-card__badge:has(> .ione-chip:empty),
.ione .ione-card__cta:has(> a:empty),
.ione .ione-split__cta:has(> a:empty),
.ione .ione-hero__cta:has(> a:empty):not(:has(> a:not(:empty))),
.ione .ione-band__cta:has(> a:empty):not(:has(> a:not(:empty))),
.ione .ione-chips:not(:has(> .ione-chip:not(:empty))),
.ione .ione-ledger thead:not(:has(th:not(:empty))) {
  display: none;
}

.ione .ione-lead + .ione-hero__cta,
.ione .ione-h2 + .ione-lead,
.ione .ione-h2 + .ione-bento,
.ione .ione-lead + .ione-bento,
.ione .ione-lead + .ione-figures,
.ione .ione-h2 + .ione-figures,
.ione .ione-lead + .ione-stats,
.ione .ione-h2 + .ione-stats,
.ione .ione-lead + .ione-steps,
.ione .ione-h2 + .ione-steps {
  margin-top: 24px;
}

/* ── Hero with the product figure beneath the CTAs (B-01-V81) ─────────── */
.ione-hero--figure {
  padding-bottom: 64px;
}

.ione-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 24px;
}

/* The figure's edges ARE the page's edges. Measured before: a 960px cap inside
 * a 1232px wrap put the product screenshot's left edge at x=233 while every
 * card below it started at x=97, so the first thing under the headline aligned
 * with nothing that followed it. */
.ione-hero__figure {
  margin: 48px auto 0;
}

/* ── Static card grid (B-11-V81) ───────────────────────────────────────── */
.ione-cards--grid {
  align-items: stretch;
}

.ione-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 24px;
}

.ione-card .ione-h3 {
  margin: 0;
}

.ione-card__badge {
  margin: 0;
}

.ione-card__body {
  white-space: pre-line;
  flex: 1;
  margin: 0;
}

.ione-card__meta {
  margin: 0;
  font-size: var(--ione-t-micro);
  line-height: var(--ione-lh-ui);
  color: var(--ione-meta);
}

.ione-card__cta {
  margin: 8px 0 0;
}

/* ── Media split and figure row (B-05-V80 / V81) ───────────────────────── */
.ione-split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: center;
}

@media (min-width: 900px) {
  .ione-split {
    grid-template-columns: 5fr 7fr;
    gap: 48px;
  }
}

.ione-split__copy,
.ione-split__figure {
  align-self: center;
}

.ione-split__cta {
  margin-top: 24px;
}

.ione-figures {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

@media (min-width: 720px) {
  .ione-figures {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }
}

.ione-figures + .ione-split__cta {
  margin-top: 24px;
}

.ione-figure .infoc-media {
  display: block;
  width: 100%;
  height: auto;
}

/* ── Inline band (B-06-V81) ────────────────────────────────────────────── */
.ione-band--inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 32px;
  text-align: left;
}

.ione-band__copy {
  flex: 1 1 480px;
}

.ione-band__body {
  margin-top: 8px;
}

.ione-band__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
}

/* ── Pull quote (B-08-V80) ─────────────────────────────────────────────── */
.ione-quote {
  margin: 0;
  max-width: 68ch;
}

.ione-quote__text {
  margin: 0 0 12px;
  padding-left: 24px;
  border-left: 2px solid var(--ione-accent);
  font-size: var(--ione-t-h3);
  line-height: var(--ione-lh-tight);
  font-weight: 600;
}

/* ── Bare FAQ list (B-09-V81) ──────────────────────────────────────────── */
.ione-acc--list {
  max-width: 68ch;
}

/* ── Stat strip (B-02-V81): as many cards as the store carries ─────────── */
.ione-stats--strip {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

/* ── Calendar ledger (B-12-V81) ────────────────────────────────────────── */
.ione-ledger--calendar .ione-ledger__code {
  width: 1%;
}

/* ══════════════════════════════════════════════════════════════════════════
 * SHARED CHROME ON THIS SITE. The header, footer, consent dialog and focus
 * ring are shared kit chrome that read kit custom properties: the family
 * (`--ioc-sans`/`--ioc-mono`), the accent (`--ioc-blue`, the active nav
 * underline, the focus ring). This ONE rule moves all of them onto the
 * site's own tokens without a single shared selector — the skin contract
 * forbids any `.ioc-` class here. `body[class]` is the trick: the CMS-D-092
 * typography block declares the same properties on `body.ioc-site` at
 * (0,1,1), a bare `body` rule loses to it, and an attribute selector ties
 * it — and this sheet is linked AFTER that block, so the tie is ours.
 * Measured before: nav links, footer and consent buttons in Manrope, the
 * footer kicker in JetBrains Mono, CTA/active/focus in #0001ff on a
 * green-accent site. After: the ledger green everywhere, and the pack's own
 * two faces.
 *
 * TWO FACES, NOT ONE (F4). The 00-wiringsite pack is a two-face system and
 * states it in four lines: `--sans:'Inter',-apple-system,...` and
 * `--display:'Figtree Local','Figtree',var(--sans)` (site.css:37 and :39),
 * then `body{font-family:var(--sans)}` (site.css:53) against
 * `h1,h2,h3,h4,h5{font-family:var(--display)}` (site.css:63). Figtree is the
 * DISPLAY face here; body copy is Inter, and the pack's own comment on
 * site.css:38 says so in words.
 *
 * The pack-layer generator deletes class-free selectors on purpose
 * (build-pack-layer.mjs, SCOPE_KEEP keeps only `section` and `h1`-`h5`), so
 * the pack's `body` rule went out whole and took the body family with it. The
 * kit's own `body.ioc-site` was then the only sheet with an opinion, and this
 * bridge handed it `--ione-sans` — the SUPERSEDED warm-bento single-family
 * token — for the body as well as the headings.
 *
 * Measured on the rendered site before this fix, on all nine routes:
 * `getComputedStyle(document.body).fontFamily` was Figtree, every paragraph
 * with it, `--ione-w-sans` consumed by three `ione-w-atd` rules and nothing
 * else, and `document.fonts` reported the vendored Inter face `unloaded` on
 * eight of the nine — committed bytes no visitor ever fetched. After: body
 * Inter on all nine, Inter `loaded` on all nine, every h1-h4 still on the
 * pack's display stack and every h5 still JetBrains Mono.
 *
 * `--ioc-mono` is deliberately NOT moved with them. It still resolves to
 * Figtree where the pack states JetBrains Mono (site.css:36), on the two to
 * eight shared-chrome elements a page that read it — the optional-field
 * marker, the search head, the consent-dialog kicker. That is a different
 * finding on different surfaces and is left to the finding that owns it.
 * ═════════════════════════════════════════════════════════════════════════ */
body[class] {
  --ioc-sans: var(--ione-w-sans);
  /* ...and the mono face is the pack's own JetBrains Mono, not the display face.
     The bridge handed --ioc-mono the superseded single-family token with the
     other two; the pack states --mono:'JetBrains Mono',ui-monospace,monospace
     (site.css:38) and the face is already self-hosted and loaded. */
  --ioc-mono: var(--ione-w-mono);
  --ioc-blue: var(--ione-accent);
  --ioc-blue-hover: var(--ione-accent-hover);
  --ioc-header-active: var(--ione-accent);
  --ioc-focus: var(--ione-accent);
  --ioc-shadow-focus: 0 0 0 2px var(--ione-cream), 0 0 0 5px var(--ione-accent);
  --ioc-body-family: var(--ione-w-sans);
  --ioc-heading-family: var(--ione-w-display);
}

/* ══════════════════════════════════════════════════════════════════════════
 * HEADER LOCKUP. Rendered by OneBrand.tsx inside the shared chrome; these two
 * classes exist only in this sheet, which only ever loads on this site.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-hdr-lockup {
  font-family: var(--ione-sans);
  font-size: var(--ione-t-lead);
  line-height: var(--ione-lh-ui);
  letter-spacing: var(--ione-ls-tight);
  font-weight: 700;
  color: var(--ione-ink);
  white-space: nowrap;
}

.ione-hdr-one {
  color: var(--ione-accent);
}

/* ══════════════════════════════════════════════════════════════════════════
 * MOTION OFF. Removes transitions, animations and the glow itself — a large
 * static gradient is still visual noise for a reader who asked for less.
 * ═════════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .ione *,
  .ione *::before,
  .ione *::after {
    transition-duration: 1ms !important;
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
  }

  .ione-hero::before {
    background: none;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
 * LEDGER BELOW 720px. Measured at 375px: the calendar ledger's third column
 * was CLIPPED by the dominant cell's overflow (table 437px wide in a 375px
 * viewport, body scrollWidth 375 — the status chips simply vanished). Rows
 * stack — code · line · chip — which is still rows, never tiles (CMS-D-215
 * ④). Above that, a table that still outgrows its cell scrolls inside it
 * rather than being cut.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-cell--lead {
  overflow-x: auto;
}

@media (max-width: 719px) {
  .ione-ledger thead {
    display: none;
  }

  .ione-ledger,
  .ione-ledger tbody,
  .ione-ledger tr,
  .ione-ledger td {
    display: block;
  }

  .ione-ledger tr {
    padding: 12px 24px;
    border-bottom: 1px solid var(--ione-hairline);
  }

  .ione-ledger tr:last-child {
    border-bottom: 0;
  }

  .ione-ledger td {
    padding: 0;
    border-bottom: 0;
  }

  .ione-ledger td + td {
    margin-top: 4px;
  }

  .ione-ledger__code,
  .ione-ledger__stat {
    text-align: left;
    white-space: normal;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
 * FAQ HIT AREA. Measured: <summary> 647×21px — the whole card looked
 * clickable but only the text line was. The card's padding moves onto the
 * summary so the target is the full row (≥ 48px), and the answer keeps the
 * card's inner rhythm.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-acc__item {
  padding: 0 24px;
}

.ione-acc__q {
  display: block;
  box-sizing: border-box;
  min-height: 48px;
  padding: 16px 0 12px;
}

.ione-acc__a {
  margin-top: 0;
  padding-bottom: 16px;
}

/* Headings balance their last line; ledes avoid orphans. Progressive — a
 * browser without text-wrap keeps the plain wrap. */
.ione-display,
.ione-h1,
.ione-h2,
.ione-h3 {
  text-wrap: balance;
}

.ione-lead {
  text-wrap: pretty;
}

/* Stacked calendar rows: the date keeps one line. The desktop rule shrinks
 * the code column to its content (width: 1%), which on a block-level cell
 * wrapped "1 Apr 2026" onto three lines — measured at 375px. */
@media (max-width: 719px) {
  .ione-ledger--calendar .ione-ledger__code {
    width: auto;
    white-space: nowrap;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
 * SECTION HEADS. DESIGN.md §Aesthetic Direction: "hero and section headings
 * centred; body copy, tables, cards and lists left-aligned." The hero obeyed
 * it and no section did.
 *
 * THE CHILD COMBINATOR IS THE RULE — do not loosen it to a descendant
 * selector. Only the flat section variants put their head directly in the
 * wrap: B-11-V80/V81 (cards), B-13-V80 (steps), B-02-V81 (stats), B-05-V81
 * (figure row), B-14-V80 (timeline). Every head that belongs to a left-aligned
 * block sits one level deeper and is deliberately NOT matched: `.ione-prose`
 * (B-04, articles and legal clauses), `.ione-acc__head` (B-09-V80),
 * `.ione-split__copy` (B-05-V80 — the two-column split, where a centred head
 * over a left column would be plainly wrong), `.ione-cell__head` (B-07, B-12)
 * and `.ione-band` (B-06, which centres itself). `.ione-related` (B-22) is a
 * nav and keeps its left eyebrow.
 *
 * The rhythm carries the hierarchy: 8 inside the head, 16 under the heading,
 * 32 down to the content, against 64 between sections. Measured before: all
 * four of those gaps were 24px, so a section head read as one more line of
 * text rather than a title standing over its section.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-section > .ione-wrap > .ione-eyebrow,
.ione-section > .ione-wrap > .ione-h2,
.ione-section > .ione-wrap > .ione-lead,
.ione-section > .ione-wrap > .ione-split__cta {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
}

.ione-section > .ione-wrap > .ione-eyebrow {
  margin-top: 0;
}

/* A heading is a title, not a rule across the page. Wide enough that a 38
 * character heading stays on one line, tight enough that a 64 character one
 * breaks in two — `text-wrap: balance` then evens them. */
.ione-section > .ione-wrap > .ione-h2 {
  max-width: 42ch;
}

/* `:not(:empty)` on the FIRST element of each pair, because the collapse rules
 * above hide an unfilled slot with `display: none` — which removes the BOX and
 * never the `+` relationship. Measured without these guards: `/get-started` §1
 * and §2 (eyebrow unfilled) pushed their first visible element to 40px below
 * the section edge instead of 32, and the home's §9 (heading unfilled) to 48px,
 * because the margin of a hidden element's sibling collapses through
 * `.ione-wrap`, which carries no vertical padding or border to stop it. */
.ione-section > .ione-wrap > .ione-eyebrow:not(:empty) + .ione-h2 {
  margin-top: 8px;
}

.ione-section > .ione-wrap > .ione-h2:not(:empty) + .ione-lead {
  margin-top: 16px;
}

/* The complement, and it is NOT redundant: guarding the rules above only stops
 * them firing, and the older unguarded `.ione .ione-h2 + .ione-lead` at (0,2,0)
 * then wins with its 24px. Measured on the home's lede-only section: 56px from
 * the section edge, where a head that begins with the lede should begin at 32. */
.ione-section > .ione-wrap > .ione-eyebrow:empty + .ione-h2,
.ione-section > .ione-wrap > .ione-h2:empty + .ione-lead {
  margin-top: 0;
}

.ione-section > .ione-wrap > .ione-h2 + .ione-bento,
.ione-section > .ione-wrap > .ione-h2 + .ione-stats,
.ione-section > .ione-wrap > .ione-h2 + .ione-steps,
.ione-section > .ione-wrap > .ione-h2 + .ione-figures,
.ione-section > .ione-wrap > .ione-lead + .ione-bento,
.ione-section > .ione-wrap > .ione-lead + .ione-stats,
.ione-section > .ione-wrap > .ione-lead + .ione-steps,
.ione-section > .ione-wrap > .ione-lead + .ione-figures,
.ione-section > .ione-wrap > .ione-eyebrow + .ione-timeline {
  margin-top: 32px;
}

/* NO HEAD, NO HEAD-GAP. The rules above are keyed on the element that PRECEDES
 * the content, and a collapsed slot keeps its place in the sibling chain, so a
 * section whose head is entirely unfilled still reserved 32px for a title that
 * is not there — measured at `/services` §0, `/blog` §0 and the home's §4
 * (Group Pulse) and §13 (the Compass tiles): content sat 64px below the section
 * edge instead of 32px. The partial cases stay correct on their own: with the
 * lede unfilled but a heading present, `.ione-lead + .ione-bento` is still the
 * rule that puts the content 32px under the heading. */
.ione-section
  > .ione-wrap:not(
    :has(> .ione-eyebrow:not(:empty), > .ione-h2:not(:empty), > .ione-lead:not(:empty))
  )
  > .ione-bento,
.ione-section
  > .ione-wrap:not(
    :has(> .ione-eyebrow:not(:empty), > .ione-h2:not(:empty), > .ione-lead:not(:empty))
  )
  > .ione-stats,
.ione-section
  > .ione-wrap:not(
    :has(> .ione-eyebrow:not(:empty), > .ione-h2:not(:empty), > .ione-lead:not(:empty))
  )
  > .ione-steps,
.ione-section
  > .ione-wrap:not(
    :has(> .ione-eyebrow:not(:empty), > .ione-h2:not(:empty), > .ione-lead:not(:empty))
  )
  > .ione-figures,
.ione-section
  > .ione-wrap:not(
    :has(> .ione-eyebrow:not(:empty), > .ione-h2:not(:empty), > .ione-lead:not(:empty))
  )
  > .ione-timeline {
  margin-top: 0;
}

/* ══════════════════════════════════════════════════════════════════════════
 * THE ONE FOCAL SECTION. DESIGN.md §Colour permits "soft radial light behind
 * focal sections" and only the hero ever had one, so the page's own claim sat
 * on exactly the same flat cream as the office address. The same static glow
 * as the hero — it does not pulse, drift or follow the cursor, and
 * prefers-reduced-motion removes it with the hero's.
 *
 * The selector resolves to ONE section on the site, for the reason spelled out
 * at the suite-ledger rules above.
 * ═════════════════════════════════════════════════════════════════════════ */
.ione-section:has(.ione-ledger:not(.ione-ledger--calendar)) {
  position: relative;
  overflow: hidden;
  padding-top: 48px;
  padding-bottom: 48px;
}

.ione-section:has(.ione-ledger:not(.ione-ledger--calendar))::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -30%;
  width: 100%;
  height: 100%;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(closest-side, var(--ione-glow), transparent 72%);
  pointer-events: none;
}

.ione-section:has(.ione-ledger:not(.ione-ledger--calendar)) > .ione-wrap {
  position: relative;
}

@media (prefers-reduced-motion: reduce) {
  .ione-section:has(.ione-ledger:not(.ione-ledger--calendar))::before {
    background: none;
  }
}

/* ── Sprite icons (W3) ─────────────────────────────────────────────────
   The pack drew icons as Phosphor webfont glyphs and sized them the way you
   size type: font-size and color on the PARENT, inherited by the glyph.
   W1 replaced the font with an owned <symbol> sprite, and an <svg> ignores
   font-size — so it is sized in em instead. That makes the sprite a drop-in
   for the glyph: every font-size and color rule already in the generated pack
   layer keeps driving it, unchanged, with no per-icon sizing anywhere.
   Authored here rather than in the generated block, which is rewritten whole
   from site.css on every regeneration. ── */
.ione-w-ic{width:1em;height:1em;display:block;flex:none;fill:currentColor}

/* ── The pack band base (CMS-D-215 W13) ───────────────────────────────────
   A pack band used to carry ".ione", this skin's ORIGINAL warm-bento wrapper
   class, and inherited its whole base with it: a cream ground, #2e2b21 warm
   ink, and the warm-bento type metrics. Every heading on all twelve routes
   rendered warm olive against the pack's cool rgb(12,10,20), and every plain
   band sat on cream where the pack is white. The pack layer only ever
   corrected what it explicitly restated, so everything it did not name kept
   the superseded design underneath it — which is why measuring class COVERAGE
   said 96% while the page was visibly a different design.

   ".ione" is NOT changed: the four blog articles still render through the
   warm-bento variants and depend on its ground, ink and metrics. The pack
   simply gets its own scope class instead of borrowing that one, which is what
   it should have had from the start.

   Ground is deliberately unset so a plain band shows the page ground (white,
   as in the pack), and ".ione-w-wash" / ".ione-w-dk" in the generated block
   below still win for the bands that have one. ── */
.ione-w-band{color:var(--ione-w-t1)}

/* === BEGIN GENERATED: 00-wiringsite pack layer === */
/* GENERATED by sites/infoc.one/scripts/build-pack-layer.mjs — do not edit here.
 * Source: design/00-wiringsite/www.infoc.one/site.css
 * Classes namespaced to .ione-w-*, class-free selectors removed, and every
 * literal re-expressed onto the T23 scale (owner direction 2026-09-04:
 * re-express, do not widen the gate). Regenerate with --write. */
:root{--ione-w-c-000000:#000000;--ione-w-c-5fd6c9:#5fd6c9;--ione-w-c-f2b15f:#f2b15f;--ione-w-c-d98fe0:#d98fe0;--ione-w-c-e7ce8e:#e7ce8e;--ione-w-c-6b4bf5:#6b4bf5;--ione-w-c-aa4112:#aa4112;--ione-w-c-bfd2ff:#bfd2ff;--ione-w-c-0f1118:#0f1118;--ione-w-c-5fd69b:#5fd69b;--ione-w-c-0b0b0d:#0b0b0d;--ione-w-c-131317:#131317;--ione-w-c-d7dbe3:#d7dbe3;--ione-w-c-0a6b45:#0a6b45;--ione-w-c-e6f7ef:#e6f7ef;--ione-w-c-4a3ab8:#4a3ab8;--ione-w-c-ede8fe:#ede8fe;--ione-w-c-c2255c:#c2255c;--ione-w-c-9a5b00:#9a5b00;--ione-w-c-1a1c24:#1a1c24;--ione-w-h:#0F43D6;--ione-w-h2:#1B4FF0;--ione-w-h3:#3D7BFF;--ione-w-h4:#8FA8F2;--ione-w-h50:#EEF3FF;--ione-w-h100:#DAE5FF;--ione-w-h800:#0A2F9E;--ione-w-b:#151519;--ione-w-b2:#0F0F12;--ione-w-b3:#202026;--ione-w-b-line:rgba(255,255,255,.10);--ione-w-b-line2:rgba(255,255,255,.16);--ione-w-t1:#0C0A14;--ione-w-t2:#2C3340;--ione-w-t3:#4E5663;--ione-w-t4:#7A828F;--ione-w-ink:#0C0A14;--ione-w-ink-2:#2C3340;--ione-w-ink-3:#4E5663;--ione-w-paper:#fff;--ione-w-wash:#F7F8FB;--ione-w-wash2:#EEF1F6;--ione-w-line:#E4E7EE;--ione-w-line2:#CDD4DF;--ione-w-ok:#1C8F47;--ione-w-ok50:#E9F6EE;--ione-w-warn:#A57408;--ione-w-warn50:#FFF7E0;--ione-w-bad:#B92020;--ione-w-bad50:#FDF2F6;--ione-w-ledger:#077A8E;--ione-w-lattice:#0E8977;--ione-w-counter:#957508;--ione-w-verify:#1C8F47;--ione-w-pulse:#8A2BC8;--ione-w-chart:#C24E18;--ione-w-ok-t:#15713A;--ione-w-warn-t:#7A5606;--ione-w-bad-t:#9B1A1A;--ione-w-lattice-t:#0A6659;--ione-w-ledger-t:#055C6B;--ione-w-chart-t:#9B3D12;--ione-w-mono:'JetBrains Mono',ui-monospace,monospace;--ione-w-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--ione-w-display:'Figtree Local','Figtree',var(--ione-w-sans);--ione-w-r:8px;--ione-w-r2:12px;--ione-w-lat-p:52px;--ione-w-lat-i:3px;--ione-w-lat-b:46px;--ione-w-lat-r:8px;--ione-w-pad:clamp(20px,4vw,64px);--ione-w-sec-y:clamp(76px,9.5vw,140px);--ione-w-sec-y-tight:clamp(44px,5vw,72px);--ione-w-sec-y-hero:clamp(40px,5vw,64px);--ione-w-sec-y-hero-t:clamp(52px,7vw,92px);--ione-w-sh1:0 1px 2px rgba(12,10,20,.05);--ione-w-sh2:0 1px 3px rgba(12,10,20,.06),0 12px 32px rgba(12,10,20,.07);--ione-w-sh3:0 2px 6px rgba(12,10,20,.06),0 28px 64px rgba(12,10,20,.10);
}.ione-w-k{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3)}.ione-w-k--on{color:var(--ione-w-h)}.ione-w-k--dk{color:rgba(255,255,255,.5)}:where(.ione-w-band) h1,:where(.ione-w-band) h2,:where(.ione-w-band) h3,:where(.ione-w-band) h4,:where(.ione-w-band) h5,.ione-w-h1,.ione-w-h2,.ione-w-h3,.ione-w-h4{font-family:var(--ione-w-display);font-variation-settings:"wght" 700}:where(.ione-w-band) h1,.ione-w-h1{font-size:clamp(38px,5.4vw,68px);font-weight:700;letter-spacing:-0.02em;line-height:1;text-wrap:balance}:where(.ione-w-band) h2,.ione-w-h2{font-size:clamp(28px,3.4vw,44px);font-weight:700;letter-spacing:-0.02em;line-height:1.1;text-wrap:balance}:where(.ione-w-band) h3,.ione-w-h3{font-size:clamp(20px,2vw,26px);font-weight:700;letter-spacing:-0.02em;line-height:1.25}:where(.ione-w-band) h4,.ione-w-h4{font-size:16px;font-weight:700;letter-spacing:-0.02em;line-height:1.25}:where(.ione-w-band) h5{font-size:12px;font-weight:700;letter-spacing:0}.ione-w-lede{font-size:clamp(16px,1.35vw,19px);line-height:1.65;color:var(--ione-w-t2);text-wrap:pretty}.ione-w-body{font-size:14px;line-height:1.65;color:var(--ione-w-t2);text-wrap:pretty}.ione-w-small{font-size:14px;line-height:1.5;color:var(--ione-w-t3);text-wrap:pretty}.ione-w-mono{font-family:var(--ione-w-mono);font-variant-numeric:tabular-nums}em.ione-w-a{font-style:normal;color:var(--ione-w-h)}.ione-w-dk em.ione-w-a{color:var(--ione-w-h4)}.ione-w-wrap{max-width:1240px;margin:0 auto;padding:0 var(--ione-w-pad)}.ione-w-wrap--nar{max-width:920px}section:where(.ione-w-band){padding:var(--ione-w-sec-y) 0}section.ione-w-tight{padding:var(--ione-w-sec-y-tight) 0}.ione-w-hero{padding:var(--ione-w-sec-y-hero-t) 0 var(--ione-w-sec-y-hero)}.ione-w-hero + section.ione-w-tight{padding-top:0}section.ione-w-tight:has(+ .ione-w-rail){padding-bottom:0}.ione-w-dk + .ione-w-dk.ione-w-tight,.ione-w-wash.ione-w-tight + .ione-w-wash.ione-w-tight{padding-top:0}.ione-w-dk{background:var(--ione-w-b);color:var(--ione-w-paper)}.ione-w-dk .ione-w-lede,.ione-w-dk .ione-w-body{color:rgba(255,255,255,.72)}.ione-w-dk .ione-w-small{color:rgba(255,255,255,.58)}.ione-w-wash{background:var(--ione-w-wash)}.ione-w-sec-h{max-width:62ch}.ione-w-sec-h .ione-w-k{margin-bottom:16px;display:block}.ione-w-sec-h .ione-w-lede{margin-top:16px}.ione-w-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(28px,5vw,72px);align-items:start}.ione-w-split--even{grid-template-columns:1fr 1fr}.ione-w-g2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ione-w-g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.ione-w-g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.ione-w-top{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--ione-w-line)}.ione-w-top__in{max-width:1240px;margin:0 auto;padding:0 var(--ione-w-pad);height:64px;display:flex;align-items:center;gap:24px}.ione-w-brand{display:flex;align-items:center;gap:8px;flex:none}.ione-w-brand svg{border-radius:8px;display:block}.ione-w-brand b{font-family:'Figtree Local','Figtree',var(--ione-w-sans);font-size:16px;font-weight:750;font-variation-settings:"wght" 750;letter-spacing:0;line-height:1;white-space:nowrap}.ione-w-brand b em{font-style:normal;font-weight:750;font-variation-settings:"wght" 750;color:var(--ione-w-h);margin-left:0}.ione-w-nav{display:flex;gap:2px;font-size:14px;color:var(--ione-w-t2)}.ione-w-nav a{padding:8px 12px;border-radius:8px}.ione-w-nav a:hover{background:var(--ione-w-wash2);color:var(--ione-w-t1)}.ione-w-nav a.ione-w-on{color:var(--ione-w-h);font-weight:600}.ione-w-top__sp{flex:1}.ione-w-top__cta{display:flex;gap:8px;align-items:center;flex:none}.ione-w-navtog{display:none;align-items:center;justify-content:center;width:38px;height:38px;border-radius:8px;border:1px solid var(--ione-w-line2);background:var(--ione-w-paper);color:var(--ione-w-t1);font-size:18px;flex:none}.ione-w-navtog:hover{background:var(--ione-w-wash)}.ione-w-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 16px;border-radius:8px;font-size:14px;font-weight:600;letter-spacing:0;border:1px solid var(--ione-w-line2);background:var(--ione-w-paper);color:var(--ione-w-t1);white-space:nowrap;transition:background .14s,border-color .14s,transform .14s}.ione-w-btn:hover{background:var(--ione-w-wash);border-color:var(--ione-w-t4)}.ione-w-btn:active{transform:translateY(1px)}.ione-w-btn--p{background:var(--ione-w-b);border-color:var(--ione-w-b);color:var(--ione-w-paper)}.ione-w-btn--p:hover{background:var(--ione-w-c-000000);border-color:var(--ione-w-c-000000)}.ione-w-btn--h{background:var(--ione-w-h);border-color:var(--ione-w-h);color:var(--ione-w-paper)}.ione-w-btn--h:hover{background:var(--ione-w-h800);border-color:var(--ione-w-h800)}.ione-w-btn--g{background:transparent;border-color:transparent;color:var(--ione-w-t2)}.ione-w-btn--g:hover{background:var(--ione-w-wash2);color:var(--ione-w-t1)}.ione-w-btn--lg{height:46px;padding:0 24px;font-size:14px}.ione-w-btn--sm{height:32px;padding:0 12px;font-size:12px}.ione-w-dk .ione-w-btn{background:rgba(255,255,255,.08);border-color:var(--ione-w-b-line2);color:var(--ione-w-paper)}.ione-w-dk .ione-w-btn:hover{background:rgba(255,255,255,.16)}.ione-w-dk .ione-w-btn--p{background:var(--ione-w-paper);border-color:var(--ione-w-paper);color:var(--ione-w-b)}.ione-w-dk .ione-w-btn--p:hover{background:var(--ione-w-h50);border-color:var(--ione-w-h50)}.ione-w-ann{background:var(--ione-w-b);color:rgba(255,255,255,.82);font-size:12px;text-align:center;padding:9px var(--ione-w-pad)}.ione-w-ann a{color:var(--ione-w-paper);font-weight:600;border-bottom:1px solid var(--ione-w-b-line2)}.ione-w-ann i{color:var(--ione-w-h4);font-style:normal}.ione-w-hero{position:relative;overflow:hidden;background:var(--ione-w-paper);border-bottom:1px solid var(--ione-w-line)}.ione-w-hero__grid{position:absolute;top:0;left:50%;transform:translateX(-50%);pointer-events:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='52' height='52'><rect x='3' y='3' width='46' height='46' rx='7' fill='rgba(15,67,214,0.045)'/></svg>");background-size:var(--ione-w-lat-p) var(--ione-w-lat-p);background-attachment:scroll;background-repeat:repeat;width:100%;height:100%}.ione-w-hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(58% 62% at 50% 30%,var(--ione-w-paper) 0%,rgba(255,255,255,.92) 42%,rgba(255,255,255,0) 78%)}.ione-w-hero__in{position:relative;text-align:center;max-width:900px;margin:0 auto}.ione-w-hero__shot{position:relative;z-index:2}.ione-w-hero__shot .ione-w-surf{border-top-left-radius:var(--ione-w-r2);border-top-right-radius:var(--ione-w-r2);border-bottom-right-radius:0;border-bottom-left-radius:0;border-bottom:0;box-shadow:0 2px 6px rgba(12,10,20,.05),0 -18px 48px rgba(12,10,20,.09)}.ione-w-hero .ione-w-k{position:relative;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border:1px solid var(--ione-w-h100);background:rgba(255,255,255,.82);border-radius:999px;color:var(--ione-w-h);margin-bottom:24px;box-shadow:var(--ione-w-sh1)}.ione-w-hero .ione-w-k svg{width:20px;height:20px;border-radius:8px;display:block;flex:none}.ione-w-hero__in{position:relative;z-index:2}.ione-w-hero h1{margin-bottom:16px}.ione-w-hero .ione-w-lede{max-width:60ch;margin:0 auto}.ione-w-hero__cta{display:flex;gap:12px;justify-content:center;margin-top:32px;flex-wrap:wrap}.ione-w-hero__badges{display:flex;gap:8px;justify-content:center;margin-top:24px;flex-wrap:wrap}.ione-w-pill{display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border:1px solid var(--ione-w-line);border-radius:999px;background:var(--ione-w-paper);font-size:12px;color:var(--ione-w-t3)}.ione-w-pill i,.ione-w-pill .ione-w-ic{font-size:12px;color:var(--ione-w-ok);font-style:normal}.ione-w-hero__shot{position:relative;margin-top:clamp(36px,5vw,60px);margin-bottom:0}.ione-w-surf{background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:var(--ione-w-r2);box-shadow:var(--ione-w-sh3);overflow:hidden}.ione-w-surf--flat{box-shadow:var(--ione-w-sh2)}.ione-w-surf--sm{border-radius:var(--ione-w-r)}.ione-w-surf__bar{height:34px;display:flex;align-items:center;gap:8px;padding:0 12px;background:var(--ione-w-wash);border-bottom:1px solid var(--ione-w-line)}.ione-w-surf__dots{display:flex;gap:4px}.ione-w-surf__dots i{width:9px;height:9px;border-radius:50%;background:var(--ione-w-line2);display:block}.ione-w-surf__url{flex:1;text-align:center;font-family:var(--ione-w-mono);font-size:12px;color:var(--ione-w-t3)}.ione-w-ap{background:var(--ione-w-wash);min-width:0}.ione-w-ap__top{height:38px;display:flex;align-items:center;gap:8px;padding:0 12px;background:var(--ione-w-b);color:var(--ione-w-paper);font-size:12px}.ione-w-ap__m{width:22px;height:22px;border-radius:8px;background:var(--ione-w-h);display:grid;place-items:center;font-family:var(--ione-w-mono);font-size:12px;font-weight:800;flex:none}.ione-w-ap__top b{font-weight:600;letter-spacing:-0.02em;font-size:12px}.ione-w-ap__seg{display:flex;gap:2px;background:rgba(255,255,255,.1);border-radius:8px;padding:2px;margin-left:4px}.ione-w-ap__seg span{padding:2px 8px;border-radius:8px;font-size:12px;color:rgba(255,255,255,.7)}.ione-w-ap__seg span.ione-w-on{background:var(--ione-w-paper);color:var(--ione-w-b);font-weight:600}.ione-w-ap__sp{flex:1}.ione-w-ap__ic{opacity:.55;font-size:12px}.ione-w-ap__nav{height:32px;display:flex;align-items:center;padding:0 12px;background:var(--ione-w-paper);border-bottom:1px solid var(--ione-w-line);font-size:12px;color:var(--ione-w-t3);gap:0;overflow:hidden}.ione-w-ap__nav a{padding:0 8px;height:32px;display:inline-flex;align-items:center;gap:4px;border-bottom:2px solid transparent;white-space:nowrap}.ione-w-ap__nav a.ione-w-on{color:var(--ione-w-ledger);font-weight:600;border-bottom-color:var(--ione-w-ledger)}.ione-w-ap__nav em{font-style:normal;font-family:var(--ione-w-mono);font-size:12px;color:var(--ione-w-t3);margin-left:2px}.ione-w-ap__bd{padding:12px}.ione-w-mh{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}.ione-w-mh__k{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3)}.ione-w-mh__t{font-size:16px;font-weight:600;letter-spacing:-0.02em;margin-top:2px}.ione-w-mh__s{font-size:12px;color:var(--ione-w-t3);margin-top:2px}.ione-w-mh__a{display:flex;gap:4px;flex:none}.ione-w-mbtn{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 8px;border-radius:8px;border:1px solid var(--ione-w-line2);background:var(--ione-w-paper);font-size:12px;font-weight:600;color:var(--ione-w-t2);white-space:nowrap}.ione-w-mbtn--p{background:var(--ione-w-h);border-color:var(--ione-w-h);color:var(--ione-w-paper)}.ione-w-mk{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.ione-w-mkc{position:relative;background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:8px;padding:8px 12px;overflow:hidden}.ione-w-mkc::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:transparent}.ione-w-mkc--bad::before{background:var(--ione-w-bad)}.ione-w-mkc--warn::before{background:var(--ione-w-warn)}.ione-w-mkc--ok::before{background:var(--ione-w-ok)}.ione-w-mkc__l{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3)}.ione-w-mkc__v{font-family:var(--ione-w-mono);font-size:18px;font-weight:700;letter-spacing:-0.02em;line-height:1.1;margin-top:4px;font-variant-numeric:tabular-nums}.ione-w-mkc--bad .ione-w-mkc__v{color:var(--ione-w-bad-t)}.ione-w-mkc--warn .ione-w-mkc__v{color:var(--ione-w-warn-t)}.ione-w-mkc__d{font-size:12px;color:var(--ione-w-t3);margin-top:2px}.ione-w-mtw{overflow-x:auto;-webkit-overflow-scrolling:touch}.ione-w-mtw::-webkit-scrollbar{height:6px}.ione-w-mtw::-webkit-scrollbar-thumb{background:var(--ione-w-line2);border-radius:8px}.ione-w-mt{width:100%;border-collapse:collapse;font-size:12px;background:var(--ione-w-paper)}.ione-w-mt th{text-align:left;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);padding:8px 8px;background:var(--ione-w-wash);border-bottom:1px solid var(--ione-w-line);white-space:nowrap}.ione-w-mt th.ione-w-n,.ione-w-mt td.ione-w-n{text-align:right}.ione-w-mt td{padding:8px 8px;border-bottom:1px solid var(--ione-w-line);color:var(--ione-w-t2);white-space:nowrap}.ione-w-mt tr:last-child td{border-bottom:0}.ione-w-mt td b{color:var(--ione-w-t1);font-weight:600}.ione-w-mt td .ione-w-sub{display:block;font-size:12px;color:var(--ione-w-t3);margin-top:1px}.ione-w-mt .ione-w-num{font-family:var(--ione-w-mono);font-variant-numeric:tabular-nums}.ione-w-mt tr.ione-w-tot td{background:var(--ione-w-wash);font-weight:700;color:var(--ione-w-t1)}.ione-w-mt tr.ione-w-sel td{background:var(--ione-w-h50)}.ione-w-chip{display:inline-flex;align-items:center;gap:4px;padding:1px 8px;border-radius:8px;font-size:12px;font-weight:600;background:var(--ione-w-wash2);color:var(--ione-w-t3)}.ione-w-chip--ok{background:var(--ione-w-ok50);color:var(--ione-w-ok-t)}.ione-w-chip--warn{background:var(--ione-w-warn50);color:var(--ione-w-warn-t)}.ione-w-chip--bad{background:var(--ione-w-bad50);color:var(--ione-w-bad-t)}.ione-w-chip--h{background:var(--ione-w-h50);color:var(--ione-w-h800)}.ione-w-mp{background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:8px;overflow:hidden}.ione-w-mp__h{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--ione-w-line);font-size:12px;font-weight:600}.ione-w-mp__h span{margin-left:auto;font-family:var(--ione-w-mono);font-size:12px;font-weight:500;color:var(--ione-w-t3)}.ione-w-mp__r{display:flex;align-items:flex-start;gap:8px;padding:8px 12px;border-bottom:1px solid var(--ione-w-line);font-size:12px}.ione-w-mp__r:last-child{border-bottom:0}.ione-w-mp__r>i,.ione-w-mp__r>.ione-w-ic{flex:none;font-size:12px;margin-top:1px;font-style:normal}.ione-w-mp__r div{flex:1;min-width:0}.ione-w-mp__r b{display:block;font-size:12px;font-weight:600;color:var(--ione-w-t1)}.ione-w-mp__r p{font-size:12px;color:var(--ione-w-t3);margin-top:1px;line-height:1.5}.ione-w-mp__r .ione-w-amt{flex:none;font-family:var(--ione-w-mono);font-size:12px;font-weight:700}.ione-w-pl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.ione-w-pl__c{background:var(--ione-w-wash);border:1px solid var(--ione-w-line);border-radius:8px;padding:8px;min-width:0}.ione-w-pl__h{display:flex;align-items:baseline;justify-content:space-between;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);margin-bottom:8px}.ione-w-pl__k{background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:8px;padding:8px;margin-bottom:4px;box-shadow:var(--ione-w-sh1)}.ione-w-pl__k:last-child{margin-bottom:0}.ione-w-pl__k b{display:block;font-size:12px;font-weight:600}.ione-w-pl__k .ione-w-v{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;margin-top:2px}.ione-w-pl__k .ione-w-m{font-size:12px;color:var(--ione-w-t3);margin-top:2px}.ione-w-caps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,44px);margin-top:24px;padding-top:24px;border-top:1px solid var(--ione-w-line)}.ione-w-dk .ione-w-caps{border-top-color:var(--ione-w-b-line)}.ione-w-caps h4{margin-bottom:4px}.ione-w-caps p{font-size:14px;line-height:1.5;color:var(--ione-w-t3)}.ione-w-dk .ione-w-caps p{color:rgba(255,255,255,.58)}.ione-w-rail{position:relative;z-index:1;background:rgba(255,255,255,.92);border-bottom:1px solid var(--ione-w-line)}.ione-w-rail::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:var(--ione-w-laser-w,120px);transform:translateX(var(--ione-w-laser-x,0px));border-top-left-radius:8px;border-top-right-radius:8px;border-bottom-right-radius:0;border-bottom-left-radius:0;background:var(--ione-w-h);box-shadow:0 -1px 6px rgba(15,67,214,.30);transition:transform .42s cubic-bezier(.2,.8,.2,1),width .42s cubic-bezier(.2,.8,.2,1)}.ione-w-rail__in{max-width:1240px;margin:0 auto;padding:0 var(--ione-w-pad);display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;height:52px;align-items:center}.ione-w-rail__in::-webkit-scrollbar{display:none}.ione-w-rail a{flex:none;padding:8px 12px;border-radius:999px;font-size:14px;font-weight:500;color:var(--ione-w-t3);white-space:nowrap;border:1px solid transparent}.ione-w-rail a:hover{background:var(--ione-w-wash2);color:var(--ione-w-t1)}.ione-w-rail a.ione-w-on{background:var(--ione-w-b);border-color:var(--ione-w-b);color:var(--ione-w-paper);font-weight:600}.ione-w-rail__n{flex:none;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);margin-right:12px}.ione-w-pb{padding:clamp(40px,5vw,68px) 0;border-bottom:0}.ione-w-pb[hidden]{display:none}.ione-w-pb--on{animation:ione-w-pbIn .45s cubic-bezier(.2,.8,.2,1) both}@keyframes ione-w-pbIn{from{opacity:.4;transform:translateY(10px)}to{opacity:1;transform:none}}.ione-w-rail__t{position:absolute;left:0;bottom:0;height:2px;background:rgba(15,67,214,.16);width:100%}@media (prefers-reduced-motion:reduce){.ione-w-pb--on{animation:none}.ione-w-rail::after{transition:none}}.ione-w-pb__h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px;flex-wrap:wrap}.ione-w-pb__h .ione-w-k{display:block;margin-bottom:12px}.ione-w-pb__t{max-width:34ch}.ione-w-pb__d{max-width:52ch;font-size:14px;line-height:1.65;color:var(--ione-w-t2)}.ione-w-card{background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:var(--ione-w-r2);padding:24px 24px}.ione-w-card.ione-w-card--dk{background:var(--ione-w-b);border-color:var(--ione-w-b3);color:rgba(255,255,255,.74)}.ione-w-card.ione-w-card--dk h4{color:var(--ione-w-paper)}.ione-w-card.ione-w-card--dk p{color:rgba(255,255,255,.74)}.ione-w-card--wash{background:var(--ione-w-wash);border-color:var(--ione-w-line)}.ione-w-card__i{width:38px;height:38px;border-radius:8px;background:var(--ione-w-h50);display:grid;place-items:center;font-size:18px;color:var(--ione-w-h);margin-bottom:16px}.ione-w-card.ione-w-card--dk .ione-w-card__i{background:rgba(255,255,255,.1);color:var(--ione-w-h4)}.ione-w-card{color:var(--ione-w-t3)}.ione-w-card h4{margin-bottom:8px;color:var(--ione-w-t1)}.ione-w-card p{font-size:14px;line-height:1.65}.ione-w-card--lk{transition:border-color .14s,transform .14s,box-shadow .14s;display:block}.ione-w-card--lk:hover{border-color:var(--ione-w-line2);transform:translateY(-2px);box-shadow:var(--ione-w-sh2)}.ione-w-at{display:flex;gap:12px;align-items:flex-start;padding:16px 16px;background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:var(--ione-w-r);transition:border-color .14s,transform .14s}.ione-w-at:hover{border-color:var(--ione-w-line2);transform:translateY(-1px)}.ione-w-at__i{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;color:var(--ione-w-paper);font-size:16px;flex:none}.ione-w-at b{display:block;font-size:14px;font-weight:600;letter-spacing:-0.02em}.ione-w-at span{display:block;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);margin-top:2px}.ione-w-at p{font-size:12px;line-height:1.5;color:var(--ione-w-t3);margin-top:4px}.ione-w-step{position:relative;padding:24px 24px 24px;background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:var(--ione-w-r2);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.ione-w-step:hover{transform:translateY(-3px);box-shadow:0 18px 34px -18px rgba(12,10,20,.26);border-color:var(--ione-w-line2)}.ione-w-dk .ione-w-step{background:rgba(255,255,255,.04);border-color:var(--ione-w-b-line)}.ione-w-dk .ione-w-step:hover{box-shadow:0 20px 40px -18px rgba(12,10,20,.55)}.ione-w-step__n{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;color:var(--ione-w-h800);display:grid;place-items:center;width:34px;height:34px;border-radius:var(--ione-w-lat-r);background:var(--ione-w-h50);margin-bottom:16px;animation:ione-w-stepwalk 10.5s ease-in-out infinite}.ione-w-step:nth-child(2) .ione-w-step__n{animation-delay:3.5s}.ione-w-step:nth-child(3) .ione-w-step__n{animation-delay:7s}@keyframes ione-w-stepwalk{0%,2%{background:var(--ione-w-h);color:var(--ione-w-paper);box-shadow:0 0 0 5px var(--ione-w-h50)}26%,100%{background:var(--ione-w-h50);color:var(--ione-w-h800);box-shadow:0 0 0 0 rgba(15,67,214,0)}}@media (prefers-reduced-motion:reduce){.ione-w-step__n{animation:none}}.ione-w-dk .ione-w-step__n{background:rgba(255,255,255,.08);color:var(--ione-w-paper)}.ione-w-step h4{margin-bottom:4px}.ione-w-step p{font-size:14px;line-height:1.65;color:var(--ione-w-t3)}.ione-w-dk .ione-w-step p{color:rgba(255,255,255,.62)}.ione-w-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--ione-w-b-line);border:1px solid var(--ione-w-b-line);border-radius:var(--ione-w-r2);overflow:hidden}.ione-w-stat{background:var(--ione-w-b);padding:24px 24px}.ione-w-stat b{display:block;font-family:var(--ione-w-mono);font-size:clamp(28px,3.4vw,40px);font-weight:700;letter-spacing:-0.02em;line-height:1;color:var(--ione-w-paper)}.ione-w-stat span{display:block;font-size:12px;color:rgba(255,255,255,.55);margin-top:8px;line-height:1.5}.ione-w-statsw{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px}.ione-w-statw{padding:24px 24px;background:var(--ione-w-b);border:1px solid var(--ione-w-b3);border-radius:var(--ione-w-r2);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.ione-w-statw:hover{transform:translateY(-3px);box-shadow:0 20px 40px -18px rgba(12,10,20,.55)}.ione-w-statw b{display:block;font-family:var(--ione-w-mono);font-size:clamp(30px,3.4vw,40px);font-weight:700;letter-spacing:-0.02em;line-height:1}.ione-w-statw:nth-child(1) b{color:var(--ione-w-c-5fd6c9)}.ione-w-statw:nth-child(2) b{color:var(--ione-w-h4)}.ione-w-statw:nth-child(3) b{color:var(--ione-w-c-f2b15f)}.ione-w-statw:nth-child(4) b{color:var(--ione-w-c-d98fe0)}.ione-w-statw span{display:block;font-size:12px;color:rgba(255,255,255,.62);margin-top:8px;line-height:1.5;max-width:26ch}@media (max-width:720px){.ione-w-statsw{grid-template-columns:1fr 1fr}}.ione-w-casc{display:grid;grid-template-columns:180px 1fr;gap:clamp(20px,4vw,56px);align-items:start}.ione-w-casc__src{background:var(--ione-w-h);border-radius:var(--ione-w-r);padding:16px;color:var(--ione-w-paper)}.ione-w-casc__src .ione-w-k{color:rgba(255,255,255,.82);display:block;margin-bottom:8px}.ione-w-casc__src b{font-size:16px;font-weight:600;letter-spacing:-0.02em;line-height:1.25;display:block}.ione-w-casc__src p{font-size:12px;color:rgba(255,255,255,.72);margin-top:8px;line-height:1.5}.ione-w-casc__l{display:grid;gap:1px;background:var(--ione-w-b-line);border:1px solid rgba(255,255,255,.13);border-radius:var(--ione-w-r2);overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)}.ione-w-casc__r{position:relative;display:grid;grid-template-columns:96px 1fr auto;gap:12px;align-items:center;padding:12px 16px 12px 24px;background:linear-gradient(90deg,rgba(255,255,255,.045),rgba(255,255,255,.012) 42%,rgba(255,255,255,0) 88%),var(--ione-w-b2)}.ione-w-casc__r:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ione-w-ca,var(--ione-w-h3));box-shadow:0 0 14px -1px var(--ione-w-ca,var(--ione-w-h3))}.ione-w-casc__a{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-ca,var(--ione-w-h4));filter:brightness(1.5) saturate(1.1)}.ione-w-casc__r b{font-size:14px;font-weight:600;color:var(--ione-w-paper);letter-spacing:0}.ione-w-casc__r em{font-style:normal;font-family:var(--ione-w-mono);font-size:12px;font-weight:600;color:rgba(255,255,255,.72);white-space:nowrap;font-variant-numeric:tabular-nums}.ione-w-casc__r:hover{background:linear-gradient(90deg,rgba(255,255,255,.085),rgba(255,255,255,.03) 52%,rgba(255,255,255,0) 92%),var(--ione-w-b2)}.ione-w-casc__r:hover em{color:var(--ione-w-paper)}.ione-w-ctc{display:grid}.ione-w-ctc__r{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--ione-w-line)}.ione-w-ctc__r:last-child{border-bottom:0}.ione-w-ctc dt{font-family:var(--ione-w-mono);font-size:12px;font-weight:600;color:var(--ione-w-t2)}.ione-w-ctc dd{margin:0}.ione-w-ctc dd b{font-weight:500;color:var(--ione-w-t1);font-size:14px}.ione-w-ctc dd a{color:var(--ione-w-h)}@media (max-width:560px){.ione-w-ctc__r{grid-template-columns:1fr;gap:2px}}.ione-w-tl{position:relative;display:grid;gap:1px}.ione-w-tl:before{content:"";position:absolute;left:5px;top:20px;bottom:20px;width:2px;border-radius:8px;background:var(--ione-w-line)}.ione-w-tl:after{content:"";position:absolute;left:5px;top:20px;width:2px;height:var(--ione-w-tl-prog,0px);border-radius:8px;background:linear-gradient(180deg,var(--ione-w-ok),var(--ione-w-ok) 78%,var(--ione-w-warn));transform:scaleY(0);transform-origin:top;animation:ione-w-tlfill 1.6s .25s cubic-bezier(.22,1,.36,1) forwards}@keyframes ione-w-tlfill{to{transform:scaleY(1)}}.ione-w-tl__y{display:flex;align-items:center;gap:12px;padding:16px 0 8px 24px;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;color:var(--ione-w-t3)}.ione-w-tl__y:first-child{padding-top:2px}.ione-w-tl__y:after{content:"";flex:1;height:1px;background:var(--ione-w-line)}.ione-w-tl__r{position:relative;display:grid;grid-template-columns:104px 1fr auto;gap:16px;align-items:baseline;padding:8px 12px 8px 24px;border-radius:8px;font-size:14px}.ione-w-tl__r:before{content:"";position:absolute;left:0;top:14px;width:12px;height:12px;box-sizing:border-box;border-radius:999px;background:var(--ione-w-paper);border:2px solid var(--ione-w-line2)}.ione-w-tl__r--live:before{background:var(--ione-w-ok);border-color:var(--ione-w-ok);animation:ione-w-tldot .5s cubic-bezier(.22,1,.36,1)}.ione-w-tl__r--live:nth-of-type(2):before{animation-delay:.45s}.ione-w-tl__r--live:nth-of-type(3):before{animation-delay:.7s}.ione-w-tl__r--live:nth-of-type(4):before{animation-delay:.95s}@keyframes ione-w-tldot{from{transform:scale(.2);opacity:0}60%{opacity:1}}.ione-w-tl__r--next{background:var(--ione-w-warn50)}.ione-w-tl__r--next:before{border-color:var(--ione-w-warn);box-shadow:0 0 0 4px var(--ione-w-warn50);animation:ione-w-tlnext 2.8s ease-out 1.6s infinite}@keyframes ione-w-tlnext{0%{box-shadow:0 0 0 4px var(--ione-w-warn50),0 0 0 0 rgba(165,116,8,.5)}55%,100%{box-shadow:0 0 0 4px var(--ione-w-warn50),0 0 0 13px rgba(165,116,8,0)}}@media (prefers-reduced-motion:reduce){.ione-w-tl:after,.ione-w-tl__r--live:before,.ione-w-tl__r--next:before{animation:none}.ione-w-tl:after{transform:scaleY(1)}}.ione-w-tl__d{font-family:var(--ione-w-mono);font-size:12px;font-weight:600;color:var(--ione-w-t2);font-variant-numeric:tabular-nums}.ione-w-tl__r b{font-weight:500;color:var(--ione-w-t1);font-size:14px;line-height:1.5}.ione-w-tl__s{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;text-align:right;white-space:nowrap}.ione-w-tl__s--live{color:var(--ione-w-ok-t)}.ione-w-tl__s--next{color:var(--ione-w-warn-t);background:var(--ione-w-paper);border:1px solid var(--ione-w-c-e7ce8e);border-radius:999px;padding:2px 8px}.ione-w-tl__s--fut{color:var(--ione-w-t3)}.ione-w-auths{display:flex;flex-wrap:wrap;gap:8px}.ione-w-pill--auth{gap:8px;color:var(--ione-w-t2);font-weight:500}.ione-w-pill--auth:before{content:"";width:5px;height:5px;border-radius:999px;background:var(--ione-w-h4)}.ione-w-vh{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.ione-w-cmp-w{overflow-x:auto;border:1px solid var(--ione-w-line);border-radius:var(--ione-w-r);background:var(--ione-w-paper)}.ione-w-cmp{width:100%;min-width:660px;border-collapse:collapse;font-size:14px}.ione-w-cmp th,.ione-w-cmp td{padding:12px 16px;border-bottom:1px solid var(--ione-w-line);text-align:left;vertical-align:middle}.ione-w-cmp tr:last-child th,.ione-w-cmp tr:last-child td{border-bottom:0}.ione-w-cmp thead th{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);border-bottom:1px solid var(--ione-w-line2);white-space:nowrap}.ione-w-cmp thead th.ione-w-cmp-on{color:var(--ione-w-h800)}.ione-w-cmp th+th,.ione-w-cmp td{text-align:center;width:116px}.ione-w-cmp tbody th{font-weight:500;color:var(--ione-w-t1);width:auto;text-align:left}.ione-w-cmp tbody th small{display:block;font-size:12px;font-weight:400;color:var(--ione-w-t3);margin-top:2px}.ione-w-cmp tr.ione-w-cmp-g th{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);background:var(--ione-w-wash)}.ione-w-cmp tr.ione-w-cmp-g td{background:var(--ione-w-wash)}.ione-w-cmp .ione-w-cmp-y{color:var(--ione-w-ok);font-size:16px;line-height:1}.ione-w-cmp .ione-w-cmp-n{color:var(--ione-w-t4);font-size:14px;line-height:1}.ione-w-cmp td.ione-w-cmp-on{background:var(--ione-w-h50)}.ione-w-cmp td.ione-w-cmp-t{font-family:var(--ione-w-mono);font-size:12px;font-weight:600;color:var(--ione-w-t2)}.ione-w-sz{display:grid;grid-template-columns:1.25fr 1fr;gap:0;border:1px solid var(--ione-w-line);border-radius:var(--ione-w-r);background:var(--ione-w-paper);overflow:hidden}.ione-w-sz__c{padding:clamp(20px,2.4vw,30px);display:grid;gap:24px;align-content:start}.ione-w-sz__f>label{display:block;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);margin-bottom:8px}.ione-w-sz__v{font-family:var(--ione-w-mono);font-size:18px;font-weight:700;color:var(--ione-w-t1);font-variant-numeric:tabular-nums;margin-bottom:8px}.ione-w-sz input[type=range]{width:100%;accent-color:var(--ione-w-h);height:22px}.ione-w-sz__seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:8px}.ione-w-sz__seg button{padding:8px 8px;border:1px solid var(--ione-w-line);border-radius:8px;background:var(--ione-w-paper);font:inherit;font-size:12px;color:var(--ione-w-t2);cursor:pointer}.ione-w-sz__seg button[aria-pressed=true]{border-color:var(--ione-w-h);background:var(--ione-w-h50);color:var(--ione-w-h800);font-weight:600}.ione-w-sz__out{padding:clamp(20px,2.4vw,30px);background:var(--ione-w-wash);border-left:1px solid var(--ione-w-line);display:grid;align-content:start;gap:12px}.ione-w-sz__k{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3)}.ione-w-sz__p{font-family:var(--ione-w-display);font-size:clamp(26px,3vw,34px);font-weight:700;letter-spacing:-0.02em;color:var(--ione-w-t1);line-height:1.1}.ione-w-sz__why{font-size:14px;color:var(--ione-w-t2);line-height:1.5}.ione-w-sz__mods{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}.ione-w-faq{border-top:1px solid var(--ione-w-line)}.ione-w-faq details{border-bottom:1px solid var(--ione-w-line)}.ione-w-faq summary{padding:16px 0;font-size:16px;font-weight:600;letter-spacing:-0.02em;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px}.ione-w-faq summary::-webkit-details-marker{display:none}.ione-w-faq summary::after{content:"+";font-family:var(--ione-w-mono);font-size:18px;font-weight:400;color:var(--ione-w-t3);flex:none}.ione-w-faq details[open] summary::after{content:"–"}.ione-w-faq p{padding:0 0 16px;max-width:74ch;font-size:14px;line-height:1.65;color:var(--ione-w-t2)}.ione-w-plan{background:var(--ione-w-paper);border:1px solid var(--ione-w-line);border-radius:var(--ione-w-r2);padding:24px;display:flex;flex-direction:column}.ione-w-plan--on{border-color:var(--ione-w-h);box-shadow:0 0 0 3px var(--ione-w-h50)}.ione-w-plan__tag{align-self:flex-start;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-h);background:var(--ione-w-h50);padding:4px 8px;border-radius:8px;margin-bottom:12px}.ione-w-plan h3{margin-bottom:2px}.ione-w-plan__hc{font-family:var(--ione-w-mono);font-size:12px;color:var(--ione-w-t3)}.ione-w-plan__d{font-size:14px;color:var(--ione-w-t3);margin:12px 0 16px;line-height:1.5}.ione-w-plan ul{list-style:none;display:grid;gap:8px;margin-bottom:24px;flex:1}.ione-w-plan li{display:flex;gap:8px;font-size:14px;line-height:1.5;color:var(--ione-w-t2)}.ione-w-plan li i,.ione-w-plan li .ione-w-ic{flex:none;color:var(--ione-w-ok-t);font-size:14px;font-style:normal;margin-top:2px}.ione-w-plan li.ione-w-hd{font-weight:600;color:var(--ione-w-t1)}.ione-w-ft{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:clamp(24px,4vw,48px)}.ione-w-ft__b .ione-w-brand b{color:var(--ione-w-paper)}.ione-w-ft__b .ione-w-brand b em{color:var(--ione-w-h4)}.ione-w-ft__b p{font-size:14px;line-height:1.65;margin-top:12px;max-width:34ch;color:rgba(255,255,255,.55)}.ione-w-ft h5{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,.56);margin-bottom:12px}.ione-w-ft ul{list-style:none;display:grid;gap:8px}.ione-w-ft li a{font-size:14px;color:rgba(255,255,255,.66)}.ione-w-ft li a:hover{color:var(--ione-w-paper)}.ione-w-ft__bot{margin-top:clamp(36px,5vw,56px);padding-top:24px;border-top:1px solid var(--ione-w-b-line);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,.56)}.ione-w-ft__bot nav{display:flex;gap:16px}.ione-w-live{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.6);margin-top:16px}.ione-w-live i{width:7px;height:7px;border-radius:50%;background:var(--ione-w-ok);flex:none;animation:ione-w-bl 2.4s ease-in-out infinite}@keyframes ione-w-bl{0%,100%{opacity:1}50%{opacity:.35}}.ione-w-rv{transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}html.ione-w-rv-on .ione-w-rv{opacity:0;transform:translateY(14px)}html.ione-w-rv-on .ione-w-rv.ione-w-in{opacity:1;transform:none}html.ione-w-rv-done .ione-w-rv{opacity:1!important;transform:none!important;transition:none!important}@media (prefers-reduced-motion:reduce){html.ione-w-rv-on .ione-w-rv{opacity:1;transform:none;transition:none}.ione-w-live i{animation:none}}@media (max-width:1080px){.ione-w-ft{grid-template-columns:1fr 1fr 1fr}.ione-w-ft__b{grid-column:1/-1}.ione-w-g4{grid-template-columns:1fr 1fr}.ione-w-nav{display:none}.ione-w-navtog{display:inline-flex}.ione-w-top__in{flex-wrap:wrap;height:auto;min-height:64px;padding-top:12px;padding-bottom:12px}.ione-w-top__in.ione-w-open .ione-w-nav{display:flex;order:9;flex-basis:100%;flex-wrap:wrap;padding-top:8px;margin-top:2px;border-top:1px solid var(--ione-w-line)}.ione-w-top__in.ione-w-open .ione-w-nav a{padding:8px 12px}}@media (max-width:1100px){.ione-w-split{grid-template-columns:minmax(0,1fr)!important}}@media (max-width:900px){.ione-w-split--even,.ione-w-casc{grid-template-columns:1fr}.ione-w-g3{grid-template-columns:1fr}.ione-w-caps{grid-template-columns:1fr;gap:16px}.ione-w-pl{grid-template-columns:1fr 1fr}.ione-w-sz{grid-template-columns:1fr}.ione-w-sz__out{border-left:0;border-top:1px solid var(--ione-w-line)}.ione-w-tl__r{grid-template-columns:96px 1fr;gap:4px 12px}.ione-w-tl__s{grid-column:2;text-align:left;justify-self:start}}@media (max-width:620px){.ione-w-g2,.ione-w-g4{grid-template-columns:1fr}.ione-w-ft{grid-template-columns:1fr 1fr}.ione-w-top__in{gap:12px}.ione-w-pl{grid-template-columns:1fr}.ione-w-ap__nav{display:none}.ione-w-ap__seg{display:none}.ione-w-surf,.ione-w-ap{min-width:0;max-width:100%}.ione-w-ap__top{overflow:hidden}}.ione-w-dk{position:relative;overflow:hidden}.ione-w-dk::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='52' height='52'><rect x='3' y='3' width='46' height='46' rx='7' fill='rgba(255,255,255,0.028)'/></svg>");background-repeat:repeat;background-position:left top;background-size:var(--ione-w-lat-p) var(--ione-w-lat-p);background-attachment:scroll;mask-image:radial-gradient(120% 90% at 82% 0%,var(--ione-w-c-000000) 0%,rgba(0,0,0,.55) 42%,transparent 88%);
  -webkit-mask-image:radial-gradient(120% 90% at 82% 0%,var(--ione-w-c-000000) 0%,rgba(0,0,0,.55) 42%,transparent 88%)}.ione-w-dk::after{content:"";position:absolute;top:0;right:0;width:min(62%,860px);height:min(120%,760px);z-index:0;pointer-events:none;background:radial-gradient(58% 62% at 76% 18%,rgba(255,255,255,.055),rgba(255,255,255,0) 68%),
             radial-gradient(42% 48% at 96% 4%,rgba(255,255,255,.035),rgba(255,255,255,0) 72%)}.ione-w-dk + .ione-w-dk::before{background-image:none}.ione-w-dk + .ione-w-dk::after{display:none}.ione-w-dk .ione-w-wrap,footer .ione-w-wrap{position:relative;z-index:2}@media (max-width:820px){.ione-w-dk::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='52' height='52'><rect x='3' y='3' width='46' height='46' rx='7' fill='rgba(255,255,255,0.035)'/></svg>");background-repeat:repeat;background-position:left top}.ione-w-dk::after{display:none}}.ione-w-gridpulse{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}.ione-w-dk .ione-w-gridpulse,footer .ione-w-gridpulse{mask-image:linear-gradient(90deg,var(--ione-w-c-000000) 0%,var(--ione-w-c-000000) 12%,transparent 26%,transparent 74%,var(--ione-w-c-000000) 88%,var(--ione-w-c-000000) 100%);
  -webkit-mask-image:linear-gradient(90deg,var(--ione-w-c-000000) 0%,var(--ione-w-c-000000) 12%,transparent 26%,transparent 74%,var(--ione-w-c-000000) 88%,var(--ione-w-c-000000) 100%)}.ione-w-gridpulse i{position:absolute;width:var(--ione-w-lat-b);height:var(--ione-w-lat-b);border-radius:var(--ione-w-lat-r);opacity:1;border:0;background:currentColor;box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);display:grid;place-items:center;font-size:18px;font-style:normal}.ione-w-gridpulse i::before{color:var(--ione-w-paper);line-height:1;position:relative;z-index:1}.ione-w-dk .ione-w-gridpulse i,footer .ione-w-gridpulse i{filter:brightness(1.55) saturate(1.15)}.ione-w-hero .ione-w-gridpulse i{box-shadow:inset 0 0 0 1px rgba(255,255,255,.34),0 8px 18px -8px rgba(12,10,20,.34)}.ione-w-gridpulse i:nth-child(1){color:var(--ione-w-ledger);background:var(--ione-w-ledger)}.ione-w-gridpulse i:nth-child(2){color:var(--ione-w-lattice);background:var(--ione-w-lattice)}.ione-w-gridpulse i:nth-child(3){color:var(--ione-w-counter);background:var(--ione-w-counter)}.ione-w-gridpulse i:nth-child(4){color:var(--ione-w-ok);background:var(--ione-w-ok)}.ione-w-gridpulse i:nth-child(5){color:var(--ione-w-chart);background:var(--ione-w-chart)}.ione-w-gridpulse i:nth-child(6){color:var(--ione-w-c-6b4bf5);background:var(--ione-w-c-6b4bf5)}.ione-w-gridpulse i:nth-child(7){color:var(--ione-w-pulse);background:var(--ione-w-pulse)}.ione-w-gridpulse i:nth-child(8){color:var(--ione-w-c-aa4112);background:var(--ione-w-c-aa4112)}.ione-w-hero .ione-w-gridpulse i{left:0;top:0}@media (max-width:1180px){.ione-w-gridpulse i:nth-child(4),.ione-w-gridpulse i:nth-child(7){display:none}}@media (max-width:820px){.ione-w-gridpulse{display:none}}.ione-w-ftapps{display:grid;grid-template-columns:repeat(4,var(--ione-w-lat-b));gap:calc(var(--ione-w-lat-p) - var(--ione-w-lat-b));margin-top:24px;position:relative;z-index:2}.ione-w-ftapp{width:var(--ione-w-lat-b);height:var(--ione-w-lat-b);border-radius:var(--ione-w-lat-r);display:grid;place-items:center;position:relative;background:var(--ione-w-fa);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);transition:transform .22s ease,box-shadow .22s ease}.ione-w-ftapp i,.ione-w-ftapp .ione-w-ic{font-size:18px;color:var(--ione-w-paper);line-height:1;display:grid;place-items:center}.ione-w-ftapp:hover{transform:translateY(-3px) scale(1.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}.ione-w-ftapp::after{content:"";position:absolute;inset:-2.5px;border-radius:8px;padding:1px;pointer-events:none;background:conic-gradient(from var(--ione-w-gpa),rgba(255,255,255,0) 0 58%,rgba(191,210,255,.28) 74%,var(--ione-w-paper) 86%,rgba(191,210,255,.28) 95%,rgba(255,255,255,0) 100%);
  -webkit-mask:linear-gradient(var(--ione-w-c-000000) 0 0) content-box,linear-gradient(var(--ione-w-c-000000) 0 0);-webkit-mask-composite:xor;mask:linear-gradient(var(--ione-w-c-000000) 0 0) content-box,linear-gradient(var(--ione-w-c-000000) 0 0);mask-composite:exclude;filter:drop-shadow(0 0 5px rgba(191,210,255,.7));opacity:0;transition:opacity .2s ease}.ione-w-ftapp:hover::after,.ione-w-ftapp:focus-visible::after{opacity:1;animation:ione-w-gpring 3.8s linear infinite}@media (max-width:720px){.ione-w-ftapps{grid-template-columns:repeat(4,1fr);gap:8px}.ione-w-ftapp{width:100%;height:auto;aspect-ratio:1}}@media (prefers-reduced-motion:reduce){.ione-w-ftapp:hover{transform:none}.ione-w-ftapp:hover::after{animation:none}}.ione-w-dk--plain::before,.ione-w-dk--plain::after{display:none!important}footer .ione-w-gridpulse--ft{mask-image:none!important;-webkit-mask-image:none!important;z-index:3}.ione-w-ft__bot{border-top:0!important;position:relative}.ione-w-ft__bot::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.13) 26%,rgba(255,255,255,.13) 74%,transparent)}.ione-w-pb .ione-w-ap .ione-w-is-done{opacity:.42}.ione-w-pb .ione-w-ap .ione-w-is-done b{text-decoration:line-through;text-decoration-thickness:1px}.ione-w-pb .ione-w-ap .ione-w-mbtn{transition:background .18s ease,color .18s ease}.ione-w-pb .ione-w-ap .ione-w-mrw:hover,.ione-w-pb .ione-w-ap .ione-w-mp__r:hover{background:rgba(15,67,214,.035)}.ione-w-vc2{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:32px}.ione-w-vc2__c{border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:24px;background:rgba(255,255,255,.026);position:relative;overflow:hidden}.ione-w-vc2__k{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-h4)}.ione-w-vc2__t{font-size:22px;font-weight:600;letter-spacing:-0.02em;margin:8px 0 8px;color:var(--ione-w-paper)}.ione-w-vc2__d{font-size:14px;line-height:1.65;color:rgba(255,255,255,.66);margin:0;text-wrap:pretty}.ione-w-vc2__st{display:grid;gap:8px;margin-top:16px}.ione-w-vc2__r{display:flex;gap:12px;align-items:flex-start;font-size:12px;color:rgba(255,255,255,.74)}.ione-w-vc2__r i,.ione-w-vc2__r .ione-w-ic{font-size:14px;color:var(--ione-w-h4);flex:none;margin-top:2px}.ione-w-vstage{min-height:150px;display:grid;place-items:center;margin:4px 0 8px;padding:4px 0}.ione-w-vtile{width:88px;height:88px;border-radius:0;background:var(--ione-w-h);display:grid;place-items:center;position:relative;overflow:hidden;box-shadow:0 0 0 rgba(191,210,255,0);animation:ione-w-vhalo 4.4s ease-in-out infinite}.ione-w-vtile svg{width:100%;height:100%;display:block;position:relative;z-index:2}.ione-w-vring{position:absolute;left:22.5%;top:50%;width:10px;height:10px;margin:0 0 0 0;border-radius:50%;border:1.5px solid var(--ione-w-c-bfd2ff);opacity:0;z-index:1;animation:ione-w-vring 4.4s ease-out infinite}.ione-w-vring:nth-of-type(2){animation-delay:.5s}.ione-w-vring:nth-of-type(3){animation-delay:1s}@keyframes ione-w-vring{0%{transform:scale(.4);opacity:0}12%{opacity:.85}62%{transform:scale(6);opacity:0}100%{opacity:0}}@keyframes ione-w-vhalo{0%,100%{box-shadow:0 0 12px rgba(191,210,255,.10)}40%{box-shadow:0 0 34px rgba(191,210,255,.42)}}.ione-w-vcap{font-family:var(--ione-w-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,.42);text-align:center;margin-top:8px}.ione-w-cph{width:170px;margin:0 auto;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:var(--ione-w-c-0f1118);padding:12px 12px 16px;box-shadow:0 26px 60px rgba(0,0,0,.42)}.ione-w-cph__b{font-family:var(--ione-w-mono);font-size:12px;letter-spacing:0.06em;color:rgba(255,255,255,.34);text-align:center;margin-bottom:8px}.ione-w-cph__c{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px;background:rgba(255,255,255,.03)}.ione-w-cph__t{font-size:12px;font-weight:600;color:var(--ione-w-paper);line-height:1.25}.ione-w-cph__s{font-size:12px;color:rgba(255,255,255,.56);margin-top:4px;line-height:1.5}.ione-w-cph__a{display:flex;gap:4px;margin-top:8px}.ione-w-cph__a span{flex:1;text-align:center;font-size:12px;font-weight:600;padding:4px 0;border-radius:8px}.ione-w-cph__a span:first-child{background:rgba(255,255,255,.09);color:rgba(255,255,255,.72)}.ione-w-cph__a span:last-child{background:var(--ione-w-h);color:var(--ione-w-paper)}.ione-w-cph__f{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:12px;font-size:12px;color:rgba(255,255,255,.46)}.ione-w-cph__f i,.ione-w-cph__f .ione-w-ic{font-size:12px;color:var(--ione-w-c-5fd69b)}@media (max-width:900px){.ione-w-vc2{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.ione-w-vring,.ione-w-vtile{animation:none}.ione-w-vring:first-of-type{opacity:.5;transform:scale(3)}}.ione-w-vc4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px}.ione-w-vc4__c{border:1px solid rgba(255,255,255,.10);border-radius:12px;padding:16px;background:rgba(255,255,255,.022);position:relative}.ione-w-vc4__c--soon{background:none;border-style:dashed;border-color:rgba(255,255,255,.16)}.ione-w-vc4__i{width:38px;height:38px;background-image:none;border-radius:8px;display:grid;place-items:center;font-size:18px;color:var(--ione-w-paper);margin-bottom:12px}.ione-w-vc4__c--soon .ione-w-vc4__i{background:none!important;border:1px dashed rgba(255,255,255,.26);color:rgba(255,255,255,.5)}.ione-w-vc4__n{font-size:16px;font-weight:600;color:var(--ione-w-paper);letter-spacing:-0.02em}.ione-w-vc4__s{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-h4);margin-top:4px;display:block}.ione-w-vc4__c--soon .ione-w-vc4__s{color:rgba(255,255,255,.42)}.ione-w-vc4__d{font-size:12px;line-height:1.65;color:rgba(255,255,255,.62);margin:8px 0 0;text-wrap:pretty}.ione-w-vc2__sub{font-size:14px;color:rgba(255,255,255,.56);margin:40px 0 0;max-width:70ch}@media (max-width:1100px){.ione-w-vc4{grid-template-columns:1fr 1fr}}@media (max-width:600px){.ione-w-vc4{grid-template-columns:1fr}}.ione-w-dk{background:var(--ione-w-c-0b0b0d)}.ione-w-dk::after{display:none!important}.ione-w-dk::before{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='52' height='52'><rect x='3' y='3' width='46' height='46' rx='7' fill='rgba(255,255,255,0.030)'/></svg>")}.ione-w-vc2__c,.ione-w-vc4__c{background:rgba(255,255,255,.028);border-color:rgba(255,255,255,.11)}.ione-w-cph{background:var(--ione-w-c-131317)}.ione-w-gridpulse i{background-image:none!important}.ione-w-vtile{background:var(--ione-w-h)!important}.ione-w-vc4__i{background-image:none}.ione-w-ap__seg span{color:rgba(255,255,255,.72)}.ione-w-ap__seg span.ione-w-on{color:var(--ione-w-t1);background:var(--ione-w-paper)}.ione-w-ap__nav a{color:var(--ione-w-ink-2)}.ione-w-ap__nav a.ione-w-on{color:var(--ione-w-h)}.ione-w-ap__nav em{color:var(--ione-w-ink-3)}.ione-w-mkc__l{color:var(--ione-w-ink-3)}.ione-w-mkc__d{color:var(--ione-w-ink-3)}.ione-w-mh__k{color:var(--ione-w-ink-3)}.ione-w-mp__h span{color:var(--ione-w-ink-3)}.ione-w-cph__b{color:rgba(255,255,255,.62)}.ione-w-cph__s{color:rgba(255,255,255,.72)}.ione-w-cph__f{color:rgba(255,255,255,.66)}.ione-w-vcap{color:rgba(255,255,255,.62)}.ione-w-vc2__d,.ione-w-vc4__d{color:rgba(255,255,255,.76)}.ione-w-vc2__r{color:rgba(255,255,255,.82)}.ione-w-vc2__sub{color:rgba(255,255,255,.72)}.ione-w-ft a{color:rgba(255,255,255,.74)}.ione-w-dk .ione-w-sec-h .ione-w-k{color:var(--ione-w-h4)}.ione-w-ft__bot::before{display:none}.ione-w-ft__bot{border-top:0}.ione-w-stats,.ione-w-stat,.ione-w-stats__c{background:rgba(255,255,255,.032)!important;border-color:rgba(255,255,255,.10)!important}.ione-w-stat b,.ione-w-stats b{color:var(--ione-w-paper)}.ione-w-gridvoc{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}.ione-w-gridvoc i{position:absolute;width:var(--ione-w-lat-b);height:var(--ione-w-lat-b);border-radius:var(--ione-w-lat-r);display:grid;place-items:center;font-size:18px;color:var(--ione-w-paper);opacity:0;font-style:normal;text-shadow:0 0 10px rgba(255,255,255,.55);animation:ione-w-voc 7s ease-in-out infinite}@keyframes ione-w-voc{0%,100%{opacity:0}18%{opacity:.30}42%{opacity:.16}62%{opacity:0}}.ione-w-gridpulse i{opacity:1!important;filter:none!important;background-image:none!important;animation:gpb 9s ease-in-out infinite}@media (prefers-reduced-motion:reduce){.ione-w-gridvoc{display:none}}@media (max-width:900px){.ione-w-gridvoc{display:none}}.ione-w-at{display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:start;padding:24px;border:1px solid var(--ione-w-line);border-radius:18px;background:var(--ione-w-paper);transition:border-color .2s ease,box-shadow .24s ease,transform .24s ease}.ione-w-at:hover{border-color:var(--ione-w-line2);box-shadow:0 18px 40px -22px rgba(12,10,20,.30);transform:translateY(-2px)}.ione-w-at__i{width:56px;height:56px;border-radius:8px;display:grid;place-items:center;font-size:30px;color:var(--ione-w-paper);box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 0 0 1px rgba(255,255,255,.12),0 10px 22px -10px rgba(12,10,20,.45)}.ione-w-at>div>b{font-size:18px;font-weight:600;letter-spacing:-0.02em;display:block;line-height:1.25}.ione-w-at>div>span{display:block;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);margin-top:4px}.ione-w-at>div>p{font-size:14px;line-height:1.65;color:var(--ione-w-t2);margin:12px 0 0;text-wrap:pretty}.ione-w-at>div>p.ione-w-mono{margin-top:12px;padding-top:12px;border-top:1px solid var(--ione-w-line);font-size:12px;line-height:1.65;color:var(--ione-w-t3)!important}@media (max-width:520px){.ione-w-at{grid-template-columns:1fr}.ione-w-at__i{width:48px;height:48px;font-size:22px}}.ione-w-at__i i,.ione-w-mmi__i i,.ione-w-lhm i,.ione-w-card__i i,.ione-w-vc4__i i,.ione-w-atd__m,.ione-w-gridpulse i::before{display:grid;place-items:center;line-height:1}.ione-w-at__i{font-size:12px}.ione-w-at__i i,.ione-w-at__i .ione-w-ic{width:100%;height:100%;font-size:22px;color:var(--ione-w-paper)}.ione-w-lh{position:relative;height:clamp(420px,42vw,560px);margin-top:clamp(30px,4vw,52px);z-index:2;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}.ione-w-lh__l{position:absolute;border-radius:12px;background:var(--ione-w-paper);border:1px solid rgba(12,10,20,.09);box-shadow:0 30px 70px -28px rgba(12,10,20,.34),0 2px 6px rgba(12,10,20,.05);overflow:hidden;will-change:transform}.ione-w-lh__h{display:flex;align-items:center;gap:4px;padding:8px 12px;border-bottom:1px solid rgba(12,10,20,.07);background:var(--ione-w-wash)}.ione-w-lh__h i{width:7px;height:7px;border-radius:50%;background:var(--ione-w-c-d7dbe3);display:block}.ione-w-lh__h b{margin-left:4px;font-family:var(--ione-w-mono);font-size:12px;font-weight:500;color:var(--ione-w-t3);letter-spacing:0.06em}.ione-w-lh__b{padding:12px 12px}.ione-w-lhseg{margin-left:auto;display:flex;gap:2px;padding:2px;border-radius:8px;background:rgba(12,10,20,.055)}.ione-w-lhseg span{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);padding:2px 8px;border-radius:8px;cursor:pointer;user-select:none}.ione-w-lhseg span.ione-w-on{background:var(--ione-w-paper);color:var(--ione-w-h);box-shadow:0 1px 2px rgba(12,10,20,.12)}.ione-w-lhm{width:16px;height:16px;border-radius:8px;display:grid;place-items:center;flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 0 0 0 1px rgba(255,255,255,.14)}.ione-w-lhm i,.ione-w-lhm .ione-w-ic{font-size:12px;line-height:1;color:var(--ione-w-paper)}.ione-w-lhr .ione-w-lhtag,.ione-w-lhtag{display:inline-block;width:auto;margin-right:4px;padding:1px 4px;border-radius:8px;color:var(--ione-w-paper);font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;vertical-align:1px}.ione-w-lhtx,.ione-w-lhc,.ione-w-lhag{display:none;margin:0 0 12px}.ione-w-lhtx:not([hidden]),.ione-w-lhag:not([hidden]){display:block}.ione-w-lhc:not([hidden]){display:block}.ione-w-lhtx{border:1px solid rgba(12,10,20,.08);border-radius:8px;overflow:hidden}.ione-w-lhtx__h{display:flex;align-items:center;gap:8px;padding:8px 8px;background:rgba(12,10,20,.02);border-bottom:1px solid rgba(12,10,20,.07)}.ione-w-lhtx__h b{font-size:12px;font-weight:600;color:var(--ione-w-t1)}.ione-w-lhtx__h em{font-style:normal;font-family:var(--ione-w-mono);font-size:12px;color:var(--ione-w-t3)}.ione-w-lhtx__ok{margin-left:auto;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-c-0a6b45);background:var(--ione-w-c-e6f7ef);border-radius:8px;padding:2px 4px}.ione-w-lhtt{width:100%;border-collapse:collapse}.ione-w-lhtt td{padding:4px 8px;border-bottom:1px solid rgba(12,10,20,.055);font-size:12px;vertical-align:middle}.ione-w-lhtt tr:last-child td{border-bottom:0}.ione-w-lhtt td b{display:block;font-size:12px;font-weight:600;color:var(--ione-w-t1)}.ione-w-lhtt td span:not(.ione-w-lhtag){display:block;font-size:12px;color:var(--ione-w-t3);margin-top:1px}.ione-w-lhtt td.ione-w-n{text-align:right;font-family:var(--ione-w-mono);font-size:12px;font-weight:600;color:var(--ione-w-t2);white-space:nowrap}.ione-w-lhtt tr.ione-w-tot td{background:rgba(15,67,214,.04);font-family:var(--ione-w-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3)}.ione-w-lhtt tr.ione-w-tot td.ione-w-n{color:var(--ione-w-h);text-transform:none;letter-spacing:0;font-size:12px}.ione-w-lhag{border:1px solid rgba(107,75,245,.20);border-radius:8px;padding:8px 12px;background:rgba(107,75,245,.035)}.ione-w-lhag__h{display:flex;align-items:center;gap:8px;margin-bottom:8px}.ione-w-lhag__h b{display:block;font-size:12px;font-weight:600;color:var(--ione-w-t1)}.ione-w-lhag__h span:not(.ione-w-lhm):not(.ione-w-lhlive){display:block;font-size:12px;color:var(--ione-w-t3);margin-top:1px}.ione-w-lhag__f{display:flex;gap:4px;align-items:flex-start;font-size:12px;line-height:1.5;color:var(--ione-w-t3)}.ione-w-lhag__f i,.ione-w-lhag__f .ione-w-ic{font-size:12px;color:var(--ione-w-c-6b4bf5);flex:none;margin-top:1px}.ione-w-lhc{padding:8px 12px;border:1px solid rgba(12,10,20,.08);border-radius:8px}.ione-w-lhc__h{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}.ione-w-lhc__h b{font-size:12px;font-weight:600;color:var(--ione-w-t1)}.ione-w-lhc__h em{font-style:normal;font-family:var(--ione-w-mono);font-size:12px;color:var(--ione-w-ok-t)}.ione-w-lhc__lg{margin-left:auto;display:flex;align-items:center;gap:4px;font-family:var(--ione-w-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3)}.ione-w-lhc__lg i{width:6px;height:6px;border-radius:8px;display:block}.ione-w-lhc__b{position:relative;height:72px}.ione-w-lhc__b svg{width:100%;height:100%;display:block;overflow:visible}.ione-w-lhc__t{stroke:rgba(12,10,20,.16);stroke-width:1;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}.ione-w-lhc__a{fill:url(#lhcg)}.ione-w-lhc__p,.ione-w-lhc__f{fill:none;stroke:var(--ione-w-h);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}.ione-w-lhc__f{stroke:var(--ione-w-h4);stroke-dasharray:4 3}.ione-w-lhc__d{position:absolute;width:8px;height:8px;margin:0 0 0 0;border-radius:50%;background:var(--ione-w-paper);border:2px solid var(--ione-w-h)}.ione-w-lhc__tg{position:absolute;right:0;top:14px;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);background:var(--ione-w-paper);padding:0 2px}.ione-w-lhc__ax{position:absolute;left:0;right:0;bottom:-4px;display:flex;justify-content:space-between;font-family:var(--ione-w-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t4)}.ione-w-lhc__ax i{font-style:normal}.ione-w-lhlive{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-c-4a3ab8)}.ione-w-lhlive::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--ione-w-c-6b4bf5)}.ione-w-lhst{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}.ione-w-lhst span{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;padding:2px 4px;border-radius:8px;background:rgba(12,10,20,.05);color:var(--ione-w-t3)}.ione-w-lhst span.ione-w-done{background:var(--ione-w-c-e6f7ef);color:var(--ione-w-c-0a6b45)}.ione-w-lhst span.ione-w-now{background:var(--ione-w-c-ede8fe);color:var(--ione-w-c-4a3ab8)}.ione-w-lhbar{height:4px;border-radius:999px;background:rgba(12,10,20,.07);overflow:hidden;margin-bottom:8px}.ione-w-lhbar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--ione-w-c-6b4bf5),var(--ione-w-h))}.ione-w-lhr em.ione-w-go{color:var(--ione-w-h)}.ione-w-lh--ledger{left:50%;top:52px;width:min(820px,58vw);transform:translateX(-50%);z-index:3}.ione-w-lh--reg{left:calc(50% - 700px);top:8px;width:460px;z-index:2}.ione-w-lh--phone{right:calc(50% - 636px);top:96px;width:214px;border-radius:18px;background:var(--ione-w-c-0b0b0d);border-color:rgba(255,255,255,.13);z-index:4;box-shadow:0 34px 70px -26px rgba(12,10,20,.52)}.ione-w-lh--run{left:calc(50% - 620px);bottom:-52px;width:340px;z-index:2}.ione-w-lh--voce{right:calc(50% - 470px);bottom:30px;width:276px;z-index:6;background:var(--ione-w-c-0b0b0d);border-color:rgba(255,255,255,.14);box-shadow:0 26px 54px -22px rgba(12,10,20,.58)}.ione-w-lhr{display:grid;grid-template-columns:1fr auto;gap:8px;padding:8px 0;border-bottom:1px solid rgba(12,10,20,.06);font-size:12px}.ione-w-lhr:last-child{border-bottom:0}.ione-w-lhr b{font-weight:600;color:var(--ione-w-ink);font-size:12px;display:block}.ione-w-lhr span{color:var(--ione-w-t3);font-size:12px;display:block;margin-top:2px}.ione-w-lhr em{font-style:normal;font-family:var(--ione-w-mono);font-size:12px;font-weight:600;color:var(--ione-w-ink);align-self:center}.ione-w-lhk{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.ione-w-lhk div{border:1px solid rgba(12,10,20,.08);border-radius:8px;padding:8px 8px}.ione-w-lhk .ione-w-l{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3)}.ione-w-lhk .ione-w-v{font-family:var(--ione-w-mono);font-size:14px;font-weight:700;letter-spacing:-0.02em;margin-top:2px}.ione-w-lhk .ione-w-v--bad{color:var(--ione-w-c-c2255c)}.ione-w-lhk .ione-w-v--ok{color:var(--ione-w-ok-t)}.ione-w-lhk .ione-w-v--warn{color:var(--ione-w-c-9a5b00)}.ione-w-lh--phone .ione-w-lh__b,.ione-w-lh--voce .ione-w-lh__b{padding:12px}.ione-w-lhp__k{font-family:var(--ione-w-mono);font-size:12px;letter-spacing:0.06em;color:rgba(255,255,255,.5);text-transform:uppercase}.ione-w-lhp__t{font-size:12px;font-weight:600;color:var(--ione-w-paper);margin-top:8px;line-height:1.25}.ione-w-lhp__s{font-size:12px;color:rgba(255,255,255,.66);margin-top:4px;line-height:1.5}.ione-w-lhp__a{display:flex;gap:4px;margin-top:8px}.ione-w-lhp__a span{flex:1;text-align:center;font-size:12px;font-weight:600;padding:4px 0;border-radius:8px;background:rgba(255,255,255,.10);color:rgba(255,255,255,.78)}.ione-w-lhp__a span:last-child{background:var(--ione-w-h);color:var(--ione-w-paper)}.ione-w-lhv{display:flex;align-items:center;gap:8px}.ione-w-lhv__m{width:30px;height:30px;border-radius:8px;background:var(--ione-w-h);display:grid;place-items:center;flex:none;position:relative}.ione-w-lhv__m svg{width:100%;height:100%}.ione-w-lhv__t{font-size:12px;color:rgba(255,255,255,.86);line-height:1.5}.ione-w-lhv__t em{font-style:normal;color:rgba(255,255,255,.5)}@media (max-width:1100px){.ione-w-lh--reg,.ione-w-lh--voce,.ione-w-lh--run{display:none}.ione-w-lh--ledger{width:74%}}@media (max-width:760px){.ione-w-lh{height:320px}.ione-w-lh--phone,.ione-w-lh--run{display:none}.ione-w-lh--ledger{width:96%;top:20px}}@media (prefers-reduced-motion:reduce){.ione-w-lh__l{transform:none!important}.ione-w-lh--ledger{transform:translateX(-50%)!important}}.ione-w-nav a.ione-w-mmt{display:inline-flex;align-items:center;gap:4px}.ione-w-nav a.ione-w-mmt i,.ione-w-nav a.ione-w-mmt .ione-w-ic{font-size:12px;color:var(--ione-w-t4);line-height:1;transition:transform .18s ease}.ione-w-nav a.ione-w-mmt[aria-expanded="true"]{background:var(--ione-w-wash2);color:var(--ione-w-t1)}.ione-w-nav a.ione-w-mmt[aria-expanded="true"] i{transform:rotate(180deg)}.ione-w-mm{display:none;position:absolute;left:0;right:0;top:100%;background:var(--ione-w-paper);border-bottom:1px solid var(--ione-w-line);box-shadow:0 34px 64px -30px rgba(12,10,20,.34)}.ione-w-mm:not([hidden]){display:block}.ione-w-mm__in{max-width:1240px;margin:0 auto;padding:30px var(--ione-w-pad) 34px;display:grid;grid-template-columns:1fr 1fr 300px;gap:32px}.ione-w-mm__k{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);margin-bottom:12px}.ione-w-mm__g{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:4px}.ione-w-mmi{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;padding:8px 12px;border-radius:12px;transition:background .16s ease,transform .16s ease}.ione-w-mmi:hover{background:var(--ione-w-wash2);transform:translateX(2px)}.ione-w-mmi__i{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;color:var(--ione-w-paper);flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.12),0 6px 14px -8px rgba(12,10,20,.5);transition:transform .16s ease}.ione-w-mmi:hover .ione-w-mmi__i{transform:scale(1.06)}.ione-w-mmi__i i,.ione-w-mmi__i .ione-w-ic{font-size:18px;line-height:1;color:var(--ione-w-paper)}.ione-w-mmi b{display:block;font-size:14px;font-weight:600;letter-spacing:-0.02em;line-height:1.25;color:var(--ione-w-t1)}.ione-w-mmi em{display:block;font-style:normal;font-size:12px;line-height:1.5;color:var(--ione-w-t3);margin-top:2px}.ione-w-mm__rail{border-left:1px solid var(--ione-w-line);padding-left:24px}.ione-w-mmr{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;padding:8px 8px;border-radius:8px;transition:background .16s ease}.ione-w-mmr:hover{background:var(--ione-w-wash2)}.ione-w-mmr>i,.ione-w-mmr>.ione-w-ic{font-size:16px;color:var(--ione-w-h);line-height:1}.ione-w-mmr b{display:block;font-size:14px;font-weight:600;letter-spacing:-0.02em;color:var(--ione-w-t1)}.ione-w-mmr em{display:block;font-style:normal;font-size:12px;line-height:1.5;color:var(--ione-w-t3);margin-top:2px}.ione-w-mm__soc{display:flex;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--ione-w-line)}.ione-w-mm__soc a{width:38px;height:38px;border-radius:8px;border:1px solid var(--ione-w-line);display:grid;place-items:center;color:var(--ione-w-t2);background:var(--ione-w-paper);transition:background .16s ease,color .16s ease,transform .16s ease,border-color .16s ease}.ione-w-mm__soc a:hover{background:var(--ione-w-h);border-color:var(--ione-w-h);color:var(--ione-w-paper);transform:translateY(-2px)}.ione-w-mm__soc i,.ione-w-mm__soc .ione-w-ic{font-size:18px;line-height:1}@media (max-width:1180px){.ione-w-mm__in{grid-template-columns:1fr 1fr}.ione-w-mm__rail{grid-column:1/-1;border-left:0;border-top:1px solid var(--ione-w-line);padding:16px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:4px}.ione-w-mm__rail .ione-w-mm__k,.ione-w-mm__soc{grid-column:1/-1}}.ione-w-g2 > *,.ione-w-g3 > *,.ione-w-g4 > *,.ione-w-stats > *,.ione-w-mm__g > *{transition-delay:inherit}html.ione-w-rv-on .ione-w-rv.ione-w-in > .ione-w-g2 > *:nth-child(2),html.ione-w-rv-on .ione-w-rv.ione-w-in > .ione-w-g3 > *:nth-child(2){transition-delay:.06s}html.ione-w-rv-on .ione-w-rv.ione-w-in > .ione-w-g2 > *:nth-child(3),html.ione-w-rv-on .ione-w-rv.ione-w-in > .ione-w-g3 > *:nth-child(3){transition-delay:.12s}html.ione-w-rv-on .ione-w-rv.ione-w-in > .ione-w-g2 > *:nth-child(4){transition-delay:.18s}.ione-w-card,.ione-w-at,.ione-w-stat,.ione-w-mkc,.ione-w-pill{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.ione-w-card:hover,.ione-w-at:hover{transform:translateY(-3px);box-shadow:0 18px 34px -18px rgba(12,10,20,.26);border-color:var(--ione-w-line2)}.ione-w-card--dk:hover{box-shadow:0 20px 40px -18px rgba(12,10,20,.55)}.ione-w-stat:hover{transform:translateY(-2px)}.ione-w-pill:hover{border-color:var(--ione-w-h100);color:var(--ione-w-t2)}.ione-w-btn{transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease}.ione-w-btn:hover{transform:translateY(-1px)}.ione-w-btn--h:hover,.ione-w-btn--p:hover{box-shadow:0 10px 22px -12px rgba(15,67,214,.66)}.ione-w-nav a{transition:background .16s ease,color .16s ease}.ione-w-gridpulse i{transition:transform .22s ease,box-shadow .22s ease}.ione-w-hero .ione-w-gridpulse i:hover{transform:translateY(-3px) scale(1.04)}.ione-w-lhr,.ione-w-lhtt tr,.ione-w-mmr{transition:background .16s ease}.ione-w-lhr:hover,.ione-w-lhtt tbody tr:not(.ione-w-tot):hover{background:rgba(15,67,214,.035)}.ione-w-lhseg span{transition:background .16s ease,color .16s ease,box-shadow .16s ease}.ione-w-lhseg span:hover{color:var(--ione-w-t1)}.ione-w-ft__c a{transition:color .16s ease}@media (prefers-reduced-motion:reduce){.ione-w-card,.ione-w-at,.ione-w-stat,.ione-w-btn,.ione-w-gridpulse i,.ione-w-mmi,.ione-w-mmi__i,.ione-w-mm__soc a,.ione-w-step,.ione-w-statw{transition:none!important}.ione-w-card:hover,.ione-w-at:hover,.ione-w-stat:hover,.ione-w-btn:hover,.ione-w-gridpulse i:hover,.ione-w-mmi:hover,.ione-w-mm__soc a:hover,.ione-w-step:hover,.ione-w-statw:hover{transform:none!important}}.ione-w-ap__m,.ione-w-lhm,.ione-w-mmi__i,.ione-w-at__i,.ione-w-card__i,.ione-w-vc4__i,.ione-w-mm__soc a,.ione-w-gridpulse i,.ione-w-gridvoc i,.ione-w-brand svg,.ione-w-hero .ione-w-k svg{background-image:none}.ione-w-at--dash{display:grid;grid-template-columns:auto 1fr;column-gap:16px;row-gap:16px;align-items:start}.ione-w-atd{grid-column:1/-1;border:1px solid var(--ione-w-line);border-radius:12px;overflow:hidden;background:var(--ione-w-paper);box-shadow:0 1px 2px rgba(12,10,20,.04)}.ione-w-atd span{font-family:var(--ione-w-sans);letter-spacing:0;text-transform:none;font-weight:400;display:inline}.ione-w-atd__top{display:flex;align-items:center;gap:8px;padding:0 8px;height:34px;color:var(--ione-w-paper);flex-wrap:nowrap}.ione-w-atd__top b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ione-w-atd__m{width:20px;height:20px;border-radius:8px;background:rgba(255,255,255,.20);display:grid;place-items:center;font-family:var(--ione-w-mono);font-size:12px;font-weight:800;letter-spacing:0.06em;flex:none}.ione-w-atd__top b{font-size:12px;font-weight:600;letter-spacing:-0.02em}.ione-w-atd__seg{margin-left:auto;display:flex;flex-wrap:nowrap;flex:none;gap:2px;padding:2px;border-radius:8px;background:rgba(255,255,255,.16)}.ione-w-atd__seg span{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;padding:2px 4px;border-radius:8px;color:var(--ione-w-paper);white-space:nowrap}.ione-w-atd__seg span.ione-w-on{background:var(--ione-w-paper);color:var(--ione-w-t1)}.ione-w-atd__nav{display:flex;gap:0;padding:0 8px;border-bottom:1px solid var(--ione-w-line);background:var(--ione-w-wash)}.ione-w-atd__nav span{font-family:var(--ione-w-sans);font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ione-w-t3);padding:8px 8px;border-bottom:2px solid transparent;white-space:nowrap}.ione-w-atd__nav span.ione-w-on{font-weight:600}.ione-w-atd__b{padding:12px}.ione-w-atd__k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:8px}.ione-w-atd__k>div{border:1px solid var(--ione-w-line);border-radius:8px;padding:8px 8px;min-width:0}.ione-w-atd__k .ione-w-l{display:block;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ione-w-t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ione-w-atd__k .ione-w-v{display:block;font-family:var(--ione-w-mono);font-size:14px;font-weight:700;letter-spacing:-0.02em;margin-top:2px;color:var(--ione-w-t1)}.ione-w-atd__k .ione-w-v--ok{color:var(--ione-w-ok-t)}.ione-w-atd__k .ione-w-v--warn{color:var(--ione-w-c-9a5b00)}.ione-w-atd__k .ione-w-v--bad{color:var(--ione-w-c-c2255c)}.ione-w-atd__r{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:8px 0;border-top:1px solid var(--ione-w-line);transition:background .16s ease}.ione-w-atd__r:hover{background:rgba(15,67,214,.03)}.ione-w-atd__r b{display:block;font-size:12px;font-weight:600;color:var(--ione-w-t1);line-height:1.25}.ione-w-atd__r span{display:block;font-family:var(--ione-w-sans);font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ione-w-t3);margin-top:2px;line-height:1.5}.ione-w-atd__r em{font-style:normal;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;white-space:nowrap;color:var(--ione-w-h)}@media (max-width:520px){.ione-w-at--dash{grid-template-columns:1fr}.ione-w-atd__k{grid-template-columns:1fr 1fr}}.ione-w-ftsoc{display:grid;grid-auto-flow:column;gap:calc(var(--ione-w-lat-p) - var(--ione-w-lat-b));margin:0;padding:0;border:0;position:relative;z-index:2}.ione-w-ftsoc a{width:var(--ione-w-lat-b);height:var(--ione-w-lat-b);border-radius:var(--ione-w-lat-r);border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;color:rgba(255,255,255,.72);background:rgba(255,255,255,.03);transition:background .16s ease,color .16s ease,transform .16s ease,border-color .16s ease}.ione-w-ftsoc a:hover{background:var(--ione-w-h);border-color:var(--ione-w-h);color:var(--ione-w-paper);transform:translateY(-2px)}.ione-w-ftsoc i,.ione-w-ftsoc .ione-w-ic{font-size:18px;line-height:1;display:grid;place-items:center}.ione-w-is-live{background:rgba(15,67,214,.055)!important;box-shadow:inset 2px 0 0 var(--ione-w-h)}.ione-w-dk .ione-w-is-live,footer .ione-w-is-live{background:rgba(255,255,255,.055)!important;box-shadow:inset 2px 0 0 var(--ione-w-h3)}.ione-w-is-tick{color:var(--ione-w-h)!important}.ione-w-tl__s,.ione-w-at>div>span,.ione-w-vc4__s{font-size:12px}.ione-w-csp{position:relative;width:100%;max-width:290px;margin:0 auto;aspect-ratio:290/500;border-radius:18px;background:var(--ione-w-c-0f1118);border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 70px -24px rgba(12,10,20,.5),inset 0 0 0 5px var(--ione-w-c-1a1c24);overflow:hidden;isolation:isolate}.ione-w-csp__st{display:flex;justify-content:space-between;align-items:center;padding:12px 16px 4px;font-family:var(--ione-w-mono);font-size:12px;font-weight:600;color:rgba(255,255,255,.6)}.ione-w-csp__st i,.ione-w-csp__st .ione-w-ic{font-size:12px;margin-left:4px;color:rgba(255,255,255,.5)}.ione-w-csp__ap{padding:4px 12px}.ione-w-csp__k{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,.42)}.ione-w-csp__hd b{display:block;font-family:var(--ione-w-display);font-size:16px;font-weight:700;letter-spacing:-0.02em;color:var(--ione-w-paper);margin-top:4px}.ione-w-csp__fd{display:grid;gap:8px;margin-top:12px}.ione-w-csp__c{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:12px;padding:8px 12px;display:grid;grid-template-columns:22px 1fr;gap:8px;align-items:start}.ione-w-csp__c i,.ione-w-csp__c .ione-w-ic{font-size:14px;line-height:1.1;margin-top:1px}.ione-w-csp__c b{display:block;font-size:12px;font-weight:600;color:var(--ione-w-paper);line-height:1.25}.ione-w-csp__c p{font-size:12px;line-height:1.5;color:rgba(255,255,255,.6);margin-top:2px}.ione-w-csp__vl{position:absolute;inset:0;background:rgba(10,14,23,.62);z-index:2;animation:ione-w-cspVeil 9s linear infinite}.ione-w-csp__sh{position:absolute;left:0;right:0;bottom:0;z-index:3;background:var(--ione-w-paper);border-top-left-radius:18px;border-top-right-radius:18px;border-bottom-right-radius:0;border-bottom-left-radius:0;padding:8px 16px 16px;box-shadow:0 -18px 50px -12px rgba(10,14,23,.45);animation:ione-w-cspUp 9s cubic-bezier(.22,1,.36,1) infinite}.ione-w-csp__gr{width:34px;height:4px;border-radius:999px;background:var(--ione-w-line2);margin:0 auto 12px}.ione-w-csp__bc{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:var(--ione-w-h800)}.ione-w-csp__bc i,.ione-w-csp__bc .ione-w-ic{font-size:12px}.ione-w-csp__bc em{margin-left:auto;font-style:normal;font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;color:var(--ione-w-t3)}.ione-w-csp__t{display:block;font-family:var(--ione-w-display);font-size:16px;font-weight:700;letter-spacing:-0.02em;line-height:1.25;color:var(--ione-w-t1);margin-top:8px}.ione-w-csp__n{font-family:var(--ione-w-mono);font-size:18px;font-weight:700;letter-spacing:-0.02em;color:var(--ione-w-t1);font-variant-numeric:tabular-nums;margin-top:8px}.ione-w-csp__e{list-style:none;margin:12px 0 0;padding:12px 0 0;border-top:1px solid var(--ione-w-line);display:grid;gap:8px}.ione-w-csp__e li{position:relative;padding-left:12px;font-size:12px;line-height:1.5;color:var(--ione-w-t3)}.ione-w-csp__e li:before{content:"";position:absolute;left:0;top:5px;width:6px;height:6px;border-radius:999px;background:var(--ione-w-ok)}.ione-w-csp__e li.ione-w-csp--hold:before{background:var(--ione-w-warn)}.ione-w-csp__ac{display:flex;gap:8px;margin-top:12px}.ione-w-csp__ac span{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;height:38px;border-radius:8px;font-size:12px;font-weight:600;border:1px solid var(--ione-w-line);color:var(--ione-w-t2)}.ione-w-csp__ac .ione-w-csp__go{border-color:var(--ione-w-h);background:var(--ione-w-h);color:var(--ione-w-paper);flex:1.5}.ione-w-csp__ac i,.ione-w-csp__ac .ione-w-ic{font-size:14px}@keyframes ione-w-cspUp{0%,6%{transform:translateY(102%)}18%,76%{transform:translateY(0)}90%,100%{transform:translateY(102%)}}@keyframes ione-w-cspVeil{0%,6%{opacity:0}18%,76%{opacity:1}90%,100%{opacity:0}}@media (prefers-reduced-motion:reduce){.ione-w-csp__sh,.ione-w-csp__vl{animation:none}}@property --gpa{syntax:"<angle>";inherits:false;initial-value:0deg}.ione-w-hero .ione-w-gridpulse i::after{content:"";position:absolute;inset:-2.5px;border-radius:8px;padding:1px;pointer-events:none;z-index:2;background:conic-gradient(from var(--ione-w-gpa),rgba(255,255,255,0) 0 58%,rgba(191,210,255,.28) 74%,var(--ione-w-paper) 86%,rgba(191,210,255,.28) 95%,rgba(255,255,255,0) 100%);
  -webkit-mask:linear-gradient(var(--ione-w-c-000000) 0 0) content-box,linear-gradient(var(--ione-w-c-000000) 0 0);-webkit-mask-composite:xor;mask:linear-gradient(var(--ione-w-c-000000) 0 0) content-box,linear-gradient(var(--ione-w-c-000000) 0 0);mask-composite:exclude;filter:drop-shadow(0 0 5px rgba(191,210,255,.7));animation:ione-w-gpring 3.8s linear infinite}@keyframes ione-w-gpring{to{--ione-w-gpa:360deg}}.ione-w-hero .ione-w-gridpulse i:nth-child(2)::after{animation-delay:-.48s}.ione-w-hero .ione-w-gridpulse i:nth-child(3)::after{animation-delay:-.95s}.ione-w-hero .ione-w-gridpulse i:nth-child(4)::after{animation-delay:-1.42s}.ione-w-hero .ione-w-gridpulse i:nth-child(5)::after{animation-delay:-1.9s}.ione-w-hero .ione-w-gridpulse i:nth-child(6)::after{animation-delay:-2.37s}.ione-w-hero .ione-w-gridpulse i:nth-child(7)::after{animation-delay:-2.85s}.ione-w-hero .ione-w-gridpulse i:nth-child(8)::after{animation-delay:-3.32s}@media (prefers-reduced-motion:reduce){.ione-w-hero .ione-w-gridpulse i::after{animation:none}}.ione-w-dk::before{left:50%;right:auto;transform:translateX(-50%);width:var(--ione-w-lat-w,100%);height:var(--ione-w-lat-h,100%)}.ione-w-dk::before{top:0;bottom:auto}.ione-w-ftsoc a:hover{transform:none;background:var(--ione-w-h);border-color:var(--ione-w-h)}:root{--ione-w-t2:#141519;--ione-w-t3:#2F3238;--ione-w-t4:#6E727A;--ione-w-wash:#FFFFFF;--ione-w-wash2:#F1F1F2;--ione-w-line:#E5E5E7;--ione-w-line2:#C7C8CC}.ione-w-wash{background:var(--ione-w-paper);border-top:1px solid var(--ione-w-line)}.ione-w-wash + .ione-w-wash{border-top:0}.ione-w-card--wash{background:var(--ione-w-paper);border-color:var(--ione-w-line)}section.ione-w-pb{padding-top:var(--ione-w-sec-y-tight)}.ione-w-sec-h .ione-w-k{margin-bottom:16px}.ione-w-sec-h .ione-w-lede{margin-top:16px}.ione-w-sec-h--wide{max-width:none!important}@media (min-width:900px){.ione-w-sec-h--wide{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);column-gap:clamp(36px,5vw,80px);align-items:end;margin-bottom:clamp(30px,3.4vw,44px)}.ione-w-sec-h--wide h2{margin:0;max-width:22ch}.ione-w-sec-h--wide .ione-w-k{grid-column:1/-1}.ione-w-sec-h--wide .ione-w-lede{margin-top:0;padding-bottom:0;max-width:46ch}}.ione-w-g2{gap:clamp(20px,2.4vw,32px)}.ione-w-g3{gap:clamp(20px,2.6vw,40px)}.ione-w-g4{gap:clamp(16px,2vw,28px)}.ione-w-card{padding:24px 32px}.ione-w-body,.ione-w-lede{color:var(--ione-w-t2)}.ione-w-step p,.ione-w-card p{color:var(--ione-w-t3)}.ione-w-mt tr.ione-w-tot td{background:var(--ione-w-paper);border-top:1px solid var(--ione-w-line2)}.ione-w-tl__y:after{background:var(--ione-w-line)}.ione-w-posts{display:grid;gap:0;border-top:1px solid var(--ione-w-line)}.ione-w-post{display:block;padding:clamp(22px,2.6vw,34px) 0;border-bottom:1px solid var(--ione-w-line);max-width:74ch}.ione-w-post__m{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}.ione-w-post__k,.ione-w-post time{font-family:var(--ione-w-mono);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}.ione-w-post__k{color:var(--ione-w-h)}.ione-w-post time{color:var(--ione-w-t4)}.ione-w-post h3{font-size:clamp(20px,2.2vw,27px);letter-spacing:-0.02em;line-height:1.25;margin-top:12px;color:var(--ione-w-t1);text-wrap:pretty}.ione-w-post p{font-size:14px;line-height:1.65;color:var(--ione-w-t3);margin-top:8px}.ione-w-post__go{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font-size:14px;font-weight:600;color:var(--ione-w-h)}.ione-w-post:hover h3{color:var(--ione-w-h800)}.ione-w-post:hover .ione-w-post__go i{transform:translateX(3px)}.ione-w-post__go i{transition:transform .16s ease}a.ione-w-post,a.ione-w-post:hover{color:inherit}.ione-w-ftr__stage{position:absolute;z-index:0;pointer-events:none;overflow:hidden}.ione-w-ftr__c{position:absolute;inset:0}.ione-w-ftr__f{position:absolute;inset:0}.ione-w-ftr__f i,.ione-w-ftr__f .ione-w-ic{position:absolute;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:14px;font-style:normal;will-change:left,top}.ione-w-ft__b{position:relative}.ione-w-ft__b .ione-w-brand,.ione-w-ft__b p,.ione-w-ft__b .ione-w-live{position:relative;z-index:1}@media (prefers-reduced-motion:reduce){.ione-w-ftr__stage{display:none}}html.ione-w-intro-lock{overflow:hidden}#heroIntro.ione-w-hi--out{opacity:0;pointer-events:none}.ione-w-hi__c{position:absolute;inset:0;z-index:1}.ione-w-hi__f{position:absolute;inset:0;z-index:2}.ione-w-hi__f i{position:absolute;width:var(--ione-w-lat-b);height:var(--ione-w-lat-b);border-radius:var(--ione-w-lat-r);display:grid;place-items:center;font-size:22px;font-style:normal;color:var(--ione-w-paper);will-change:left,top}.ione-w-hi__m{position:absolute;z-index:3;display:grid;place-items:center;border-radius:0;background:var(--ione-w-h)}.ione-w-hi__m svg{width:100%;height:100%;display:block}@media (prefers-reduced-motion:reduce){}
/* === END GENERATED: 00-wiringsite pack layer === */

/* ── Surface accents + mark size (W3, for B-12-V82) ────────────────────
   Each suite card wears its own accent, derived from the anchor id the card
   already carries so the seed never holds a colour. Suffix match, because
   namespaceIds rewrites an authored id to <instance>-<id> at render.

   The font-size below repairs a W2 side effect: the pack used
   .at__i{font-size:0} only to hide the webfont ligature fallback, and the
   T23 scale has no 0 step, so the snap made it 12px — leaving the mark at
   12px inside a 56px tile. The webfont is gone, so the tile states its own
   size and .ione-w-ic (1em) follows it. ── */
:root{--ione-w-surface-erp:#077A8E;--ione-w-surface-hrm:#8A2BC8;--ione-w-surface-crm:#0E8977;--ione-w-surface-pos:#957508;--ione-w-surface-wms:#1C8F47;--ione-w-surface-epm:#C24E18;--ione-w-surface-psa:#AA4112;--ione-w-surface-ai:#6B4BF5;--ione-w-surface-vantage:#8A2BC8;--ione-w-surface-almanac:#077A8E;--ione-w-surface-commerce:#CF8327;--ione-w-surface-cms:#5E96E2;--ione-w-surface-compass:#0F43D6;--ione-w-surface-voce:#5478E8}
.ione-w-at__i{font-size:22px}
.ione-w-at[id$="erp"] .ione-w-at__i{background:var(--ione-w-surface-erp)}
.ione-w-at[id$="hrm"] .ione-w-at__i{background:var(--ione-w-surface-hrm)}
.ione-w-at[id$="crm"] .ione-w-at__i{background:var(--ione-w-surface-crm)}
.ione-w-at[id$="pos"] .ione-w-at__i{background:var(--ione-w-surface-pos)}
.ione-w-at[id$="wms"] .ione-w-at__i{background:var(--ione-w-surface-wms)}
.ione-w-at[id$="epm"] .ione-w-at__i{background:var(--ione-w-surface-epm)}
.ione-w-at[id$="psa"] .ione-w-at__i{background:var(--ione-w-surface-psa)}
.ione-w-at[id$="ai"] .ione-w-at__i{background:var(--ione-w-surface-ai)}
.ione-w-at[id$="vantage"] .ione-w-at__i{background:var(--ione-w-surface-vantage)}
.ione-w-at[id$="almanac"] .ione-w-at__i{background:var(--ione-w-surface-almanac)}
.ione-w-at[id$="commerce"] .ione-w-at__i{background:var(--ione-w-surface-commerce)}
.ione-w-at[id$="cms"] .ione-w-at__i{background:var(--ione-w-surface-cms)}
.ione-w-at[id$="compass"] .ione-w-at__i{background:var(--ione-w-surface-compass)}
.ione-w-at[id$="voce"] .ione-w-at__i{background:var(--ione-w-surface-voce)}

/* ── The plan sizer's plan wrapper (CMS-D-215 / 00-wiringsite W7) ──────────
   The pack has no equivalent, because the pack has nothing to wrap: its
   sizer computes ONE outcome and writes it into a single panel. This site
   renders all three plans server-side — so the page says something true with
   no JavaScript — and the island narrows them, which needs one element per
   plan to hide.

   `display:contents` makes that element layout-transparent: the plan's name,
   reason and module list sit in exactly the grid positions the pack's own
   `.sz__out` children occupy, so the wrapper costs nothing visually and the
   generated pack rules keep driving the interior unchanged.

   The `[hidden]` rule is NOT redundant. The UA sheet's `[hidden]{display:none}`
   is a type-level rule and this class selector outranks it, so without the
   second line `display:contents` would win and hiding a plan would do nothing
   at all — every plan visible, always, with the island appearing to run.
   Authored here rather than in the generated block, which is rewritten whole
   from site.css on every regeneration. ── */
.ione-w-sz__plan{display:contents}
.ione-w-sz__plan[hidden]{display:none}

/* ── The collapse class (CMS-D-215 / 00-wiringsite W12) ────────────────────
   The pack never renders an element it does not want: its timeline emits a
   `.tl__y` year rule only where a year actually starts, and a plan card
   without a tag simply has no tag element. A TEMPLATE cannot do that — its
   markup is static and every slot renders — so a slot with nothing in it has
   to be collapsed instead.

   The composer was emitting the fragment ` hidden` for exactly this, which
   matches nothing: `[hidden]` in CSS is an ATTRIBUTE selector and this is a
   class value. So every year rule rendered, empty, on every row that was not a
   new year, and the pack's own `.tl__y` never appeared at all.

   One rule, namespaced like everything else, used by the timeline's year rules
   and the plan cards' optional tag and sixth feature slot. Authored here rather
   than in the generated block, which is rewritten whole on every regeneration.
   ── */
.ione-w-hidden{display:none}

/* ── The four-up surface accents (CMS-D-215 / 00-wiringsite W12) ───────────
   The pack paints each tile's mark with an inline per-surface hex. A six-digit
   hex may not appear in product markup (CMS-D-066) and an editor must never be
   able to choose one, so the accent is derived from the tile's own anchor —
   the same solution the suite wall uses, on a different anatomy, which is
   exactly what this band's scope note said whoever claimed it would face.

   The tokens are already here: the wall defined them. These four rules reuse
   them rather than restating any colour, so the two surfaces cannot drift.  ── */
.ione-w-vc4__c[id$="vantage"] .ione-w-vc4__i{background:var(--ione-w-surface-vantage)}
.ione-w-vc4__c[id$="almanac"] .ione-w-vc4__i{background:var(--ione-w-surface-almanac)}
.ione-w-vc4__c[id$="commerce"] .ione-w-vc4__i{background:var(--ione-w-surface-commerce)}
.ione-w-vc4__c[id$="cms"] .ione-w-vc4__i{background:var(--ione-w-surface-cms)}

/* ── The suite wall's in-card dashboards: accents (CMS-D-215 W13) ──────────
   The pack builds these previews in the browser and writes each accent as an
   INLINE STYLE, computed there by mixing the app's own colour toward the
   beacon ground in 2% steps until white text on it clears 4.6:1.

   Colour is code-owned (CMS-D-066) and a template may not carry a hex, so the
   pack's exact algorithm is run at BUILD time instead and the result lands
   here. Recompute with the snippet recorded in the W13 commit; five of the
   fourteen actually shift (crm, pos, wms, commerce, cms, voce), the rest are
   already clear. Every one of these values was verified at 4.5:1 or better
   against white, which the runtime version could only promise.

   Keyed on a SUFFIX match because renderBlock namespaces an authored id to
   <instance>-<id> — the same reason the fourteen mark accents above do. ── */
:root{--ione-w-atd-erp:#077a8e;--ione-w-atd-hrm:#8a2bc8;--ione-w-atd-crm:#0f8272;--ione-w-atd-pos:#907109;--ione-w-atd-wms:#1c8544;--ione-w-atd-epm:#c24e18;--ione-w-atd-psa:#aa4112;--ione-w-atd-ai:#6b4bf5;--ione-w-atd-vantage:#8a2bc8;--ione-w-atd-almanac:#077a8e;--ione-w-atd-commerce:#a06727;--ione-w-atd-cms:#4c75b1;--ione-w-atd-compass:#0f43d6;--ione-w-atd-voce:#4e6ed5}

.ione-w-at[id$="erp"] .ione-w-atd__top{background:var(--ione-w-atd-erp)}
.ione-w-at[id$="erp"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-erp);border-bottom-color:var(--ione-w-atd-erp)}
.ione-w-at[id$="erp"] .ione-w-atd__r em{color:var(--ione-w-atd-erp)}
.ione-w-at[id$="hrm"] .ione-w-atd__top{background:var(--ione-w-atd-hrm)}
.ione-w-at[id$="hrm"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-hrm);border-bottom-color:var(--ione-w-atd-hrm)}
.ione-w-at[id$="hrm"] .ione-w-atd__r em{color:var(--ione-w-atd-hrm)}
.ione-w-at[id$="crm"] .ione-w-atd__top{background:var(--ione-w-atd-crm)}
.ione-w-at[id$="crm"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-crm);border-bottom-color:var(--ione-w-atd-crm)}
.ione-w-at[id$="crm"] .ione-w-atd__r em{color:var(--ione-w-atd-crm)}
.ione-w-at[id$="pos"] .ione-w-atd__top{background:var(--ione-w-atd-pos)}
.ione-w-at[id$="pos"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-pos);border-bottom-color:var(--ione-w-atd-pos)}
.ione-w-at[id$="pos"] .ione-w-atd__r em{color:var(--ione-w-atd-pos)}
.ione-w-at[id$="wms"] .ione-w-atd__top{background:var(--ione-w-atd-wms)}
.ione-w-at[id$="wms"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-wms);border-bottom-color:var(--ione-w-atd-wms)}
.ione-w-at[id$="wms"] .ione-w-atd__r em{color:var(--ione-w-atd-wms)}
.ione-w-at[id$="epm"] .ione-w-atd__top{background:var(--ione-w-atd-epm)}
.ione-w-at[id$="epm"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-epm);border-bottom-color:var(--ione-w-atd-epm)}
.ione-w-at[id$="epm"] .ione-w-atd__r em{color:var(--ione-w-atd-epm)}
.ione-w-at[id$="psa"] .ione-w-atd__top{background:var(--ione-w-atd-psa)}
.ione-w-at[id$="psa"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-psa);border-bottom-color:var(--ione-w-atd-psa)}
.ione-w-at[id$="psa"] .ione-w-atd__r em{color:var(--ione-w-atd-psa)}
.ione-w-at[id$="ai"] .ione-w-atd__top{background:var(--ione-w-atd-ai)}
.ione-w-at[id$="ai"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-ai);border-bottom-color:var(--ione-w-atd-ai)}
.ione-w-at[id$="ai"] .ione-w-atd__r em{color:var(--ione-w-atd-ai)}
.ione-w-at[id$="vantage"] .ione-w-atd__top{background:var(--ione-w-atd-vantage)}
.ione-w-at[id$="vantage"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-vantage);border-bottom-color:var(--ione-w-atd-vantage)}
.ione-w-at[id$="vantage"] .ione-w-atd__r em{color:var(--ione-w-atd-vantage)}
.ione-w-at[id$="almanac"] .ione-w-atd__top{background:var(--ione-w-atd-almanac)}
.ione-w-at[id$="almanac"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-almanac);border-bottom-color:var(--ione-w-atd-almanac)}
.ione-w-at[id$="almanac"] .ione-w-atd__r em{color:var(--ione-w-atd-almanac)}
.ione-w-at[id$="commerce"] .ione-w-atd__top{background:var(--ione-w-atd-commerce)}
.ione-w-at[id$="commerce"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-commerce);border-bottom-color:var(--ione-w-atd-commerce)}
.ione-w-at[id$="commerce"] .ione-w-atd__r em{color:var(--ione-w-atd-commerce)}
.ione-w-at[id$="cms"] .ione-w-atd__top{background:var(--ione-w-atd-cms)}
.ione-w-at[id$="cms"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-cms);border-bottom-color:var(--ione-w-atd-cms)}
.ione-w-at[id$="cms"] .ione-w-atd__r em{color:var(--ione-w-atd-cms)}
.ione-w-at[id$="compass"] .ione-w-atd__top{background:var(--ione-w-atd-compass)}
.ione-w-at[id$="compass"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-compass);border-bottom-color:var(--ione-w-atd-compass)}
.ione-w-at[id$="compass"] .ione-w-atd__r em{color:var(--ione-w-atd-compass)}
.ione-w-at[id$="voce"] .ione-w-atd__top{background:var(--ione-w-atd-voce)}
.ione-w-at[id$="voce"] .ione-w-atd__nav .ione-w-on{color:var(--ione-w-atd-voce);border-bottom-color:var(--ione-w-atd-voce)}
.ione-w-at[id$="voce"] .ione-w-atd__r em{color:var(--ione-w-atd-voce)}

/* ── The hero's application marks (CMS-D-215 W13 repair) ───────────────────
   In the pack the <i> IS the tile: `.gridpulse i` gives it its 46px box, its
   radius and `background:currentColor`, `:nth-child(n)` gives it its colour,
   and the webfont glyph rides in `i::before` painted white.

   W12 shipped the sprite <svg> as a BARE child of `.gridpulse`, so all
   twenty-five generated `.ione-w-gridpulse i` rules matched nothing and the
   eight marks rendered as small ink glyphs stacked in the hero's top-left
   corner — on all twelve pages, every one of which draws this hero. The <i>
   is back in both hero variants; only the two things the pack said THROUGH
   the webfont are re-stated here, because an <svg> cannot inherit them.

   FILL: an <svg> has no rendered ::before and it inherits the tile's own
   colour, so without this the glyph is invisible against its own background.

   CELLS: the pack's own `latticeFit()` assigned these at runtime and this site
   ships no such script, so the eight cells are stated against the hero's
   untrimmed 52px lattice (3px inset, mirrored left/right). left = inset +
   col*pitch for cols 0,2,1,3; top = inset + row*pitch for rows 1,4,7,9 on the
   left and 2,5,8,10 on the right. The min() keeps the low rows inside the
   shorter inner-page heroes, which is what the pack's own row clamp did. ── */
.ione-w-gridpulse i > svg{color:var(--ione-w-paper)}
.ione-w-hero .ione-w-gridpulse i:nth-child(1){left:3px;top:min(55px,calc(100% - 52px))}
.ione-w-hero .ione-w-gridpulse i:nth-child(2){left:107px;top:min(211px,calc(100% - 52px))}
.ione-w-hero .ione-w-gridpulse i:nth-child(3){left:55px;top:min(367px,calc(100% - 52px))}
.ione-w-hero .ione-w-gridpulse i:nth-child(4){left:159px;top:min(471px,calc(100% - 52px))}
.ione-w-hero .ione-w-gridpulse i:nth-child(5){left:auto;right:3px;top:min(107px,calc(100% - 52px))}
.ione-w-hero .ione-w-gridpulse i:nth-child(6){left:auto;right:107px;top:min(263px,calc(100% - 52px))}
.ione-w-hero .ione-w-gridpulse i:nth-child(7){left:auto;right:55px;top:min(419px,calc(100% - 52px))}
.ione-w-hero .ione-w-gridpulse i:nth-child(8){left:auto;right:159px;top:min(523px,calc(100% - 52px))}

/* The split band's button row. The pack sets 26px inline on the class-less div
   it wraps the button in; 24px is that value on the house space scale, which
   T23 grades this file against. Only a band whose store carries a CTA gets this
   class — the rest keep the variant's `ione-w-hidden` default. */
.ione-w-cta-row{margin-top:24px}

/* ── The footer's eight application tiles, and the brand badge (W13) ────────
   The pack paints each footer tile with an inline `style="--fa:#077A8E"` and
   draws the brand badge as an SVG with `fill="#0F43D6"`. Neither hex may ride
   in product markup (CMS-D-066), so both are derived here from facts the
   markup already carries: the tile's own destination, and the badge's class.

   The tokens are the suite wall's: one accent per application, stated once.
   Where the pack's footer disagrees with its own wall — it swaps the HRM and
   CRM colours — the wall wins, as CMS-D-220 ⑤ recorded (two sources to one).
   `#beacons` wears the ONE AI accent, which is what the pack's own mark is.

   `svg` beside `i`: the pack's glyph rule names the webfont element, and the
   owned sprite is an <svg>, which inherits the tile's own colour and vanished
   against it — the eight tiles rendered as dark outlines with dark marks. ── */
.ione-w-ftapp[href$="#erp"]{--ione-w-fa:var(--ione-w-surface-erp)}
.ione-w-ftapp[href$="#hrm"]{--ione-w-fa:var(--ione-w-surface-hrm)}
.ione-w-ftapp[href$="#crm"]{--ione-w-fa:var(--ione-w-surface-crm)}
.ione-w-ftapp[href$="#pos"]{--ione-w-fa:var(--ione-w-surface-pos)}
.ione-w-ftapp[href$="#wms"]{--ione-w-fa:var(--ione-w-surface-wms)}
.ione-w-ftapp[href$="#epm"]{--ione-w-fa:var(--ione-w-surface-epm)}
.ione-w-ftapp[href$="#psa"]{--ione-w-fa:var(--ione-w-surface-psa)}
.ione-w-ftapp[href$="#beacons"]{--ione-w-fa:var(--ione-w-surface-ai)}
.ione-w-ftapp svg{color:var(--ione-w-paper);width:18px;height:18px}

/* ── The contact band's split (W13, B-17-V82) ──────────────────────────────
   The pack sets this band's ratio, card margins and kicker spacing INLINE —
   `grid-template-columns:1.15fr 1fr`, `margin-bottom:16px`, `display:block;
   margin-bottom:12px` — none of which a template may carry. Re-stated here on
   a modifier the variant wears. The 1.7 address line-height is 1.65 on the
   house scale. Below the skin's 1100px collapse the `!important` single-column
   rule still wins, which is what the pack does there too. ── */
.ione-w-split--form{grid-template-columns:1.15fr 1fr}
.ione-w-split--form .ione-w-card--wash{margin-bottom:16px}
.ione-w-split--form .ione-w-card--wash .ione-w-k{display:block;margin-bottom:12px}
.ione-w-split--form .ione-w-card--wash .ione-w-h4{margin-bottom:8px;color:var(--ione-w-t1)}
.ione-w-split--form .ione-w-card--wash .ione-w-small{line-height:1.65}
.ione-w-split--form .ione-w-card--dk .ione-w-h4{margin-bottom:8px;color:var(--ione-w-paper)}
.ione-w-split--form .ione-w-card--dk a{color:var(--ione-w-h4)}

/* ── Anchor buttons against the shared sheet (W13) ──────────────────────────
   The root layout links infoc.com's site.css on every site, and that sheet
   carries `body.ioc-site a{color:inherit}` at (0,1,2) — an element, a class
   and an element. The pack states the button family at (0,1,0) — `.btn`, `.btn--p`, `.btn--h`, `.btn--g` — so on
   an <a> the leaked rule outranks all four and the header's "Talk to us"
   rendered black on near-black, the hero CTA's label dark on blue. Measured
   in the browser: the winning rule was site.css's, not this sheet's.

   Every other pack rule that colours an anchor is already at (0,1,1) or
   higher (`.ctc dd a`, `.ft li a`, `.rail a`, `.nav a.on`, `.dk .btn`), ties
   or beats the leak and wins by loading later. Only the four button classes
   need lifting, and only for colour: `body a.ione-w-btn--p` ties the leak at
   (0,1,2) and wins by order. A first cut used `a.ione-w-btn--p` alone, which
   is (0,1,1) and loses on weight however late it loads — measured, and it did — every other declaration still
   arrives from the class rule. The wholesale fix is serving this site its own
   sheet ALONE (recorded against CMS-D-221 as the open item); this is the
   narrowest correct repair until then. ── */
body a.ione-w-btn{color:var(--ione-w-t1)}
body a.ione-w-btn--p{color:var(--ione-w-paper)}
body a.ione-w-btn--h{color:var(--ione-w-paper)}
body a.ione-w-btn--g{color:var(--ione-w-t2)}
body a.ione-w-btn--g:hover{color:var(--ione-w-t1)}
body .ione-w-dk a.ione-w-btn{color:var(--ione-w-paper)}
body .ione-w-dk a.ione-w-btn--p{color:var(--ione-w-b)}

/* ── W14 · the shapes the pack draws that no rule had ──────────────────
   Every one of these re-states something the pack sets inline or on a bare
   selector the namespacer dropped. Values are the pack's, snapped to the T23
   scale; every colour resolves to a token.

   1 · THE BEACON CARD. The pack puts the mark BESIDE the copy on /product's
       six Beacons and paints it the ONE AI accent, both inline. The ground
       modifier carries the accent by name (`--ai`) and the copy column makes
       the row possible. */
.ione-w-card--ai{display:flex;gap:12px;align-items:flex-start}
.ione-w-card--ai>.ione-w-card__i{flex:none;width:32px;height:32px;margin-bottom:0;background:var(--ione-w-surface-ai);color:var(--ione-w-paper)}
.ione-w-card--ai>.ione-w-card__c{flex:1;min-width:0}

/* 2 · THE TITLE ROW. A card with a chip states the two on one baseline, the
       chip pushed to the end; a card without one is unchanged, because an
       empty chip does not render at all. */
.ione-w-card__t{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.ione-w-card__t h4{margin-bottom:0}
.ione-w-chip:empty{display:none}

/* 3 · THE REGISTER LINE — six /about cards name what the role touches. Mono,
       small and quiet; collapsed entirely on the ninety cards without one. */
.ione-w-card__reg{margin-top:8px;font-size:12px;line-height:1.5;color:var(--ione-w-t3)}
.ione-w-card__reg:empty{display:none}

/* 4 · THE RUN LINE — the Beacons' last outcome, under a hairline. */
.ione-w-card__run{margin-top:8px;padding-top:8px;border-top:1px solid var(--ione-w-line)}
.ione-w-card__run b{color:var(--ione-w-t2)}

/* 5 · THE PILL CARD — one card, two columns, a row of pills. Three bands end
       with one. `--pills` only sets the split's proportions; the ground is the
       card's own. */
.ione-w-split--pills{grid-template-columns:1fr 1.4fr;align-items:center;gap:24px}
.ione-w-card--pills{margin-top:24px}
.ione-w-card--pills h4{margin-bottom:4px}
.ione-w-card--dk.ione-w-card--pills .ione-w-pill{background:rgba(255,255,255,.06);border-color:var(--ione-w-b-line2);color:rgba(255,255,255,.8)}
/* The pack paints the prohibit mark a rose that reads on ink; it lives inline
   there, so it has no generated token and gets one here. */
:root{--ione-w-bad-on-dk:#E0899F}
.ione-w-card--dk.ione-w-card--pills .ione-w-pill .ione-w-ic{color:var(--ione-w-bad-on-dk)}
.ione-w-pill .ione-w-ic{width:14px;height:14px;flex:none;color:var(--ione-w-ok-t)}

/* 6 · THE OFFICE CARD (/about) — the contact band's anatomy with no form, so
       the two columns are even and the reach list has no fifth row. */
.ione-w-split--office{grid-template-columns:1fr 1fr;align-items:center;gap:24px}
.ione-w-split--office h3{margin-bottom:8px}
.ione-w-split--office .ione-w-k{display:block;margin-bottom:12px}
.ione-w-split--office .ione-w-cta-row{margin-top:16px}

/* 7 · THE HEAD'S SECOND PARAGRAPH. Two bands carry one; on the rest the slot
       renders empty and must take no room. */
.ione-w-sec-h>.ione-w-body{margin-top:16px}
.ione-w-sec-h>.ione-w-body:empty{display:none}

/* 8 · A HIDDEN SLOT IS HIDDEN. `.ione-w-plan li{display:flex}` outranks a
       single class, so every collapsed plan feature and every unused pill row
       rendered as a blank line. The islands toggle the `hidden` ATTRIBUTE and
       never this class, so nothing else is affected. */
.ione-w-hidden{display:none!important}

/* 9 · A PILL ROW is a pill, not a card. The split's point list serves both,
       so a row that carries no mark and no prose must not keep their boxes:
       the pack states its eight Compass jobs as eight words. */
.ione-w-pill h4{margin:0;font:inherit;font-weight:500}
.ione-w-pill p:empty{display:none}
.ione-w-g4>.ione-w-pill,.ione-w-g2>.ione-w-pill{justify-content:center}

/* 10 · THE FOOTER GROUND, as the pack finally states it — not as `.dk` states
        it. The pack keeps overriding its own footer down the sheet, and W14
        copied the `.dk` twin from the middle of that cascade instead of
        following it to the end. Five things were wrong: the ground (the pack
        settles on #0B0B0D at :681, not `--b`); the top padding it needs to
        clear the lattice; the MASK (a bottom-up linear fade at :609, not the
        top-right radial the dark bands use); the tile fill (.030 at :683); and
        the corner lights, which the pack turns off outright at :682 and W14
        added. Text is .74 white at :712. */
.ione-w-footer{position:relative;overflow:hidden;background:var(--ione-w-c-0b0b0d);color:rgba(255,255,255,.74);padding:clamp(48px,6vw,80px) 0 32px}
.ione-w-footer p,.ione-w-footer .ione-w-ft a{color:rgba(255,255,255,.74)}
.ione-w-footer::before{content:"";position:absolute;left:50%;bottom:0;top:auto;transform:translateX(-50%);width:var(--ione-w-lat-w,100%);height:var(--ione-w-lat-h,100%);z-index:0;pointer-events:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='52' height='52'><rect x='3' y='3' width='46' height='46' rx='7' fill='rgba(255,255,255,0.030)'/></svg>");background-repeat:repeat;background-position:left top;background-size:var(--ione-w-lat-p) var(--ione-w-lat-p);mask-image:linear-gradient(180deg,transparent 0%,transparent 38%,rgba(0,0,0,.55) 66%,var(--ione-w-c-000000) 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,transparent 38%,rgba(0,0,0,.55) 66%,var(--ione-w-c-000000) 100%)}
/* The pack disables the corner lights on the footer outright (:682). W14 gave
   it the `.dk` pair, which lit a corner the design had switched off. */
.ione-w-footer::after{display:none}
.ione-w-footer>*{position:relative;z-index:2}
/* THE TILES AND THE SOCIAL ROW RIDE THE LATTICE FROM HERE, not from an inline
   style. Where they land is viewport-dependent and only the client can measure
   it, but both boxes are rendered by OneChromeShell, so React reconciles them
   at hydration — and the island ships `defer`, which runs BEFORE React
   hydrates. An inline `transform` written there was an attribute React’s tree
   did not have, and React reported a hydration mismatch on every page of the
   site. The island now publishes the measurement on `<html>` (already
   `suppressHydrationWarning`) and the transform is applied here instead.

   The `0px` fallbacks matter: with JS off, or before the first pass, the boxes
   must sit exactly where the un-transformed layout puts them. */
.ione-w-ftapps{transform:translate(var(--ione-w-ftapps-x,0px),var(--ione-w-ftapps-y,0px))}
.ione-w-ftsoc{transform:translateX(var(--ione-w-ftsoc-x,0px))}
/* Whole squares only, the way the pack’s own fitter trims the box. */
@supports (width: round(down, 100px, 52px)){
  .ione-w-footer::before{width:round(down,100%,var(--ione-w-lat-p));height:round(down,100%,var(--ione-w-lat-p))}
}

/* 11 · THE REACH ROWS. The pack states a phone as ink mono and an e-mail as a
        house-blue link in the sans face. Both are anchors here, because a
        phone number a visitor cannot tap is worse than the pack's span, so the
        FACE and the COLOUR are keyed by the scheme instead of by the markup. */
.ione-w-ctc dd a[href^="tel:"]{color:var(--ione-w-t1)}
/* ...and the pack's "sans face" for that e-mail is INTER, not the display
   face. The pack's own markup is the evidence: in the `ctc` list a phone row
   is `<b class="mono">` and an e-mail row is a bare `<b>`, so the e-mail falls
   through to `body{font-family:var(--sans)}`. This site renders every reach
   value inside a mono `<b>`, so the rule still has to undo the mono — it just
   has to undo it to the PACK sans. Measured: once the bridge above was
   corrected, two anchors on /contact and one on /about were the only elements
   left in Figtree anywhere on the site. */
.ione-w-ctc dd a[href^="mailto:"]{font-family:var(--ione-w-sans)}

/* ── W15 · the pack's own colour, geometry and motion, where they were lost ──

   12 · THE CASCADE ACCENTS. The pack gives each of the seven consequence rows
        its application's colour, set INLINE as `--ca:#0E8977`. A hex may not
        ride a template (CMS-D-066), so the row carries `data-app` and the
        accent is keyed off it here — the same idiom the footer tiles use. With
        no rule to key on, all seven rows fell back to one house blue, and the
        band whose whole point is "seven systems, one event" said it in one
        colour. Peppol takes the Voce surface because the pack paints them the
        same blue, not because they are the same thing. */
.ione-w-casc__r[data-app="erp"]{--ione-w-ca:var(--ione-w-surface-erp)}
.ione-w-casc__r[data-app="crm"]{--ione-w-ca:var(--ione-w-surface-crm)}
.ione-w-casc__r[data-app="wms"]{--ione-w-ca:var(--ione-w-surface-wms)}
.ione-w-casc__r[data-app="epm"]{--ione-w-ca:var(--ione-w-surface-epm)}
.ione-w-casc__r[data-app="peppol"]{--ione-w-ca:var(--ione-w-surface-voce)}
.ione-w-casc__r[data-app="ai"]{--ione-w-ca:var(--ione-w-surface-ai)}

/* 13 · WHOLE SQUARES ON EVERY DARK BAND, not only the footer. The pack's own
        fitter trims each dark ground to a whole number of 52px tiles so no
        column is a sliver; the footer got that treatment at W14 and the four
        `.dk` bands did not. */
@supports (width: round(down, 100px, 52px)){
  .ione-w-dk::before{left:50%;transform:translateX(-50%);width:round(down,100%,var(--ione-w-lat-p));height:round(down,100%,var(--ione-w-lat-p))}
}

/* 14 · THE MOCK'S ONE BADGE, drawn like the real one. The box keeps the pack's
        22px; the word and the corner are viewBox geometry now, so the badge is
        the brand lockup at a smaller size instead of a hard square with the
        word spilling out of it. `width`/`height` are not on any scale the T23
        gate grades, and are the pack's own numbers. */
/* CMS-D-239: the badge is the master INFOC ONE tile (design/brand), not the
   word "ONE" set in JetBrains Mono on a #0F43D6 square. The tile carries its
   own ground, corner and outlined letters, so the span only sizes it. */
.ione-w-ap__m{background:none;border-radius:0}
.ione-w-ap__m img{width:22px;height:22px;display:block}

/* THE SAME BADGE ON THE SUITE DASHBOARD, and so the same treatment. The pack
   sets this one as the word "ONE" in its mono face on a white wash; W15 drew
   it as viewBox text so it would fit its 20px box, but the word was still
   mono. CMS-D-239 makes it the master tile too, on all fourteen app screens:
   outlined letters on the tile's own ground, so no face renders it and
   nothing overflows the box. */
.ione-w-atd__m{background:none;border-radius:0}
.ione-w-atd__m img{width:20px;height:20px;display:block}

/* 15 · A ONE-COLUMN POINT LIST. A split whose point list is a single block —
        the home page's "Above the ledger" card, the Voce card — has no grid in
        the pack at all, and the two-column default rendered it at half the
        measure with a column of air beside it. */
.ione-w-g1{display:grid;grid-template-columns:1fr;gap:16px}
/* AND IT NEEDS AIR ABOVE IT. The pack carries that separation as an inline
   style — `<div class="card card--dk" style="margin-top:26px">` at
   index.html:146 — and inline styles do not survive the port, so the group
   rendered hard against whatever precedes it: a measured 0px gap under the
   CTA row on the home page ("See the eight apps" touching "Above the
   ledger"), and the same 0px under the body copy on /product. Both of the
   site's two g1 groups had it.

   26px on the house scale is the 24px step — the one the CTA row directly
   above it already uses, so the two reads as one rhythm. `:not(:first-child)`
   keeps a group that opens its container flush, which is what the pack does
   on /product, where the card is the first thing in its own column. */
.ione-w-g1:not(:first-child){margin-top:24px}

/* 16 · THE OPENING PASS. The pack states the overlay on a bare `#heroIntro`,
        and the pack-layer generator keeps CLASSES — so the base rule was
        dropped and only the `.hi--out` fade survived. Restated here on the
        class the hero carries. It is hidden until the island adopts it, so a
        visitor with no JS never sees a black box; and it is gone entirely for
        anyone who asked for less motion. */
.ione-w-hi{display:none}
.ione-w-hi:has(canvas){display:block;position:fixed;inset:0;z-index:200;background:var(--ione-w-c-000000);overflow:hidden;opacity:1;transition:opacity .65s ease}
.ione-w-hi__f i svg{width:21px;height:21px;display:block}
/* CMS-D-239: the centre mark is the master INFOC ONE tile. It fills the cell
   the island measures and brings its own ground and corner, so the pack's
   #0F43D6 square behind it goes. */
.ione-w-hi__m{background:none}
.ione-w-hi__m img{width:100%;height:100%;display:block}
@media (prefers-reduced-motion:reduce){.ione-w-hi{display:none!important}}

/* 17 · W16 — the two geometry values the scale could not carry.

   A percentage radius has no px step to snap to, so `snapRadius` maps it
   against {0, 50%} and 15% lands on 0. That squared the ONE Voce tile and the
   intro's centre mark, which the design review saw as a hard blue box. The
   design doc's rule is "size follows surface", so each takes the step its own
   surface asks for — both on the scale, neither a respelling. CMS-D-239 made
   the centre mark the master tile, whose corner is its own drawing, so only
   the Voce tile keeps a rule here. */
.ione-w-vtile{border-radius:var(--ione-r-md)}

/* The listening rings centre on a point with `margin:-5px 0 0 -5px` in the
   pack. The space scale has no negative steps, so it snapped to 0 and the
   rings bloomed from the corner instead of the centre. The offset moves into
   the POSITION rather than into `transform`: the ring keyframes animate
   `transform: scale()`, so a translate here would be overwritten the moment
   the animation starts and the centring would come and go with it. `left` and
   `top` are not spacing properties, and `calc()` is exempt by the T17 clamp
   ruling the scale gate follows. */
.ione-w-vring{margin:0;left:calc(22.5% - 5px);top:calc(50% - 5px)}
/* 23 · THE COMPOSITION THE PACK STATES IN INLINE STYLES.

   177 inline `style=` declarations across the twelve pack pages carry a
   font-size, a max-width or a margin. The CMS drops every one of them, and
   that is right: an inline style is markup no editor can see or govern, and
   the kit binds text, url and attr only so a binding can never inject markup.
   Three of those groups are COMPOSITION rather than micro-rhythm, and losing
   them was measurable on every route.

   HERO SCALE. Eleven of the twelve pages open with
   `<h1 style="font-size:clamp(34px,4.4vw,54px)">` — partners with
   `clamp(32px,4.2vw,52px)` — against a base of `clamp(38px,5.4vw,68px)`.
   Without them all twelve rendered the HOME hero's 68px step, and /about broke
   "Singapore-" / "engineered since 2012." mid-word. Only index is meant to be
   68px and it keeps it: this modifier rides B-01-V82, the standard page hero,
   while the home hero is B-01-V83 and never wears it.

   HERO MEASURE. `hero__in` at 820px on nine pages and 860px on product and
   partners, over a 900px base; the lede at 58ch on nine and 60ch on those same
   two, over `.ione-w-hero .ione-w-lede{max-width:60ch;margin:0 auto}`. So the
   lede ran a full measure step wide on nine routes and started hard against
   the headline on all eleven.

   THE TWO OUTLIERS RIDE THE BLOCK INSTANCE, not a second variant. The pack
   states product and partners differently and there is nothing structural to
   key on — eleven pages share one variant, one band and one markup, and the
   only per-page hook the kit emits is `data-block-instance`, whose shape is
   `p-<slug>-r<NN>-s<NN>`. It is server-rendered and present with JavaScript
   disabled, so nothing here depends on an island. Matched on the SLUG PREFIX
   so a re-ordered row cannot silently unstyle a hero, and stacked on the
   modifier so specificity carries it whatever the source order.

   TWO PLACES THIS DOES NOT REPRODUCE THE PACK BYTE FOR BYTE, both the T23
   scale, both the snap build-pack-layer.mjs applies to every literal it ports
   (owner direction 2026-09-04: re-express, do not widen the gate): the lede's
   18px top margin takes the 16px step, and the cascade note's 22px takes 24px.
   Respelling either as a rem or a calc() to slip past the detector would be
   exactly the drift the gate exists to catch, so neither is done. max-width is
   ungraded and the clamps are exempt, so every hero value is the pack's own.

   THE CASCADE NOTE. index.html:342 caps the consequence band's closing line at
   78ch. Uncapped it was the widest paragraph on the site — 1,125px and 155
   characters on one line, against the pack's 664px. B-12-V83 renders on the
   home page only. */
.ione-w-hero--page .ione-w-hero__in{max-width:820px}
.ione-w-hero--page .ione-w-h1{font-size:clamp(34px,4.4vw,54px)}
.ione-w-hero--page .ione-w-lede{max-width:58ch;margin-top:16px}
.ione-w-hero--page[data-block-instance^="p-product-"] .ione-w-hero__in,
.ione-w-hero--page[data-block-instance^="p-partners-"] .ione-w-hero__in{max-width:860px}
.ione-w-hero--page[data-block-instance^="p-product-"] .ione-w-lede,
.ione-w-hero--page[data-block-instance^="p-partners-"] .ione-w-lede{max-width:60ch}
.ione-w-hero--page[data-block-instance^="p-partners-"] .ione-w-h1{font-size:clamp(32px,4.2vw,52px)}
.ione-w-casc__note{max-width:78ch;margin-top:24px}

/* B-02-V82's numerals default to paper. `.ione-w-statw` carries its own dark
   card, and the pack's accents only reach `:nth-child(1..4) b` because the pack
   never mounts a fifth cell. About mounts five. Without this the fifth numeral
   inherits the band's ink and sits on #151519 — the same white-on-white class of
   defect this variant just came out of, one cell wide. Specificity keeps the
   accents: `.ione-w-statw:nth-child(1) b` is (0,2,1) against this (0,1,1), so
   the four coloured cells are unaffected wherever this rule sits in the file. */
.ione-w-statw b{color:var(--ione-w-paper)}
/* 24 · THE SUITE MEGA-MENU (F9). Almost none of this panel needs authoring:
        `.ione-w-mm`, `.ione-w-mm__in`, `.ione-w-mm__k`, `.ione-w-mm__g`,
        `.ione-w-mmi`, `.ione-w-mmi__i`, `.ione-w-mmr`, `.ione-w-mm__rail`,
        `.ione-w-mm__soc`, `.ione-w-nav a.ione-w-mmt`, the 1180px reflow and the
        reduced-motion entries all came across with site.css and have been
        dressing NOTHING since W2, because the pack builds this panel in site.js
        and the port only ever read HTML. Three things the generator could not
        carry across, and one deliberate addition.

   ① THE FOURTEEN ACCENTS. The pack writes each mark's ground as an inline
      `style="background:#077A8E"`, which CMS-D-066 keeps out of product markup
      and out of an editor's reach. Derived from the destination anchor instead
      — the same fourteen `--ione-w-surface-*` tokens the suite wall's cards and
      the footer's tiles already resolve, so one fact keeps one binding and the
      seed never holds a colour. Suffix match on the href the store holds
      (`/suite#erp`); nothing else on this site ends that way.

   ② THE CARET'S ROTATION. `twinIconSelectors` gives a pack rule an
      `.ione-w-ic` twin only where the rule states a `font-size`, because it is
      the SIZING rules that would otherwise select nothing once the webfont is
      gone. The pack states the rotation on its own —
      `.nav a.mmt[aria-expanded="true"] i{transform:rotate(180deg)}` — with no
      font-size, so it got no twin, and the disclosure caret would have pointed
      down while the panel stood open.

   ③ THE SOCIAL ROW'S RESTING COLOUR. The kit's own link reset
      `body.ioc-site a{color:inherit}` is (0,1,2); the pack's
      `.ione-w-mm__soc a{color:var(--ione-w-t2)}` is only (0,1,1), so the reset
      wins on specificity wherever it sits and the four marks render at the
      inherited ink. Restated one level deeper. The hover half is restated WITH
      it and that is not decoration: without the second line THIS rule would
      then outrank the generated `:hover`, and the marks would stay dark ink on
      the house-blue hover ground — measured, both ways.

   AND ONE ADDITION TO THE PACK'S REDUCED-MOTION SET, named rather than
   smuggled. The pack lists `.mmi`, `.mmi__i` and `.mm__soc a` there and omits
   the caret, whose 180° rotation is the one transform this component adds that
   a visitor who asked for less motion would otherwise still see. No new value:
   the same `transition:none` the pack states for its own list. ── */
.ione-w-mmi[href$="#erp"] .ione-w-mmi__i{background:var(--ione-w-surface-erp)}
.ione-w-mmi[href$="#hrm"] .ione-w-mmi__i{background:var(--ione-w-surface-hrm)}
.ione-w-mmi[href$="#crm"] .ione-w-mmi__i{background:var(--ione-w-surface-crm)}
.ione-w-mmi[href$="#pos"] .ione-w-mmi__i{background:var(--ione-w-surface-pos)}
.ione-w-mmi[href$="#wms"] .ione-w-mmi__i{background:var(--ione-w-surface-wms)}
.ione-w-mmi[href$="#epm"] .ione-w-mmi__i{background:var(--ione-w-surface-epm)}
.ione-w-mmi[href$="#psa"] .ione-w-mmi__i{background:var(--ione-w-surface-psa)}
.ione-w-mmi[href$="#ai"] .ione-w-mmi__i{background:var(--ione-w-surface-ai)}
.ione-w-mmi[href$="#vantage"] .ione-w-mmi__i{background:var(--ione-w-surface-vantage)}
.ione-w-mmi[href$="#almanac"] .ione-w-mmi__i{background:var(--ione-w-surface-almanac)}
.ione-w-mmi[href$="#commerce"] .ione-w-mmi__i{background:var(--ione-w-surface-commerce)}
.ione-w-mmi[href$="#cms"] .ione-w-mmi__i{background:var(--ione-w-surface-cms)}
.ione-w-mmi[href$="#compass"] .ione-w-mmi__i{background:var(--ione-w-surface-compass)}
.ione-w-mmi[href$="#voce"] .ione-w-mmi__i{background:var(--ione-w-surface-voce)}
.ione-w-nav a.ione-w-mmt[aria-expanded="true"] .ione-w-ic{transform:rotate(180deg)}
.ione-w-mm .ione-w-mm__soc a{color:var(--ione-w-t2)}
.ione-w-mm .ione-w-mm__soc a:hover{color:var(--ione-w-paper)}
/* ONE LINE THE PACK DOES NOT STATE, KEPT DELIBERATELY. site.css:955 lists
   .mmi, .mmi__i and .mm__soc a in its reduced-motion block and omits the
   caret, whose .18s rotation is the one panel transition left running. That
   reads as an oversight rather than a decision: the rule below invents no
   value, reuses the pack own transition:none, and an added motion that a
   reduced-motion preference cannot stop is the one thing this port may not
   ship. Recorded here because anti-drift rule 1 forbids adding it silently. */
@media (prefers-reduced-motion:reduce){.ione-w-nav a.ione-w-mmt .ione-w-ic{transition:none}}
/* 25 · THE OPENING PASS MOVES BY TRANSFORM, and its glyphs need an origin to
        move from. The generated pack layer states `will-change:left,top` on
        these because `left`/`top` is what the pack's `hero-intro.js` animates —
        and an absolutely positioned box that changes `left`/`top` changes its
        LAYOUT position, which Chrome scores as a layout shift. Ten glyphs
        re-celling every 150ms for two seconds scored 0.1112 of the home page's
        0.1501 CLS, on an overlay the visitor sees for two seconds and never
        scrolls. `initIntro`'s `tick` now writes a transform instead — same
        arithmetic, same cell, not a layout change — so the hint here names the
        property that actually moves.

        `left:0;top:0` is the origin the transform is measured from, stated once
        rather than written onto every glyph on every frame. It reaches only the
        RIDING glyphs: the ten anchored ones carry their own inline `left`/`top`
        from `build()`, and an inline style outranks a stylesheet rule. Same
        specificity as the generated rule (0,1,1), later in the same file, so
        position is the tiebreak — the pack layer is rewritten whole on every
        regeneration and this must not live inside it. T23 grades font-size,
        line-height, letter-spacing, radius and spacing; `left`, `top` and
        `will-change` are none of those. */
.ione-w-hi__f i{left:0;top:0;will-change:transform}

/* 26 · THE CONSENT CARD TAKES THE FREE CORNER. Placement only — the card is CMS
        chrome the pack has no equivalent for, so where it sits is ours to
        decide, and nothing here touches what it says (CMS-D-187 / T19 governs
        the disclosure text; this rule moves the box and nothing else).

        The kit pins it bottom-LEFT at `left:20px`, which on this site lands it
        on the hero's ledger figure. Measured at 1440x900: 99,424 px² over
        `.ione-w-lh--reg` — the labelled "ERP · Sales invoices" panel the figure
        is read from, at x 20..480 / y 615..911 — plus 27,846 px² of the ledger
        itself; 127,270 px² in all, with the register panel unreadable on first
        paint.

        Bottom-right is free HERE, and only here: it is where the kit already
        puts its other bottom-fixed overlay (`.sh-chat`, kit `right:20px`), and
        this site renders no chat launcher and no assistant, so nothing stacks
        and the runtime's measured `--lift-bottom` is untouched (it stays 20px
        before and after, and this site has no `.ioc-footer .legal` for the lift
        to find). After: 0 px² over the register panel, 61,872 px² in all at
        1440x900, and less of the figure covered at every width from 1101 to
        1920 — between 44% and 80% less.

        1101px, not 561px, because below the 1100px breakpoint this sheet
        already uses, the figure collapses to one centred column: the register
        panel is no longer under the card at all, and moving right only adds the
        phone panel. Measured at 1100x900 the move was 25% WORSE. The kit's own
        `max-width:560px` full-width rule is left untouched, which is why this is
        a min-width query and not a flat override.

        `.sh-` is not `.ioc-`: the skin contract's ban (DESIGN.md, "What the
        system does NOT reach") names the kit's `.ioc-` classes, and this sheet
        is concatenated into `site-infoc-one.css`, which is linked on
        www.infoc.one and nowhere else — infoc.com links site-infoc-com-v7.css,
        infoc.ai site-infoc-ai.css, infoc.in site-infoc-in.css, all verified in
        a browser — so this rule cannot reach another site. */
@media (min-width:1101px){.sh-cookie{left:auto;right:20px}}

/* 27 · THE FOOTER'S LINK TRANSITION. The pack states it once, as
        `.ft__c a,footer a{transition:color .16s ease}` (site.css:953), and
        `.ft__c` is on no element of any of the twelve pages — so the whole
        rule rode the bare `footer a` half, which `dropBareParts` removes for
        the reason the generator gives: a bare selector in that layer would
        reach the kit's own chrome. Nothing restated it. Measured on the home
        page, thirty anchors lost the fade: the four link columns' twenty-six
        links, whose `.ft li a:hover{color:#fff}` (site.css:471) still fires
        and now fires instantly; the legal row's three; and the footer
        wordmark. It is the only transition rule in the sheet lost this way —
        `#heroIntro` at :1158 was the other, and section 16 already has it.

        Restated on the class the shell puts on the element
        (`OneChromeShell.tsx:272`) at ZERO specificity, so `.ione-w-ftsoc a`
        (0,1,1) and `.ione-w-ftapp` (0,1,0) keep their own longer transitions
        exactly as they outrank `footer a` in the pack.

        NO REDUCED-MOTION TWIN, because the pack states none: its
        prefers-reduced-motion block (site.css:954-957) lists the ten selectors
        that MOVE, and no footer anchor is among them. A colour change is not
        motion. */
:where(.ione-w-footer) a{transition:color .16s ease}


/* 28 · THE ICON VOCABULARY'S MARKS. The pack draws each cell of `.gridvoc`
        with a Phosphor icon font at `font-size:19px` (site.css:731-734), and
        both halves of that are unportable: there is no icon font here, so the
        cell holds a sprite `<use>` whose box is `.ione-w-ic` (1em), and 19px
        is not a step on the T23 scale, so the pack-layer generator snapped the
        cell's own font-size to 18px. Stating the MARK's box in width/height
        restores the pack's 19px without putting an off-scale font-size back
        into the sheet — the same repair section 16 makes for the intro
        field's 21px marks.

        The glow moves with it. `.ione-w-gridvoc i` still carries the pack's
        `text-shadow:0 0 10px rgba(255,255,255,.55)`, which is inert on an
        `<svg>` child; `drop-shadow` is the same blur, the same colour and the
        same alpha in the medium the mark actually uses. Every value here is
        the pack's own, read from site.css:731-734 — none is new. */
.ione-w-gridvoc i svg{width:19px;height:19px;display:block;filter:drop-shadow(0 0 10px rgba(255,255,255,.55))}
/* ── W17 · the band seams the wrapper broke (CMS-D-215) ────────────────────
   The pack composes vertical rhythm out of ADJACENCY. Six sibling selectors
   and one `:has()` in `site.css` (:87, :90, :92, :545, :547, :1103) read each
   section against the one before it: the first tight section under the hero
   drops its top padding so the two read as one opening; a tight section
   handing straight down to the walkthrough rail drops its bottom; a tight band
   that continues the same ground drops the seam above it; and a dark run drops
   its lattice so two dark bands read as ONE field.

   Every one of those selectors was DEAD here, and none of them was reported
   missing, because the CLASSES are all present. The CMS wraps each band in its
   own `<section class="page-layout-row layout-full">` and the band sits at
   depth 2 inside it — `row > .page-layout-cell > band`, measured on 62 of 62
   rows across the twelve routes — so NO TWO BANDS ARE EVER SIBLINGS.
   `.ione-w-tight` matched four elements on the home page while
   `.ione-w-hero + section.ione-w-tight` matched none, which is the whole
   defect in one line: nine routes opened with a band of dead space under the
   hero, the home page carried three more seams that should have been closed,
   and its two dark bands each drew their own grid. Measured pack-against-live
   on the computed box of all 62 band rows: 12 rows wrong, 0 after this.

   Re-expressed against the WRAPPER rather than baked into the composer. The
   seam is a function of what is actually next to what, and `:has()` recomputes
   it whenever the CMS reorders, inserts or removes a row; a modifier written
   into the stored page would go stale the first time an editor moved a band
   and would need a reseed to reach a page that is already published. The pack
   itself states one of these rules with `:has()`, and this skin already
   carries nineteen more, so the mechanism is the design's own.

   NOT scoped to a site class, and it does not need one: this sheet is the last
   part of `site-infoc-one.css`, served to no other host, and every selector
   below names an `.ione-w-*` class at BOTH ends — classes infoc.com, infoc.ai
   and infoc.in never emit. A rule keyed on `.page-layout-row` alone would leak
   to all four sites.

   The `> .page-layout-cell >` child steps are load-bearing, not decoration:
   `dk` and `wash` are section GROUNDS, and a descendant `:has()` would also
   fire on a dark card nested inside a light band. Nothing here animates, so
   there is no reduced-motion arm to port. ── */

/* 18 · THE HERO SEAM. `site.css:87`. Nine of the twelve routes open with a
        tight band under the hero and all nine rendered 72px of dead space at
        the join. */
.page-layout-row:has(> .page-layout-cell > .ione-w-hero) + .page-layout-row > .page-layout-cell > .ione-w-tight{padding-top:0}

/* 19 · THE RAIL SEAM. `site.css:90` — the pack's own `:has()`, moved up one
        level. A band handing straight down to the walkthrough rail closes its
        own bottom so the rail reads as part of the same block. `.ione-w-rail`
        occurs exactly once in the whole variant set, so the descendant step
        inside `:has()` is unambiguous. */
.page-layout-row:has(+ .page-layout-row .ione-w-rail) > .page-layout-cell > .ione-w-tight{padding-bottom:0}

/* 20 · THE CONTINUATION SEAMS. `site.css:92`. A tight band closes its top only
        when it CONTINUES the ground above it — two grounds, two rules, exactly
        as the pack states them. */
.page-layout-row:has(> .page-layout-cell > .ione-w-dk) + .page-layout-row > .page-layout-cell > .ione-w-dk.ione-w-tight{padding-top:0}
.page-layout-row:has(> .page-layout-cell > .ione-w-wash.ione-w-tight) + .page-layout-row > .page-layout-cell > .ione-w-wash.ione-w-tight{padding-top:0}

/* 21 · A DARK RUN IS ONE FIELD. `site.css:545`. The second dark band in a run
        drops the lattice pattern so the two grounds read as one surface;
        without it the home page's two dark bands each drew their own 52px grid
        and the run read as two slabs.

        `site.css:547` — the `::after` twin of this rule — is deliberately NOT
        ported. It is dead in the pack as well: `site.css:682` supersedes it
        with `.dk::after{display:none!important}` on EVERY dark band, the
        generated block above already carries that, and the corner light
        measures off on all four dark bands here exactly as it does in the
        pack. Porting it would add a rule that changes nothing. */
.page-layout-row:has(> .page-layout-cell > .ione-w-dk) + .page-layout-row > .page-layout-cell > .ione-w-dk::before{background-image:none}

/* 22 · AND A WASHED RUN IS ONE SURFACE. `site.css:1103`. `.ione-w-wash` wears
        a 1px top hairline; a second wash directly under it drops it, or the
        join reads as a rule drawn across the page. */
.page-layout-row:has(> .page-layout-cell > .ione-w-wash) + .page-layout-row > .page-layout-cell > .ione-w-wash{border-top:0}

/* ──────────────────────────────────────────────────────────────────────────
 * B-05-V84 — the product walkthrough band.
 *
 * Every value is a pack token. No literal colour, no literal font, and no
 * radius outside the pack's two steps (--ione-w-r 8px / --ione-w-r2 12px), so
 * T23 grades this at zero when it lands in the authored skin.
 *
 * PROGRESSIVE ENHANCEMENT IS THE WHOLE SHAPE OF THIS FILE. Without the island
 * the nine steps are static, stacked, each under its own capture, and every
 * word is readable. `.ione-w-wt--live` is added by the island and is what
 * turns the stack into a player. Nothing is hidden in the markup.
 * ────────────────────────────────────────────────────────────────────────── */

.ione-w-wt {
  border: 1px solid var(--ione-w-line);
  border-radius: var(--ione-w-r2);
  background: var(--ione-w-paper);
  overflow: hidden;
}

/* ── the no-JS state: a readable stack ─────────────────────────────────── */
.ione-w-wt__shot + .ione-w-wt__shot { border-top: 1px solid var(--ione-w-line); }
.ione-w-wt__shot img { width: 100%; height: auto; display: block; }
.ione-w-wt__note { padding: 24px; }
.ione-w-wt__note h3 {
  margin: 8px 0 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--ione-w-t1);
  text-wrap: pretty;
}
.ione-w-wt__note p {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 1.65;
  color: var(--ione-w-t2);
  max-width: 68ch;
}

/* ── the live state ────────────────────────────────────────────────────── */
.ione-w-wt--live .ione-w-wt__well {
  position: relative;
  aspect-ratio: 1643 / 970;
  background: var(--ione-w-wash2);
}
.ione-w-wt--live .ione-w-wt__shot {
  position: absolute;
  inset: 0;
  border-top: 0;
  opacity: 0;
  transition: opacity 320ms ease-out;
}
.ione-w-wt--live .ione-w-wt__shot--on { opacity: 1; }
/* `contain` letterboxes the one capture with a different ratio (the four-phone
   Compass, 2640x1300) rather than cropping a phone off the end of it. */
.ione-w-wt--live .ione-w-wt__shot img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.ione-w-wt--live .ione-w-wt__note { display: none; }

/* The renderer inserts its <img> INTO this span, so the span has to be the box
   the image fills — otherwise the capture sizes to an inline element. */
.ione-w-wt--live .ione-w-wt__fig { position: absolute; inset: 0; display: block; }

/* A STEP WITH NO CAPTURE DRAWS ITS OWN WORDS. Steps 04 and 09 are type on a
   ground, and `data-infoc-media-slot` inserts nothing for them — without this
   they would be an empty 1643x970 box. `:has()` asks the only question that
   actually matters (did a capture arrive?) rather than trusting a flag the
   composer might not set. The rail suppresses its caption for these steps, so
   the words are said once. */
.ione-w-wt--live .ione-w-wt__shot:not(:has(img)) .ione-w-wt__note {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: absolute;
  inset: 0;
  padding: 0 10%;
  text-align: center;
  background: var(--ione-w-wash);
}
.ione-w-wt--live .ione-w-wt__shot:not(:has(img)) .ione-w-wt__note h3 {
  margin: 0;
  font-size: clamp(22px, 2.6vw, 40px);
  letter-spacing: -0.02em;
}
.ione-w-wt--live .ione-w-wt__shot:not(:has(img)) .ione-w-wt__note p {
  margin: 0;
  font-size: clamp(16px, 1.3vw, 18px);
  max-width: 56ch;
}

/* THE CLOSE. `tone` carries `ione-w-dk` on exactly one step, which is also what
   makes the pack's own dark-ground button and kicker rules apply — the CTA
   painted near-black on near-black until this class was on the element rather
   than a colour written by hand. */
.ione-w-wt--live .ione-w-wt__shot.ione-w-dk .ione-w-wt__note {
  background: var(--ione-w-b);
  color: var(--ione-w-paper);
}
.ione-w-wt--live .ione-w-wt__shot.ione-w-dk .ione-w-wt__note h3 { color: var(--ione-w-paper); }
.ione-w-wt--live .ione-w-wt__shot.ione-w-dk .ione-w-wt__note p { color: rgba(255, 255, 255, 0.82); }


/* ── the thing to click ────────────────────────────────────────────────── */
/* The pack's halo blue is the product's own interaction colour, and on a blue
   app chrome it is the only value that reads as "this is the control". One
   entrance pulse per step, from element.animate() — never a style write, and
   never a loop: an infinite animation makes axe score a transitioning opacity
   as a contrast failure. */
.ione-w-wt__hot {
  position: absolute;
  border: 0;
  padding: 0;
  border-radius: var(--ione-w-r);
  background: rgba(15, 67, 214, 0.10);
  box-shadow: 0 0 0 3px var(--ione-w-h), 0 0 0 9px rgba(15, 67, 214, 0.20);
  cursor: pointer;
  z-index: 3;
}
.ione-w-wt__hot:hover { background: rgba(15, 67, 214, 0.20); }
.ione-w-wt__hot:focus-visible { outline: 3px solid var(--ione-w-t1); outline-offset: 3px; }
/* A step with no single target advances from anywhere in the capture. */
.ione-w-wt__any {
  position: absolute;
  inset: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  z-index: 2;
}

/* ── the rail ──────────────────────────────────────────────────────────── */
.ione-w-wt__rail {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 24px;
  padding: 24px;
  background: var(--ione-w-paper);
  border-top: 1px solid var(--ione-w-line);
}
.ione-w-wt__cap h3 {
  margin: 8px 0 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--ione-w-t1);
  text-wrap: pretty;
}
.ione-w-wt__cap p {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 1.65;
  color: var(--ione-w-t2);
  max-width: 68ch;
}
.ione-w-wt__ctrl { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.ione-w-wt__row { display: flex; align-items: center; gap: 12px; }
.ione-w-wt__of {
  font-variant-numeric: tabular-nums;
  font-size: 14px;
  font-weight: 600;
  color: var(--ione-w-t3);
  white-space: nowrap;
}

/* Nine segments, so the length of this is visible before it is begun. */
.ione-w-wt__prog { display: flex; gap: 4px; padding: 16px 24px; background: var(--ione-w-paper); }
.ione-w-wt__prog:empty { display: none; }
.ione-w-wt__seg {
  height: 3px;
  flex: 1;
  border-radius: 999px;
  background: var(--ione-w-t4);
  opacity: .32;
  transition: background 120ms ease-out, opacity 120ms ease-out;
}
.ione-w-wt__seg--on { background: var(--ione-w-h); opacity: 1; }

/* The drift stamp O5's reasoning asks for: what these captures are, and when. */
.ione-w-wt__stamp:empty { display: none; }
.ione-w-wt__stamp {
  margin-top: 12px;
  font-size: 12px;
  color: var(--ione-w-t3);
  font-variant-numeric: tabular-nums;
}

@media (max-width: 720px) {
  .ione-w-wt__rail { grid-template-columns: 1fr; align-items: start; gap: 16px; }
  .ione-w-wt__ctrl { align-items: stretch; }
  .ione-w-wt__row { justify-content: space-between; }
}

/* Reduced motion removes every transition here; the island independently skips
   element.animate(), so the pulse never runs rather than running invisibly. */
@media (prefers-reduced-motion: reduce) {
  .ione-w-wt--live .ione-w-wt__shot,
  .ione-w-wt__seg {
    transition: none;
  }
}

/* ═══ CMS-D-235 · the sister-sites row ═══════════════════════════════════
   Two placements on this site: the footer band above the legal line, and a
   phone row beside the collapsed nav. Every value is already on this skin's
   scale — 12px and 14px are steps, 0.06em is the tracked step, 8px is the
   action radius — so T23 sees no new number. The kicker takes the footer's own
   label voice (the mono `h5` the columns use) rather than the body sans: it is
   a label, and this site labels in mono. */
.ione-w-ft__net {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 16px;
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.13);
}
.ione-w-ft__netk {
  font-family: var(--ione-w-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.56);
}
.ione-w-ft__net a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.74);
}
.ione-w-ft__net a:hover {
  color: var(--ione-w-paper);
}
/* The phone row: a SIBLING of `.ione-w-nav`, revealed by the same
   `.ione-w-open` class the island puts on their shared parent. Hidden
   everywhere the inline nav is visible. */
.ione-w-net {
  display: none;
}
@media (max-width: 1080px) {
  .ione-w-top__in.ione-w-open .ione-w-net {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    order: 10;
    flex-basis: 100%;
    gap: 0 4px;
    margin-top: 4px;
    padding-top: 8px;
    border-top: 1px solid var(--ione-w-line);
  }
  .ione-w-net .ione-w-netk {
    flex-basis: 100%;
    padding: 4px 12px 0;
    font-family: var(--ione-w-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ione-w-t4);
  }
  .ione-w-net a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 14px;
    color: var(--ione-w-t2);
  }
  .ione-w-net a:hover {
    background: var(--ione-w-wash2);
    color: var(--ione-w-t1);
  }
}

/* ── CMS-D-238 — the INFOC ONE master lockup in the header and footer ──────
 * The pack's 30px mono ONE badge is retired everywhere (header, footer, hero
 * eyebrow), with its `.ione-w-brand__m` rules. The brand is the master's
 * outlined lockup, an <img> inside a <picture>.
 *   · CMS-D-239 (owner, 2026-09-14: "keep the same font size" as the wordmark
 *     on www.infoc.one). Production sets "INFOC ONE" in Figtree 750 at 16px,
 *     header and footer alike: a cap height of 11.2px. The lockup's cap is
 *     20/221 of its width, so both lockups are 124px wide (cap 11.2px), down
 *     from CMS-D-238's 221px header and 265px footer, and below the comp's
 *     20px-cap floor by the owner's ruling. The header row returns to the
 *     pack's 64px: CMS-D-238 grew it to 72px only to clear a 49px lockup.
 *   · CMS-D-240 (owner, 2026-09-14, "Option A") supersedes those sizes: every
 *     INFOC lockup on all four Sites shares one 16px cap, header and footer
 *     alike, so this one is 177px (39px tall, inside the 64px row); the footer
 *     steps to 155px (14px cap) on phones with the others
 *   · CMS-D-247 (owner, 2026-09-16) supersedes both for this Site. The header
 *     is the comp's FAMILY CUT: the grid mark then the WRITTEN name, in ink.
 *     ONE size of written name serves BOTH surfaces (owner: "footer wordmark
 *     size goes to header also and follow single") — 135px, cap 16.8px,
 *     stepping to 116px at ≤560px, so one rule below sizes header and footer
 *     alike. The comp's family-cut ratios are kept around it: the mark at
 *     1.417× the cap (24px) and the gap at the house step nearest its two
 *     thirds, 12px — T23 grades the space scale and 11 is not on it. The brand
 *     cell is 171px. 135px is a recorded departure from the comp's 180px floor
 *     for the written name, which CMS-D-247 carries.
 *   · the brand cell keeps its intrinsic width, or fixed-ratio art is squashed
 *     the way infoc.ai's header lockup once was
 *   · the brand link and the nav toggle are 44px targets (D11); the art and
 *     the glyph keep their own sizes */
.ione-w-brand {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 12px;
  min-height: 44px;
}
.ione-w-brand__mk {
  display: block;
  flex: none;
  width: 32px;
  height: 32px;
}
.ione-w-brand__wm {
  display: block;
}
/* ONE rule sizes the written name on BOTH surfaces (owner, 2026-09-16). */
.ione-w-brand__art {
  display: block;
  width: 135px;
  height: auto;
}
@media (max-width: 560px) {
  .ione-w-brand__art {
    width: 116px;
  }
}
/* Below this the family cut and the CTA group cannot share the row (measured:
   they need ~470px), so the name goes and the mark alone carries the brand, at
   the 32px the comp's colour floor asks for. */
@media (max-width: 479px) {
  .ione-w-brand__wm {
    display: none;
  }
}
.ione-w-navtog {
  min-width: 44px;
  min-height: 44px;
}

/* ── CMS-D-239 — "ONE" is never set in mono ────────────────────────────────
 * Owner-directed 2026-09-14: "any "ONE" still use mono font ... fix". ONE is
 * the product's name, and the pack set it in JetBrains Mono wherever a label
 * style happened to carry a product name. An audit of every rendered "ONE" on
 * all twelve routes and the intro found these eight label styles and the three
 * badges (drawn as the master tile, above), and nothing else:
 *   the section eyebrow `.ione-w-k` ("ONE AI", "ONE Compass", "ONE Voce"),
 *   the cascade's app label, the voice and compass mocks' kickers, the compass
 *   phone's kicker, the ledger mock's head and panel kicker, and the pricing
 *   table's group rows.
 * Each keeps its size, weight, tracking, case and ink; only the face moves, to
 * the pack's own display face (Figtree), the face the brand's letters are cut
 * from. The rest of the mono voice (codes, figures, table heads, footer column
 * heads) names no ONE and is untouched. */
.ione-w-k,
.ione-w-casc__a,
.ione-w-vc2__k,
.ione-w-cph__b,
.ione-w-csp__k,
.ione-w-lhp__k,
.ione-w-lh__h b,
.ione-w-cmp tr.ione-w-cmp-g th {
  font-family: var(--ione-w-display);
}
