/* AKS iQ Homepage — standalone stylesheet
   =========================================================================
   TOKENS ARE INLINED BELOW (2026-08-19), not @imported.
   They used to be five @import rules. An @import is only discovered after this
   file downloads and parses, so the browser needed a second round trip before
   any token — every colour, size and font — was available. That delayed first
   paint on every page.
   The source of truth is still assets/design-system/tokens/. If you edit a file
   there, re-paste it into the matching block below or the site will not change.
   ========================================================================= */

/* ===== inlined from assets/design-system/tokens/fonts.css ===== */
/* Self-hosted Inter — no third-party font CDN calls. Weights 300 / 400 / 500 / 600.
   300 (Light) carries the display headings; the heavier cuts carry body, labels and buttons.
   FLAG: drop the four .woff2 files into assets/fonts/ (paths below are relative to this
   file). Until then, the stack falls back to system sans and the light headings will not
   render as designed — the fallback has no matching 300 cut. */
@font-face{font-family:'Inter';font-style:normal;font-weight:300;font-display:swap;src:url('../assets/fonts/Inter-Light.woff2') format('woff2')}

@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/Inter-Regular.woff2') format('woff2')}

@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/Inter-Medium.woff2') format('woff2')}

@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/Inter-SemiBold.woff2') format('woff2')}


/* ===== inlined from assets/design-system/tokens/colors.css ===== */
:root{
--white:#FFFFFF;
--ink-900:#3D3D42;
--ink-700:#5B5B62;
--ink-500:#83838A;
--ink-300:#C7CACD;
--ink-100:#E3E5E8;
--cool-50:#F6F8F9;
--cool-100:#EEF3F4;

--navy-900:#161A26;
--navy-800:#20263A;

--cyan-600:#158FA8;
--cyan-500:#1BB4D3;
--cyan-100:#E4F6FA;
--cyan-50:#F2FBFD;
--blue-700:#255F7D;
--blue-600:#2F80A6;
--blue-100:#E7F0F5;
--blue-50:#F0F6FA;
--violet-600:#5B4BD1;
--violet-500:#6C5DD3;
--violet-400:#8E82E4;
--violet-100:#ECEAFB;

--success-600:#1E8A5F;
--success-100:#E3F5EC;
--warning-600:#B3720F;
--warning-100:#FBEFDC;
--danger-600:#B23A32;
--danger-100:#FBE9E7;

--bg-page:var(--white);
--bg-surface:var(--cool-50);
--bg-surface-alt:var(--cool-100);
--bg-dark:var(--navy-900);
--border-default:var(--ink-100);
--border-strong:var(--ink-300);
--text-primary:var(--ink-900);
--text-secondary:var(--ink-700);
--text-tertiary:var(--ink-500);
--text-on-accent:var(--white);
--text-on-dark:var(--white);
--text-link:var(--blue-600);
--text-link-hover:var(--blue-700);
--accent-primary:var(--cyan-500);
--accent-primary-hover:var(--cyan-600);
--accent-secondary:var(--blue-600);
--accent-secondary-hover:var(--blue-700);

--focus-ring:var(--cyan-500);
--focus-ring-outer:var(--cyan-100);
--focus-ring-inner:var(--blue-600);

--status-success:var(--success-600);
--status-success-bg:var(--success-100);
--status-warning:var(--warning-600);
--status-warning-bg:var(--warning-100);
--status-danger:var(--danger-600);
--status-danger-bg:var(--danger-100);

/* Gradients — marketing surfaces only, max two moments per viewport. Never on product/data UI. */
--gradient-brand:linear-gradient(120deg,var(--cyan-500) 0%,var(--violet-500) 100%);
--gradient-brand-soft:linear-gradient(120deg,var(--cyan-100) 0%,var(--violet-100) 100%);
--gradient-band:linear-gradient(120deg,#12B5D6 0%,#5B4BD1 100%); /* @kind color */

/* Data-viz categorical order — use in this sequence so charts stay on-brand and legible. */
--viz-1:var(--blue-600);
--viz-2:var(--cyan-500);
--viz-3:var(--violet-500);
--viz-4:var(--warning-600);
--viz-5:var(--success-600);
--viz-6:var(--ink-500);
}


/* ===== inlined from assets/design-system/tokens/typography.css ===== */
:root{
/* Consolidated on Inter (single family). --font-display / --font-mono are kept as
   aliases so existing var() references keep working; data uses Inter's tabular-nums. */
--font-display:'Inter',ui-sans-serif,system-ui,sans-serif;
--font-body:'Inter',ui-sans-serif,system-ui,sans-serif;
--font-mono:'Inter',ui-sans-serif,system-ui,sans-serif;

--text-xs:12px;
--text-sm:14px;
--text-base:16px;
--text-md:18px;
--text-lg:22px;
--text-xl:28px;
--text-2xl:36px;
--text-3xl:48px;
--text-4xl:64px;

--leading-tight:1.1;
--leading-snug:1.3;
--leading-normal:1.5;
--leading-relaxed:1.7;

--tracking-tight:-0.005em;
--tracking-normal:0em;
--tracking-wide:0.04em;

--weight-light:300;
--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;
}
.aksiq-site h1, .aksiq-site h2, .aksiq-site h3, .aksiq-site h4, .aksiq-site h5, .aksiq-site h6{font-family:var(--font-display);letter-spacing:var(--tracking-tight);font-weight:var(--weight-medium);color:var(--text-primary);margin:0}

/* Light strokes only earn their authority at display sizes. Below ~24px a 300 weight
   reads thin and under-confident, so small headings step back up to regular. */
.aksiq-site h3{font-weight:var(--weight-semibold)}
.aksiq-site h4, .aksiq-site h5, .aksiq-site h6{font-weight:var(--weight-regular)}
.aksiq-site{font-family:var(--font-body);color:var(--text-primary);background:var(--bg-page)}
.aksiq-site code, .aksiq-site pre, .aksiq-site .mono, .aksiq-site .data{font-family:var(--font-mono)}


/* Role-based type scale — one class per role, each bundling family/size/weight/leading/tracking.
   Display + headings: Space Grotesk. Body: Inter. Data/numeric: JetBrains Mono with tabular figures. */
.aksiq-site .t-display-xxl{font-family:var(--font-display);font-weight:300;font-size:64px;line-height:1.04;letter-spacing:-0.02em}
.aksiq-site .t-display-xl{font-family:var(--font-display);font-weight:300;font-size:48px;line-height:1.08;letter-spacing:-0.015em}
.aksiq-site .t-display-lg{font-family:var(--font-display);font-weight:300;font-size:36px;line-height:1.1;letter-spacing:-0.02em}
.aksiq-site .t-display-md{font-family:var(--font-display);font-weight:300;font-size:28px;line-height:1.15;letter-spacing:-0.02em}
.aksiq-site .t-heading-lg{font-family:var(--font-display);font-weight:400;font-size:22px;line-height:1.2;letter-spacing:-0.005em}
.aksiq-site .t-heading-md{font-family:var(--font-display);font-weight:500;font-size:18px;line-height:1.3;letter-spacing:0}
.aksiq-site .t-body-lg{font-family:var(--font-body);font-weight:400;font-size:18px;line-height:1.6;letter-spacing:0}
.aksiq-site .t-body-md{font-family:var(--font-body);font-weight:400;font-size:16px;line-height:1.55;letter-spacing:0}
.aksiq-site .t-body-sm{font-family:var(--font-body);font-weight:400;font-size:14px;line-height:1.5;letter-spacing:0}
.aksiq-site .t-data-lg{font-family:var(--font-mono);font-weight:500;font-size:28px;line-height:1.1;letter-spacing:-0.01em;font-feature-settings:"tnum"}
.aksiq-site .t-data-md{font-family:var(--font-mono);font-weight:500;font-size:16px;line-height:1.4;font-feature-settings:"tnum"}
.aksiq-site .t-data-sm{font-family:var(--font-mono);font-weight:400;font-size:13px;line-height:1.4;font-feature-settings:"tnum"}
.aksiq-site .t-label{font-family:var(--font-mono);font-weight:600;font-size:12px;line-height:1.2;letter-spacing:0.06em;text-transform:uppercase}
.aksiq-site .t-caption{font-family:var(--font-body);font-weight:400;font-size:13px;line-height:1.4;color:var(--text-secondary)}
.aksiq-site .t-micro{font-family:var(--font-body);font-weight:400;font-size:11px;line-height:1.4;color:var(--text-tertiary)}


/* Tabular-figure discipline — apply to ANY element rendering money, counts, IDs, or transaction values,
   in either mono or Inter, so digits align in columns. The brand's quiet data-precision signal. */
.aksiq-site .tnum{font-feature-settings:"tnum"}


/* ===== inlined from assets/design-system/tokens/spacing.css ===== */
:root{
--space-0:2px;
--space-1:4px;
--space-2:8px;
--space-3:16px;
--space-4:24px;
--space-5:32px;
--space-6:48px;
--space-7:64px;
--space-8:96px;
--space-9:128px;

--radius-xs:3px;
--radius-sm:4px;
--radius-md:6px;
--radius-lg:10px;
--radius-xl:14px;
--radius-pill:999px;

--shadow-sm:0 1px 2px rgba(61,61,66,0.06);
--shadow-md:0 4px 12px rgba(61,61,66,0.08);

/* Elevation — three structured levels. Level 0 is the default; the system prefers hairline
   borders over shadow, so 1 is for resting cards that need lift, 2 only for floating overlays. */
--elevation-0:none;
--elevation-1:0 1px 3px rgba(61,61,66,0.06);
--elevation-2:0 8px 24px rgba(61,61,66,0.08),0 2px 6px rgba(61,61,66,0.04);

--border-width:1px;

--container-max:1392px; /* 1232px content + 2x80px gutter = Stripe's column at 1440 */
--container-pad:24px;
}


/* ===== inlined from assets/design-system/tokens/interactions.css ===== */
/* Universal focus + press states — WCAG 2.1 AA. Focus rings are never removed
   without this replacement. :where() keeps specificity 0 so component inline
   styles still control everything except the focus ring. */
.aksiq-site :where(button, .aksiq-site [role="button"], .aksiq-site a[href], .aksiq-site input, .aksiq-site select, .aksiq-site textarea, .aksiq-site summary, .aksiq-site [tabindex]:not([tabindex="-1"])):focus-visible{
  outline:2px solid transparent;
  outline-offset:1px;
  box-shadow:0 0 0 1px var(--focus-ring-inner),0 0 0 3px var(--focus-ring-outer);
  border-radius:var(--radius-sm);
}
.aksiq-site *, .aksiq-site *::before, .aksiq-site *::after{box-sizing:border-box}
.aksiq-site{scroll-behavior:smooth}
.aksiq-site{margin:0;background:var(--bg-page);-webkit-font-smoothing:antialiased}
.aksiq-site main{perspective:1600px}
.aksiq-site img{max-width:100%;display:block}
.aksiq-site a{color:inherit}
.aksiq-site button{font:inherit}
.aksiq-site .svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.aksiq-site .icon{display:inline-block;flex-shrink:0;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.aksiq-site .container{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad)}
@media (min-width:768px){
.aksiq-site .container{padding:0 48px}
}

/* Stripe carries roughly 104px of gutter at 1440. Matching it stops the content from
   running to the edge of a wide monitor. */
@media (min-width:1440px){
.aksiq-site .container{padding:0 80px}
}
.aksiq-site .section{padding:var(--space-8) 0}

/* The homepage read as eight equal stacked boxes because every band was 96/96. Opening
   the desktop rhythm gives each section room to be its own moment. */
@media (min-width:1024px){
.aksiq-site .section{padding:112px 0}
}
@media (max-width:1023px){
.aksiq-site .section{padding:var(--space-6) 0}
}
.aksiq-site .section--tight{padding:var(--space-7) 0}

/* A section holding nothing but a heading and one line of copy does not need the full
   112px band top and bottom. Distinct from .section--tight above, which is the sole
   padding source on speak-to-an-expert.html and must not change. */
.aksiq-site .section--compact{padding:var(--space-7) 0}
@media (max-width:1023px){
.aksiq-site .section--compact{padding:var(--space-5) 0}
}
.aksiq-site .bg-surface{background:var(--bg-surface)}
.aksiq-site .bg-dark{background:var(--bg-dark)}
.aksiq-site .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:var(--text-sm);font-weight:600;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--accent-secondary)}


/* ---------- Buttons ---------- */
.aksiq-site .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-body);font-weight:600;font-size:var(--text-base);border-radius:var(--radius-md);padding:10px 20px;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background 120ms ease,filter 120ms ease,border-color 120ms ease;white-space:nowrap}
.aksiq-site .btn:active{filter:brightness(0.92)}
.aksiq-site .btn-lg{padding:13px 26px;font-size:var(--text-md)}
.aksiq-site .btn-sm{padding:7px 14px;font-size:var(--text-sm)}
.aksiq-site .btn{transition:background 160ms ease,filter 160ms ease,border-color 160ms ease,transform 160ms ease,box-shadow 160ms ease}
.aksiq-site .btn-primary{background:var(--accent-secondary);color:var(--white);border-color:var(--accent-secondary)}
.aksiq-site .btn-primary:hover{background:var(--accent-secondary-hover);border-color:var(--accent-secondary-hover);transform:translateY(-1px);box-shadow:0 4px 12px rgba(47,128,166,0.25)}
.aksiq-site .btn-secondary{background:var(--white);color:var(--text-primary);border-color:var(--border-strong)}
.aksiq-site .btn-secondary:hover{background:var(--cool-50);transform:translateY(-1px)}
.aksiq-site .btn-ghost{background:transparent;color:var(--text-primary)}
.aksiq-site .btn-ghost:hover{background:var(--cool-50)}
.aksiq-site .btn-on-gradient{background:var(--white);color:var(--blue-700);border-color:var(--white)}
.aksiq-site .btn-on-gradient:hover{background:var(--cool-50);transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,0.15)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .btn:hover{transform:none}
}


/* ---------- Scroll reveal ---------- */
.aksiq-site .reveal{opacity:0;transform:translateY(22px);transition:opacity 650ms cubic-bezier(.16,.84,.44,1),transform 650ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .reveal.is-visible{opacity:1;transform:translateY(0)}
.aksiq-site .reveal-group>.reveal:nth-child(1){transition-delay:0ms}
.aksiq-site .reveal-group>.reveal:nth-child(2){transition-delay:70ms}
.aksiq-site .reveal-group>.reveal:nth-child(3){transition-delay:140ms}
.aksiq-site .reveal-group>.reveal:nth-child(4){transition-delay:210ms}
.aksiq-site .reveal-group>.reveal:nth-child(5){transition-delay:280ms}
.aksiq-site .reveal-group>.reveal:nth-child(6){transition-delay:350ms}
.aksiq-site .reveal-group>.reveal:nth-child(7){transition-delay:420ms}
@media (prefers-reduced-motion:reduce){
.aksiq-site .reveal{opacity:1!important;transform:none!important;transition:none!important}
}


/* ---------- Header ---------- */
.aksiq-site .site-header{position:sticky;top:0;z-index:50;background:var(--white);border-bottom:1px solid var(--border-default)}
.aksiq-site .site-header .container{display:flex;align-items:center;justify-content:space-between;gap:24px;height:88px}
.aksiq-site .brand{flex-shrink:0}
.aksiq-site .brand img{height:48px;width:auto;display:block}
.aksiq-site .nav{display:none}
.aksiq-site .nav-actions{display:flex;align-items:center;gap:24px;flex-shrink:0}
.aksiq-site .nav-cta-header{display:none;flex-shrink:0;white-space:nowrap}
.aksiq-site .nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--border-default);border-radius:var(--radius-sm);background:var(--white);cursor:pointer;flex-shrink:0}
@media (min-width:1024px){
.aksiq-site .nav{display:flex;align-items:center;justify-content:center;gap:4px;flex:1 1 auto;min-width:0}
.aksiq-site .nav-actions{justify-content:flex-end}
.aksiq-site .nav-item{position:relative}
.aksiq-site .nav-link{display:inline-flex;align-items:center;gap:5px;font-size:var(--text-base);font-weight:600;color:var(--text-primary);text-decoration:none;padding:10px 16px;border-radius:var(--radius-sm)}
.aksiq-site .nav-link:hover{background:var(--cool-50)}
.aksiq-site .nav-caret{width:14px;height:14px;transition:transform 220ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .nav-item:hover .nav-caret, .aksiq-site .nav-item:focus-within .nav-caret{transform:rotate(180deg)}
.aksiq-site .nav-cta-header{display:inline-flex}
.aksiq-site .nav-toggle{display:none}


  /* Mega menu */
  .aksiq-site .mega-panel{position:absolute;top:100%;left:50%;transform:translate(-50%,6px);width:max-content;min-width:280px;max-width:520px;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--elevation-2);padding:10px;opacity:0;visibility:hidden;transition:opacity 200ms cubic-bezier(.16,.84,.44,1),transform 200ms cubic-bezier(.16,.84,.44,1),visibility 200ms;margin-top:6px;z-index:60}
.aksiq-site .nav-item:hover .mega-panel, .aksiq-site .nav-item:focus-within .mega-panel{opacity:1;visibility:visible;transform:translate(-50%,0)}
.aksiq-site .mega-panel--grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;max-width:640px}
.aksiq-site .mega-link{display:flex;align-items:center;gap:14px;padding:12px;border-radius:var(--radius-md);text-decoration:none;color:inherit;transition:background 150ms ease}
.aksiq-site .mega-link:hover{background:var(--cool-50)}
.aksiq-site .mega-link-icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary);flex-shrink:0}
.aksiq-site .mega-link-text{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.aksiq-site .mega-link-title{font-size:var(--text-sm);font-weight:600;color:var(--text-primary)}
.aksiq-site .mega-link-desc{font-size:var(--text-xs);color:var(--text-tertiary)}
.aksiq-site .mega-link-arrow{flex-shrink:0;color:var(--accent-secondary);opacity:0;transform:translateX(-4px);transition:opacity 180ms ease,transform 180ms ease}
.aksiq-site .mega-link:hover .mega-link-arrow{opacity:1;transform:translateX(0)}
}
.aksiq-site .mobile-nav{display:none;position:fixed;inset:88px 0 0 0;background:var(--white);z-index:40;overflow-y:auto;padding:8px 24px 40px}
.aksiq-site .mobile-nav.is-open{display:block}
.aksiq-site .mobile-nav-group{border-bottom:1px solid var(--border-default);padding:6px 0}
.aksiq-site .mobile-nav-top{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;padding:14px 0;font-size:var(--text-base);font-weight:600;color:var(--text-primary);cursor:pointer;text-align:left;text-decoration:none}
.aksiq-site .mobile-nav-top .nav-caret{width:16px;height:16px;transition:transform 220ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .mobile-nav-group.is-open .nav-caret{transform:rotate(180deg)}
.aksiq-site .mobile-nav-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows 260ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .mobile-nav-panel > div{overflow:hidden}
.aksiq-site .mobile-nav-group.is-open .mobile-nav-panel{grid-template-rows:1fr}
.aksiq-site .mobile-nav-panel a{display:block;padding:8px 0;font-size:var(--text-base);color:var(--text-secondary);text-decoration:none;transition:color 150ms ease,transform 150ms ease}
.aksiq-site .mobile-nav-panel a:hover{color:var(--accent-secondary);transform:translateX(4px)}
.aksiq-site .mobile-nav-cta{margin-top:20px;display:flex;flex-direction:column;gap:12px}
@media (min-width:1024px){
.aksiq-site .mobile-nav{display:none!important}
}


/* ---------- Hero ---------- */

.aksiq-site .hero{position:relative;overflow:hidden;padding:36px 0 0;
  /* Four layers, back to front: the diagonal brand wash; a white bloom that keeps the
     headline side light enough for dark text; a cyan bloom through the upper middle; and
     a saturated violet mass on the right edge that the orbit sits against. Only the wash
     drifts -- moving the blooms would slide the contrast out from under the copy. */
  background:
    radial-gradient(72% 108% at 101% 86%,var(--violet-600) 0%,rgba(91,75,209,0.80) 20%,rgba(108,93,211,0.44) 42%,rgba(142,130,228,0) 70%),
    radial-gradient(58% 86% at 64% 16%,rgba(27,180,211,0.28) 0%,rgba(27,180,211,0) 68%),
    radial-gradient(74% 88% at 0% 0%,#FFFFFF 0%,rgba(255,255,255,0.92) 34%,rgba(255,255,255,0) 76%),
    linear-gradient(122deg,#FBFEFE 0%,var(--cyan-100) 26%,#D7E3F8 56%,var(--violet-100) 78%,#CFC7F4 100%);
  background-size:100% 100%,100% 100%,100% 100%,200% 200%;
  background-repeat:no-repeat;
  animation:heroGradientDrift 22s ease infinite alternate}
.aksiq-site .hero .container{position:relative}
.aksiq-site .hero-content{max-width:720px}
.aksiq-site .hero h1{font-size:32px;line-height:1.14;letter-spacing:-0.015em;margin:0 0 16px;font-weight:var(--weight-light)}
.aksiq-site .hero-subhead{font-size:var(--text-md);line-height:var(--leading-normal);color:var(--text-secondary);max-width:560px;margin:0 0 28px;font-weight:500}
.aksiq-site .hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:var(--space-4)}
@media (min-width:768px){
.aksiq-site .hero h1{font-size:44px}
}
@media (min-width:1024px){
.aksiq-site .hero h1{font-size:48px;line-height:1.12;letter-spacing:-0.02em}
}

@keyframes heroGradientDrift{0%{background-position:0% 50%,0% 50%,0% 50%,0% 50%}100%{background-position:0% 50%,0% 50%,0% 50%,100% 50%}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .hero{animation:none}
}


/* Hero orbit visual — sits in the empty right of the hero. Absolutely positioned
   from 1160px up so it never adds to the hero's height; below that the copy needs
   the full width, so it drops under the text in normal flow. */
/* --spin is the single dial for orbit speed: one full revolution. */
.aksiq-site .hero-visual{display:block;max-width:340px;margin:6px auto 10px;--r:84px;--chip:38px;--spin:150s}


/* Stage is exactly as tall as the content it holds: orbit radius, plus half a
   chip, plus the label hanging below it. Keeps the hero's height untouched. */
.aksiq-site .orbit{position:relative;width:100%;height:calc(var(--r)*2 + var(--chip) + 44px)}
.aksiq-site .orbit-path, .aksiq-site .orbit-halo, .aksiq-site .orbit-core{position:absolute;left:50%;top:50%;translate:-50% -50%;border-radius:50%}
.aksiq-site .orbit-path{border:1px solid rgba(142,130,228,0.30)}
.aksiq-site .orbit-path--outer{width:calc(var(--r)*2);height:calc(var(--r)*2)}
.aksiq-site .orbit-path--inner{width:calc(var(--r)*1.12);height:calc(var(--r)*1.12);border-color:rgba(27,180,211,0.20);border-style:dashed}


/* Core — a gradient torus with a soft halo, no neon */
.aksiq-site .orbit-halo{width:calc(var(--r)*1.5);height:calc(var(--r)*1.5);background:radial-gradient(circle,rgba(108,93,211,0.20) 0%,rgba(27,180,211,0.10) 42%,transparent 70%)}
.aksiq-site .orbit-core{width:var(--core,calc(var(--chip)*1.5));height:var(--core,calc(var(--chip)*1.5));
  background:conic-gradient(from 210deg,var(--cyan-500),var(--violet-500),var(--violet-400),var(--cyan-500));
  box-shadow:0 10px 34px rgba(91,75,209,0.28);
  animation:orbitCoreSpin 26s linear infinite}

@keyframes orbitCoreSpin{to{rotate:360deg}}


/* The ring carries the nodes round; each node counter-rotates so its icon and
   label stay upright the whole way. */
.aksiq-site .orbit-ring{position:absolute;inset:0;margin:0;padding:0;list-style:none;animation:orbitSpin var(--spin) linear infinite}

@keyframes orbitSpin{to{rotate:360deg}}
.aksiq-site .orbit-item{position:absolute;left:50%;top:50%;width:0;height:0;
  transform:rotate(calc(var(--i)*72deg)) translateY(calc(var(--r)*-1)) rotate(calc(var(--i)*-72deg))}

/* Chip and label are one rigid group, so their spacing is fixed and they can never
   converge. The group counter-rotates about the NODE POINT (transform-origin), not
   its own centre — that keeps the chip pinned to the orbit path with no wobble
   while the label hangs a constant distance below it. */
.aksiq-site .orbit-inner{position:absolute;left:0;top:calc(var(--chip)/-2);translate:-50% 0;width:var(--label-w,132px);
  display:flex;flex-direction:column;align-items:center;gap:5px;
  transform-origin:50% calc(var(--chip)/2);
  animation:orbitSpinBack var(--spin) linear infinite}

@keyframes orbitSpinBack{to{rotate:-360deg}}
.aksiq-site .orbit-chip{flex:none;width:var(--chip);height:var(--chip);border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,0.96);color:var(--violet-600);
  box-shadow:0 4px 16px rgba(91,75,209,0.16),0 0 0 1px rgba(91,75,209,0.08)}

/* The markup hard-codes 20px icons, which read as undersized once the chip grows.
   Sizing off --chip keeps the icon proportional at every breakpoint. */
.aksiq-site .orbit-chip .icon{width:calc(var(--chip)*0.44);height:calc(var(--chip)*0.44)}

/* Two lines like the source artwork. The radial wash erases the orbit path where it
   would otherwise run through the text. */
.aksiq-site .orbit-label{max-width:calc(var(--chip)*2);font-size:11px;font-weight:600;line-height:1.25;letter-spacing:-0.005em;
  color:var(--navy-900);text-align:center;text-wrap:balance;padding:2px 7px;
  background:radial-gradient(ellipse 100% 100% at 50% 50%,rgba(248,250,254,0.97) 54%,rgba(248,250,254,0) 100%)}
@media (min-width:768px){
.aksiq-site .hero-visual{max-width:440px;--r:118px;--chip:50px}
}
@media (min-width:1160px){

  /* top is nudged above the copy's midpoint: the hero band the orbit has to live in
     (navbar underside to logo-strip border) is centred slightly higher than the copy. */
  .aksiq-site .hero-visual{position:absolute;top:50%;right:0;translate:0 -50%;width:46%;max-width:520px;margin:0;--r:158px;--chip:58px}
.aksiq-site .orbit-label{font-size:13px}
}
@media (prefers-reduced-motion:reduce){
.aksiq-site .orbit-ring, .aksiq-site .orbit-inner, .aksiq-site .orbit-core{animation:none}
}


/* Coverage map as a flat render. The CSS .hub below is now unused on trade-iq.html but
   is left intact: it is what the markup reverts to if the linked, animated version is
   ever wanted back. */
.aksiq-site .hub-figure{margin:0}
.aksiq-site .hub-figure img{display:block;width:100%;max-width:478px;height:auto;margin:0 auto}

/* ---------- Split hero (Trade iQ) — copy left, coverage hub right ----------
   A real grid rather than an absolute overlay, so the hero grows to fit the hub
   instead of the hub being squeezed into the existing band. */
.aksiq-site .hub{--r:130px;--chip:52px;--core:94px;--sweep:51.4286deg;
  position:relative;width:100%;max-width:470px;margin:8px auto 0;
  height:calc(var(--r)*2 + var(--chip) + 76px)}
@media (min-width:1160px){
.aksiq-site .hero--split .container{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,478px);
    align-items:center;gap:40px;padding-top:10px;padding-bottom:26px}
.aksiq-site .hero--split .hero-content{max-width:none}
.aksiq-site .hub{margin:0}
}


/* Rings */
.aksiq-site .hub-orbit{position:absolute;left:50%;top:50%;translate:-50% -50%;border-radius:50%;
  width:calc(var(--r)*2);height:calc(var(--r)*2);border:1px solid rgba(142,130,228,0.34)}
.aksiq-site .hub-orbit--dashed{width:calc(var(--r)*1.24);height:calc(var(--r)*1.24);
  border-style:dashed;border-color:rgba(142,130,228,0.24)}


/* Core — gradient torus with the engine name inside the hole */
.aksiq-site .hub-core{position:absolute;left:50%;top:50%;translate:-50% -50%;
  width:var(--core);height:var(--core);border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}
.aksiq-site .hub-core::before{content:'';position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 205deg,var(--cyan-500),var(--violet-500),var(--violet-600),var(--violet-400),var(--cyan-500));
  -webkit-mask:radial-gradient(circle,transparent 63%,#000 65%);mask:radial-gradient(circle,transparent 63%,#000 65%)}
.aksiq-site .hub-core-title{position:relative;font-family:var(--font-display);font-weight:600;font-size:16px;letter-spacing:-0.01em;color:var(--navy-900)}
.aksiq-site .hub-core-sub{position:relative;font-size:8.5px;font-weight:600;line-height:1.2;color:var(--text-tertiary);max-width:70px}


/* Nodes — placed round the ring, labels upright, chip lifts on hover like the cards */
.aksiq-site .hub-nodes, .aksiq-site .hub-sources{position:absolute;inset:0;margin:0;padding:0;list-style:none}
.aksiq-site .hub-node{position:absolute;left:50%;top:50%;width:0;height:0;
  transform:rotate(calc(var(--i)*var(--sweep))) translateY(calc(var(--r)*-1)) rotate(calc(var(--i)*var(--sweep)*-1))}

/* Spoke back to the core. Sits outside the link so the hover lift never detaches it. */
.aksiq-site .hub-spoke{position:absolute;left:0;top:0;width:1px;transform-origin:top center;
  height:calc(var(--r) - var(--core)/2 - var(--chip)/2 - 4px);
  transform:rotate(calc(var(--i)*var(--sweep)));background:rgba(142,130,228,0.42)}
.aksiq-site .hub-dot{position:absolute;left:0;top:calc(var(--chip)/-2);translate:-50% 0;
  display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;color:inherit;width:max-content}
.aksiq-site .hub-chip{position:relative;width:var(--chip);height:var(--chip);border-radius:50%;display:grid;place-items:center;
  background:var(--white);color:var(--violet-600);box-shadow:0 2px 10px rgba(61,61,66,0.10),0 0 0 1px rgba(91,75,209,0.08);
  transition:transform 200ms cubic-bezier(.16,.84,.44,1),box-shadow 200ms ease}
.aksiq-site .hub-dot:hover .hub-chip, .aksiq-site .hub-dot:focus-visible .hub-chip{transform:translateY(-4px);
  box-shadow:0 10px 22px rgba(91,75,209,0.20),0 0 0 1px rgba(91,75,209,0.30)}

/* The one red accent in the source art — the mis-invoicing flag */
.aksiq-site .hub-chip--flag::after{content:'';position:absolute;top:2px;right:2px;width:11px;height:11px;border-radius:50%;
  background:var(--status-danger);border:2px solid var(--white)}
.aksiq-site .hub-label{max-width:92px;font-size:10.5px;font-weight:700;line-height:1.2;letter-spacing:-0.005em;
  color:var(--navy-900);text-align:center;text-wrap:balance;transition:color 200ms ease}
.aksiq-site .hub-dot:hover .hub-label{color:var(--violet-600)}


/* Outside data sources — pills tucked into the four corners */
.aksiq-site .hub-source{position:absolute;display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:var(--radius-pill);background:rgba(255,255,255,0.86);
  border:1px solid rgba(91,75,209,0.12);box-shadow:0 1px 3px rgba(61,61,66,0.06);
  font-size:9.5px;font-weight:700;letter-spacing:-0.005em;color:var(--text-secondary);white-space:nowrap}
.aksiq-site .hub-source .icon{color:var(--violet-400);flex:none}

/* One fixed inset for all four, so the corners stay symmetrical at any hub size
   (percentages drifted: 6% of the height at the top vs 8% at the bottom). */
.aksiq-site .hub-source--tl{left:0;top:24px}
.aksiq-site .hub-source--tr{right:0;top:24px}
.aksiq-site .hub-source--bl{left:0;bottom:24px}
.aksiq-site .hub-source--br{right:0;bottom:24px}
@media (max-width:1159px){
.aksiq-site .hub{--r:118px;--chip:48px;--core:104px}
}
@media (max-width:520px){
.aksiq-site .hub{--r:96px;--chip:42px;--core:88px}
.aksiq-site .hub-label{font-size:9.5px;max-width:80px}
.aksiq-site .hub-source{font-size:8.5px;padding:5px 8px}
}
.aksiq-site .logo-strip{position:relative;border-top:1px solid rgba(61,61,66,0.10);
  /* The hero gradient runs dark in the bottom-right corner, which is exactly where the
     marquee travels. Fade back to white so the bank logos stay legible against it. */
  background:linear-gradient(180deg,rgba(255,255,255,0.62) 0%,var(--white) 38%);padding-bottom:8px}
.aksiq-site .logo-strip-label{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary);margin:20px 0 26px}
.aksiq-site .logo-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,black 8%,black 92%,transparent);mask-image:linear-gradient(90deg,transparent,black 8%,black 92%,transparent);padding-bottom:20px}
.aksiq-site .logo-marquee-track{display:flex;align-items:center;gap:56px;width:max-content;animation:logoMarquee 36s linear infinite}
.aksiq-site .logo-marquee:hover .logo-marquee-track{animation-play-state:paused}
.aksiq-site .logo-marquee-item{display:flex;align-items:center;justify-content:center;height:34px;flex-shrink:0}
.aksiq-site .logo-marquee-item img{height:100%;width:auto;max-width:130px;object-fit:contain}

@keyframes logoMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .logo-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
.aksiq-site .logo-marquee-track{animation:none}
.aksiq-site .logo-marquee-item[aria-hidden="true"]{display:none}
}


/* ---------- Section headers ---------- */
.aksiq-site .section-head{max-width:680px;margin:0 0 var(--space-6)}

/* Drops the 48px tail on a section-head that is the section's only content. */
.aksiq-site .section-head--flush{margin-bottom:0}

/* The eleven-module intro is one line by request. It measures 1122px set at 18px, so it
   gets the whole 1232px column rather than a tighter cap: a 1120px max-width left it two
   pixels short and it wrapped to two lines. */
.aksiq-site .section-head--wide{max-width:none}
.aksiq-site .section-head h2{font-size:28px;line-height:1.15;letter-spacing:-0.01em;margin:0 0 12px}
.aksiq-site .section-head p{font-size:var(--text-md);line-height:var(--leading-normal);color:var(--text-secondary);margin:0}
@media (min-width:1024px){
.aksiq-site .section-head h2{font-size:36px;line-height:1.1}
}


/* ---------- Bento cards (Box 2) — full-bleed background graphics ---------- */
.aksiq-site .bento{display:grid;grid-template-columns:1fr;gap:16px}
.aksiq-site .bento-card{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:24px;border:1px solid var(--border-default);border-radius:var(--radius-lg);background:var(--white);padding:28px;text-decoration:none;color:inherit;transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms ease}
.aksiq-site .bento-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-1);transform:translateY(-3px)}
.aksiq-site .bento-card .card-foot svg{transition:transform 180ms ease}
.aksiq-site .bento-card:hover .card-foot svg{transform:translateX(4px)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .bento-card:hover, .aksiq-site .expert-card:hover, .aksiq-site .deploy-card:hover{transform:none}
}
.aksiq-site .bento-card-content{position:relative;z-index:1;display:flex;flex-direction:column;gap:16px}
.aksiq-site .bento-card .icon-wrap{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);background:var(--white);color:var(--accent-secondary);box-shadow:var(--elevation-1)}
.aksiq-site .bento-card h3{position:relative;z-index:1;font-size:var(--text-md);line-height:1.3;letter-spacing:-0.005em;font-weight:600;margin:0;max-width:70%}
.aksiq-site .bento-card .card-foot{position:relative;z-index:1;display:flex;align-items:center;gap:8px;font-size:var(--text-sm);font-weight:600;color:var(--accent-secondary)}
.aksiq-site .bento-card--large{padding:36px}
.aksiq-site .bento-card--large h3{font-size:22px;line-height:1.25;max-width:60%}
.aksiq-site .bento-card--wide{flex-direction:row;align-items:center;justify-content:space-between}
.aksiq-site .bento-card--wide h3{font-size:var(--text-md);max-width:none}


/* Image-first card — the graphic fills essentially the whole card; only a thin
   strip at the bottom is reserved for the title. No icon, no tinted background. */
.aksiq-site .bento-card--media{padding:0;gap:0}
.aksiq-site .bento-card-media{flex:1 1 auto;min-height:0;overflow:hidden;background:var(--cool-50)}
.aksiq-site .bento-card-media picture{display:block;width:100%;height:100%}
.aksiq-site .bento-card-media img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transform:scale(1.2);transition:transform 300ms ease}
.aksiq-site .bento-card--media:hover .bento-card-media img{transform:scale(1.26)}

/* Some source graphics have important content (labels, tooltips) too close to their own
   edge to safely crop at any zoom level without losing something — show the whole graphic
   uncropped instead, letterboxed on a matching background rather than cover-cropped. */
/* Vertical-only stretch: the width fit from object-fit:contain is already correct
   (no side cropping), so only grow the Y axis to eat into the top/bottom letterbox
   without touching X and risking that side-cropping again. */
.aksiq-site .bento-card-media--soft-crop img{object-fit:contain;transform:scale(1,1.62);object-position:center}
.aksiq-site .bento-card--media:hover .bento-card-media--soft-crop img{transform:scale(1,1.65)}
.aksiq-site .bento-card-media-text{flex:0 0 auto;padding:20px 28px 24px;display:flex;flex-direction:column;gap:10px}
.aksiq-site .bento-card-media-text h3{max-width:100%}
@media (prefers-reduced-motion:reduce){
.aksiq-site .bento-card--media:hover .bento-card-media img{transform:none}
}
@media (max-width:640px){
.aksiq-site .bento-card-media{aspect-ratio:4/3;flex:none}
.aksiq-site .bento-card-media--soft-crop img{transform:scale(1,1.45)}
.aksiq-site .bento-card--media:hover .bento-card-media--soft-crop img{transform:scale(1,1.45)}
}


/* Art-only cards — the graphic IS the card, so the card gives it no surface of its own:
   no white fill, no padding, no letterbox. The artwork carries its own background right
   to the edge, the way Stripe does it. A hairline stays, purely so two light-backed
   cards sitting 16px apart still read as separate objects.
   Row heights: every single-cell card shares one aspect ratio, so cards in a row resolve
   to identical heights and the row lines up. The large card declares no ratio and
   stretches across the two rows it spans — that is what fixes the ragged edges. */
.aksiq-site .bento-card--fill{padding:0;gap:0;flex-direction:column;background:transparent;
  border-color:#E5EDF5;border-radius:var(--radius-md);overflow:hidden}
.aksiq-site .bento-card--fill .bento-card-media{width:100%;height:100%;flex:1 1 auto;background:transparent}
.aksiq-site .bento-card--fill .bento-card-media picture{height:100%}
.aksiq-site .bento-card--fill .bento-card-media img{width:100%;height:100%;object-fit:cover;object-position:center;transform:none}
.aksiq-site .bento-card--fill:hover .bento-card-media img{transform:none}

/* No lift and no drop shadow on these -- Stripe's cards sit flat, and a shadow under a
   card whose artwork already carries its own soft edge reads as a doubled grey frame. */
.aksiq-site .bento-card--fill:hover{border-color:#CBDCEC;box-shadow:none;transform:none}


/* Full-bleed tinted background, graphic bled off the bottom/right edge behind the text */
.aksiq-site .bento-card-bg{position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;overflow:hidden}
.aksiq-site .card-tint--cyan .bento-card-bg{background:radial-gradient(125% 125% at 100% 100%,var(--cyan-100) 0%,transparent 62%)}
.aksiq-site .card-tint--violet .bento-card-bg{background:radial-gradient(125% 125% at 100% 100%,var(--violet-100) 0%,transparent 62%)}
.aksiq-site .card-tint--blue .bento-card-bg{background:radial-gradient(125% 125% at 100% 100%,var(--blue-100) 0%,transparent 62%)}
.aksiq-site .bento-card-graphic{position:absolute;z-index:0;right:-10%;bottom:-12%;width:80%;height:auto;opacity:0.95;filter:drop-shadow(0 10px 24px rgba(61,61,66,0.10));transition:opacity 220ms ease,transform 220ms ease;pointer-events:none}
.aksiq-site .bento-card:hover .bento-card-graphic{opacity:1;transform:translateY(-4px) scale(1.02)}
.aksiq-site .bento-card--large .bento-card-graphic{right:-4%;bottom:3%;width:68%}
.aksiq-site .bento-card-graphic--wide{right:190px;bottom:50%;transform:translateY(50%);width:36%;max-width:280px}
.aksiq-site .bento-card--wide:hover .bento-card-graphic--wide{transform:translateY(50%) scale(1.02)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .bento-card:hover .bento-card-graphic{transform:none}
}


/* Subtle motion accents — a slow flowing pulse line, a breathing flagged node */
.aksiq-site .pulse-line{stroke-dasharray:7 5;animation:pulseFlow 3.2s linear infinite}

@keyframes pulseFlow{to{stroke-dashoffset:-48}}
.aksiq-site .flag-node{transform-box:fill-box;transform-origin:center;animation:flagPulse 2.2s ease-in-out infinite}

@keyframes flagPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.65;transform:scale(1.15)}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .pulse-line, .aksiq-site .flag-node{animation:none}
}
@media (max-width:900px){
.aksiq-site .bento-card-graphic--wide{right:150px;width:34%;max-width:200px}
}


/* Below 640px, the graphic can't safely bleed absolutely without risking overlap on
   short, single-column cards — so it rejoins normal flex flow instead, sitting below
   the text and pushing the card taller rather than floating behind it. */
@media (max-width:640px){
.aksiq-site .bento-card{justify-content:flex-start}
.aksiq-site .bento-card h3, .aksiq-site .bento-card--large h3{max-width:100%}
.aksiq-site .bento-card-graphic, .aksiq-site .bento-card--large .bento-card-graphic, .aksiq-site .bento-card-graphic--wide{
    position:static;z-index:auto;width:100%;max-width:none;right:auto;bottom:auto;left:auto;top:auto;
    transform:none;margin-top:14px;opacity:0.85
  }
.aksiq-site .bento-card--wide{flex-wrap:wrap}
}
@media (max-width:420px){
.aksiq-site .bento-card--wide{flex-direction:column;align-items:flex-start;gap:16px}
}
@media (min-width:768px){
.aksiq-site .bento{grid-template-columns:repeat(3,1fr);grid-auto-rows:auto}

  /* One ratio for every single-cell card: same width + same ratio = same height, which
     is what keeps the rows level. 3:2 is chosen deliberately -- the source art comes in two
     ratios, and the 3:2 pieces (mis-invoicing, vessel tracking, digitize) carry headlines
     that run close to their right edge, so cropping them horizontally would clip type.
     The 4:3 pieces all have deep top and bottom whitespace, so losing ~6% off each of
     those edges costs nothing. */
  .aksiq-site .bento-card--fill{aspect-ratio:3/2}
.aksiq-site .bento-card--large{grid-column:1/3;grid-row:1/3;aspect-ratio:auto}

  /* The closer runs full width at 2:1 against 3:2 art, so cover trims about a quarter of
     the height. Biasing the crop well up protects the headline top-left and takes the loss
     out of the empty lower band instead. */
  .aksiq-site .bento-card--wide{grid-column:1/4;aspect-ratio:2/1}
.aksiq-site .bento-card--wide .bento-card-media img{object-position:50% 20%}
}

/* ---------- Stat band (Box 3) ---------- */
.aksiq-site .stat-band-head{text-align:center;max-width:640px;margin:0 auto var(--space-6)}
.aksiq-site .stat-band-head h2{font-size:32px;letter-spacing:-0.02em}
@media (min-width:1024px){
.aksiq-site .stat-band-head h2{font-size:40px}
}
.aksiq-site .stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:40px 0;border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default);padding:var(--space-6) 0}
.aksiq-site .stat-item{text-align:left;padding:0 28px;cursor:default;border-left:none}

/* Display face, not mono: at this size the mono cut reads as a code sample rather than a
   headline. Tabular figures stay on so digits still align column to column. */
.aksiq-site .stat-value{position:relative;display:inline-block;font-family:var(--font-display);
  font-weight:var(--weight-light);font-size:40px;line-height:1.05;letter-spacing:-0.02em;
  font-feature-settings:"tnum";color:var(--text-primary);
  transition:color 300ms cubic-bezier(0.25,1,0.5,1)}
.aksiq-site .stat-value::after{content:'';position:absolute;left:0;bottom:-10px;width:0;height:2px;
  background:var(--gradient-brand);transition:width 300ms cubic-bezier(0.25,1,0.5,1)}
.aksiq-site .stat-label{font-size:var(--text-sm);color:var(--text-secondary);margin-top:12px;max-width:210px;
  transition:color 300ms cubic-bezier(0.25,1,0.5,1)}

/* Stripe's mechanic: pointing at one stat recedes the others, so the one being read is the
   only one at full strength. Hovering the grid dims everything, then the hovered item wins. */
.aksiq-site .stat-grid:hover .stat-value{color:var(--text-tertiary)}
.aksiq-site .stat-grid:hover .stat-label{color:var(--ink-300)}
.aksiq-site .stat-item:hover .stat-value, .aksiq-site .stat-grid:hover .stat-item:hover .stat-value{color:var(--cyan-600)}
.aksiq-site .stat-item:hover .stat-label, .aksiq-site .stat-grid:hover .stat-item:hover .stat-label{color:var(--text-primary)}
.aksiq-site .stat-item:hover .stat-value::after{width:100%}
@media (prefers-reduced-motion:reduce){
.aksiq-site .stat-value::after{transition:none}
}
.aksiq-site .reveal-repeat--label{transition-delay:150ms}

/* Dividers wait for the 4-across layout: in the 2-column mobile grid the third stat starts
   a new row, where a left edge reads as a bug rather than a separator. */
@media (min-width:768px){
.aksiq-site .stat-grid{grid-template-columns:repeat(4,1fr)}
.aksiq-site .stat-item{border-left:1px solid var(--border-default)}

  /* First stat sits flush with the container edge, as Stripe's does. */
  .aksiq-site .stat-item:first-child{border-left:none;padding-left:0}
}
@media (min-width:1024px){
.aksiq-site .stat-value{font-size:48px}
}


/* ---------- Contrast section (Box 3.5) ---------- */
.aksiq-site .contrast{display:grid;grid-template-columns:1fr;gap:40px;align-items:center}
.aksiq-site .contrast h2{font-size:28px;line-height:1.2;letter-spacing:-0.01em;margin:0 0 16px}
.aksiq-site .contrast p{font-size:var(--text-base);line-height:var(--leading-relaxed);color:var(--text-secondary);margin:0 0 20px}
.aksiq-site .contrast-link{display:inline-flex;align-items:center;gap:8px;font-size:var(--text-base);font-weight:600;color:var(--accent-secondary);text-decoration:none}
.aksiq-site .contrast-link:hover{color:var(--blue-700)}
.aksiq-site .contrast-link svg{transition:transform 180ms ease}
.aksiq-site .contrast-link:hover svg{transform:translateX(4px)}
.aksiq-site .contrast-graphic{order:-1;border:1px solid var(--border-default);border-radius:var(--radius-xl);background:var(--cool-50);padding:32px;display:flex;align-items:center;justify-content:center}
@media (min-width:1024px){
.aksiq-site .contrast{grid-template-columns:1fr 1fr;gap:64px}
.aksiq-site .contrast-graphic{order:1}
}


/* Staggered reveal: heading, then paragraph, then CTA */
.aksiq-site .reveal-group--slow>.reveal:nth-child(1){transition-delay:0ms}
.aksiq-site .reveal-group--slow>.reveal:nth-child(2){transition-delay:150ms}
.aksiq-site .reveal-group--slow>.reveal:nth-child(3){transition-delay:300ms}


/* Invoice mockup — reveals its own parts in sequence once .contrast-graphic becomes visible,
   then behaves like a small interactive product surface on hover. */
.aksiq-site .invoice-card{width:100%;max-width:360px;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--elevation-1);padding:24px;transition:box-shadow 220ms ease,border-color 220ms ease,transform 220ms ease}
.aksiq-site .contrast-graphic:hover .invoice-card{transform:translateY(-3px);box-shadow:var(--elevation-2);border-color:var(--border-strong)}
.aksiq-site .invoice-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.aksiq-site .invoice-id{font-weight:600;color:var(--text-primary)}
.aksiq-site .invoice-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid var(--border-default);font-size:var(--text-sm);color:var(--text-secondary)}
.aksiq-site .invoice-row--mismatch{color:var(--status-danger);transition:background 220ms ease}
.aksiq-site .invoice-row--mismatch span:first-child{display:flex;align-items:center;gap:6px}
.aksiq-site .invoice-row--mismatch .tnum{color:var(--status-danger)}
.aksiq-site .contrast-graphic:hover .invoice-row--mismatch{background:var(--danger-100);margin:0 -12px;padding-left:12px;padding-right:12px;border-radius:var(--radius-sm)}
.aksiq-site .invoice-warning-icon{transition:transform 180ms ease}
.aksiq-site .contrast-graphic:hover .invoice-warning-icon{transform:scale(1.15)}
.aksiq-site .chip--danger{background:var(--danger-100);color:var(--status-danger)}
@media (min-width:1024px) and (prefers-reduced-motion:no-preference){
.aksiq-site .invoice-card, .aksiq-site .invoice-badge, .aksiq-site .invoice-row{opacity:0;transform:translateY(14px);transition:opacity 450ms cubic-bezier(.16,.84,.44,1),transform 450ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .invoice-card{transition-delay:120ms}
.aksiq-site .invoice-badge{transition-delay:280ms}
.aksiq-site .invoice-card-head+.invoice-row{transition-delay:340ms}
.aksiq-site .invoice-card-head+.invoice-row+.invoice-row{transition-delay:400ms}
.aksiq-site .invoice-row--mismatch{transition-delay:480ms}
.aksiq-site .contrast-graphic.is-visible .invoice-card, .aksiq-site .contrast-graphic.is-visible .invoice-badge, .aksiq-site .contrast-graphic.is-visible .invoice-row{opacity:1;transform:translateY(0)}
.aksiq-site .contrast-graphic.is-visible .invoice-warning-icon{animation:invoiceWarningPulse 700ms ease 620ms}
}

@keyframes invoiceWarningPulse{0%{transform:scale(1)}40%{transform:scale(1.3)}100%{transform:scale(1)}}


/* ---------- Proof section (Box 4) ---------- */
.aksiq-site .proof-featured{border:1px solid var(--border-default);border-radius:var(--radius-xl);background:var(--white);box-shadow:var(--elevation-1);padding:32px;margin-bottom:var(--space-5)}
.aksiq-site .proof-featured h3{font-size:22px;line-height:1.25;letter-spacing:-0.005em;margin:0 0 12px}
.aksiq-site .proof-featured p{font-size:var(--text-base);line-height:var(--leading-normal);color:var(--text-secondary);margin:0 0 24px}

/* Featured-deployment figure — bleeds left and right to the card edges (negative margins
   cancel the 32px padding) but no longer to the bottom: the figures moved out of the
   image into .proof-stat-row, which now occupies that space. */
.aksiq-site .proof-figure{margin:4px -32px 28px;overflow:hidden;background:var(--cool-50);
  border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default)}

/* 16:9 from a 4:3 source. Centred rather than bottom-anchored — the old bottom anchor
   existed to protect a stat line burned into the image, which no longer lives there. */
.aksiq-site .proof-figure img{width:100%;height:100%;display:block;aspect-ratio:16/9;object-fit:cover;object-position:50% 50%}
.aksiq-site .proof-stat-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:16px 0}
.aksiq-site .proof-stat-row .stat-chip{display:flex;align-items:baseline;gap:10px;font-size:var(--text-sm);color:var(--text-secondary);padding-right:28px;margin-right:28px;border-right:1px solid var(--border-default)}
.aksiq-site .proof-stat-row .stat-chip:last-child{border-right:none;margin-right:0;padding-right:0}
.aksiq-site .proof-stat-row .stat-chip strong{font-family:var(--font-display);font-feature-settings:"tnum";font-weight:var(--weight-light);color:var(--text-primary);font-size:28px;letter-spacing:-0.02em;line-height:1}
@media (max-width:640px){
.aksiq-site .proof-stat-row .stat-chip{width:100%;border-right:none;margin-right:0;padding-right:0;border-bottom:1px solid var(--border-default);padding-bottom:12px}
}
.aksiq-site .accordion{border:1px solid var(--border-default);border-radius:var(--radius-lg);overflow:hidden;background:var(--white)}
.aksiq-site .accordion-row{border-top:1px solid var(--border-default)}
.aksiq-site .accordion-row:first-child{border-top:none}
.aksiq-site .accordion-trigger{display:flex;align-items:center;gap:16px;width:100%;background:none;border:none;text-align:left;padding:20px 24px;cursor:pointer;transition:background 150ms ease}
.aksiq-site .accordion-trigger:hover{background:var(--cool-50)}
.aksiq-site .accordion-trigger span.line{flex:1;font-size:var(--text-base);font-weight:600;color:var(--text-primary)}
.aksiq-site .accordion-trigger .nav-caret{width:20px;height:20px;color:var(--text-tertiary);flex-shrink:0;transition:transform 160ms ease}
.aksiq-site .row-logo{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--white);flex-shrink:0;padding:8px}
.aksiq-site .row-logo img{width:100%;height:100%;object-fit:contain}
.aksiq-site .row-logo--icon{color:var(--accent-secondary);background:var(--cyan-50);border-color:var(--cyan-50)}
.aksiq-site .row-arrow{color:var(--accent-secondary);flex-shrink:0;opacity:0;transform:translateX(-6px);transition:opacity 180ms ease,transform 180ms ease}
.aksiq-site .accordion-trigger:hover .row-arrow{opacity:1;transform:translateX(0)}
.aksiq-site .accordion-row.is-open .accordion-trigger .nav-caret{transform:rotate(180deg)}
.aksiq-site .accordion-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows 200ms ease}
.aksiq-site .accordion-row.is-open .accordion-panel{grid-template-rows:1fr}
.aksiq-site .accordion-panel-inner{overflow:hidden}
.aksiq-site .accordion-body{padding:0 24px 24px}
.aksiq-site .accordion-body p{font-size:var(--text-base);line-height:var(--leading-normal);color:var(--text-secondary);margin:0 0 16px}
.aksiq-site .chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.aksiq-site .chip{display:inline-flex;align-items:center;padding:4px 12px;border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);font-size:var(--text-xs);font-weight:600}
.aksiq-site .solutions-used{font-size:var(--text-sm);color:var(--text-tertiary)}
.aksiq-site .experts-row{margin-top:var(--space-6)}
.aksiq-site .experts-head{font-size:22px;letter-spacing:-0.005em;margin:0 0 24px}
.aksiq-site .experts-grid{display:grid;grid-template-columns:1fr;gap:20px}
.aksiq-site .expert-card{border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:28px;transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms ease}
.aksiq-site .expert-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-1);transform:translateY(-2px)}
.aksiq-site .expert-card .icon-wrap{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary);margin-bottom:16px}
.aksiq-site .expert-card h4{font-size:var(--text-md);margin:0 0 8px}
.aksiq-site .expert-card p{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal);margin:0}
@media (min-width:768px){
.aksiq-site .experts-grid{grid-template-columns:repeat(3,1fr)}
}


/* ---------- Quote carousel (Box 5) ---------- */
.aksiq-site .quote-carousel{max-width:820px;margin:0 auto;text-align:center}
.aksiq-site .quote-track{position:relative;min-height:170px}
.aksiq-site .quote-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 240ms ease;display:flex;flex-direction:column;align-items:center;justify-content:center}
.aksiq-site .quote-slide.is-active{opacity:1;visibility:visible;position:relative}
.aksiq-site .quote-slide blockquote{font-family:var(--font-display);font-weight:600;font-size:22px;line-height:1.4;letter-spacing:-0.005em;margin:0 0 28px;color:var(--text-primary)}
.aksiq-site .quote-profile{display:inline-flex;align-items:center;gap:12px;padding:10px 18px 10px 10px;border-radius:var(--radius-lg);border:1px solid transparent;text-decoration:none;color:inherit;transition:border-color 180ms ease,background 180ms ease,transform 180ms ease}
.aksiq-site .quote-profile:hover{border-color:var(--border-default);background:var(--cool-50);transform:translateY(-1px)}
.aksiq-site .quote-avatar{display:inline-block;width:44px;height:44px;border-radius:50%;flex-shrink:0;overflow:hidden;background:var(--cool-100)}
.aksiq-site .quote-avatar img{width:100%;height:100%;object-fit:cover}
.aksiq-site .quote-profile-text{display:flex;flex-direction:column;gap:2px;text-align:left}
.aksiq-site .quote-name{font-size:var(--text-sm);font-weight:600;color:var(--text-primary)}
.aksiq-site .quote-title{font-size:var(--text-xs);color:var(--text-tertiary)}
.aksiq-site .quote-linkedin{display:inline-flex;color:var(--accent-secondary);opacity:0;transform:translateX(-4px);transition:opacity 180ms ease,transform 180ms ease}
.aksiq-site .quote-profile:hover .quote-linkedin{opacity:1;transform:translateX(0)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .quote-profile:hover{transform:none}
}

/* Bank tabs — the names are the control. The active tab's top rule fills across
   over one autoplay interval, so the timer is visible instead of implied.
   Keep QUOTE_INTERVAL in main.js in step with the 6000ms below. */
.aksiq-site .quote-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin-top:22px;border-top:1px solid var(--border-default)}
.aksiq-site .quote-tab{position:relative;background:none;border:0;padding:16px 12px 0;cursor:pointer;
  font-family:var(--font-display);font-weight:600;font-size:var(--text-base);color:var(--ink-500);
  transition:color 200ms ease}
.aksiq-site .quote-tab::before{content:'';position:absolute;top:-1px;left:0;width:0;height:2px;background:var(--accent-secondary);border-radius:2px}
.aksiq-site .quote-tab:hover{color:var(--text-secondary)}
.aksiq-site .quote-tab.is-active{color:var(--text-primary)}
.aksiq-site .quote-tab.is-active::before{animation:quoteTabFill 6000ms linear forwards}

@keyframes quoteTabFill{from{width:0}to{width:100%}}

/* Autoplay pauses on hover, so the bar should pause with it */
.aksiq-site .quote-carousel:hover .quote-tab.is-active::before{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
.aksiq-site .quote-tab.is-active::before{animation:none;width:100%}
}
@media (max-width:640px){
.aksiq-site .quote-tabs{grid-auto-flow:row;grid-auto-columns:auto}
.aksiq-site .quote-tab{padding:13px 12px 12px;border-top:1px solid var(--border-default)}
.aksiq-site .quote-tab:first-child{border-top:0}
}
.aksiq-site .quote-dots{display:flex;justify-content:center;gap:8px;margin-top:16px}
.aksiq-site .quote-dot{width:8px;height:8px;border-radius:50%;background:var(--ink-100);border:none;padding:0;cursor:pointer}
.aksiq-site .quote-dot.is-active{background:var(--accent-secondary)}
.aksiq-site .quote-footnote{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:14px}


/* ---------- Dark infrastructure section (Box 6) — scroll-driven story ---------- */
.aksiq-site .infra{color:var(--white);padding:var(--space-8) 0}
.aksiq-site .infra .section-head h2, .aksiq-site .infra .section-head p{color:var(--white)}
.aksiq-site .infra .section-head p{color:rgba(255,255,255,0.72)}
.aksiq-site .section-head-wrap{margin-bottom:var(--space-6)}
.aksiq-site .infra-panels{position:relative}
.aksiq-site .infra-step-counter{display:flex;align-items:baseline;margin-bottom:20px;font-family:var(--font-mono);font-feature-settings:"tnum"}
.aksiq-site .infra-step-current{font-size:88px;line-height:1;font-weight:700;letter-spacing:-0.02em;color:var(--cyan-500)}
.aksiq-site .infra-step-total{font-size:24px;font-weight:600;color:rgba(255,255,255,0.4);margin-left:2px}
.aksiq-site .infra-panel h3{font-size:36px;letter-spacing:-0.015em;color:var(--white);margin:0 0 16px}
.aksiq-site .infra-panel p{font-size:var(--text-lg);line-height:var(--leading-normal);color:rgba(255,255,255,0.72);margin:0 0 20px;max-width:600px}
@media (max-width:767px){
.aksiq-site .infra-step-current{font-size:64px}
.aksiq-site .infra-panel h3{font-size:28px}
}
.aksiq-site .infra-stats{display:flex;flex-wrap:wrap;gap:28px}
.aksiq-site .infra-stat-value{font-family:var(--font-mono);font-weight:500;font-size:28px;letter-spacing:-0.01em;font-feature-settings:"tnum";color:var(--cyan-500)}
.aksiq-site .infra-stat-label{font-size:var(--text-sm);color:rgba(255,255,255,0.72);margin-top:4px}


/* ---------- Scale panel — flowing light ribbon behind the figures ----------
   A slow-drifting blurred band with a fine striped overlay, sitting behind the
   copy. Purely decorative and out of the flow, so panel height is unchanged. */
.aksiq-site .infra-panel{position:relative}
.aksiq-site .infra-panel > *:not(.infra-flow){position:relative;z-index:1}
.aksiq-site .infra-flow{position:absolute;left:-6%;right:-6%;top:-12%;bottom:-18%;z-index:0;pointer-events:none;overflow:hidden;
  -webkit-mask:radial-gradient(ellipse 78% 62% at 52% 54%,#000 26%,transparent 76%);
  mask:radial-gradient(ellipse 78% 62% at 52% 54%,#000 26%,transparent 76%)}

/* the band itself */
.aksiq-site .infra-flow::before{content:'';position:absolute;left:-15%;right:-15%;top:50%;height:58%;translate:0 -50%;
  border-radius:50%;filter:blur(46px);opacity:.75;
  background:linear-gradient(94deg,transparent 2%,rgba(27,180,211,0.50) 22%,rgba(108,93,211,0.80) 48%,rgba(142,130,228,0.55) 72%,transparent 96%);
  animation:infraFlowDrift 19s ease-in-out infinite alternate}

/* fine striping, the texture that reads as motion rather than a plain glow */
.aksiq-site .infra-flow::after{content:'';position:absolute;inset:0;opacity:.5;
  background:repeating-linear-gradient(101deg,rgba(255,255,255,0.055) 0 1px,transparent 1px 6px);
  animation:infraFlowShift 24s linear infinite}

@keyframes infraFlowDrift{
  0%{transform:rotate(-7deg) scaleY(0.86) translateX(-3%)}
  100%{transform:rotate(4deg) scaleY(1.12) translateX(3%)}
}

@keyframes infraFlowShift{to{background-position:180px 0}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .infra-flow::before, .aksiq-site .infra-flow::after{animation:none}
}


/* Figures sit large over the ribbon, filled with the brand gradient */
.aksiq-site .infra-stats--lg{gap:44px;margin-top:28px}
.aksiq-site .infra-stats--lg .infra-stat-value{font-size:48px;font-weight:700;line-height:1.05;
  background:linear-gradient(96deg,var(--cyan-500) 0%,var(--violet-400) 55%,var(--violet-500) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.aksiq-site .infra-stats--lg .infra-stat-label{margin-top:8px}
@media (max-width:640px){
.aksiq-site .infra-stats--lg{gap:28px}
.aksiq-site .infra-stats--lg .infra-stat-value{font-size:38px}
}
.aksiq-site .deploy-layout{display:flex;flex-direction:column;gap:24px}
@media (min-width:900px){
.aksiq-site .deploy-layout{flex-direction:row;align-items:stretch;gap:32px}
}
.aksiq-site .deploy-cards{display:grid;grid-template-columns:1fr;gap:12px;max-width:640px;flex:1 1 auto}
.aksiq-site .deploy-card{cursor:pointer;border:1px solid rgba(255,255,255,0.14);border-radius:var(--radius-md);padding:16px 18px;transition:border-color 200ms ease,background 200ms ease,transform 200ms ease}
.aksiq-site .deploy-card:hover, .aksiq-site .deploy-card.is-active{border-color:var(--cyan-500);background:rgba(27,180,211,0.08);transform:translateY(-2px)}
.aksiq-site .deploy-card h4{font-size:var(--text-sm);font-weight:600;color:var(--white);margin:0 0 4px}
.aksiq-site .deploy-card p{font-size:var(--text-sm);color:rgba(255,255,255,0.68);margin:0;line-height:1.5}
@media (min-width:640px){
.aksiq-site .deploy-cards{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:900px){
.aksiq-site .deploy-cards{grid-template-columns:1fr;max-width:280px}
}
.aksiq-site .deploy-visual{position:relative;flex:1 1 auto;min-height:220px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-xl);overflow:hidden}
.aksiq-site .deploy-visual-panel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;opacity:0;visibility:hidden;transition:opacity 300ms ease}
.aksiq-site .deploy-visual-panel.is-active{opacity:1;visibility:visible}
.aksiq-site .deploy-visual-icon{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:12px;background:rgba(27,180,211,0.12);color:var(--cyan-500)}
.aksiq-site .deploy-visual-title{font-size:var(--text-md);font-weight:600;color:var(--white)}
.aksiq-site .deploy-visual-diagram{display:flex;align-items:center;gap:0;width:100%;max-width:320px;justify-content:center}
.aksiq-site .deploy-visual-box{font-family:var(--font-mono);font-size:12px;color:rgba(255,255,255,0.85);border:1px solid rgba(255,255,255,0.18);border-radius:8px;padding:10px 14px;white-space:nowrap}
.aksiq-site .deploy-visual-box--accent{border-color:var(--cyan-500);background:rgba(27,180,211,0.14);color:var(--white)}
.aksiq-site .deploy-visual-link{flex:1 1 auto;min-width:24px;height:1px;background:repeating-linear-gradient(to right,rgba(27,180,211,0.6) 0 6px,transparent 6px 11px);background-size:200% 100%;animation:cmapWireFlow 1.6s linear infinite}
.aksiq-site .deploy-visual-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.aksiq-site .deploy-visual-tags span{font-size:var(--text-xs);color:rgba(255,255,255,0.68);border:1px solid rgba(255,255,255,0.16);border-radius:var(--radius-pill);padding:4px 10px}
@media (prefers-reduced-motion:reduce){
.aksiq-site .deploy-visual-link{animation:none}
}
.aksiq-site .infra-security{display:flex;align-items:flex-start;gap:12px;padding-top:var(--space-5);border-top:1px solid rgba(255,255,255,0.14);flex-wrap:wrap;margin-top:var(--space-7)}
.aksiq-site .infra-security p{font-size:var(--text-sm);color:rgba(255,255,255,0.72);margin:0;flex:1;min-width:240px}
.aksiq-site .infra-security a{display:inline-flex;align-items:center;gap:6px;color:var(--cyan-500);font-weight:600;text-decoration:none;white-space:nowrap}
.aksiq-site .infra-security a svg{transition:transform 180ms ease}
.aksiq-site .infra-security a:hover{text-decoration:underline}
.aksiq-site .infra-security a:hover svg{transform:translateX(4px)}


/* Plain natural page flow — each step just reveals in (via the generic .reveal
   system) as the reader scrolls to it, same as every other section. No pinning,
   no scroll-hijacking: the page keeps moving under the reader the whole time. */
.aksiq-site .infra-panel:not(:last-child){margin-bottom:56px}


/* ---------- Closing CTA band (Box 7) ---------- */
.aksiq-site .cta-band{position:relative;overflow:hidden;background:var(--gradient-band);background-size:180% 180%;padding:var(--space-7) 0;color:var(--white);animation:heroGradientDrift 22s ease infinite alternate}
@media (prefers-reduced-motion:reduce){
.aksiq-site .cta-band{animation:none}
}
.aksiq-site .cta-band-content{max-width:640px}
.aksiq-site .cta-band h2{font-size:32px;line-height:1.15;letter-spacing:-0.015em;color:var(--white);margin:0 0 16px}
.aksiq-site .cta-band p{font-size:var(--text-md);line-height:var(--leading-relaxed);color:rgba(255,255,255,0.88);margin:0 0 32px}
@media (min-width:1024px){
.aksiq-site .cta-band h2{font-size:44px}
}


/* ---------- Footer ---------- */
.aksiq-site .site-footer{background:var(--white);border-top:1px solid var(--border-default);padding:var(--space-6) 0 var(--space-4)}
.aksiq-site .footer-top{display:grid;grid-template-columns:1fr;gap:40px;margin-bottom:var(--space-6)}
.aksiq-site .footer-brand img{height:46px;margin-bottom:16px}
.aksiq-site .footer-brand p{font-size:var(--text-sm);color:var(--text-tertiary);max-width:260px;line-height:1.5;margin:0 0 20px}
.aksiq-site .social-link{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-secondary);text-decoration:none}
.aksiq-site .social-link:hover{background:var(--cool-50)}
.aksiq-site .footer-cols{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.aksiq-site .footer-col h5{font-size:var(--text-xs);font-weight:600;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-tertiary);margin:0 0 16px}
.aksiq-site .footer-col a{display:block;font-size:var(--text-sm);color:var(--text-secondary);text-decoration:none;margin-bottom:12px}
.aksiq-site .footer-col a:hover{color:var(--text-primary)}
.aksiq-site .footer-bottom{display:flex;flex-direction:column;gap:12px;padding-top:var(--space-4);border-top:1px solid var(--border-default);font-size:var(--text-xs);color:var(--text-tertiary)}
@media (min-width:768px){
.aksiq-site .footer-top{grid-template-columns:1.4fr repeat(4,1fr)}
.aksiq-site .footer-cols{display:contents}
.aksiq-site .footer-bottom{flex-direction:row;align-items:center;justify-content:space-between}
}
@media (max-width:767px){
.aksiq-site .footer-cols{grid-template-columns:repeat(2,1fr)}
}


/* ---------- Trade iQ page — feature rows (whole row is one dynamic card) ---------- */
.aksiq-site .feature-row{display:grid;grid-template-columns:1fr;gap:22px;padding:24px;margin-bottom:20px;border:1px solid var(--border-default);border-radius:var(--radius-xl);background:var(--white);transition:border-color 200ms ease,box-shadow 200ms ease,transform 200ms cubic-bezier(.16,.84,.44,1);will-change:transform}
.aksiq-site .feature-row:last-child{margin-bottom:0}
.aksiq-site .feature-row:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2)}

/* Capped measure on the heading: a 68-character h3 running the full column read as a
   banner, and the extra wrapped line also helps the copy meet the art's height. */
.aksiq-site .feature-copy h3{font-size:22px;line-height:1.3;margin:0 0 18px;max-width:17em}
.aksiq-site .feature-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px}
.aksiq-site .feature-list li{display:flex;align-items:flex-start;gap:10px;font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6}
.aksiq-site .feature-list li svg{flex-shrink:0;margin-top:3px;color:var(--accent-secondary)}

/* Fiza's four replacement renders export at 3000x2000, so the frame is 3:2 and they
   fill it exactly. The seven older 4:3 pieces give up 11% of their height to the crop,
   almost all of it their own top/bottom padding; content sits high in those canvases,
   hence the upward bias rather than a straight centre. */
.aksiq-site .feature-visual{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--cool-50);aspect-ratio:3/2}
.aksiq-site .feature-visual img{width:100%;height:100%;object-fit:cover;object-position:50% 42%;display:block;
  transition:transform 400ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .feature-row:hover .feature-visual img{transform:scale(1.02)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .feature-row:hover .feature-visual img{transform:none}
}
@media (min-width:900px){

  /* Capping the art column is what closes the dead space beside the copy. At an even
     1fr 1fr split the visual was ~570px wide and so ~380px tall, against ~200px of
     text. A proportional cap keeps the copy column from collapsing at mid widths,
     where a hard 500px of art left only 296px for the text. */
  .aksiq-site .feature-row{grid-template-columns:minmax(0,1fr) minmax(0,46%);align-items:center;gap:36px;padding:28px}
.aksiq-site .feature-row:nth-child(even){direction:rtl}
.aksiq-site .feature-row:nth-child(even) .feature-copy, .aksiq-site .feature-row:nth-child(even) .feature-visual{direction:ltr}
}
@media (min-width:1160px){

  /* At the full 1232px column, 470px of art is 313px tall and the copy gets 666px. */
  .aksiq-site .feature-row{grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:40px}
}


/* ---------- Trade iQ page — fit & trust / resources card grids ---------- */
.aksiq-site .fit-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:640px){
.aksiq-site .fit-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px){
.aksiq-site .fit-grid{grid-template-columns:repeat(4,1fr)}
}
.aksiq-site .fit-grid .expert-card{position:relative;overflow:hidden}
.aksiq-site .fit-grid .expert-card::before{content:'';position:absolute;top:0;left:0;height:3px;width:0;background:var(--accent-secondary);transition:width 320ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .fit-grid .expert-card:hover::before{width:100%}
.aksiq-site .fit-grid .expert-card .eyebrow{transition:color 200ms ease}
.aksiq-site a.expert-card{color:inherit;text-decoration:none}
.aksiq-site a.expert-card:hover h4{color:var(--accent-secondary)}
.aksiq-site .expert-card .card-foot{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);font-weight:600;color:var(--accent-secondary);margin-top:12px}
.aksiq-site .expert-card .card-foot svg{transition:transform 180ms ease}
.aksiq-site a.expert-card:hover .card-foot svg{transform:translateX(4px)}


/* ================================================================
   COMPANY PAGES — About / Partners / Careers
   Light theme throughout (per design system: white ground always,
   dark used only sparingly) — structure/animation pattern borrowed
   from aksiq.com: scroll progress, sticky sub-nav, hero rings/nodes,
   page-enter fade, scroll reveals.
   ================================================================ */

/* Scroll progress bar */
.aksiq-site .scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--gradient-band);z-index:100;transition:width 80ms linear}
@media (prefers-reduced-motion:reduce){
.aksiq-site .scroll-progress{transition:none}
}


/* Page enter fade — body starts hidden, fades in once JS confirms load */
.aksiq-site.page-fade{opacity:0;transition:opacity 500ms ease}
.aksiq-site.page-fade.is-ready{opacity:1}
@media (prefers-reduced-motion:reduce){
.aksiq-site.page-fade{opacity:1;transition:none}
}


/* Centered hero variant — layers rings/nodes/badge on top of the same
   light gradient-wash .hero used on the homepage and Trade iQ. */
.aksiq-site .hero--centered{text-align:center}
.aksiq-site .hero--centered .hero-rings{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:0}
.aksiq-site .hero-ring{position:absolute;border:1px solid rgba(47,128,166,0.14);border-radius:50%;animation:heroRingPulse 6s ease-in-out infinite}
.aksiq-site .hero-ring--1{width:320px;height:320px;animation-delay:0s}
.aksiq-site .hero-ring--2{width:500px;height:500px;animation-delay:1s;border-color:rgba(108,93,211,0.12)}
.aksiq-site .hero-ring--3{width:700px;height:700px;animation-delay:2s}

@keyframes heroRingPulse{0%,100%{transform:scale(1);opacity:0.5}50%{transform:scale(1.05);opacity:1}}
.aksiq-site .hero-node{position:absolute;border-radius:50%;background:var(--accent-secondary);opacity:0;animation:heroNodeFloat 4s ease-in-out infinite}

@keyframes heroNodeFloat{0%,100%{opacity:0;transform:translateY(0)}50%{opacity:0.7;transform:translateY(-10px)}}
.aksiq-site .hero--centered .hero-content{position:relative;z-index:1;max-width:720px;margin:0 auto}
.aksiq-site .hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:var(--radius-pill);background:var(--cyan-50);border:1px solid var(--cyan-100);color:var(--blue-700);font-size:var(--text-sm);font-weight:600;margin-bottom:22px}
.aksiq-site .hero-badge svg{flex-shrink:0;color:var(--accent-secondary)}
.aksiq-site .hero--centered h1 em{color:var(--accent-secondary);font-style:normal}
.aksiq-site .hero--centered .hero-subhead{margin-left:auto;margin-right:auto}
.aksiq-site .hero--centered .hero-actions{justify-content:center}


/* Sticky sub-nav (Partners / Careers) */
.aksiq-site .subnav{position:fixed;top:0;left:0;right:0;z-index:55;background:rgba(255,255,255,0.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--border-default);box-shadow:var(--elevation-1);transform:translateY(-100%);transition:transform 240ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .subnav.is-visible{transform:translateY(0)}
.aksiq-site .subnav__inner{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad);height:56px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.aksiq-site .subnav__title{color:var(--text-primary);font-weight:600;font-size:var(--text-sm);white-space:nowrap}
.aksiq-site .subnav__links{display:flex;align-items:center;gap:24px}
.aksiq-site .subnav__link{color:var(--text-secondary);text-decoration:none;font-size:var(--text-sm);font-weight:500;white-space:nowrap;transition:color 150ms ease}
.aksiq-site .subnav__link:hover{color:var(--text-primary)}
.aksiq-site .subnav__link.is-active{color:var(--accent-secondary)}
.aksiq-site .subnav__link--cta{padding:8px 16px;border-radius:var(--radius-pill);background:var(--accent-secondary);color:var(--white)!important}
.aksiq-site .subnav__link--cta:hover{background:var(--accent-secondary-hover)}
@media (max-width:640px){
.aksiq-site .subnav__title{display:none}
.aksiq-site .subnav__links{gap:14px;overflow-x:auto;width:100%;justify-content:flex-end}
}
.aksiq-site .section-head--center{max-width:640px;margin-left:auto;margin-right:auto;text-align:center}
.aksiq-site .challenge-text{max-width:720px;margin:20px auto 0;text-align:center;color:var(--text-secondary);font-size:var(--text-md);line-height:var(--leading-relaxed)}


/* Mission & Vision */
.aksiq-site .mv-grid{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:768px){
.aksiq-site .mv-grid{grid-template-columns:repeat(2,1fr)}
}
.aksiq-site .mv-card{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-1);padding:32px;transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .mv-card::before{content:'';position:absolute;top:0;left:0;height:3px;width:0;background:var(--accent-secondary);transition:width 320ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .mv-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2);transform:translateY(-4px)}
.aksiq-site .mv-card:hover::before{width:100%}
@media (prefers-reduced-motion:reduce){
.aksiq-site .mv-card:hover{transform:none}
}
.aksiq-site .mv-card .eyebrow{margin-bottom:16px}
.aksiq-site .mv-card__title{color:var(--text-primary);font-size:24px;line-height:1.3;font-weight:600;margin-bottom:16px}
.aksiq-site .mv-card p{color:var(--text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);margin:0 0 14px}
.aksiq-site .mv-card p:last-child{margin-bottom:0}


/* Fit-grid 3-up variant (values / why-now / culture cards use .fit-grid + .expert-card) */
@media (min-width:1024px){
.aksiq-site .fit-grid--3{grid-template-columns:repeat(3,1fr)}
}
.aksiq-site .expert-card .icon-wrap--green{background:var(--success-100);color:var(--success-600)}
.aksiq-site .expert-card .icon-wrap--blue{background:var(--blue-100);color:var(--blue-600)}
.aksiq-site .expert-card .icon-wrap--gold{background:var(--warning-100);color:var(--warning-600)}
.aksiq-site .expert-card .icon-wrap--violet{background:var(--violet-100);color:var(--violet-500)}


/* Photo band inside a card — full-bleed to the card edges (negative margins
   cancel the 28px padding), sitting flush at the top in place of the icon. */
.aksiq-site .expert-card .card-photo{margin:-28px -28px 20px;aspect-ratio:16/9;overflow:hidden;background:var(--cool-100);border-bottom:1px solid var(--border-default)}
.aksiq-site .expert-card .card-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block;transition:transform 400ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .expert-card:hover .card-photo img{transform:scale(1.04)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .expert-card:hover .card-photo img{transform:none}
}


/* Team cards (About — leadership), photo/name/title centered, bio left-aligned */
.aksiq-site .team-featured{display:grid;grid-template-columns:1fr;gap:24px;margin-bottom:24px}
@media (min-width:768px){
.aksiq-site .team-featured{grid-template-columns:repeat(2,1fr)}
}
.aksiq-site .team-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}
.aksiq-site .team-grid .team-card{flex:1 1 300px;max-width:460px}
@media (min-width:640px){
.aksiq-site .team-grid .team-card{flex-basis:calc(50% - 10px)}
}
.aksiq-site .team-card{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:28px;transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .team-card::before{content:'';position:absolute;top:0;left:0;height:3px;width:0;background:var(--accent-secondary);transition:width 320ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .team-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2);transform:translateY(-4px)}
.aksiq-site .team-card:hover::before{width:100%}
@media (prefers-reduced-motion:reduce){
.aksiq-site .team-card:hover{transform:none}
}
.aksiq-site .team-card__photo{width:76px;height:76px;border-radius:50%;overflow:hidden;margin:0 auto 18px;border:2px solid var(--cyan-100)}
.aksiq-site .team-card__photo img{width:100%;height:100%;object-fit:cover;display:block}
.aksiq-site .team-card__name{color:var(--text-primary);font-size:var(--text-md);font-weight:600;margin-bottom:2px;text-align:center}
.aksiq-site .team-card__title{color:var(--accent-secondary);font-size:var(--text-sm);font-weight:600;margin-bottom:14px;text-align:center}
.aksiq-site .team-card__bio{color:var(--text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);margin:0}


/* Global presence / office split */
.aksiq-site .office-split{display:grid;grid-template-columns:1fr;gap:32px;max-width:720px;margin:0 auto;text-align:center}
@media (min-width:640px){
.aksiq-site .office-split{grid-template-columns:1fr auto 1fr;align-items:center}
}
.aksiq-site .office-col__flag{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--cyan-50);border:1px solid var(--cyan-100);color:var(--accent-secondary);font-size:var(--text-sm);font-weight:700;letter-spacing:0.02em;margin:0 auto 16px}
.aksiq-site .office-col__country{color:var(--text-primary);font-size:var(--text-lg);font-weight:600;margin-bottom:10px}
.aksiq-site .office-col__address, .aksiq-site .office-col__phone{color:var(--text-secondary);font-size:var(--text-sm);line-height:1.6;margin:0 0 6px}
.aksiq-site .office-divider{width:1px;height:100%;min-height:80px;background:var(--border-default);justify-self:center}
@media (max-width:639px){
.aksiq-site .office-divider{display:none}
}


/* Stat grid — 3-up variant (Partners / Careers stat bands) */
@media (min-width:640px){
.aksiq-site .stat-grid--3{grid-template-columns:repeat(3,1fr)}
}


/* Program cards (Partners) */
.aksiq-site .program-grid{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:768px){
.aksiq-site .program-grid{grid-template-columns:repeat(2,1fr)}
}
.aksiq-site .program-card{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-1);padding:32px;transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .program-card::before{content:'';position:absolute;top:0;left:0;height:3px;width:0;background:var(--accent-secondary);transition:width 320ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .program-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2);transform:translateY(-4px)}
.aksiq-site .program-card:hover::before{width:100%}
@media (prefers-reduced-motion:reduce){
.aksiq-site .program-card:hover{transform:none}
}
.aksiq-site .program-card .icon-wrap{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary);margin-bottom:20px}
.aksiq-site .program-card h3{color:var(--text-primary);font-size:22px;margin:0 0 14px}
.aksiq-site .program-card p{color:var(--text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);margin:0 0 20px}


/* Open roles list (Careers) */
.aksiq-site .role-list{display:flex;flex-direction:column;border-top:1px solid var(--border-default)}
.aksiq-site .role-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 4px;border-bottom:1px solid var(--border-default);transition:padding-left 200ms ease}
.aksiq-site .role-row:hover{padding-left:12px}
.aksiq-site .role__title{color:var(--text-primary);font-size:var(--text-md);font-weight:600;margin-bottom:4px}
.aksiq-site .role__meta{color:var(--text-tertiary);font-size:var(--text-sm)}
.aksiq-site .role__apply{display:inline-flex;align-items:center;gap:8px;color:var(--accent-secondary);font-weight:600;font-size:var(--text-sm);text-decoration:none;white-space:nowrap}
.aksiq-site .role__apply svg{transition:transform 180ms ease}
.aksiq-site .role-row:hover .role__apply svg{transform:translateX(4px)}
.aksiq-site .role-fallback{color:var(--text-secondary);font-size:var(--text-sm);text-align:center;margin-top:32px;line-height:1.6}
.aksiq-site .role-fallback a{color:var(--accent-secondary);text-decoration:none;font-weight:600}


/* Application form (Careers) */
.aksiq-site .apply-card{background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-1);padding:32px;max-width:720px;margin:0 auto}
.aksiq-site .form-field{margin-bottom:20px}
.aksiq-site .form-row{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:640px){
.aksiq-site .form-row{grid-template-columns:1fr 1fr}
}
.aksiq-site .form-field label{display:block;color:var(--text-primary);font-size:var(--text-sm);font-weight:600;margin-bottom:8px}
.aksiq-site .form-field input[type=text], .aksiq-site .form-field input[type=email], .aksiq-site .form-field input[type=tel], .aksiq-site .form-field select, .aksiq-site .form-field textarea{width:100%;padding:11px 14px;border-radius:var(--radius-md);border:1px solid var(--border-default);background:var(--white);color:var(--text-primary);font:inherit;font-size:var(--text-sm);transition:border-color 150ms ease}
.aksiq-site .form-field input[type=file]{width:100%;color:var(--text-secondary);font-size:var(--text-sm)}
.aksiq-site .form-field input:focus, .aksiq-site .form-field select:focus, .aksiq-site .form-field textarea:focus{outline:none;border-color:var(--accent-secondary)}
.aksiq-site .form-field textarea{resize:vertical;min-height:100px}
.aksiq-site .form-hint{color:var(--text-tertiary);font-size:var(--text-xs);margin:6px 0 0}
.aksiq-site .form-footer{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:8px}
.aksiq-site .form-status{color:var(--accent-secondary);font-size:var(--text-sm);font-weight:600}


/* Trust pills row under a final CTA (Partners / Careers) — sits on the
   .cta-band gradient (marketing-only gradient surface, white text) */
.aksiq-site .cta-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 14px;margin-top:28px;font-size:var(--text-sm);color:rgba(255,255,255,0.8)}
.aksiq-site .cta-trust-sep{color:rgba(255,255,255,0.4)}
.aksiq-site .cta-band-content--center{text-align:center;max-width:640px;margin:0 auto}
.aksiq-site .cta-band-content--center .hero-actions{justify-content:center}


/* ================================================================
   BLOG-STYLE LISTING PAGES — Blog / Press Releases
   Same structural pattern as aksiq.com's blog index (hero, card grid
   linking to full articles, subscribe CTA) — our light design system,
   same hover/scroll-reveal dynamics used across the rest of the site.
   ================================================================ */
.aksiq-site .blog-grid{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:768px){
.aksiq-site .blog-grid{grid-template-columns:repeat(3,1fr)}
}
.aksiq-site a.blog-card{position:relative;display:flex;flex-direction:column;overflow:hidden;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-1);text-decoration:none;color:inherit;transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site a.blog-card::before{content:'';position:absolute;top:0;left:0;height:3px;width:0;background:var(--accent-secondary);transition:width 320ms cubic-bezier(.16,.84,.44,1);z-index:1}
.aksiq-site a.blog-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2);transform:translateY(-4px)}
.aksiq-site a.blog-card:hover::before{width:100%}
@media (prefers-reduced-motion:reduce){
.aksiq-site a.blog-card:hover{transform:none}
}
.aksiq-site .blog-card__img{display:flex;align-items:center;justify-content:center;height:140px;background:var(--cyan-50)}
.aksiq-site .blog-card__img svg{width:36px;height:36px;color:var(--accent-secondary)}
.aksiq-site .blog-card__img--photo{height:auto;aspect-ratio:3/2;background:none}
.aksiq-site .blog-card__img--photo img{width:100%;height:100%;object-fit:cover;display:block}
.aksiq-site .blog-card--violet .blog-card__img{background:var(--violet-100)}
.aksiq-site .blog-card--violet .blog-card__img svg{color:var(--violet-500)}
.aksiq-site .blog-card--gold .blog-card__img{background:var(--warning-100)}
.aksiq-site .blog-card--gold .blog-card__img svg{color:var(--warning-600)}
.aksiq-site .blog-card__body{padding:24px 24px 28px;display:flex;flex-direction:column;flex:1 1 auto}
.aksiq-site .blog-card__tag{display:inline-flex;align-items:center;align-self:flex-start;padding:4px 12px;border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);font-size:var(--text-xs);font-weight:600;margin-bottom:14px}
.aksiq-site .blog-card__title{color:var(--text-primary);font-size:var(--text-md);font-weight:600;line-height:1.35;margin-bottom:10px}
.aksiq-site .blog-card__desc{color:var(--text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);margin:0 0 20px}
.aksiq-site .blog-card__link{display:inline-flex;align-items:center;gap:8px;color:var(--accent-secondary);font-weight:600;font-size:var(--text-sm);margin-top:auto}
.aksiq-site .blog-card__link svg{transition:transform 180ms ease}
.aksiq-site a.blog-card:hover .blog-card__link svg{transform:translateX(4px)}


/* Subscribe form (sits inside .cta-band, gradient bg, white text) */
.aksiq-site .subscribe-row{display:flex;flex-direction:column;gap:12px;max-width:480px;margin:0 auto}
@media (min-width:520px){
.aksiq-site .subscribe-row{flex-direction:row}
}
.aksiq-site .subscribe-row input[type=email]{flex:1 1 auto;padding:13px 18px;border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,0.4);background:rgba(255,255,255,0.12);color:var(--white);font:inherit;font-size:var(--text-sm)}
.aksiq-site .subscribe-row input[type=email]::placeholder{color:rgba(255,255,255,0.7)}
.aksiq-site .subscribe-row input[type=email]:focus{outline:none;border-color:var(--white);background:rgba(255,255,255,0.18)}
.aksiq-site .subscribe-hint{font-size:var(--text-xs);color:rgba(255,255,255,0.7);margin:14px 0 0;text-align:center}


/* ---------- Article detail template (blog / press release posts) ---------- */
.aksiq-site .article{max-width:760px;margin:0 auto;padding:48px 0 var(--space-7)}
.aksiq-site .article__back{display:inline-flex;align-items:center;gap:8px;color:var(--accent-secondary);font-weight:600;font-size:var(--text-sm);text-decoration:none;margin-bottom:32px}
.aksiq-site .article__back svg{transition:transform 180ms ease}
.aksiq-site .article__back:hover svg{transform:translateX(-4px)}
.aksiq-site .article__tag{display:inline-flex;align-items:center;padding:4px 12px;border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);font-size:var(--text-xs);font-weight:600;margin-bottom:18px}
.aksiq-site .article__title{font-size:32px;line-height:1.2;letter-spacing:-0.015em;margin:0 0 16px}
@media (min-width:768px){
.aksiq-site .article__title{font-size:40px}
}
.aksiq-site .article__meta{font-size:var(--text-sm);color:var(--text-tertiary);padding-bottom:28px;margin-bottom:36px;border-bottom:1px solid var(--border-default)}
.aksiq-site .article__body{font-size:var(--text-md);line-height:var(--leading-relaxed);color:var(--text-secondary)}
.aksiq-site .article__body h2{font-size:24px;color:var(--text-primary);margin:40px 0 14px;letter-spacing:-0.01em}
.aksiq-site .article__body h3{font-size:var(--text-lg);color:var(--text-primary);margin:28px 0 10px}
.aksiq-site .article__body p{margin:0 0 18px}
.aksiq-site .article__body ul, .aksiq-site .article__body ol{margin:0 0 18px 22px;padding:0}
.aksiq-site .article__body li{margin-bottom:8px}
.aksiq-site .article__body strong{color:var(--text-primary)}
.aksiq-site .article__body a{color:var(--accent-secondary)}
.aksiq-site .article__body blockquote{border-left:3px solid var(--accent-secondary);background:var(--cyan-50);padding:16px 22px;margin:28px 0;border-radius:0 var(--radius-md) var(--radius-md) 0;color:var(--text-primary)}
.aksiq-site .article__refs{margin-top:44px;padding-top:28px;border-top:1px solid var(--border-default)}
.aksiq-site .article__refs h3{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--accent-secondary);margin-bottom:14px}
.aksiq-site .article__refs ol{font-size:var(--text-sm);color:var(--text-tertiary);margin:0 0 0 20px;padding:0}
.aksiq-site .article__refs li{margin-bottom:8px}
.aksiq-site .article__cta{margin-top:44px;padding:32px;text-align:center;background:var(--cool-50);border:1px solid var(--border-default);border-radius:var(--radius-xl)}
.aksiq-site .article__cta p{color:var(--text-secondary);margin:0 0 18px}


/* ================================================================
   WHY AKS iQ PAGE
   ================================================================ */

/* Hero trust bar — small dot-separated line above the H1 */
.aksiq-site .hero-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 14px;font-size:var(--text-sm);font-weight:600;color:var(--text-secondary);margin-bottom:20px}
.aksiq-site .hero-trust-sep{color:var(--border-strong)}


/* Stat grid — 6-up variant */
@media (min-width:640px){
.aksiq-site .stat-grid--6{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:1024px){
.aksiq-site .stat-grid--6{grid-template-columns:repeat(6,1fr)}
}


/* Fit-grid 5-up variant (lifecycle steps) */
@media (min-width:1024px){
.aksiq-site .fit-grid--5{grid-template-columns:repeat(5,1fr)}
}
.aksiq-site .step-card{position:relative}
.aksiq-site .step-card__num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--cyan-50);color:var(--accent-secondary);font-family:var(--font-mono);font-weight:600;font-size:var(--text-sm);margin-bottom:16px}


/* Success stories — case cards (light theme, same hover dynamic as expert-card) */
.aksiq-site .case-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:640px){
.aksiq-site .case-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px){
.aksiq-site .case-grid{grid-template-columns:repeat(4,1fr)}
}
.aksiq-site .case-card{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:26px;display:flex;flex-direction:column;transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .case-card::before{content:'';position:absolute;top:0;left:0;height:3px;width:0;background:var(--accent-secondary);transition:width 320ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .case-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2);transform:translateY(-4px)}
.aksiq-site .case-card:hover::before{width:100%}
@media (prefers-reduced-motion:reduce){
.aksiq-site .case-card:hover{transform:none}
}
.aksiq-site .case-card__badge{display:inline-flex;align-self:flex-start;padding:4px 12px;border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);font-size:var(--text-xs);font-weight:600;margin-bottom:14px}
.aksiq-site .case-card__badge--gold{background:var(--warning-100);color:var(--warning-600)}
.aksiq-site .case-card__title{font-size:var(--text-md);font-weight:600;color:var(--text-primary);margin:0 0 10px;line-height:1.3}
.aksiq-site .case-card__desc{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal);margin:0 0 18px}
.aksiq-site .case-card__metrics{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:auto;padding-top:18px;border-top:1px solid var(--border-default)}
.aksiq-site .case-card__metric-num{font-family:var(--font-mono);font-weight:600;font-size:16px;line-height:1.3;color:var(--accent-secondary);letter-spacing:-0.01em}
.aksiq-site .case-card__metric-label{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:2px}
.aksiq-site .case-card__detail{font-size:var(--text-xs);color:var(--text-tertiary);line-height:var(--leading-normal);margin-top:auto}
.aksiq-site .case-card--award{background:var(--cool-50)}
.aksiq-site .award-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:640px){
.aksiq-site .award-grid{grid-template-columns:repeat(2,1fr)}
}
.aksiq-site .award-item{margin-bottom:0}
.aksiq-site .award-item__title{font-size:var(--text-sm);font-weight:600;color:var(--text-primary);margin-bottom:4px}
.aksiq-site .award-item__desc{font-size:var(--text-xs);color:var(--text-tertiary);line-height:var(--leading-normal)}


/* Static logo wall (distinct from the homepage's moving marquee) */
.aksiq-site .logo-wall{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (min-width:640px){
.aksiq-site .logo-wall{grid-template-columns:repeat(4,1fr)}
}
@media (min-width:1024px){
.aksiq-site .logo-wall{grid-template-columns:repeat(6,1fr)}
}
.aksiq-site .logo-wall__item{display:flex;align-items:center;justify-content:center;height:80px;padding:16px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--white);transition:border-color 180ms ease,box-shadow 180ms ease}
.aksiq-site .logo-wall__item:hover{border-color:var(--border-strong);box-shadow:var(--elevation-1)}


/* ---------- Platform mega-panel — product picker + live capability list ---------- */
@media (min-width:1024px){
.aksiq-site .mega-panel--platform{display:flex;flex-direction:column;padding:0;max-width:none;width:640px}
.aksiq-site .platform-panel-body{display:flex}
.aksiq-site .platform-products{flex:0 0 220px;padding:12px;border-right:1px solid var(--border-default)}
.aksiq-site .platform-products-label, .aksiq-site .platform-capabilities-label{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-tertiary);padding:4px 10px 10px}
.aksiq-site .platform-product{display:block;padding:12px 10px;border-radius:var(--radius-md);text-decoration:none;color:inherit;cursor:pointer;transition:background 150ms ease}
.aksiq-site .platform-product:hover, .aksiq-site .platform-product.is-active{background:var(--cool-50)}
.aksiq-site .platform-product-title{font-size:var(--text-sm);font-weight:600;color:var(--text-primary);margin-bottom:2px}
.aksiq-site .platform-product-desc{font-size:var(--text-xs);color:var(--text-tertiary);line-height:1.4}
.aksiq-site .platform-capabilities{flex:1;padding:12px 16px;min-width:0}
.aksiq-site .platform-capabilities-label{padding-left:0}
.aksiq-site .platform-cap-panel{display:none;grid-template-columns:1fr 1fr;gap:2px 12px}
.aksiq-site .platform-cap-panel.is-active{display:grid}
.aksiq-site .platform-cap-item{display:flex;align-items:flex-start;gap:10px;padding:7px 8px;border-radius:var(--radius-sm);text-decoration:none;color:var(--text-secondary);font-size:13px;line-height:1.35;transition:background 150ms ease,color 150ms ease}
.aksiq-site .platform-cap-checkbox{margin-top:2px}
.aksiq-site .platform-cap-item:hover{background:var(--cool-50);color:var(--text-primary)}
.aksiq-site .platform-cap-checkbox{flex-shrink:0;width:14px;height:14px;border-radius:4px;border:1.5px solid var(--border-strong)}
.aksiq-site .platform-footnote{font-size:var(--text-xs);color:var(--text-tertiary);padding:10px 16px;border-top:1px solid var(--border-default)}
}
.aksiq-site .logo-wall__item img{max-width:100%;max-height:32px;object-fit:contain}


/* ---------- Connection map (Connect step, infra section) — animated, Stripe-style ---------- */
@media (min-width:900px){
.aksiq-site .infra-panel--split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
}
.aksiq-site .cmap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:32px;max-width:none;width:100%;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-xl)}
.aksiq-site .cmap-row{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.aksiq-site .cmap-row--core{gap:0;width:100%}
.aksiq-site .cmap-chip, .aksiq-site .cmap-slot{position:relative;font-family:var(--font-mono);font-size:14px;color:rgba(255,255,255,0.75);border:1px solid rgba(255,255,255,0.16);border-radius:7px;padding:11px 18px;background:rgba(255,255,255,0.03);white-space:nowrap;overflow:hidden;transition:background 350ms ease,border-color 350ms ease}
.aksiq-site .cmap-slot{border-style:dashed;color:transparent;width:74px;height:38px;padding:0}
.aksiq-site .cmap-slot::before{content:attr(data-fill);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--cyan-500);font-size:12px;font-weight:700;letter-spacing:0.02em;opacity:0;transition:opacity 350ms ease}
.aksiq-site .cmap-chip.is-filled, .aksiq-site .cmap-slot.is-filled{background:rgba(27,180,211,0.18);border-color:var(--cyan-500)}
.aksiq-site .cmap-slot.is-filled::before{opacity:1}
.aksiq-site .cmap-chip--soft{color:rgba(255,255,255,0.85);background:rgba(255,255,255,0.05);padding:13px 22px;font-size:14px}
.aksiq-site .cmap-stems{position:relative;width:100%;max-width:320px;height:20px}
.aksiq-site .cmap-stem{position:absolute;top:0;left:var(--x);width:1px;height:100%;background:repeating-linear-gradient(to bottom,rgba(255,255,255,0.25) 0 4px,transparent 4px 8px)}
.aksiq-site .cmap-row--tags{margin-bottom:2px}
.aksiq-site .cmap-tag{font-family:var(--font-mono);font-size:12px;letter-spacing:0.02em;color:var(--cyan-500);text-transform:uppercase}
.aksiq-site .cmap-row--core{gap:12px;margin:10px 0}
.aksiq-site .cmap-wire{flex:1 1 auto;height:1px;min-width:28px;background:repeating-linear-gradient(to right,rgba(27,180,211,0.6) 0 6px,transparent 6px 11px);background-size:200% 100%;animation:cmapWireFlow 1.6s linear infinite}

@keyframes cmapWireFlow{to{background-position:-17px 0}}
.aksiq-site .cmap-node{flex-shrink:0;font-weight:700;font-size:16px;color:var(--white);background:var(--accent-secondary);padding:15px 24px;border-radius:9px;box-shadow:0 0 0 8px rgba(27,180,211,0.15)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .cmap-wire{animation:none}
.aksiq-site .cmap-chip, .aksiq-site .cmap-slot, .aksiq-site .cmap-slot::before{transition:none}
}


/* ---------- Speak to an Expert page ---------- */
.aksiq-site .demo-hero{padding:56px 0 var(--space-8)}
.aksiq-site .demo-hero-grid{display:grid;grid-template-columns:1fr;gap:40px;align-items:start}
@media (min-width:960px){
.aksiq-site .demo-hero-grid{grid-template-columns:1fr 1fr;gap:56px}
}
.aksiq-site .demo-copy h1{font-size:32px;line-height:1.15;letter-spacing:-0.01em;margin:0 0 16px}
@media (min-width:1024px){
.aksiq-site .demo-copy h1{font-size:42px;line-height:1.1}
}
.aksiq-site .demo-copy>.hero-subhead{margin:0 0 28px}
.aksiq-site .demo-benefits{display:flex;flex-direction:column;gap:18px;margin:0;padding:0;list-style:none}
.aksiq-site .demo-benefit{display:flex;align-items:flex-start;gap:12px;font-size:var(--text-md);color:var(--text-primary);line-height:1.4}
.aksiq-site .demo-benefit-check{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:rgba(47,128,166,0.12);color:var(--accent-secondary);margin-top:1px}
.aksiq-site .demo-form-checkbox{display:flex;align-items:flex-start;gap:10px;font-size:var(--text-sm);color:var(--text-secondary);line-height:1.4;margin:4px 0 24px}
.aksiq-site .demo-form-checkbox input{margin-top:3px;flex-shrink:0;width:16px;height:16px;accent-color:var(--accent-secondary)}
.aksiq-site .demo-form-hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}


/* Left-scrolling testimonial marquee (dark banner, distinct from the homepage's static quote carousel) */
.aksiq-site .testi-band{background:var(--bg-dark);padding:var(--space-8) 0;overflow:hidden}
.aksiq-site .testi-band .section-head h2, .aksiq-site .testi-band .section-head p{color:var(--white)}
.aksiq-site .testi-band .section-head p{color:rgba(255,255,255,0.72)}
.aksiq-site .testi-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,black 6%,black 94%,transparent);mask-image:linear-gradient(90deg,transparent,black 6%,black 94%,transparent)}
.aksiq-site .testi-marquee-track{display:flex;align-items:stretch;gap:24px;width:max-content;animation:testiMarquee 32s linear infinite}
.aksiq-site .testi-marquee:hover .testi-marquee-track{animation-play-state:paused}
.aksiq-site .testi-card{flex-shrink:0;width:380px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius-xl);padding:28px}
.aksiq-site .testi-card blockquote{margin:0 0 20px;font-family:var(--font-display);font-weight:500;font-size:var(--text-md);line-height:1.5;color:rgba(255,255,255,0.92)}
.aksiq-site .testi-person{display:flex;align-items:center;gap:12px}
.aksiq-site .testi-avatar{width:44px;height:44px;border-radius:50%;flex-shrink:0;overflow:hidden;background:rgba(255,255,255,0.1)}
.aksiq-site .testi-avatar img{width:100%;height:100%;object-fit:cover}
.aksiq-site .testi-name{font-weight:600;font-size:var(--text-sm);color:var(--white)}
.aksiq-site .testi-title{font-size:var(--text-xs);color:rgba(255,255,255,0.65)}

@keyframes testiMarquee{to{transform:translateX(-50%)}}
@media (max-width:640px){
.aksiq-site .testi-card{width:300px}
}
@media (prefers-reduced-motion:reduce){
.aksiq-site .testi-marquee-track{animation:none}
.aksiq-site .logo-marquee-track{animation:none}
}


/* ================================================================
   SOLUTIONS MEGA PANEL — by buyer problem
   Three columns of two, each naming the problem the buyer has and
   the modules underneath that solve it.
   ================================================================ */
@media (min-width:1024px){

  /* One column, like the Resources and Company panels. It used to be a 760px-wide
     three-across grid, which read as a horizontal banner next to those two and forced
     half the labels onto a second line. Six items stack fine. */
  .aksiq-site .mega-panel--solutions{display:block;max-width:none;width:340px;padding:10px}
.aksiq-site .mega-panel--solutions .mega-panel-label{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);
    text-transform:uppercase;color:var(--text-tertiary);padding:4px 12px 8px}
.aksiq-site .mega-panel--solutions .mega-grid{display:grid;grid-template-columns:1fr;gap:2px}
.aksiq-site .mega-panel--solutions .mega-link-title{white-space:nowrap}
.aksiq-site .mega-link-modules{font-size:var(--text-xs);color:var(--text-tertiary);letter-spacing:0.01em}
}
.aksiq-site .mobile-nav-panel .mobile-nav-sub{display:block;font-size:var(--text-xs);color:var(--text-tertiary);margin-top:-4px;margin-bottom:4px}


/* ================================================================
   SOLUTION DETAIL PAGE — Trade KYC & Customer Risk
   Section order mirrors the copy deck: hero, tension, solve, payoff,
   adaptability & trust, proof, stats, CTA.
   ================================================================ */

/* ---------- Hero: copy left, live score card right ---------- */
@media (min-width:1100px){
.aksiq-site .hero--solution .container{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);
    align-items:center;gap:56px;padding-top:12px;padding-bottom:28px}
.aksiq-site .hero--solution .hero-content{max-width:none}
}
.aksiq-site .hero--solution .hero-actions{margin-bottom:var(--space-3)}


/* The score card is a small product surface: a dial that fills, factor bars that
   grow, and a live-update ticker. All CSS — no image to load, no layout shift. */
.aksiq-site .score-card{position:relative;width:100%;max-width:420px;margin:28px auto 0;background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-2);
  padding:22px;overflow:hidden}
@media (min-width:1100px){
.aksiq-site .score-card{margin:0}
}
.aksiq-site .score-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.aksiq-site .score-card__who{min-width:0}
.aksiq-site .score-card__name{font-size:var(--text-sm);font-weight:600;color:var(--text-primary)}
.aksiq-site .score-card__meta{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:2px}
.aksiq-site .score-card__live{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;padding:4px 10px;
  border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);
  font-size:var(--text-xs);font-weight:700;letter-spacing:0.02em}
.aksiq-site .score-card__live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--cyan-500);
  animation:scorePulse 1.8s ease-in-out infinite}

@keyframes scorePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.35;transform:scale(1.5)}}
.aksiq-site .score-card__dial{display:flex;align-items:center;gap:20px;padding-bottom:18px;margin-bottom:16px;
  border-bottom:1px solid var(--border-default)}
.aksiq-site .score-dial{position:relative;width:112px;height:112px;flex-shrink:0}
.aksiq-site .score-dial svg{width:100%;height:100%;transform:rotate(-90deg)}
.aksiq-site .score-dial__track{fill:none;stroke:var(--cool-100);stroke-width:9}

/* 2πr for r=48 ≈ 301.6 — the dasharray/offset pair animates the arc from empty to 72%. */
.aksiq-site .score-dial__arc{fill:none;stroke:url(#scoreGradient);stroke-width:9;stroke-linecap:round;
  stroke-dasharray:301.6;stroke-dashoffset:301.6;animation:scoreArc 1.6s cubic-bezier(.16,.84,.44,1) .35s forwards}

@keyframes scoreArc{to{stroke-dashoffset:84.4}}
.aksiq-site .score-dial__value{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.aksiq-site .score-dial__num{font-family:var(--font-mono);font-feature-settings:"tnum";font-weight:600;font-size:30px;
  letter-spacing:-0.01em;color:var(--text-primary);line-height:1}
.aksiq-site .score-dial__unit{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:3px}
.aksiq-site .score-dial__band{display:inline-flex;align-items:center;padding:3px 10px;border-radius:var(--radius-pill);
  background:var(--warning-100);color:var(--warning-600);font-size:var(--text-xs);font-weight:700;
  letter-spacing:0.02em;margin-bottom:8px}
.aksiq-site .score-card__delta{font-size:var(--text-xs);color:var(--text-secondary);line-height:1.5;margin:8px 0 0}
.aksiq-site .score-card__delta strong{color:var(--warning-600);font-family:var(--font-mono);font-feature-settings:"tnum"}
.aksiq-site .score-factors{display:flex;flex-direction:column;gap:11px}
.aksiq-site .score-factor{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center}
.aksiq-site .score-factor__label{font-size:var(--text-xs);font-weight:600;color:var(--text-secondary)}
.aksiq-site .score-factor__num{font-family:var(--font-mono);font-feature-settings:"tnum";font-size:var(--text-xs);
  font-weight:600;color:var(--text-primary)}
.aksiq-site .score-factor__bar{grid-column:1/-1;height:6px;border-radius:3px;background:var(--cool-100);overflow:hidden}
.aksiq-site .score-factor__fill{display:block;height:100%;border-radius:3px;background:var(--gradient-band);
  width:0;animation:scoreFactorFill 1.1s cubic-bezier(.16,.84,.44,1) forwards}
.aksiq-site .score-factor:nth-child(1) .score-factor__fill{animation-delay:.55s}
.aksiq-site .score-factor:nth-child(2) .score-factor__fill{animation-delay:.75s}
.aksiq-site .score-factor:nth-child(3) .score-factor__fill{animation-delay:.95s}
.aksiq-site .score-factor:nth-child(4) .score-factor__fill{animation-delay:1.15s}

@keyframes scoreFactorFill{to{width:var(--w)}}
.aksiq-site .score-card__foot{display:flex;align-items:center;gap:8px;margin-top:18px;padding-top:14px;
  border-top:1px solid var(--border-default);font-size:var(--text-xs);color:var(--text-tertiary)}
.aksiq-site .score-card__foot svg{color:var(--accent-secondary);flex-shrink:0}
@media (prefers-reduced-motion:reduce){
.aksiq-site .score-card__live::before{animation:none}
.aksiq-site .score-dial__arc{animation:none;stroke-dashoffset:84.4}
.aksiq-site .score-factor__fill{animation:none;width:var(--w)}
}


/* ---------- Tension band — the snapshot vs the live profile ---------- */
.aksiq-site .tension{display:grid;grid-template-columns:1fr;gap:36px;align-items:center}
@media (min-width:960px){
.aksiq-site .tension{grid-template-columns:1fr 1fr;gap:64px}
}
.aksiq-site .tension h2{font-size:28px;line-height:1.2;letter-spacing:-0.01em;margin:0 0 16px}
@media (min-width:1024px){
.aksiq-site .tension h2{font-size:34px}
}
.aksiq-site .tension p{font-size:var(--text-md);line-height:var(--leading-relaxed);color:var(--text-secondary);margin:0}
.aksiq-site .tension-compare{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:520px){
.aksiq-site .tension-compare{grid-template-columns:1fr 1fr}
}
.aksiq-site .tension-panel{position:relative;border:1px solid var(--border-default);border-radius:var(--radius-lg);
  background:var(--white);padding:20px;overflow:hidden}
.aksiq-site .tension-panel--stale{background:var(--cool-50)}
.aksiq-site .tension-panel--live{border-color:var(--cyan-100);box-shadow:var(--elevation-1)}
.aksiq-site .tension-panel__tag{display:inline-flex;align-items:center;padding:3px 10px;border-radius:var(--radius-pill);
  font-size:var(--text-xs);font-weight:700;letter-spacing:0.02em;margin-bottom:14px}
.aksiq-site .tension-panel--stale .tension-panel__tag{background:var(--ink-100);color:var(--text-tertiary)}
.aksiq-site .tension-panel--live .tension-panel__tag{background:var(--cyan-50);color:var(--blue-700)}
.aksiq-site .tension-panel__num{font-family:var(--font-mono);font-feature-settings:"tnum";font-weight:600;font-size:38px;
  line-height:1.05;letter-spacing:-0.01em;height:40px}
.aksiq-site .tension-panel--stale .tension-panel__num{color:var(--text-tertiary)}
.aksiq-site .tension-panel--live .tension-panel__num{color:var(--text-primary)}

/* The live score is a column of values that steps upward, so the figure visibly
   moves while the frozen one beside it never does. */
.aksiq-site .tension-panel__num--live{overflow:hidden}
.aksiq-site .tension-ticker{display:flex;flex-direction:column;animation:tensionTick 7.2s steps(1) infinite}
.aksiq-site .tension-ticker span{height:40px;display:block}

@keyframes tensionTick{0%{transform:translateY(0)}25%{transform:translateY(-40px)}
  50%{transform:translateY(-80px)}75%{transform:translateY(-120px)}100%{transform:translateY(-160px)}}
.aksiq-site .tension-panel__when{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:8px;line-height:1.5}

/* The stale panel's trace is flat and frozen; the live one keeps drawing itself. */
.aksiq-site .tension-spark{display:block;width:100%;height:34px;margin-top:14px}
.aksiq-site .tension-spark path{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.aksiq-site .tension-panel--stale .tension-spark path{stroke:var(--ink-300)}
.aksiq-site .tension-panel--live .tension-spark path{stroke:var(--accent-secondary);stroke-dasharray:260;
  stroke-dashoffset:260;animation:tensionDraw 3.4s ease-in-out infinite}

@keyframes tensionDraw{0%{stroke-dashoffset:260}55%,100%{stroke-dashoffset:0}}
.aksiq-site .tension-panel--live .tension-events{position:absolute;right:16px;bottom:16px;display:flex;flex-direction:column;gap:4px;
  align-items:flex-end;font-size:10px;font-weight:700;letter-spacing:0.02em;color:var(--accent-secondary)}
.aksiq-site .tension-event{opacity:0;animation:tensionEvent 5.4s ease-in-out infinite}
.aksiq-site .tension-event:nth-child(2){animation-delay:1.8s}
.aksiq-site .tension-event:nth-child(3){animation-delay:3.6s}

@keyframes tensionEvent{0%{opacity:0;transform:translateY(6px)}12%,28%{opacity:1;transform:translateY(0)}42%,100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .tension-panel--live .tension-spark path{animation:none;stroke-dashoffset:0}
.aksiq-site .tension-ticker{animation:none;transform:translateY(-160px)}
.aksiq-site .tension-event{animation:none;opacity:1}
}


/* ---------- Payoff rail — four columns behind a left accent bar ---------- */
.aksiq-site .payoff-grid{display:grid;grid-template-columns:1fr;gap:32px 28px}
@media (min-width:640px){
.aksiq-site .payoff-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px){
.aksiq-site .payoff-grid{grid-template-columns:repeat(4,1fr)}
}
.aksiq-site .payoff-item{padding-left:16px;border-left:2px solid var(--border-default);transition:border-color 220ms ease}
.aksiq-site .payoff-item:hover{border-left-color:var(--accent-secondary)}
.aksiq-site .payoff-item .icon-wrap{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary);margin-bottom:16px;
  transition:transform 220ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .payoff-item:hover .icon-wrap{transform:translateY(-3px)}
.aksiq-site .payoff-item h3{font-size:var(--text-base);font-weight:600;line-height:1.35;color:var(--text-primary);margin:0 0 8px}
.aksiq-site .payoff-item p{font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--text-secondary);margin:0}
@media (prefers-reduced-motion:reduce){
.aksiq-site .payoff-item:hover .icon-wrap{transform:none}
}


/* ---------- Trust cards — mini product surface on top, copy underneath ---------- */
.aksiq-site .trust-grid{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:768px){
.aksiq-site .trust-grid{grid-template-columns:repeat(3,1fr)}
}
.aksiq-site .trust-card{display:flex;flex-direction:column;overflow:hidden;background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-1);
  transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .trust-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2);transform:translateY(-4px)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .trust-card:hover{transform:none}
}
.aksiq-site .trust-card__stage{position:relative;height:184px;flex-shrink:0;padding:22px;overflow:hidden;
  background:var(--gradient-brand-soft);border-bottom:1px solid var(--border-default);
  display:flex;flex-direction:column;justify-content:center;gap:10px}
.aksiq-site .trust-card__body{padding:22px;display:flex;flex-direction:column;flex:1 1 auto}
.aksiq-site .trust-card__tag{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;padding:4px 12px;
  border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);
  font-size:var(--text-xs);font-weight:600;margin-bottom:14px}
.aksiq-site .trust-card__tag svg{flex-shrink:0}
.aksiq-site .trust-card h3{font-size:var(--text-md);font-weight:600;line-height:1.3;color:var(--text-primary);margin:0 0 10px}
.aksiq-site .trust-card p{font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--text-secondary);margin:0}


/* Stage 1 — appetite sliders that settle into position */
.aksiq-site .tune-row{display:flex;align-items:center;gap:10px}
.aksiq-site .tune-row__label{flex:0 0 74px;font-size:10px;font-weight:700;letter-spacing:0.02em;text-transform:uppercase;
  color:var(--text-secondary)}
.aksiq-site .tune-row__track{position:relative;flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,0.75)}
.aksiq-site .tune-row__knob{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;background:var(--white);
  border:2px solid var(--accent-secondary);translate:-50% -50%;left:var(--from);
  animation:tuneSlide 6s ease-in-out infinite alternate}
.aksiq-site .tune-row:nth-child(2) .tune-row__knob{animation-delay:.6s}
.aksiq-site .tune-row:nth-child(3) .tune-row__knob{animation-delay:1.2s}
.aksiq-site .tune-row:nth-child(4) .tune-row__knob{animation-delay:1.8s}

@keyframes tuneSlide{to{left:var(--to)}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .tune-row__knob{animation:none;left:var(--to)}
}


/* Stage 2 — the model proposes, a named reviewer signs it off */
.aksiq-site .decide-card{background:var(--white);border-radius:var(--radius-md);box-shadow:var(--elevation-1);padding:12px 14px}
.aksiq-site .decide-card__label{font-size:9.5px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--text-tertiary);margin-bottom:6px}
.aksiq-site .decide-card__line{display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:var(--text-xs);font-weight:600;color:var(--text-primary)}
.aksiq-site .decide-card__score{font-family:var(--font-mono);font-feature-settings:"tnum";color:var(--warning-600)}
.aksiq-site .decide-card--human{position:relative}
.aksiq-site .decide-card--human .decide-card__line{color:var(--success-600)}
.aksiq-site .decide-sign{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;
  background:var(--success-100);color:var(--success-600);flex-shrink:0;
  animation:decideStamp 4.4s ease-in-out infinite}

@keyframes decideStamp{0%,40%{transform:scale(0);opacity:0}52%{transform:scale(1.25);opacity:1}62%,100%{transform:scale(1);opacity:1}}
.aksiq-site .decide-arrow{display:flex;justify-content:center;color:var(--accent-secondary);animation:decideDrop 4.4s ease-in-out infinite}

@keyframes decideDrop{0%,30%{opacity:.3;transform:translateY(-3px)}45%,100%{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .decide-sign, .aksiq-site .decide-arrow{animation:none;transform:none;opacity:1}
}


/* Stage 3 — the profile is built inside the bank, and nothing leaves it */
.aksiq-site .onprem{display:flex;flex-direction:column;align-items:center;gap:12px}
.aksiq-site .onprem__box{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 22px;background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius-md);box-shadow:var(--elevation-1);
  font-size:var(--text-xs);font-weight:700;color:var(--text-primary)}
.aksiq-site .onprem__box svg{color:var(--accent-secondary)}
.aksiq-site .onprem__wall{position:relative;width:100%;max-width:190px;height:26px}
.aksiq-site .onprem__wall::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;translate:0 -50%;
  background:repeating-linear-gradient(to right,var(--border-strong) 0 5px,transparent 5px 10px)}
.aksiq-site .onprem__packet{position:absolute;top:50%;left:6px;width:8px;height:8px;border-radius:2px;translate:0 -50%;
  background:var(--accent-secondary);animation:onpremBlocked 3.6s ease-in-out infinite}

@keyframes onpremBlocked{0%{left:6px;opacity:1}45%{left:44%;opacity:1}60%{left:44%;opacity:0;transform:scale(.4)}100%{left:6px;opacity:0}}
.aksiq-site .onprem__stop{position:absolute;left:50%;top:50%;translate:-50% -50%;display:inline-flex;align-items:center;
  justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--danger-100);color:var(--danger-600)}
.aksiq-site .onprem__caption{font-size:10px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:var(--text-secondary)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .onprem__packet{animation:none;opacity:0}
}


/* ---------- Proof — copy left, client card right ---------- */
.aksiq-site .proof-split{display:grid;grid-template-columns:1fr;gap:36px;align-items:center}
@media (min-width:960px){
.aksiq-site .proof-split{grid-template-columns:1fr 1fr;gap:56px}
}
.aksiq-site .proof-split h2{font-size:28px;line-height:1.2;letter-spacing:-0.01em;margin:0 0 16px}
@media (min-width:1024px){
.aksiq-site .proof-split h2{font-size:34px}
}
.aksiq-site .proof-split p{font-size:var(--text-md);line-height:var(--leading-relaxed);color:var(--text-secondary);margin:0 0 24px}
.aksiq-site .proof-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.aksiq-site .proof-points li{display:flex;align-items:flex-start;gap:10px;font-size:var(--text-sm);color:var(--text-secondary);
  line-height:var(--leading-normal)}
.aksiq-site .proof-points li svg{flex-shrink:0;margin-top:2px;color:var(--accent-secondary)}
.aksiq-site .client-card{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:22px;min-height:300px;padding:40px;border-radius:var(--radius-xl);
  background:var(--gradient-band);box-shadow:var(--elevation-2)}
.aksiq-site .client-card__logo{display:flex;align-items:center;justify-content:center;padding:22px 34px;border-radius:var(--radius-lg);
  background:var(--white);box-shadow:0 8px 24px rgba(0,0,0,0.14)}
.aksiq-site .client-card__logo img{height:44px;width:auto;object-fit:contain}

/* Scoped to .client-card so it outranks `.proof-split p` (0,1,1), which was winning on
   specificity and painting the quote --text-secondary grey on the gradient. That bug hit
   the sanctions page's Standard Chartered card too; both are fixed by this one line.
   Line-height is snugger than --leading-relaxed as well: at 1.7 a centred four-line pull
   quote reads as loose scattered text rather than one block. */
.aksiq-site .client-card .client-card__quote{position:relative;z-index:1;max-width:360px;text-align:center;
  font-size:var(--text-base);line-height:1.55;color:var(--white);margin:0;
  text-wrap:balance;letter-spacing:var(--tracking-tight)}
.aksiq-site .client-card__meta{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;
  font-size:var(--text-xs);font-weight:700;letter-spacing:0.02em;color:rgba(255,255,255,0.8)}

/* Slow sheen across the card, the same drift used on the hero and CTA gradients */
.aksiq-site .client-card::after{content:'';position:absolute;inset:-40%;pointer-events:none;
  background:radial-gradient(circle at 30% 20%,rgba(255,255,255,0.22) 0%,transparent 55%);
  animation:clientSheen 14s ease-in-out infinite alternate}

@keyframes clientSheen{to{transform:translate(18%,12%)}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .client-card::after{animation:none}
}


/* ---------- Stat rail — figures behind a left accent bar ---------- */
.aksiq-site .stat-rail{display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:640px){
.aksiq-site .stat-rail{grid-template-columns:repeat(3,1fr);gap:32px}
}
.aksiq-site .stat-rail__item{padding-left:18px;border-left:3px solid var(--accent-secondary)}
.aksiq-site .stat-rail__value{font-family:var(--font-mono);font-feature-settings:"tnum";font-weight:600;font-size:38px;
  line-height:1.05;letter-spacing:-0.02em;color:var(--accent-secondary)}
@media (min-width:1024px){
.aksiq-site .stat-rail__value{font-size:46px}
}
.aksiq-site .stat-rail__label{font-size:var(--text-sm);line-height:var(--leading-normal);color:var(--text-secondary);margin-top:10px}
.aksiq-site .stat-rail__note{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:6px}


/* ============================================================================
   Dark infrastructure section — colour pass
   The section used to run cyan-only, which read flat next to Stripe's dark band.
   Stripe's version earns its "dynamic" feel from three things, all borrowed here:
   ambient off-centre gradient glows, gradient-clipped figures, and accent variety
   across sibling elements rather than one repeated hue.
   ============================================================================ */

/* A deeper, bluer ground than the neutral navy, plus two ambient glows placed off
   opposite corners so the band has depth instead of a single flat fill. */
.aksiq-site .infra.bg-dark{
  background:
    radial-gradient(58% 44% at 6% 0%,rgba(27,180,211,0.16) 0%,rgba(27,180,211,0) 68%),
    radial-gradient(64% 52% at 96% 100%,rgba(108,93,211,0.24) 0%,rgba(108,93,211,0) 70%),
    linear-gradient(168deg,#111A32 0%,var(--navy-900) 48%,#141B33 100%);
}


/* Every figure in the band gets the brand gradient, not just the large pair. */
.aksiq-site .infra-stat-value{
  background:linear-gradient(96deg,var(--cyan-500) 0%,var(--violet-400) 55%,var(--violet-500) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}


/* Connection map: alternate the fill accent across siblings so the wave that runs
   through it reads as several systems exchanging, not one signal repeating. */
.aksiq-site .cmap-chip:nth-of-type(even).is-filled, .aksiq-site .cmap-slot:nth-of-type(even).is-filled{
  background:rgba(108,93,211,0.20);border-color:var(--violet-400);
}
.aksiq-site .cmap-slot:nth-of-type(even).is-filled::before{color:var(--violet-400)}

/* The hub is the one element that should look like the product, so it carries the
   full gradient rather than a flat accent fill. */
.aksiq-site .cmap-node{
  background:var(--gradient-brand);
  box-shadow:0 0 0 8px rgba(108,93,211,0.14),0 8px 28px rgba(27,180,211,0.22);
}


/* Deploy step: gradient icon plate, and the selected option picks up a violet edge
   so the three cards are visibly distinct states rather than three cyan rows. */
.aksiq-site .deploy-visual-icon{background:var(--gradient-brand);color:var(--white)}
.aksiq-site .deploy-visual{background:
  radial-gradient(78% 62% at 50% 0%,rgba(108,93,211,0.14) 0%,rgba(108,93,211,0) 72%),
  rgba(255,255,255,0.03);}
.aksiq-site .deploy-card:hover, .aksiq-site .deploy-card.is-active{
  border-color:var(--violet-400);background:rgba(108,93,211,0.10);
}
.aksiq-site .deploy-visual-box--accent{
  border-color:var(--violet-400);background:rgba(108,93,211,0.16);
}


/* ============================================================================
   Benefit blocks ("Software is half of it") — homepage only
   Scoped under .experts-row on purpose: .expert-card is reused on About and
   Careers with photos and coloured icon plates, and those pages should not move.
   Stripe's equivalent row carries no card chrome at all — icon, title, copy, done.
   ============================================================================ */

.aksiq-site .experts-row .experts-head{font-size:32px;letter-spacing:-0.02em;margin:0 0 40px}
.aksiq-site .experts-row .experts-grid{gap:44px 48px}

/* No card chrome at all, and no top rule either -- Stripe's version is just icon,
   sentence, link, sitting on the section background. */
.aksiq-site .experts-row .expert-card{border:none;border-radius:0;padding:0;box-shadow:none}
.aksiq-site .experts-row .expert-card:hover{border:none;box-shadow:none;transform:none}

/* Small outlined plate rather than a filled tint block -- the filled block was the
   part that read as a boxy card-within-a-card. */
.aksiq-site .experts-row .expert-card .icon-wrap{width:38px;height:38px;background:transparent;box-shadow:none;
  border:1px solid var(--border-default);border-radius:9px;color:var(--cyan-600);margin-bottom:20px}
.aksiq-site .experts-row .expert-card .icon-wrap .icon{width:19px;height:19px}

/* Heading and description share one paragraph flow: the h4 is inline, so the bold lead-in
   runs straight into the sentence the way Stripe sets it. */
.aksiq-site .experts-row .expert-copy{font-size:var(--text-base);line-height:var(--leading-normal);color:var(--text-secondary);margin:0 0 16px}
.aksiq-site .experts-row .expert-copy h4{display:inline;font-size:inherit;line-height:inherit;
  font-weight:var(--weight-semibold);color:var(--text-primary)}
.aksiq-site .experts-row .expert-link{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-sm);
  font-weight:var(--weight-medium);color:var(--accent-secondary);text-decoration:none}
.aksiq-site .experts-row .expert-link svg{transition:transform 180ms ease}
.aksiq-site .experts-row .expert-link:hover{text-decoration:underline}
.aksiq-site .experts-row .expert-link:hover svg{transform:translateX(3px)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .experts-row .expert-link:hover svg{transform:none}
}


/* ============================================================================
   Testimonial bank logos
   The tabs used to be bank names as plain text. Logos carry more weight with a
   banking audience, and the greyscale-to-colour move is the same one the hero
   logo strip could use: muted at rest so the row stays quiet, full colour on the
   one being pointed at or currently showing.
   ============================================================================ */
.aksiq-site .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}
.aksiq-site .quote-tab{display:flex;align-items:center;justify-content:center}
.aksiq-site .quote-tab img{height:26px;width:auto;max-width:132px;object-fit:contain;
  /* Desaturated and held back at rest; both dials release together on hover/active. */
  filter:grayscale(1);opacity:0.42;
  transition:filter 300ms cubic-bezier(0.25,1,0.5,1),opacity 300ms cubic-bezier(0.25,1,0.5,1)}
.aksiq-site .quote-tab:hover img, .aksiq-site .quote-tab.is-active img{filter:grayscale(0);opacity:1}
.aksiq-site .quote-tab:focus-visible img{filter:grayscale(0);opacity:1}
@media (max-width:640px){
.aksiq-site .quote-tab img{height:22px}
}
@media (prefers-reduced-motion:reduce){
.aksiq-site .quote-tab img{transition:none}
}


/* ============================================================================
   Hero orbit — quality pass
   Three things were making this read as low quality:
     1. The core was a conic-gradient being rotated. Conic gradients have a hard
        seam where the sweep wraps, and spinning it puts that seam on display.
     2. The labels sat on radial-gradient ellipses, which fade out unevenly and
        leave soft ragged edges rather than a clean shape.
     3. The rings were flat 1px borders at a single opacity, so they either
        disappeared or looked like plain circles.
   ============================================================================ */

/* 1. Core as a lit sphere: one smooth diagonal gradient for body, an off-centre
      white highlight for the light source, a rim light, and grounded shadows.
      It breathes instead of spinning, so there is no seam to notice. */
.aksiq-site .orbit-core{
  width:var(--core,calc(var(--chip)*1.62));height:var(--core,calc(var(--chip)*1.62));
  background:
    radial-gradient(circle at 34% 26%,rgba(255,255,255,0.58) 0%,rgba(255,255,255,0.10) 38%,rgba(255,255,255,0) 58%),
    linear-gradient(148deg,var(--cyan-500) 0%,#4FA6DE 34%,var(--violet-500) 76%,var(--violet-600) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.30),
    inset 0 -8px 18px rgba(59,44,140,0.28),
    0 16px 44px rgba(91,75,209,0.30),
    0 4px 12px rgba(27,180,211,0.18);
  animation:orbitCoreBreathe 7s ease-in-out infinite;
}

@keyframes orbitCoreBreathe{0%,100%{scale:1}50%{scale:1.035}}


/* 2. Labels as one consistent frosted chip. A solid translucent shape with a real
      radius reads as deliberate UI; the old soft-edged wash read as an artefact.
      hyphens:none keeps two-word labels from breaking mid-word. */
.aksiq-site .orbit-label{
  max-width:100%;width:-moz-fit-content;width:fit-content;padding:4px 10px;border-radius:8px;
  font-size:12px;font-weight:var(--weight-medium);line-height:1.3;
  hyphens:none;-webkit-hyphens:none;text-wrap:pretty;
  color:var(--navy-900);
  background:rgba(255,255,255,0.82);
  -webkit-backdrop-filter:blur(8px) saturate(1.1);backdrop-filter:blur(8px) saturate(1.1);
  box-shadow:0 1px 3px rgba(30,26,72,0.07),inset 0 0 0 1px rgba(255,255,255,0.55);
}


/* 3. Rings as gradient hairlines: a conic sweep masked to a 1px annulus, so the
      stroke brightens through the arc instead of sitting at one flat opacity. */
.aksiq-site .orbit-path{border:none}
.aksiq-site .orbit-path--outer{
  background:conic-gradient(from 200deg,rgba(108,93,211,0.58) 0%,rgba(27,180,211,0.34) 34%,rgba(108,93,211,0.06) 62%,rgba(108,93,211,0.58) 100%);
  -webkit-mask:radial-gradient(circle,transparent calc(50% - 1.5px),#000 calc(50% - 1.5px));
          mask:radial-gradient(circle,transparent calc(50% - 1.5px),#000 calc(50% - 1.5px));
}
.aksiq-site .orbit-path--inner{
  border:1px dashed rgba(27,180,211,0.26);background:none;
  -webkit-mask:none;mask:none;
}


/* 4. Chips get a hairline inner ring plus a two-stage shadow, so they read as
      solid tokens rather than flat white discs. */
.aksiq-site .orbit-chip{
  background:rgba(255,255,255,0.98);
  box-shadow:
    inset 0 0 0 1px rgba(91,75,209,0.08),
    0 1px 2px rgba(30,26,72,0.06),
    0 8px 22px rgba(91,75,209,0.16);
}
@media (prefers-reduced-motion:reduce){
.aksiq-site .orbit-core{animation:none}
}


/* ============================================================================
   Connect map — SVG hub diagram
   Two earlier versions missed. The original mixed real system names with empty
   dashed slots that flashed "200 OK" and "SYNC", which read as content that had
   failed to load. The replacement stacked everything in a narrow centred column,
   which was cramped and left the box half empty. This is a single SVG read left to
   right: the bank's systems, into the platform, out to the evidence it leaves.
   Drawing it means the curves land exactly on the boxes instead of being
   approximated with flex gaps and border tricks.
   ============================================================================ */
.aksiq-site .cmap{display:block;padding:28px 24px;background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.10);border-radius:var(--radius-xl)}
.aksiq-site .cmap-svg{display:block;width:100%;height:auto}


/* Small-caps markers for the two ends of the flow */
.aksiq-site .cmap-cap{fill:rgba(255,255,255,0.42);font-family:var(--font-mono);font-size:11px;letter-spacing:0.09em}


/* Boxes: hairline surface, legible label */
.aksiq-site .cmap-box rect{fill:rgba(255,255,255,0.05);stroke:rgba(255,255,255,0.20);stroke-width:1}
.aksiq-site .cmap-box text{fill:rgba(255,255,255,0.88);font-family:var(--font-body);font-size:13px;text-anchor:middle}


/* The hub is the one element allowed to look like the product */
.aksiq-site .cmap-hubg text{fill:var(--white);font-family:var(--font-display);font-size:15px;
  font-weight:var(--weight-semibold);text-anchor:middle}


/* Travelling dashes read as live exchange without anything having to blink */
.aksiq-site .cmap-path{fill:none;stroke:rgba(27,180,211,0.55);stroke-width:1.5;
  stroke-dasharray:5 7;animation:cmapDash 1.4s linear infinite}

@keyframes cmapDash{to{stroke-dashoffset:-24}}
.aksiq-site .cmap-note{fill:var(--cyan-500);font-family:var(--font-mono);font-size:11px;letter-spacing:0.05em}
@media (prefers-reduced-motion:reduce){
.aksiq-site .cmap-path{animation:none}
}


/* ============================================================================
   Solution card art — scale and crop balance
   The source pieces arrive in two ratios (3:2 and 4:3) with their headlines baked
   in at a fixed relative size. Two consequences had to be managed:

   1. CROP. The 4:3 pieces sit in 3:2 frames, so cover trims ~12% of their height.
      Centred, that trim eats the margin above the headline and the type reads as
      jammed against the top edge. .art--tall anchors them near the top instead, so
      the loss comes out of the empty lower band each of them has.

   2. SCALE. Because the headline is part of the image, a card twice as wide renders
      that headline twice as large. The closer used to run the full 1232px, showing
      its art at ~37% while the small cards showed theirs at ~14% -- three different
      apparent text sizes in one grid, which is what made the set look mismatched.
      Capping the closer at the same 816px as the large card puts the two feature
      cards on one scale (~24-27%) and the five small cards on another (~14%), so
      the grid reads as two deliberate tiers rather than three arbitrary sizes.
   ============================================================================ */
.aksiq-site .bento-card--fill .bento-card-media img.art--tall{object-position:50% 8%}
@media (min-width:768px){
.aksiq-site .bento-card--wide{aspect-ratio:3/2;max-width:816px;width:100%;justify-self:center}

  /* 3:2 art in a 3:2 frame needs no crop at all, so the bias is removed. */
  .aksiq-site .bento-card--wide .bento-card-media img{object-position:50% 50%}
}


/* ============================================================================
   Benefit blocks — back to real blocks
   Stripe's version is chrome-free because it sits on a busy page that already has
   plenty of edges. On this page the row lands on a flat grey band with nothing
   around it, so with no chrome it read as three loose paragraphs of text rather
   than three things. Giving each one a surface makes them objects again, while the
   inner layout (outlined icon plate, bold lead-in running into the sentence, link)
   stays as Stripe sets it.
   ============================================================================ */
.aksiq-site .experts-row .expert-card{
  background:var(--white);
  border:1px solid var(--border-default);
  border-radius:var(--radius-lg);
  padding:28px 26px 24px;
  display:flex;flex-direction:column;
  transition:border-color 200ms ease,box-shadow 200ms ease;
}
.aksiq-site .experts-row .expert-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-1)}

/* Push the link to the bottom edge so the three cards line up regardless of how
   long each description runs. */
.aksiq-site .experts-row .expert-copy{flex:1 1 auto}
.aksiq-site .experts-row .expert-link{align-self:flex-start;margin-top:4px}
.aksiq-site .experts-row .experts-grid{gap:20px}



/* ---------- Why AKS iQ page — vfairs-derived block system ----------
   Measured off vfairs.com/why-vfairs' own stylesheets rather than eyeballed, so the
   numbers below are theirs: 12px card radius, 30px card padding, a soft
   0 30px 30px rgba(63,72,80,.10) lift, 30px gutters, the 106.29deg gradient angle on
   the customer band, and an 80s linear marquee running 0 -> -50%.
   Type, colour and the 1232px column stay ours. */

/* ---- Hero vertical rhythm (all pages) — single source of truth ----
   .hero-actions carried a 32px bottom margin *inside* the centred flex box, so the
   visible ink never landed on the band's optical centre — it read as sitting low.
   Zeroing that and letting the container's min-height define the band makes centre
   mean centre.

   TOP padding only. Any bottom padding on .hero renders BELOW the logo strip — the
   strip is a full-bleed band pinned to the hero's last child — which exposed the hero
   gradient as a stray violet stripe under the white logo row on index, trade-iq and
   solutions/. Separation from the next section comes from that section's own 112px
   top padding, so the bottom padding was redundant anyway. */
.aksiq-site .hero .hero-actions{margin-bottom:0}
@media (min-width:1024px){
.aksiq-site .hero{padding:56px 0 0}
.aksiq-site .hero > .container{min-height:420px}

  /* Flex centring is for the PLAIN hero only. The --split and --solution variants lay their
     container out as a two-column grid, and setting display:flex here beat those rules and
     stacked the copy above the visual instead of beside it.
     The plain hero also needs a taller band: it holds the orbit, which is absolutely
     positioned and so contributes no height of its own. */
  .aksiq-site .hero:not([class*="hero--"]) > .container{min-height:500px;
    display:flex;flex-direction:column;justify-content:center}
}


/* Trust chips — vfairs runs proof points as pills. No justify-content here so the
   parent's centring (or the split hero's left edge) decides alignment. */
.aksiq-site .hero-trust--chips{gap:8px;margin-bottom:24px}
.aksiq-site .hero-trust--chips span{display:inline-flex;align-items:center;padding:6px 14px;
  border:1px solid var(--border-default);border-radius:var(--radius-pill);
  background:var(--white);box-shadow:var(--elevation-1);
  font-size:var(--text-xs);font-weight:600;color:var(--text-secondary);white-space:nowrap}


/* Framed screenshot, used for the lifecycle product shot. */
.aksiq-site .shot{position:relative;overflow:hidden;border:1px solid var(--border-default);
  border-radius:var(--radius-xl);background:var(--white);box-shadow:var(--elevation-2)}
.aksiq-site .shot img{width:100%;height:auto;display:block}


/* ---- Patterned band ----
   vfairs lays a faint square grid over a soft colour sweep and fades it out upward
   (their why-header.png). Rebuilt in CSS in our cyan/violet so it costs no bytes. */
.aksiq-site .band-pattern{position:relative;overflow:hidden;
  background:
    radial-gradient(60% 100% at 10% 100%,rgba(27,180,211,0.20) 0%,rgba(27,180,211,0) 70%),
    radial-gradient(70% 120% at 92% 92%,rgba(108,93,211,0.22) 0%,rgba(108,93,211,0) 72%),
    linear-gradient(180deg,var(--white) 0%,var(--cyan-50) 100%)}
.aksiq-site .band-pattern::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(to right,rgba(47,128,166,0.11) 0 1px,transparent 1px 96px),
    repeating-linear-gradient(to bottom,rgba(47,128,166,0.11) 0 1px,transparent 1px 96px);
  -webkit-mask-image:linear-gradient(to top,#000 0%,transparent 78%);
  mask-image:linear-gradient(to top,#000 0%,transparent 78%)}
.aksiq-site .band-pattern > .container{position:relative;z-index:1}


/* ---- Carded stat strip ----
   vfairs' .five-col: 12px radius, 30px padding, centred, and a large soft shadow
   pushed 30px down rather than a hairline border. */
.aksiq-site .stat-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:30px 16px}
@media (min-width:640px){
.aksiq-site .stat-cards{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:1024px){
.aksiq-site .stat-cards{grid-template-columns:repeat(6,1fr);gap:24px}
}
.aksiq-site .stat-card{display:flex;flex-direction:column;align-items:center;gap:14px;
  padding:30px 20px;text-align:center;border-radius:12px;background:var(--white);
  box-shadow:0 30px 30px rgba(63,72,80,0.10);
  transition:box-shadow 200ms ease,transform 200ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .stat-card:hover{box-shadow:0 40px 40px rgba(47,128,166,0.14);transform:translateY(-4px)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .stat-card:hover{transform:none}
}
.aksiq-site .stat-card .icon-wrap{display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary)}
.aksiq-site .stat-card__value{font-family:var(--font-display);font-weight:var(--weight-light);
  font-feature-settings:"tnum";font-size:26px;line-height:1;letter-spacing:-0.02em;color:var(--text-primary)}
.aksiq-site .stat-card__label{font-size:var(--text-xs);color:var(--text-secondary);line-height:var(--leading-normal)}


/* ---- Shot cards — image on top, then title and body ----
   One component, three layouts: a plain 3-up, and the tinted 2+1 bento where the
   last panel spans the full width. vfairs stacks that wide panel (image above text)
   rather than turning it side-by-side, and Fiza's wide render is 1.92:1 to suit it. */
.aksiq-site .shot-grid{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:640px){
.aksiq-site .shot-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px){
.aksiq-site .shot-grid--3{grid-template-columns:repeat(3,1fr);gap:30px}
}
@media (min-width:640px){
.aksiq-site .shot-grid--bento>.shot-card:last-child{grid-column:1/-1}
}
.aksiq-site .shot-card{display:flex;flex-direction:column;overflow:hidden;border-radius:12px;
  background:var(--white);box-shadow:0 30px 30px rgba(63,72,80,0.10);
  transition:box-shadow 200ms ease,transform 200ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .shot-card:hover{box-shadow:0 40px 40px rgba(47,128,166,0.14);transform:translateY(-4px)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .shot-card:hover{transform:none}
}
.aksiq-site .shot-card__media{overflow:hidden;background:var(--cool-50);aspect-ratio:3/2}
.aksiq-site .shot-card__media img{width:100%;height:100%;object-fit:cover;object-position:center;
  transition:transform 300ms ease}
.aksiq-site .shot-card:hover .shot-card__media img{transform:scale(1.03)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .shot-card:hover .shot-card__media img{transform:none}
}
.aksiq-site .shot-card__body{display:flex;flex-direction:column;gap:8px;padding:26px 28px 28px}
.aksiq-site .shot-card__body h3{font-size:var(--text-md);line-height:1.3;margin:0}
.aksiq-site .shot-card__body p{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal);margin:0}

/* Tinted bento: the two half panels are square renders, the wide one is 1.92:1. */
.aksiq-site .shot-grid--tinted .shot-card__media{aspect-ratio:1/1;background:transparent}
@media (min-width:640px){
.aksiq-site .shot-grid--bento>.shot-card:last-child .shot-card__media{aspect-ratio:25/13}
.aksiq-site .shot-grid--bento>.shot-card:last-child .shot-card__body{padding:26px 40px 32px;max-width:760px}
}


/* ---- Split row — copy left, framed screenshot right (lifecycle) ---- */
.aksiq-site .split-row{display:grid;grid-template-columns:1fr;gap:40px;align-items:center}
@media (min-width:1024px){
.aksiq-site .split-row{grid-template-columns:minmax(0,1fr) minmax(0,54%);gap:64px}
}
.aksiq-site .split-row__copy h2{font-size:28px;line-height:1.15;letter-spacing:-0.01em;margin:0 0 12px}
@media (min-width:1024px){
.aksiq-site .split-row__copy h2{font-size:36px;line-height:1.12;letter-spacing:-0.015em}
}
.aksiq-site .split-row__copy>p{font-size:var(--text-md);color:var(--text-secondary);line-height:var(--leading-normal);margin:0 0 28px}


/* Lead list — bold lead-in then the explanation. */
.aksiq-site .lead-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.aksiq-site .lead-list li{display:flex;align-items:flex-start;gap:14px}
.aksiq-site .lead-list .icon-wrap{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary)}
.aksiq-site .lead-list p{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal);margin:0}
.aksiq-site .lead-list strong{color:var(--text-primary);font-weight:600}


/* ---- Case cards ----
   Two-up (four columns crushed them), each led by the bank's own logo. The badge and
   the small footer note are gone at Fiza's call — the logo already says which bank. */
@media (min-width:1024px){
.aksiq-site .case-grid{grid-template-columns:repeat(2,1fr)}
}
.aksiq-site .case-card--award{grid-column:1/-1}
.aksiq-site .case-card__logo{display:flex;align-items:center;height:34px;margin-bottom:18px}
.aksiq-site .case-card__logo img{max-height:30px;max-width:150px;width:auto;object-fit:contain}


/* ---- Customer band — testimonials over two counter-scrolling logo rows ----
   vfairs' .customer-new-sections: 106.29deg gradient, 80px/70px padding, a 48px head,
   then .logo-marquee rows whose track is min-width:200% and animates 0 -> -50% over
   80s, second row reversed, both pausing on hover. Angle and timings are theirs. */
.aksiq-site .customer-band{background:linear-gradient(106.29deg,var(--cyan-100) -0.01%,var(--violet-100) 99.99%);
  padding:56px 0 50px;overflow:hidden}
@media (min-width:1024px){
.aksiq-site .customer-band{padding:80px 0 70px}
}
.aksiq-site .customer-head{text-align:center;max-width:900px;margin:0 auto var(--space-6)}
.aksiq-site .customer-head h2{font-size:32px;line-height:1.15;letter-spacing:-0.015em;margin:0 0 10px}
@media (min-width:1024px){
.aksiq-site .customer-head h2{font-size:44px;line-height:1.12;letter-spacing:-0.02em}
}
.aksiq-site .customer-head p{font-size:var(--text-md);color:var(--text-secondary);margin:0}
@media (min-width:1024px){
.aksiq-site .customer-head p{font-size:20px}
}
.aksiq-site .quote-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:var(--space-6)}
@media (min-width:768px){
.aksiq-site .quote-grid{grid-template-columns:repeat(3,1fr)}
}
.aksiq-site .quote-card{display:flex;flex-direction:column;gap:18px;padding:28px;border-radius:12px;
  background:var(--white);box-shadow:0 30px 30px rgba(63,72,80,0.10)}
.aksiq-site .quote-card blockquote{margin:0;font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--text-primary)}
.aksiq-site .quote-card__person{display:flex;align-items:center;gap:12px;margin-top:auto;
  text-decoration:none;color:inherit}
.aksiq-site .quote-card__avatar{flex-shrink:0;width:44px;height:44px;border-radius:50%;overflow:hidden;background:var(--cool-100)}
.aksiq-site .quote-card__avatar img{width:100%;height:100%;object-fit:cover;display:block}
.aksiq-site .quote-card__name{display:block;font-size:var(--text-sm);font-weight:600;color:var(--text-primary)}
.aksiq-site .quote-card__role{display:block;font-size:var(--text-xs);color:var(--text-tertiary);line-height:1.35}
.aksiq-site .quote-card__mark{flex-shrink:0;margin-left:auto;max-height:22px;max-width:74px;width:auto;object-fit:contain;opacity:0.75}
.aksiq-site .quote-card__person:hover .quote-card__name{color:var(--accent-secondary)}
.aksiq-site .quote-note{text-align:center;font-size:var(--text-xs);color:var(--text-tertiary);margin:0 0 var(--space-6)}
.aksiq-site .logo-marquee{overflow:hidden;width:100%;position:relative;margin-bottom:20px}
.aksiq-site .logo-marquee:last-child{margin-bottom:0}
.aksiq-site .marquee-content{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;
  gap:2rem;width:max-content;animation:marquee-right 80s linear infinite}
.aksiq-site .marquee-left .marquee-content{animation-name:marquee-left}
.aksiq-site .logo-marquee:hover .marquee-content{animation-play-state:paused}

@keyframes marquee-right{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

@keyframes marquee-left{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .marquee-content{animation:none}
}

/* Tiles echo vfairs' .company-logo: translucent white so the gradient reads through. */
.aksiq-site .marquee-content .logo-tile{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:170px;height:74px;padding:14px;border-radius:10px;background:rgba(255,255,255,0.70)}
.aksiq-site .marquee-content .logo-tile img{max-width:100%;max-height:36px;width:auto;object-fit:contain}


/* Section-level arrow link. */
.aksiq-site .section-link{display:inline-flex;align-items:center;gap:6px;margin-top:var(--space-6);
  font-size:var(--text-sm);font-weight:600;color:var(--accent-secondary);text-decoration:none}
.aksiq-site .section-link svg{transition:transform 180ms ease}
.aksiq-site .section-link:hover{text-decoration:underline}
.aksiq-site .section-link:hover svg{transform:translateX(3px)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .section-link:hover svg{transform:none}
}
.aksiq-site .section-foot{text-align:center}


/* Case-card pills — Fiza's outcome claims read as short labels, not number/label
   pairs, so the old .case-card__metrics row is replaced by chips that wrap. */
.aksiq-site .case-card__pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:18px}
.aksiq-site .case-card__pill{display:inline-flex;align-items:center;padding:6px 12px;border-radius:var(--radius-pill);
  background:var(--cyan-50);color:var(--blue-700);font-size:var(--text-xs);font-weight:600;line-height:1.35}


/* The Why AKS iQ H1 is short enough to hold one line from tablet up. Scoped to its
   own modifier — the other centred heroes carry longer headlines that must wrap. */
@media (min-width:768px){
.aksiq-site .hero--oneline h1{white-space:nowrap}
}


/* ================================================================================
   Doc iQ page
   No selector here existed before; checked against the whole sheet first, since two
   silent overrides have already been caused by adding rules that collided.
   ================================================================================ */

/* ---------- Hero visual ----------
   Fiza's second render is a true transparent PNG at 2.4:1, wider than Trade iQ's
   near-square hub, so this hero gets a wider art column.
   No radius and no box-shadow on purpose: box-shadow follows the element's box, not the
   artwork, so on a transparent PNG it would draw a rectangle around the empty space.
   The art carries its own shadows and sits directly on the hero gradient. */
.aksiq-site .doc-figure{margin:0}
.aksiq-site .doc-figure img{display:block;width:100%;max-width:640px;height:auto;margin:0 auto}


/* ---------- How it works: six text-only module cards ----------
   Fiza's call on 2026-08-21: no artwork exists for these six yet, so they run as a
   two-up card grid rather than Trade iQ's copy-beside-art rows. When renders arrive
   these become .feature-row blocks and this grid can go. */
.aksiq-site .module-grid{display:grid;grid-template-columns:1fr;gap:20px}
@media (min-width:700px){
.aksiq-site .module-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1160px){
.aksiq-site .module-grid{gap:24px}
}
.aksiq-site .module-card{background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:28px;
  transition:border-color 200ms ease,box-shadow 200ms ease,transform 200ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .module-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-2);transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .module-card:hover{transform:none}
}
.aksiq-site .module-card .icon-wrap{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary);margin-bottom:18px}
.aksiq-site .module-card h3{font-size:20px;line-height:1.3;margin:0 0 16px;max-width:18em}


/* ---------- Doc iQ hands off to Trade iQ ---------- */
.aksiq-site .handoff{display:grid;grid-template-columns:1fr;gap:32px}
@media (min-width:900px){
.aksiq-site .handoff{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:56px;align-items:center}
}
.aksiq-site .handoff-copy h2{margin:0 0 14px}
.aksiq-site .handoff-copy p{font-size:var(--text-md);color:var(--text-secondary);line-height:var(--leading-normal);margin:0 0 26px;max-width:46ch}
.aksiq-site .handoff-flow{list-style:none;margin:0;padding:0}
.aksiq-site .handoff-step{position:relative;display:flex;align-items:flex-start;gap:16px;padding:18px 20px;
  background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-lg)}
.aksiq-site .handoff-step + .handoff-step{margin-top:14px}

/* Vertical tick joining the three steps. Sits on the icon's centre line: 20px of card
   padding plus half of the 38px icon. */
.aksiq-site .handoff-step:not(:last-child)::after{content:'';position:absolute;left:39px;top:100%;width:1px;height:14px;background:var(--border-strong)}
.aksiq-site .handoff-step-icon{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:var(--radius-md);background:var(--cyan-50);color:var(--accent-secondary)}
.aksiq-site .handoff-step-text{display:flex;flex-direction:column;gap:3px;font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-normal)}
.aksiq-site .handoff-step-text strong{font-weight:600;color:var(--text-primary)}


/* Wider art column than .hero--split's 478px. Must come after that rule to win. */
@media (min-width:1160px){
.aksiq-site .hero--doc .container{grid-template-columns:minmax(0,1fr) minmax(0,640px)}
}


/* ================================================================================
   Watchlist & Sanctions Screening (solutions page)
   Sibling of trade-kyc-customer-risk.html, so it reuses .tension / .payoff-grid /
   .trust-grid / .proof-split / .stat-rail wholesale. Only the pieces below are new;
   every selector was checked against the whole sheet first.
   ================================================================================ */

/* ---------- Hero visual — live screening panel ----------
   Sibling of the KYC page's .score-card and deliberately built to the same recipe:
   identical card chrome, a staggered entrance that plays ONCE (no looping figure to
   distract from the headline), and a single pulsing LIVE dot as the only repeating
   motion. It reuses the scorePulse keyframe rather than declaring a second one.
   This replaced a provisional PNG that arrived without an alpha channel, so the hero
   now costs no bytes and there is no asset outstanding on this page.
   .hero-figure / .hero--wide-art below are now unreferenced. Kept, not deleted: the
   next solution page may well ship wide art, and these are the rules for it. */
@media (min-width:1160px){
.aksiq-site .hero--wide-art .container{grid-template-columns:minmax(0,1fr) minmax(0,560px)}
}
.aksiq-site .hero-figure{margin:0}
.aksiq-site .hero-figure img{display:block;width:100%;max-width:560px;height:auto;margin:0 auto}
.aksiq-site .hero-figure--plate img{border-radius:var(--radius-lg);box-shadow:var(--elevation-1)}
.aksiq-site .screen-card{position:relative;width:100%;max-width:420px;margin:28px auto 0;background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-2);
  padding:22px;overflow:hidden}
@media (min-width:1100px){
.aksiq-site .screen-card{margin:0}
}
.aksiq-site .screen-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-bottom:16px;margin-bottom:4px;border-bottom:1px solid var(--border-default)}
.aksiq-site .screen-card__who{min-width:0}
.aksiq-site .screen-card__name{font-size:var(--text-sm);font-weight:600;color:var(--text-primary)}
.aksiq-site .screen-card__meta{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:2px}
.aksiq-site .screen-card__live{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;padding:4px 10px;
  border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);
  font-size:var(--text-xs);font-weight:700;letter-spacing:0.02em}
.aksiq-site .screen-card__live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--cyan-500);
  animation:scorePulse 1.8s ease-in-out infinite}
.aksiq-site .screen-rows{list-style:none;margin:0;padding:0}

/* Each row arrives, then its verdict lands a beat later — name first, answer second, which
   is the order the work actually happens in. Both play once, via --d. */
.aksiq-site .screen-row{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 10px;margin:0 -10px;border-radius:var(--radius-md);
  opacity:0;animation:screenRowIn .5s var(--d) cubic-bezier(.16,.84,.44,1) forwards}
.aksiq-site .screen-row + .screen-row{box-shadow:inset 0 1px 0 var(--border-default)}
.aksiq-site .screen-row__party{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.3}
.aksiq-site .screen-row__status{flex-shrink:0;display:inline-flex;align-items:center;padding:3px 10px;
  border-radius:var(--radius-pill);font-size:var(--text-xs);font-weight:700;letter-spacing:0.02em;
  opacity:0;animation:screenStatusIn .35s calc(var(--d) + 260ms) ease forwards}
.aksiq-site .screen-row__status--clear{background:var(--success-100);color:var(--success-600)}

/* Solid fill, not the soft tint the cleared rows use: the row it sits on is itself
   tinted, so a --danger-100 chip on a --danger-100 row would disappear. */
.aksiq-site .screen-row__status--hit{background:var(--danger-600);color:var(--white)}
.aksiq-site .screen-row--hit{background:var(--danger-100)}
.aksiq-site .screen-row--hit .screen-row__party{color:var(--text-primary);font-weight:600}

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

@keyframes screenStatusIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.aksiq-site .screen-card__foot{display:flex;align-items:center;gap:8px;margin-top:16px;padding-top:14px;
  border-top:1px solid var(--border-default);font-size:var(--text-xs);color:var(--text-tertiary)}
.aksiq-site .screen-card__foot svg{color:var(--accent-secondary);flex-shrink:0}
@media (prefers-reduced-motion:reduce){
.aksiq-site .screen-card__live::before{animation:none}
.aksiq-site .screen-row, .aksiq-site .screen-row__status{animation:none;opacity:1;transform:none}
}


/* ---------- Tension: one name checked once, vs the party list a trade carries ---------- */
.aksiq-site .party-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.aksiq-site .party{display:flex;align-items:center;gap:10px;font-size:var(--text-sm);color:var(--text-secondary);line-height:1.3}
.aksiq-site .party__mark{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:50%;font-size:11px;font-weight:700}
.aksiq-site .party--clear .party__mark{background:var(--success-100);color:var(--success-600)}
.aksiq-site .party--hit{color:var(--text-primary);font-weight:600}
.aksiq-site .party--hit .party__mark{background:var(--danger-100);color:var(--danger-600)}
.aksiq-site .tension-panel--stale .party{color:var(--text-tertiary)}
.aksiq-site .tension-panel--stale .party--clear .party__mark{background:var(--ink-100);color:var(--text-tertiary)}


/* ---------- An SVG standing in for a render inside a .feature-visual frame ---------- */
.aksiq-site .feature-visual .figure-svg{display:block;width:100%;height:100%}


/* ---------- Trust card 1: the four list families resolving in a single pass ---------- */
.aksiq-site .wc-stack{display:flex;flex-direction:column;gap:11px}
.aksiq-site .wc-row{display:flex;align-items:center;gap:10px}
.aksiq-site .wc-row__name{flex:0 0 96px;font-size:var(--text-xs);color:var(--text-secondary)}
.aksiq-site .wc-row__bar{flex:1 1 auto;height:7px;border-radius:var(--radius-pill);background:var(--ink-100);overflow:hidden}
.aksiq-site .wc-row__fill{display:block;height:100%;border-radius:var(--radius-pill);
  background:linear-gradient(90deg,var(--accent-secondary),var(--violet-600));
  width:var(--w);transform-origin:left center;animation:wcFill 3.6s var(--d) cubic-bezier(.16,.84,.44,1) infinite}

@keyframes wcFill{0%{transform:scaleX(0)}28%,72%{transform:scaleX(1)}100%{transform:scaleX(1)}}
.aksiq-site .wc-foot{margin-top:4px;font-size:var(--text-xs);color:var(--text-tertiary);letter-spacing:var(--tracking-wide)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .wc-row__fill{animation:none}
}


/* ---------- Trust card 3: raise, escalate, close ---------- */
.aksiq-site .trail{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.aksiq-site .trail__step{position:relative;display:flex;align-items:flex-start;gap:12px;
  opacity:0;animation:trailIn 3.6s var(--d) ease infinite}
.aksiq-site .trail__step:not(.trail__step--end)::after{content:'';position:absolute;left:6px;top:16px;
  width:1px;height:calc(100% + 6px);background:var(--border-strong)}
.aksiq-site .trail__dot{flex-shrink:0;width:13px;height:13px;margin-top:2px;border-radius:50%;
  background:var(--white);border:3px solid var(--accent-secondary)}
.aksiq-site .trail__step--end .trail__dot{border-color:var(--success-600)}
.aksiq-site .trail__what{display:flex;flex-direction:column;gap:2px;font-size:var(--text-xs);
  font-weight:600;color:var(--text-primary);line-height:1.35}
.aksiq-site .trail__what em{font-style:normal;font-weight:400;color:var(--text-tertiary)}

@keyframes trailIn{0%{opacity:0;transform:translateY(4px)}18%,88%{opacity:1;transform:none}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .trail__step{opacity:1;animation:none}
}


/* ---------- Proof stat pills ---------- */
.aksiq-site .proof-pills{display:flex;flex-wrap:wrap;gap:10px}
.aksiq-site .proof-pill{display:inline-flex;align-items:baseline;gap:6px;padding:8px 16px;
  border:1px solid var(--border-default);border-radius:var(--radius-pill);
  background:var(--white);font-size:var(--text-sm);color:var(--text-secondary)}
.aksiq-site .proof-pill strong{font-family:var(--font-mono);font-feature-settings:"tnum";font-weight:600;color:var(--text-primary)}


/* ---------- Four stats rather than the KYC page's three ---------- */
@media (min-width:640px){
.aksiq-site .stat-rail--four{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px){
.aksiq-site .stat-rail--four{grid-template-columns:repeat(4,1fr);gap:28px}
}

/* 200,000+ is the longest value on the site and overflowed its column at 46px. */
@media (min-width:1024px){
.aksiq-site .stat-rail--four .stat-rail__value{font-size:40px}
}


/* ================================================================================
   Transaction Monitoring (solutions page)
   Third sibling of trade-kyc-customer-risk.html and watchlist-sanctions-screening.html,
   so it reuses .hero--solution / .tension / .payoff-grid / .trust-grid / .proof-split /
   .stat-rail / .onprem wholesale. Only the pieces below are new; every selector was
   checked against the whole sheet first.
   ================================================================================ */

/* ---------- Hero visual — one flagged trade from red flag to STR ----------
   Same card chrome and the same motion budget as the .score-card and .screen-card that
   came before it (entrance plays once, one looping LIVE dot), but a vertical journey
   rather than a list of verdicts, because this page's promise is a hand-off that never
   happens. The one extra loop is the STR bar, which is the thing being claimed. */
.aksiq-site .str-card{position:relative;width:100%;max-width:420px;margin:28px auto 0;background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:var(--elevation-2);
  padding:22px;overflow:hidden}
@media (min-width:1100px){
.aksiq-site .str-card{margin:0}
}
.aksiq-site .str-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--border-default)}
.aksiq-site .str-card__who{min-width:0}
.aksiq-site .str-card__name{font-size:var(--text-sm);font-weight:600;color:var(--text-primary)}
.aksiq-site .str-card__meta{font-size:var(--text-xs);color:var(--text-tertiary);margin-top:2px}
.aksiq-site .str-card__live{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;padding:4px 10px;
  border-radius:var(--radius-pill);background:var(--cyan-50);color:var(--blue-700);
  font-size:var(--text-xs);font-weight:700;letter-spacing:0.02em}

/* Reuses the scorePulse keyframe rather than declaring a third identical one. */
.aksiq-site .str-card__live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--cyan-500);
  animation:scorePulse 1.8s ease-in-out infinite}
.aksiq-site .str-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.aksiq-site .str-step{position:relative;display:flex;align-items:flex-start;gap:14px;
  opacity:0;animation:strStepIn .5s var(--d) cubic-bezier(.16,.84,.44,1) forwards}
.aksiq-site .str-step:not(.str-step--end)::after{content:'';position:absolute;left:6px;top:19px;
  width:1px;height:calc(100% + 12px);background:var(--border-strong)}
.aksiq-site .str-step__dot{flex-shrink:0;width:13px;height:13px;margin-top:3px;border-radius:50%;
  background:var(--white);border:3px solid var(--accent-secondary)}
.aksiq-site .str-step--flag .str-step__dot{border-color:var(--danger-600)}
.aksiq-site .str-step--end .str-step__dot{border-color:var(--violet-600)}
.aksiq-site .str-step__body{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1 1 auto}
.aksiq-site .str-step__label{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  font-size:var(--text-sm);font-weight:600;color:var(--text-primary);line-height:1.3}
.aksiq-site .str-step__label em{flex-shrink:0;font-style:normal;font-weight:400;font-size:var(--text-xs);
  color:var(--text-tertiary)}
.aksiq-site .str-step__detail{font-size:var(--text-xs);line-height:1.5;color:var(--text-secondary)}
.aksiq-site .str-step--flag .str-step__detail{font-weight:600;color:var(--danger-600)}

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


/* The evidence trail filling while the case is still open — the one claim on this card
   that is about something in progress, so it is the one thing that keeps moving. */
.aksiq-site .str-bar{display:block;height:6px;margin-top:9px;border-radius:var(--radius-pill);
  background:var(--ink-100);overflow:hidden}
.aksiq-site .str-bar__fill{display:block;height:100%;width:100%;border-radius:var(--radius-pill);
  background:linear-gradient(90deg,var(--accent-secondary),var(--violet-600));
  transform-origin:left center;animation:strBar 4s 900ms cubic-bezier(.16,.84,.44,1) infinite}

@keyframes strBar{0%{transform:scaleX(.08)}42%,76%{transform:scaleX(.66)}100%{transform:scaleX(.66)}}
.aksiq-site .str-card__foot{display:flex;align-items:center;gap:8px;margin-top:20px;padding-top:14px;
  border-top:1px solid var(--border-default);font-size:var(--text-xs);color:var(--text-tertiary)}
.aksiq-site .str-card__foot svg{color:var(--accent-secondary);flex-shrink:0}
@media (prefers-reduced-motion:reduce){
.aksiq-site .str-card__live::before{animation:none}
.aksiq-site .str-step{animation:none;opacity:1;transform:none}
.aksiq-site .str-bar__fill{animation:none;transform:scaleX(.66)}
}


/* ---------- Tension: four tools stitched together, vs one window ---------- */
.aksiq-site .tool-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.aksiq-site .tool{display:flex;align-items:center;gap:10px;font-size:var(--text-sm);line-height:1.3;color:var(--text-tertiary)}
.aksiq-site .tool__mark{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:50%;font-size:11px;font-weight:700;
  background:var(--ink-100);color:var(--text-tertiary)}
.aksiq-site .tool--on{color:var(--text-secondary)}
.aksiq-site .tool--on .tool__mark{background:var(--success-100);color:var(--success-600)}


/* ---------- Trust card 1: the library, with the bank's own selection lit ---------- */
.aksiq-site .scn{display:flex;flex-direction:column;justify-content:center;gap:14px;height:100%}
.aksiq-site .scn__grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.aksiq-site .scn__cell{height:20px;border-radius:var(--radius-xs);background:var(--ink-100)}
.aksiq-site .scn__cell--on{background:linear-gradient(120deg,var(--cyan-500),var(--violet-500));
  opacity:0;animation:scnOn 4.2s var(--d) ease infinite}

@keyframes scnOn{0%{opacity:0;transform:scale(.72)}13%,88%{opacity:1;transform:none}100%{opacity:1;transform:none}}
.aksiq-site .scn__foot{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:700;
  letter-spacing:0.04em;text-transform:uppercase;color:var(--text-tertiary)}
.aksiq-site .scn__key{flex-shrink:0;width:10px;height:10px;border-radius:2px;background:var(--ink-100)}
.aksiq-site .scn__key--on{background:linear-gradient(120deg,var(--cyan-500),var(--violet-500))}
@media (prefers-reduced-motion:reduce){
.aksiq-site .scn__cell--on{animation:none;opacity:1;transform:none}
}


/* ---------- Trust card 3: the four teams an alert has to satisfy ---------- */
.aksiq-site .lanes{display:flex;flex-direction:column;justify-content:center;gap:11px;height:100%}
.aksiq-site .lane{display:flex;align-items:center;gap:10px}
.aksiq-site .lane__who{flex:0 0 74px;font-size:var(--text-xs);color:var(--text-secondary)}
.aksiq-site .lane__track{position:relative;flex:1 1 auto;height:6px;border-radius:var(--radius-pill);background:var(--ink-100)}
.aksiq-site .lane__pip{position:absolute;top:50%;left:0;width:10px;height:10px;border-radius:50%;translate:0 -50%;
  background:var(--accent-secondary);animation:lanePip 3.8s var(--d) ease-in-out infinite}

@keyframes lanePip{0%{left:0;opacity:0}12%{opacity:1}80%{left:calc(100% - 10px);opacity:1}100%{left:calc(100% - 10px);opacity:0}}
.aksiq-site .lanes__foot{margin-top:5px;font-size:10px;font-weight:700;letter-spacing:0.04em;
  text-transform:uppercase;color:var(--text-tertiary)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .lane__pip{animation:none;opacity:1;left:calc(100% - 10px)}
}


/* ---------- Proof card: attributed quote with a face ----------
   .client-card sits on the gradient band, so the person row is white-on-gradient rather
   than the ink used by the .quote-card person rows elsewhere on the site.
   The translucent pill this used to carry read as a floating chip stuck to the bottom of
   the card; a hairline rule above the row attaches the name to the quote instead, which is
   how an attribution is normally set. Hover tints the name, not a background. */
.aksiq-site .client-card__person{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;
  text-decoration:none;margin-top:2px;padding-top:20px;border-top:1px solid rgba(255,255,255,0.28)}
.aksiq-site .client-card__avatar{flex-shrink:0;display:block;width:40px;height:40px;border-radius:50%;overflow:hidden;
  box-shadow:0 0 0 2px rgba(255,255,255,0.45)}
.aksiq-site .client-card__avatar img{width:100%;height:100%;object-fit:cover;display:block}
.aksiq-site .client-card__id{display:flex;flex-direction:column;gap:1px;min-width:0;text-align:left}
.aksiq-site .client-card__pname{font-size:var(--text-sm);font-weight:600;color:var(--white);line-height:1.35;
  transition:opacity 150ms ease}
.aksiq-site .client-card__prole{font-size:var(--text-xs);color:rgba(255,255,255,0.78);line-height:1.35}
.aksiq-site .client-card__person:hover .client-card__pname{opacity:0.82;text-decoration:underline;
  text-underline-offset:2px}


/* ---------- The pain-point panel, a step darker ----------
   Scoped to this page rather than changed on .tension-panel--stale itself, which the KYC
   and sanctions pages also use. Lift it into the shared rule if those two want it too. */
.aksiq-site .tension-panel--dim{background:var(--cool-100);border-color:var(--border-strong)}
.aksiq-site .tension-panel--dim .tension-panel__tag{background:var(--ink-100)}


/* ---------- One stat on this page is a before/after, not a figure ---------- */
.aksiq-site .stat-rail__value--word{display:flex;align-items:baseline;gap:8px;font-size:30px;flex-wrap:wrap}
@media (min-width:1024px){
.aksiq-site .stat-rail__value--word{font-size:34px}
}
.aksiq-site .stat-was{font-weight:400;color:var(--text-tertiary);text-decoration:line-through;
  text-decoration-thickness:2px;text-decoration-color:var(--ink-300)}
.aksiq-site .stat-arrow{color:var(--accent-secondary);font-weight:400}


/* ================================================================================
   Price & Document Integrity (solutions page)
   Fourth sibling of the solution pages, so it reuses .hero--solution / .hero--wide-art /
   .hero-figure / .tension / .party-list / .feature-row / .payoff-grid / .trust-grid /
   .onprem / .proof-split / .proof-pills / .stat-rail wholesale. Only the two card stages
   below are new; every selector was checked against the whole sheet first.

   The hero reuses .hero-figure, which had gone unreferenced when the Watchlist hero
   became a CSS panel. It is back in use here, so leave it alone.
   ================================================================================ */

/* ---------- Trust card 1: the declared price landing outside the market band ----------
   The one image that says "price integrity" on its own: a market range, and a declared
   value that does not sit inside it. The marker travels out of the band rather than
   starting there, so the eye follows the distance rather than reading a static dot. */
.aksiq-site .pband{display:flex;flex-direction:column;gap:10px}
.aksiq-site .pband__track{position:relative;height:8px;border-radius:var(--radius-pill);background:var(--ink-100)}
.aksiq-site .pband__range{position:absolute;left:22%;width:34%;top:0;bottom:0;border-radius:var(--radius-pill);
  background:linear-gradient(90deg,var(--accent-secondary),var(--violet-600))}
.aksiq-site .pband__marker{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;
  background:var(--danger-600);border:2.5px solid var(--white);box-shadow:var(--elevation-1);
  left:39%;animation:pbandOut 3.6s cubic-bezier(.16,.84,.44,1) infinite}

/* 39% is the middle of the band; 86% is clear of its right edge. */
@keyframes pbandOut{0%{left:39%}26%,74%{left:86%}100%{left:86%}}
.aksiq-site .pband__legend{display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:var(--text-xs);color:var(--text-tertiary)}
.aksiq-site .pband__flag{font-weight:700;color:var(--danger-600);font-feature-settings:"tnum"}
.aksiq-site .pband__srcs{display:flex;flex-wrap:wrap;gap:4px 6px}
.aksiq-site .pband__srcs span{padding:2px 8px;border-radius:var(--radius-pill);background:var(--white);
  border:1px solid var(--border-default);font-size:10px;color:var(--text-secondary);line-height:1.6}
@media (prefers-reduced-motion:reduce){
.aksiq-site .pband__marker{animation:none;left:86%}
}


/* ---------- Trust card 2: declared against customs, field by field ----------
   Three columns rather than two panels: the comparison is the point, and putting the two
   values on one line is what makes the third row's gap legible at a glance. */
.aksiq-site .xcheck{display:flex;flex-direction:column;gap:6px}
.aksiq-site .xcheck__head, .aksiq-site .xcheck__row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center}
.aksiq-site .xcheck__head{font-size:9px;font-weight:700;letter-spacing:0.06em;color:var(--text-tertiary);
  padding:0 8px 2px}
.aksiq-site .xcheck__head span:not(:first-child), .aksiq-site .xcheck__row span:not(:first-child){
  min-width:58px;text-align:right;font-feature-settings:"tnum"}
.aksiq-site .xcheck__row{padding:6px 8px;border-radius:var(--radius-sm);background:var(--white);
  border:1px solid var(--border-default);font-size:var(--text-xs);color:var(--text-secondary);
  opacity:0;animation:xcheckIn 3.6s var(--d) ease infinite}
.aksiq-site .xcheck__row span:first-child{font-weight:600;color:var(--text-primary)}
.aksiq-site .xcheck__row--off{background:var(--danger-100);border-color:var(--danger-100)}
.aksiq-site .xcheck__row--off span{color:var(--danger-600);font-weight:700}

@keyframes xcheckIn{0%{opacity:0;transform:translateY(3px)}14%,88%{opacity:1;transform:none}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .xcheck__row{opacity:1;animation:none}
}


/* ================================================================================
   Trade Policy & Controlled Goods (solutions page)
   Fifth sibling of the solution pages, and the lightest of them: it reuses
   .hero--solution / .hero--wide-art / .hero-figure / .tension / .tension-panel /
   .party-list / .feature-row / .payoff-grid / .trust-grid / .wc-stack / .onprem /
   .proof-split / .proof-pills / .stat-rail / .stat-rail__value--word wholesale.

   .wc-stack came off the Watchlist page untouched — "several list families resolving in
   one pass" is the same picture whether the lists are sanctions or export controls, so
   Card 1 needed no new selectors.

   Only the three rules below are new; every selector was checked against the whole sheet
   before it was written.
   ================================================================================ */

/* ---------- A two-stat rail ----------
   This page is the first to carry only two stats (Fiza cut the deck's other two on
   2026-08-24). .stat-rail is repeat(3,1fr) from 640px, which would have left a pair
   stretched across the container with a dead third column, so the pair gets its own
   track count and a max-width that stops the two figures drifting apart at 1440px.
   Sibling of the existing .stat-rail--four override, and placed to the same pattern. */
@media (min-width:640px){
.aksiq-site .stat-rail--two{grid-template-columns:repeat(2,1fr);max-width:720px}
}


/* ---------- Trust card 2: the jurisdiction is the setting, the rules follow from it ----
   The point of the copy is that the bank picks its own regulator, not that a list loads.
   So the selected policy source sits on top as a bordered, lit row, and the three rule
   families arrive underneath it — the sequence reads as consequence, not as a menu.
   The live dot reuses the global scorePulse keyframe rather than declaring another. */
.aksiq-site .regime{display:flex;flex-direction:column;gap:10px}
.aksiq-site .regime__head{font-size:9px;font-weight:700;letter-spacing:0.06em;color:var(--text-tertiary)}
.aksiq-site .regime__pick{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:var(--radius-sm);
  background:var(--white);border:1px solid var(--accent-secondary);
  font-size:var(--text-xs);font-weight:600;color:var(--text-primary)}
.aksiq-site .regime__dot{flex-shrink:0;width:8px;height:8px;border-radius:50%;background:var(--accent-secondary);
  animation:scorePulse 2.4s ease-in-out infinite}
.aksiq-site .regime__rules{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column;gap:7px}
.aksiq-site .regime__rules li{display:flex;align-items:center;gap:8px;font-size:var(--text-xs);
  color:var(--text-secondary);line-height:1.35;opacity:0;animation:regimeIn 3.6s var(--d) ease infinite}
.aksiq-site .regime__rules li svg{flex-shrink:0;color:var(--success-600)}

@keyframes regimeIn{0%{opacity:0;transform:translateX(-4px)}16%,88%{opacity:1;transform:none}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
.aksiq-site .regime__dot{animation:none}
.aksiq-site .regime__rules li{opacity:1;animation:none}
}


/* ---------- Proof card attribution without a link ----------
   .client-card__person was built on the Transaction Monitoring page as an anchor to a
   LinkedIn profile. No verified profile URL for Khurram Abid exists in this project, so
   this page uses a plain div — which would otherwise still pick up the anchor's hover
   underline and read as a link that does nothing. Delete this rule the day a real URL
   arrives and the div becomes an anchor. */
.aksiq-site div.client-card__person:hover .client-card__pname{opacity:1;text-decoration:none}


/* ================================================================================
   Vessel & Cargo Tracking (solutions page)
   Sixth sibling, and the first to add nothing to the trust section at all: Card 1 is the
   Watchlist page's .wc-stack, Card 2 is .onprem and Card 3 is the Watchlist page's .trail,
   all three verbatim. It also reuses .hero--solution / .hero-figure / .tension /
   .tension-panel / .party-list / .feature-row / .payoff-grid / .trust-grid / .proof-split /
   .proof-pills / .client-card / .stat-rail wholesale.

   Only the two rules below are new; both exist because this page's assets are shaped
   differently from every other solution page's, not because it wanted a new look.
   ================================================================================ */

/* ---------- A near-square hero figure ----------
   Every other solution hero is wide art (2.35:1 on Price, 2.85:1 on Trade Policy) and takes
   the 560px .hero--wide-art column. This one is a globe at 1.15:1. In that column it would
   stand 485px tall against 344px of hero copy and pull the eye off the headline, so the page
   uses the default 460px .hero--solution column and caps the image narrower again: 430px
   gives 372px of height, which sits just past the copy instead of towering over it.
   Scoped to its own modifier rather than changed on .hero-figure, which the Price and Trade
   Policy heroes rely on at the full 560px. */
.aksiq-site .hero-figure--globe img{max-width:430px}


/* ---------- Long stat values ----------
   "750,000+" is now the longest figure on the site, past the "200,000+" that already
   overflowed its column on the four-across rail at 46px. Three-across gives more room than
   four, but not enough at 46px, so the figures step down on this page only. */
@media (min-width:1024px){
.aksiq-site .stat-rail--long .stat-rail__value{font-size:38px}
}



/* ============================================================================
   Homepage benefit cards — animated stages ("Software is Half of It")
   Same recipe as the .trust-card stages on the solution pages: a soft brand
   gradient panel bled to the card edges, one looping idea inside it, copy
   underneath. Card 3 reuses .tune-row from the KYC page wholesale — those
   sliders literally are "configured to your rulebook", so nothing new is
   declared for it. The old outlined icon plate is gone from these three: the
   stage already carries the icon, and two of the same mark per card read as a
   duplicate rather than an accent.
   ============================================================================ */

.aksiq-site .experts-row .expert-card{overflow:hidden}

/* Bleed to the card edges. Card padding is 28px 26px 24px, hence the offsets. */
.aksiq-site .experts-row .expert-card__stage{
  margin:-28px -26px 22px;height:168px;flex-shrink:0;padding:20px;overflow:hidden;
  background:var(--gradient-brand-soft);border-bottom:1px solid var(--border-default);
  display:flex;flex-direction:column;justify-content:center;gap:10px;
}

/* With a stage on top the lead-in becomes a real block heading, the way the
   trust cards set it. Inline lead-ins needed the trailing full stop to separate
   them from the sentence; block headings do not, so the stops came off. */
.aksiq-site .experts-row .expert-copy h4{
  display:block;font-size:var(--text-md);line-height:1.3;
  font-weight:var(--weight-semibold);color:var(--text-primary);margin:0 0 8px;
}


/* Stage 1 — one trainer, then the bank's own people certified in sequence */
.aksiq-site .cohort{display:flex;flex-direction:column;align-items:center;gap:8px}
.aksiq-site .cohort__lead{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius-pill);box-shadow:var(--elevation-1);
  font-size:var(--text-xs);font-weight:700;color:var(--text-primary)}
.aksiq-site .cohort__lead svg{color:var(--accent-secondary);flex-shrink:0}

/* The feed line, with a pulse running down it into the seat row. */
.aksiq-site .cohort__feed{position:relative;width:1px;height:20px;
  background:repeating-linear-gradient(to bottom,var(--border-strong) 0 4px,transparent 4px 8px)}
.aksiq-site .cohort__feed::after{content:'';position:absolute;left:50%;top:0;width:5px;height:5px;border-radius:50%;
  translate:-50% 0;background:var(--accent-secondary);animation:cohortFeed 4.4s ease-in-out infinite}

@keyframes cohortFeed{0%{top:0;opacity:0}12%{opacity:1}34%{top:100%;opacity:1}42%,100%{top:100%;opacity:0}}
.aksiq-site .cohort__seats{display:flex;gap:10px}
.aksiq-site .cohort__seat{position:relative;width:34px;height:34px;border-radius:50%;background:var(--white);color:var(--ink-300);
  border:1.5px solid var(--border-default);animation:cohortLight 4.4s ease-in-out infinite}
.aksiq-site .cohort__seat::before{content:'';position:absolute;left:50%;top:9px;width:10px;height:10px;border-radius:50%;
  translate:-50% 0;background:currentColor}
.aksiq-site .cohort__seat::after{content:'';position:absolute;left:50%;bottom:6px;width:18px;height:8px;
  border-radius:9px 9px 0 0;translate:-50% 0;background:currentColor}

@keyframes cohortLight{0%,38%{border-color:var(--border-default);color:var(--ink-300)}50%,100%{border-color:var(--accent-secondary);color:var(--accent-secondary)}}
.aksiq-site .cohort__tick{position:absolute;right:-3px;bottom:-2px;display:inline-flex;align-items:center;
  justify-content:center;width:15px;height:15px;border-radius:50%;background:var(--success-100);
  color:var(--success-600);border:1.5px solid var(--white);
  animation:decideStamp 4.4s ease-in-out infinite}
.aksiq-site .cohort__seat:nth-child(2), .aksiq-site .cohort__seat:nth-child(2) .cohort__tick{animation-delay:.45s}
.aksiq-site .cohort__seat:nth-child(3), .aksiq-site .cohort__seat:nth-child(3) .cohort__tick{animation-delay:.9s}
.aksiq-site .cohort__caption{font-size:10px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;
  color:var(--text-secondary)}
@media (prefers-reduced-motion:reduce){
.aksiq-site .cohort__feed::after{animation:none;opacity:0}
.aksiq-site .cohort__seat{animation:none;border-color:var(--accent-secondary);color:var(--accent-secondary)}
.aksiq-site .cohort__tick{animation:none;transform:none;opacity:1}
}


/* Stage 2 — one advisory practice, three audiences lit in turn by a pulse
   travelling down the spine */
.aksiq-site .advise{display:flex;flex-direction:column;gap:10px}
.aksiq-site .advise__hub{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;padding:6px 12px;
  background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-pill);
  box-shadow:var(--elevation-1);font-size:var(--text-xs);font-weight:700;color:var(--text-primary)}
.aksiq-site .advise__hub svg{color:var(--accent-secondary);flex-shrink:0}
.aksiq-site .advise__list{position:relative;list-style:none;margin:0;padding:0 0 0 18px;
  display:flex;flex-direction:column;gap:6px}

/* The spine, dropping out of the hub chip and down past all three rows. */
.aksiq-site .advise__list::before{content:'';position:absolute;left:11px;top:-8px;bottom:12px;width:1px;
  background:var(--border-strong)}

/* The pulse that travels it. */
.aksiq-site .advise__list::after{content:'';position:absolute;left:11px;top:-8px;width:5px;height:5px;border-radius:50%;
  translate:-50% 0;background:var(--accent-secondary);animation:advisePulse 4.2s linear infinite}

@keyframes advisePulse{0%{top:-8px;opacity:0}8%{opacity:1}70%{top:78%;opacity:1}80%,100%{top:78%;opacity:0}}
.aksiq-site .advise__row{position:relative}

/* Stub from the spine across to each label. */
.aksiq-site .advise__row::before{content:'';position:absolute;left:-7px;top:50%;width:9px;height:1px;
  background:var(--border-strong)}
.aksiq-site .advise__node{display:inline-block;padding:4px 10px;border-radius:6px;background:rgba(255,255,255,0.7);
  border:1px solid transparent;font-size:11.5px;font-weight:600;color:var(--text-secondary);
  animation:adviseLight 4.2s ease-in-out infinite}

@keyframes adviseLight{
  0%,14%{background:rgba(255,255,255,0.7);border-color:transparent;color:var(--text-secondary)}
  26%,52%{background:var(--white);border-color:var(--accent-secondary);color:var(--text-primary)}
  70%,100%{background:rgba(255,255,255,0.7);border-color:transparent;color:var(--text-secondary)}
}
.aksiq-site .advise__row:nth-child(2) .advise__node{animation-delay:.85s}
.aksiq-site .advise__row:nth-child(3) .advise__node{animation-delay:1.7s}
@media (prefers-reduced-motion:reduce){
.aksiq-site .advise__list::after{animation:none;opacity:0}
.aksiq-site .advise__node{animation:none;background:var(--white);border-color:var(--accent-secondary);color:var(--text-primary)}
}


/* Platform mega-panel: Doc iQ carries no sub-line any more, so its title is the
   last child and should not leave the 2px gutter meant to clear a description. */
@media (min-width:1024px){
.aksiq-site .platform-product-title:last-child{margin-bottom:0}
}



/* ============================================================================
   Card feature art — blog and press release cards
   Replaces the illustrated JPGs on the blog cards, which had the post title and
   category pill *baked into the artwork*. That made the title uneditable, which
   is the thing that breaks once these move to WordPress: a new post would need a
   new render commissioned before it could ship. This is HTML and CSS, so the
   only per-post variable is the icon in .card-art__badge (plus an optional
   --violet / --gold accent). One block, reusable for every future post.

   The press release cards use exactly the same art, replacing their flat icon
   tiles, so the two index pages read as one system.

   The .blog-card__img rules further up are left in place but no page uses them.
   ============================================================================ */

.aksiq-site .card-art{
  --art-accent:var(--accent-secondary);
  position:relative;height:168px;flex-shrink:0;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  border-bottom:1px solid var(--border-default);
  /* White ground, with the brand gradient washing in from the far corner. */
  background:
    radial-gradient(120% 130% at 12% 10%, #FFFFFF 0%, rgba(255,255,255,0) 64%),
    linear-gradient(135deg, var(--cyan-100) 0%, var(--violet-100) 100%);
}
.aksiq-site .blog-card--violet .card-art{--art-accent:var(--violet-500)}
.aksiq-site .blog-card--gold .card-art{--art-accent:var(--warning-600)}

/* Three gradient angles cycling down the grid, so a row of cards has some variety
   without introducing colours outside the brand pair. nth-child rather than a
   modifier class on purpose: a WordPress loop then cycles them on its own. */
.aksiq-site .blog-grid > .blog-card:nth-child(3n+2) .card-art{
  background:
    radial-gradient(120% 130% at 88% 12%, #FFFFFF 0%, rgba(255,255,255,0) 62%),
    linear-gradient(215deg, var(--cyan-100) 0%, var(--violet-100) 100%);
}
.aksiq-site .blog-grid > .blog-card:nth-child(3n) .card-art{
  background:
    radial-gradient(130% 130% at 50% 108%, #FFFFFF 0%, rgba(255,255,255,0) 58%),
    linear-gradient(160deg, var(--violet-100) 0%, var(--cyan-100) 100%);
}


/* A soft accent glow sitting under the scene, so the panel is not just flat wash. */
.aksiq-site .card-art::before{
  content:'';position:absolute;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle, var(--art-accent) 0%, transparent 68%);
  opacity:.13;pointer-events:none;
}


/* The scene: a document sheet with an accent header, content lines and a tagged row,
   a second sheet fanned behind it, and the topic icon on a plate over the corner. */
.aksiq-site .card-art__stack{position:relative;display:block;width:148px;height:112px}
.aksiq-site .card-art__sheet{
  position:absolute;inset:0;display:flex;flex-direction:column;gap:9px;
  padding:15px 15px 0;background:var(--white);border:1px solid var(--border-default);
  border-radius:9px;box-shadow:var(--elevation-1);
  transition:transform 320ms cubic-bezier(.16,.84,.44,1);
}

/* Fanned to the left so it balances the badge hanging off the right. */
.aksiq-site .card-art__sheet--back{
  inset:auto auto 6px -15px;width:100%;height:100%;padding:0;
  background:rgba(255,255,255,0.78);box-shadow:none;transform:rotate(-6deg);
}
.aksiq-site .card-art__bar{width:42px;height:6px;border-radius:3px;background:var(--art-accent)}
.aksiq-site .card-art__line{height:5px;border-radius:3px;background:var(--ink-100)}
.aksiq-site .card-art__line--short{width:62%}
.aksiq-site .card-art__line--tiny{width:34px;flex-shrink:0}
.aksiq-site .card-art__row{display:flex;align-items:center;gap:7px}
.aksiq-site .card-art__pill{
  width:30px;height:11px;border-radius:var(--radius-pill);flex-shrink:0;
  background:var(--art-accent);opacity:.22;
}
.aksiq-site .card-art__badge{
  position:absolute;right:-20px;bottom:-14px;
  display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;
  border-radius:50%;background:var(--white);color:var(--art-accent);
  border:1px solid var(--border-default);box-shadow:var(--elevation-2);
  transition:transform 320ms cubic-bezier(.16,.84,.44,1);
}

/* The only motion: the scene opens up slightly when the card is pointed at. Six
   of these sit in a grid, so nothing loops on its own. */
.aksiq-site a.blog-card:hover .card-art__sheet{transform:translateY(-3px)}
.aksiq-site a.blog-card:hover .card-art__sheet--back{transform:rotate(-7deg) translateY(-3px)}
.aksiq-site a.blog-card:hover .card-art__badge{transform:translate(3px,3px) scale(1.06)}
@media (prefers-reduced-motion:reduce){
.aksiq-site a.blog-card:hover .card-art__sheet, .aksiq-site a.blog-card:hover .card-art__badge{transform:none}
.aksiq-site a.blog-card:hover .card-art__sheet--back{transform:rotate(-4deg)}
}


/* The title is a real heading now that it is no longer inside the artwork. */
.aksiq-site h3.blog-card__title{font-size:var(--text-md);font-weight:600;line-height:1.35;margin:0 0 10px}



/* ============================================================================
   2026-08-26 — homepage + Trade iQ copy pass
   Everything below is additive. The only pre-existing rule touched is
   .orbit-label, restated here (later in the sheet, so it wins) because two of
   the five orbit labels got longer.
   ============================================================================ */

/* ---------- Hero eyebrow ----------
   .eyebrow already sets the type; it only needed to be spaced off the H1. */
.aksiq-site .hero-eyebrow{margin-bottom:14px}


/* ---------- Orbit labels, restated ----------
   "Trade transaction monitoring" and "Price due diligence" both run past the
   old calc(--chip * 2) cap and dropped to three lines, which pushed the bottom
   node's text into the logo strip. Widening the box to 2.6x puts every label
   back on two lines; the stage gets the matching 8px of headroom. */
.aksiq-site .orbit-label{max-width:calc(var(--chip)*2.6);text-wrap:pretty}

/* .orbit-inner is what actually caps the label: its 132px box was narrower than
   the widened max-width, so the long label still broke to three lines. */
.aksiq-site .hero-visual{--label-w:154px}
.aksiq-site .orbit{height:calc(var(--r)*2 + var(--chip) + 52px)}


/* ============================================================================
   Homepage — Who we serve
   Four audiences, one illustration each. The SVGs are a matched set drawn to a
   shared #skyline with only the #landmark swapped, so the four line up on a row
   with no per-card nudging. The art plate is plain white on purpose: the
   illustrations dissolve to white at the top and fade into a mirror at the
   bottom, and any tint behind them shows those fades as a halo.
   ============================================================================ */

.aksiq-site .serve-grid{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width:600px){
.aksiq-site .serve-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px){
.aksiq-site .serve-grid{grid-template-columns:repeat(4,1fr);gap:22px}
}
.aksiq-site .serve-card{display:flex;flex-direction:column;background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius-lg);overflow:hidden;
  transition:border-color 180ms ease,box-shadow 180ms ease,transform 180ms ease}
.aksiq-site .serve-card:hover{border-color:var(--border-strong);box-shadow:var(--elevation-1);transform:translateY(-3px)}

/* Art sits on the card's own white, bottom-aligned so the four mirrors land on
   one line however tall a given landmark is. */
.aksiq-site .serve-card__art{flex:none;display:flex;align-items:flex-end;justify-content:center;
  padding:22px 22px 0;background:var(--white);border-bottom:1px solid var(--border-default)}
.aksiq-site .serve-card__art img{display:block;width:100%;max-width:186px;height:auto;
  transition:transform 320ms cubic-bezier(.16,.84,.44,1)}
.aksiq-site .serve-card:hover .serve-card__art img{transform:translateY(-4px)}
.aksiq-site .serve-card__copy{flex:1 1 auto;padding:20px 22px 24px}
.aksiq-site .serve-card__copy h3{font-size:var(--text-md);line-height:1.3;letter-spacing:-0.005em;
  font-weight:var(--weight-semibold);margin:0 0 8px;text-wrap:balance}
.aksiq-site .serve-card__copy p{font-size:var(--text-sm);line-height:var(--leading-normal);
  color:var(--text-secondary);margin:0}
@media (prefers-reduced-motion:reduce){
.aksiq-site .serve-card:hover{transform:none}
.aksiq-site .serve-card:hover .serve-card__art img{transform:none}
}


/* ============================================================================
   Homepage benefit cards — two replacement stages
   The row now says security and compliance, so the train-the-trainer ripple
   (.cohort) and the advisory spine (.advise) no longer describe their cards.
   Both are replaced below. Card 3 still runs .tune-row untouched.
   .cohort and .advise are left in the sheet: nothing else uses them today, but
   they are the only record of how those two stages were built.
   ============================================================================ */

/* Stage 1 — a sealed payload crossing the wire, with both states data can be
   in (moving, stored) sealing behind it. */
.aksiq-site .crypt{display:flex;flex-direction:column;align-items:center;gap:26px;width:100%}
.aksiq-site .crypt__wire{display:flex;align-items:center;gap:8px;width:100%}
.aksiq-site .crypt__end{flex:none;padding:9px 13px;background:var(--white);border:1px solid var(--border-default);
  border-radius:var(--radius-pill);box-shadow:var(--elevation-1);
  font-size:var(--text-sm);font-weight:700;color:var(--text-primary);white-space:nowrap}
.aksiq-site .crypt__track{position:relative;flex:1 1 auto;min-width:40px;height:2px;
  background:repeating-linear-gradient(to right,var(--border-strong) 0 5px,transparent 5px 10px)}
.aksiq-site .crypt__packet{position:absolute;top:50%;left:0;translate:-50% -50%;
  display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;
  background:var(--white);color:var(--violet-600);
  box-shadow:0 3px 10px rgba(91,75,209,0.22),0 0 0 1px rgba(91,75,209,0.14);
  animation:cryptSend 4.4s ease-in-out infinite}

@keyframes cryptSend{0%{left:0;opacity:0}10%{opacity:1}62%{left:100%;opacity:1}72%,100%{left:100%;opacity:0}}
.aksiq-site .crypt__states{display:flex;gap:10px}
.aksiq-site .crypt__state{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:7px;
  background:rgba(255,255,255,0.70);border:1px solid transparent;
  font-size:12px;font-weight:600;color:var(--text-secondary);white-space:nowrap;
  animation:cryptSeal 4.4s ease-in-out infinite}
.aksiq-site .crypt__state svg{color:var(--accent-secondary);flex:none}

@keyframes cryptSeal{
  0%,24%{background:rgba(255,255,255,0.70);border-color:transparent;color:var(--text-secondary)}
  38%,74%{background:var(--white);border-color:var(--accent-secondary);color:var(--text-primary)}
  88%,100%{background:rgba(255,255,255,0.70);border-color:transparent;color:var(--text-secondary)}}
.aksiq-site .crypt__state:nth-child(2){animation-delay:.5s}
@media (prefers-reduced-motion:reduce){
.aksiq-site .crypt__packet{animation:none;left:50%;opacity:1}
.aksiq-site .crypt__state{animation:none;background:var(--white);border-color:var(--accent-secondary);color:var(--text-primary)}
}


/* Stage 2 — the maker/checker/approver chain a bank already runs, each step
   stamping itself into the log in sequence. */
.aksiq-site .ledger{display:flex;flex-direction:column;gap:9px;width:100%}
.aksiq-site .ledger__head{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;padding:6px 12px;
  background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-pill);
  box-shadow:var(--elevation-1);font-size:var(--text-xs);font-weight:700;color:var(--text-primary)}
.aksiq-site .ledger__head svg{color:var(--accent-secondary);flex:none}
.aksiq-site .ledger__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.aksiq-site .ledger__row{display:flex;align-items:center;gap:8px;padding:5px 8px 5px 10px;border-radius:6px;
  background:rgba(255,255,255,0.66);border:1px solid transparent;
  animation:ledgerStamp 4.8s ease-in-out infinite}
.aksiq-site .ledger__role{flex:0 0 56px;font-size:9.5px;font-weight:700;letter-spacing:0.04em;
  text-transform:uppercase;color:var(--text-tertiary)}
.aksiq-site .ledger__act{flex:1 1 auto;font-size:11.5px;font-weight:600;color:var(--text-secondary)}
.aksiq-site .ledger__tick{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:50%;background:var(--success-100);color:var(--success-600);
  opacity:0;animation:ledgerTick 4.8s ease-in-out infinite}

@keyframes ledgerStamp{
  0%,14%{background:rgba(255,255,255,0.66);border-color:transparent}
  24%,84%{background:var(--white);border-color:var(--accent-secondary)}
  94%,100%{background:rgba(255,255,255,0.66);border-color:transparent}}

@keyframes ledgerTick{
  0%,18%{opacity:0;scale:0.6}
  28%,84%{opacity:1;scale:1}
  94%,100%{opacity:0;scale:0.6}}
.aksiq-site .ledger__row:nth-child(2), .aksiq-site .ledger__row:nth-child(2) .ledger__tick{animation-delay:.55s}
.aksiq-site .ledger__row:nth-child(3), .aksiq-site .ledger__row:nth-child(3) .ledger__tick{animation-delay:1.1s}
@media (prefers-reduced-motion:reduce){
.aksiq-site .ledger__row{animation:none;background:var(--white);border-color:var(--accent-secondary)}
.aksiq-site .ledger__tick{animation:none;opacity:1;scale:1}
}


/* ============================================================================
   Trade iQ hero — ten checks on the ring (.hub--ten)
   .hub was built for seven nodes with the label stacked UNDER its chip. At ten
   nodes the sweep drops to 36deg, which puts two same-side nodes 75px apart
   vertically while a chip plus its label is 78px tall — they collide. So the
   labels radiate OUTWARD here: left of the chip on the left half, right of it
   on the right half, above and below at the two poles. The dot becomes a
   fixed chip-sized box so the label can anchor off it; everything else
   (.hub-orbit, .hub-core, .hub-spoke, .hub-chip) is inherited unchanged.
   ============================================================================ */

.aksiq-site .hub--ten{--r:150px;--chip:44px;--core:96px;--sweep:36deg;
  max-width:560px;height:calc(var(--r)*2 + var(--chip) + 76px)}
@media (min-width:1160px){
.aksiq-site .hero--hub10 .container{grid-template-columns:minmax(0,1fr) minmax(0,560px)}
}
.aksiq-site .hub--ten .hub-dot{display:block;width:var(--chip);height:var(--chip)}
.aksiq-site .hub--ten .hub-label{position:absolute;top:50%;translate:0 -50%;
  width:106px;max-width:none;font-size:10.5px;line-height:1.22;text-wrap:balance}
.aksiq-site .hub--ten .hub-node--r .hub-label{left:calc(100% + 9px);text-align:left}
.aksiq-site .hub--ten .hub-node--l .hub-label{right:calc(100% + 9px);text-align:right}
.aksiq-site .hub--ten .hub-node--t .hub-label, .aksiq-site .hub--ten .hub-node--b .hub-label{left:50%;translate:-50% 0;text-align:center;width:132px}
.aksiq-site .hub--ten .hub-node--t .hub-label{top:auto;bottom:calc(100% + 8px)}
.aksiq-site .hub--ten .hub-node--b .hub-label{top:calc(100% + 8px)}

/* The mis-invoicing flag is a 44px chip here, not 52px. */
.aksiq-site .hub--ten .hub-chip--flag::after{width:10px;height:10px}


/* Below the split, the ring has to survive a 320px screen — it cannot. Two
   nodes plus their labels need 560px of width and there is no honest way to
   shrink that. So the ring, the spokes and the core drop out and the ten
   become a plain two-column list, which is what the content was all along. */
@media (max-width:719px){
.aksiq-site .hub--ten{height:auto;max-width:420px;margin:22px auto 0}
.aksiq-site .hub--ten .hub-orbit, .aksiq-site .hub--ten .hub-spoke{display:none}
.aksiq-site .hub--ten .hub-core{position:static;translate:none;width:auto;height:auto;
    border-radius:0;flex-direction:row;gap:8px;justify-content:flex-start;margin-bottom:16px}
.aksiq-site .hub--ten .hub-core::before{display:none}

  /* Unreferenced since the "One engine, every check" sub came out of the core
     2026-08-27. Kept for the same reason as .hub itself: restoring a sub-line is
     a one-span change and this is the rule it needs on mobile. */
  .aksiq-site .hub--ten .hub-core-sub{max-width:none;color:var(--text-secondary)}
.aksiq-site .hub--ten .hub-nodes{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:12px 14px}
.aksiq-site .hub--ten .hub-node{position:static;transform:none;width:auto;height:auto}
.aksiq-site .hub--ten .hub-dot{position:static;translate:none;display:flex;flex-direction:row;align-items:center;gap:8px;
    width:auto;height:auto}
.aksiq-site .hub--ten .hub-chip{flex:none;width:32px;height:32px}
.aksiq-site .hub--ten .hub-chip .icon{width:16px;height:16px}
.aksiq-site .hub--ten .hub-label{position:static;translate:none;width:auto;text-align:left;font-size:11px}

  /* Each of the four radial variants has to be undone at its own specificity,
     or left/right/translate survive into the list and shove the label over
     its chip. */
  .aksiq-site .hub--ten .hub-node--t .hub-label, .aksiq-site .hub--ten .hub-node--b .hub-label, .aksiq-site .hub--ten .hub-node--l .hub-label, .aksiq-site .hub--ten .hub-node--r .hub-label{
    position:static;translate:none;inset:auto;width:auto;text-align:left}
}


/* ============================================================================
   Trade iQ — the silos block
   Copy left, Fiza's looping GIF right. The GIF is white-backed and sits on a
   white section, so it needs the hairline to read as a figure rather than as
   loose text floating in the column.
   ============================================================================ */

.aksiq-site .silos{display:grid;grid-template-columns:1fr;gap:28px;align-items:center}
.aksiq-site .silos-figure{margin:0}
.aksiq-site .silos-figure img{display:block;width:100%;max-width:560px;height:auto;margin:0 auto;
  border:1px solid var(--border-default);border-radius:var(--radius-lg);background:var(--white)}
@media (min-width:1000px){
.aksiq-site .silos{grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:48px}
.aksiq-site .silos-figure img{margin:0}
}


/* ============================================================================
   HOMEPAGE HERO — twelve-module panel                         (2026-08-27)
   Replaces the five-node orbit that used to sit on the right. The hero band
   itself is untouched: the original four-layer brand gradient, its drift
   animation and the logo-strip fade all still come from the base .hero rules
   above. The only change here is the graphic and the two-column layout that
   holds it, all scoped to .hero--modules so the other 12 live heroes that
   share this stylesheet are unaffected.
   ============================================================================ */

/* Panel — four boxes, three modules each. Proportions taken off the reference
   comp: outer panel : card width = 2.36 : 1, and the 40px gutter exists to
   host the hub badge that sits where the four boxes meet. Module rows carry no
   icon, only a hairline strip, which is what keeps the block quiet. */
/* DEPTH — three physical planes, one light source, from above:
     row   = recessed well  (inset shadow, tinted fill)
     card  = raised slab    (translateZ 16px, drop shadow + top highlight)
     panel = floating sheet (translateZ 0, layered ambient + contact shadow)
     hub   = closest        (translateZ 48px)
   preserve-3d makes those Z values real, so the tilt below parallaxes the
   layers against each other instead of skewing one flat picture.
   To remove the tilt entirely, delete the transform on .hero-modules. */
.aksiq-site .hero-modules{
  position:relative;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;
  /* Equal rows: without this the top row runs taller than the bottom one and
     the hub badge no longer lands on the intersection. */
  grid-auto-rows:1fr;
  background:linear-gradient(178deg,var(--white) 0%,#FCFDFE 100%);
  border:1px solid var(--border-default);
  border-radius:16px;padding:24px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.9),
    0 2px 4px rgba(22,26,38,0.04),
    0 18px 32px -12px rgba(22,26,38,0.13),
    0 48px 80px -32px rgba(22,26,38,0.20);
  max-width:580px;margin:28px auto 6px;
  transform:perspective(1700px) rotateY(-4deg) rotateX(1.5deg);
  transform-style:preserve-3d;
}

/* Contact shadow on the ground beneath the sheet. Pushed back in Z so it sorts
   behind the panel rather than painting over it. */
.aksiq-site .hero-modules::before{
  content:'';position:absolute;left:7%;right:7%;bottom:-22px;height:40px;
  background:radial-gradient(ellipse at 50% 40%,rgba(22,26,38,0.18) 0%,rgba(22,26,38,0) 72%);
  transform:translateZ(-40px);
}
.aksiq-site .modbox{
  border:1px solid var(--border-default);border-radius:12px;padding:16px;
  background:var(--white);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.9),
    0 1px 1px rgba(22,26,38,0.04),
    0 6px 14px -4px rgba(22,26,38,0.08);
  transform:translateZ(16px);
}

/* Two of the four titles run to a second line. Top-aligning the plate and
   reserving two lines' height keeps every plate at the same y and — more
   importantly — starts the module rows on the same baseline in all four
   cards, which centre-aligning did not. 5px lifts the first line onto the
   plate's optical centre (24px plate, 14.3px line). */
.aksiq-site .modbox-head{display:flex;align-items:flex-start;gap:9px;min-height:34px;margin-bottom:11px}
.aksiq-site .modbox-plate{
  flex:none;width:24px;height:24px;border-radius:var(--radius-md);display:grid;place-items:center;
  background:linear-gradient(180deg,#F7FBFD 0%,var(--blue-50) 100%);
  border:1px solid var(--cyan-100);color:var(--accent-secondary);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.9);
}
.aksiq-site .modbox-title{
  margin:0;padding-top:5px;font-size:11px;font-weight:600;letter-spacing:0.07em;
  text-transform:uppercase;color:var(--navy-900);line-height:1.3;
}
.aksiq-site .modbox ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}

/* Recessed: the fill is a shade under the card and the inset shadow puts the
   light on the top edge, so a row reads as sunk into the slab. */
.aksiq-site .modbox li{
  display:flex;align-items:center;min-height:30px;padding:6px 10px;
  border:1px solid var(--border-default);border-radius:5px;
  background:#FBFCFD;
  box-shadow:inset 0 1px 2px rgba(22,26,38,0.05);
  font-size:11.5px;font-weight:500;line-height:1.3;color:var(--text-primary);
}

/* Hub — the closest plane. White ring plus a wide tinted halo so it reads as
   hovering above the join rather than pinned to one card. */
.aksiq-site .modhub{
  position:absolute;left:50%;top:50%;translate:-50% -50%;
  width:28px;height:28px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(180deg,#3E93B8 0%,var(--accent-secondary) 100%);
  color:var(--white);
  box-shadow:
    0 0 0 6px var(--white),
    0 0 0 7px rgba(22,26,38,0.05),
    0 6px 14px rgba(47,128,166,0.40),
    0 12px 28px rgba(47,128,166,0.20);
  transform:translateZ(48px);
}


/* Two columns need ~530px to stay readable; below that the boxes stack and the
   hub is dropped — there is no longer an intersection for it to sit on. */
@media (max-width:699px){

  /* Flat on phones: a tilted single column reads as a rendering fault, and the
     card Z-lift has nothing to parallax against once the grid is one wide. */
  .aksiq-site .hero-modules{grid-template-columns:minmax(0,1fr);gap:14px;padding:16px;max-width:420px;
    transform:none;box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),0 2px 4px rgba(22,26,38,0.04),0 12px 24px -10px rgba(22,26,38,0.12)}
.aksiq-site .hero-modules::before{display:none}
.aksiq-site .modbox{transform:none}
.aksiq-site .modhub{display:none}
}

/* Real grid from 1160px up, matching the .hero--split pattern on trade-iq.html.
   Scoped to the direct child: .hero also contains the logo-strip's .container,
   and .hero .container would turn that into a grid too. */
@media (min-width:1160px){
.aksiq-site .hero--modules > .container{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,580px);
    align-items:center;gap:52px;padding-bottom:24px;
  }
.aksiq-site .hero--modules .hero-content{max-width:none}
.aksiq-site .hero-modules{margin:0}
}


/* Keeps a hyphenated compound from breaking across lines. The narrower hero
   copy column split "End-To-End" into "End-" / "To-End"; this holds it whole
   without touching the wording. */
.aksiq-site .nb{white-space:nowrap}


/* ============================================================================
   Quote carousel — logo row                                   (2026-08-27)
   The three logos sat at 26px across a 1232px row, so each tab was ~410px of
   mostly empty space with a small washed-out mark in it. Bigger marks, more
   air above and below, and a slightly higher rest opacity. The footnote moved
   below the row in the markup: it annotates all three quotes, so sitting
   between the quote and the tabs was what made it read as cramped.
   ============================================================================ */
.aksiq-site .quote-tabs{margin-top:34px}
.aksiq-site .quote-tab{padding:24px 12px 8px}
.aksiq-site .quote-tab img{height:34px;max-width:172px;opacity:0.5}
.aksiq-site .quote-footnote{margin-top:20px;text-align:center}
@media (max-width:640px){
.aksiq-site .quote-tab{padding:18px 6px 6px}
.aksiq-site .quote-tab img{height:26px}
}


/* ============================================================================
   Encrypted End To End — rebuilt                              (2026-08-28)
   The old stage drew "Your bank" and "Trade iQ" as two boxes joined by a wire,
   which says they are separate systems. Trade iQ is deployed inside the bank.
   Now there is one bank boundary with Trade iQ's modules nested inside it,
   each locking in turn. Same rule as before: keep it simple.
   The old .crypt__wire / __end / __track / __packet rules above are dead but
   left in place as the record of the previous version.
   ============================================================================ */
.aksiq-site .crypt__bank{
  width:100%;border:1px dashed var(--border-strong);border-radius:12px;
  padding:12px 14px 14px;background:rgba(255,255,255,0.55);
}
.aksiq-site .crypt__bankname{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:600;letter-spacing:0.05em;text-transform:uppercase;color:var(--text-secondary);
}
.aksiq-site .crypt__bankname svg{color:var(--text-tertiary);flex:none}
.aksiq-site .crypt__iq{
  margin-top:10px;border:1px solid var(--accent-secondary);border-radius:9px;
  background:var(--white);padding:10px 12px 12px;
}
.aksiq-site .crypt__iqname{display:block;font-size:12px;font-weight:600;color:var(--navy-900)}
.aksiq-site .crypt__mods{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.aksiq-site .crypt__mod{
  display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:6px;
  font-size:11px;font-weight:600;color:var(--text-tertiary);
  background:var(--bg-surface);border:1px solid var(--border-default);
  animation:cryptLock 3.6s ease-in-out infinite;
}
.aksiq-site .crypt__mod svg{flex:none}
.aksiq-site .crypt__mod:nth-child(2){animation-delay:.4s}
.aksiq-site .crypt__mod:nth-child(3){animation-delay:.8s}

/* Each module seals, holds, then releases so the loop reads as continuous. */
@keyframes cryptLock{
  0%,12%   {background:var(--bg-surface);border-color:var(--border-default);color:var(--text-tertiary)}
  26%,64%  {background:var(--cyan-50);border-color:var(--accent-secondary);color:var(--text-primary)}
  82%,100% {background:var(--bg-surface);border-color:var(--border-default);color:var(--text-tertiary)}
}
@media (prefers-reduced-motion:reduce){
.aksiq-site .crypt__mod{animation:none;background:var(--cyan-50);border-color:var(--accent-secondary);color:var(--text-primary)}
}


/* ============================================================================
   Hero trust strip — label and logos up a step                (2026-08-28)
   Homepage only: the label is Title Case now and reads slightly larger, and
   the bank marks go 34px -> 40px. Scoped to .hero--modules so the same strip
   on trade-iq, doc-iq and the six solution pages is untouched.
   ============================================================================ */
.aksiq-site .hero--modules .logo-strip-label{font-size:var(--text-sm);letter-spacing:0.05em}
.aksiq-site .hero--modules .logo-marquee-item{height:40px}
@media (max-width:640px){
.aksiq-site .hero--modules .logo-marquee-item{height:32px}
}

/* Fit inside the shared 168px stage: the two lock states ride the bank header
   row rather than sitting under the box, which is ~39px of height back. */
.aksiq-site .crypt__bankrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.aksiq-site .crypt__bank .crypt__states{display:flex;gap:6px;margin-left:auto}
.aksiq-site .crypt__bank .crypt__state{padding:4px 9px;font-size:11px;border-radius:6px;animation:none;
  background:var(--white);border:1px solid var(--border-default);color:var(--text-secondary)}
.aksiq-site .crypt__bank .crypt__iq{margin-top:9px}


/* Resource heroes hold far less content than product heroes; the shared 420px
   min-height left a large empty band. Extra .hero class keeps this ahead of the
   WordPress wrapper variants. */
.aksiq-site .hero.hero--centered:not(.hero--oneline) .container{min-height:260px}


/* The LeadConnector iframe ships height:100% and collapses until its script runs. */
.aksiq-site .apply-card > iframe[id^="inline-"]{min-height:602px;display:block}


/* .infra-flow is inset -6% each side with nothing clipping it, which forced
   horizontal scroll on laptops (28px at 1366). clip, not hidden. */
.aksiq-site .infra{overflow-x:clip}


/* A flex item with margin:0 auto shrinks to its content; the orbit's children are
   absolutely positioned, so it collapsed to 0 between 1024-1159px. */
.aksiq-site .hero-visual{width:100%}


/* heroRingPulse / heroNodeFloat ignored the user's motion setting. */
@media (prefers-reduced-motion:reduce){
.aksiq-site .hero-ring, .aksiq-site .hero-node, .aksiq-site .orbit-ring, .aksiq-site .orbit-path, .aksiq-site .orbit-halo, .aksiq-site .orbit-core{animation:none!important}
}


/* Marks the US office as head office. */
.aksiq-site .office-col__role{display:inline-block;margin:-4px 0 10px;font-size:var(--text-xs);
  font-weight:600;letter-spacing:var(--tracking-wide);text-transform:uppercase;
  color:var(--accent-secondary);}


/* GeneratePress styles every bare <button> white-on-grey; the mobile menu icon uses
   stroke:currentColor and vanished. Component rules are more specific and still win. */
.aksiq-site .aksiq-site button, .aksiq-site button{background-color:transparent;color:inherit;}
/* --- Gutenberg bridge (generated) --- */
.aksiq-site .wp-block-button.btn>.wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-body);font-weight:600;font-size:var(--text-base);border-radius:var(--radius-md);padding:10px 20px;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background 120ms ease,filter 120ms ease,border-color 120ms ease;white-space:nowrap}
.aksiq-site .wp-block-button.btn:active>.wp-block-button__link{filter:brightness(0.92)}
.aksiq-site .wp-block-button.btn-lg>.wp-block-button__link{padding:13px 26px;font-size:var(--text-md)}
.aksiq-site .wp-block-button.btn-sm>.wp-block-button__link{padding:7px 14px;font-size:var(--text-sm)}
.aksiq-site .wp-block-button.btn>.wp-block-button__link{transition:background 160ms ease,filter 160ms ease,border-color 160ms ease,transform 160ms ease,box-shadow 160ms ease}
.aksiq-site .wp-block-button.btn-primary>.wp-block-button__link{background:var(--accent-secondary);color:var(--white);border-color:var(--accent-secondary)}
.aksiq-site .wp-block-button.btn-primary:hover>.wp-block-button__link{background:var(--accent-secondary-hover);border-color:var(--accent-secondary-hover);transform:translateY(-1px);box-shadow:0 4px 12px rgba(47,128,166,0.25)}
.aksiq-site .wp-block-button.btn-secondary>.wp-block-button__link{background:var(--white);color:var(--text-primary);border-color:var(--border-strong)}
.aksiq-site .wp-block-button.btn-secondary:hover>.wp-block-button__link{background:var(--cool-50);transform:translateY(-1px)}
.aksiq-site .wp-block-button.btn-ghost>.wp-block-button__link{background:transparent;color:var(--text-primary)}
.aksiq-site .wp-block-button.btn-ghost:hover>.wp-block-button__link{background:var(--cool-50)}
.aksiq-site .wp-block-button.btn-on-gradient>.wp-block-button__link{background:var(--white);color:var(--blue-700);border-color:var(--white)}
.aksiq-site .wp-block-button.btn-on-gradient:hover>.wp-block-button__link{background:var(--cool-50);transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,0.15)}
.aksiq-site .wp-block-button.btn:hover>.wp-block-button__link{transform:none}
.aksiq-site .wp-block-buttons > .wp-block-button { display: contents; }
