/* ============================================================================
   AgenTorQ site-v2 — identity layer (v2.css)
   Loaded AFTER base.css (the component library carried from the live site so every
   live section keeps rendering) and after any page-level styles, so this file sets
   the new look: type, palette, surfaces, navigation, footer, heroes, cards, FAQ,
   tables, and every component that is new in v2 (mockups, diagrams, explorer,
   use cases, scenarios, white papers).
   Brand anchors: AgenTorQ electric blue (#2f63f0) and the mascot coral (#f8330b).
   ========================================================================== */

/* metric-matched fallback so the headline keeps its line breaks while Archivo loads (no hero layout shift) */
@font-face{font-family:"Archivo Fallback";src:local("Arial");size-adjust:106%;ascent-override:88%;descent-override:21%;line-gap-override:0%}
@font-face{font-family:"Instrument Fallback";src:local("Arial");size-adjust:101%}
/* ------------------------------------------------------------------ tokens
   Stage 2 "Torque": petrol + mist surfaces, saffron actions, mascot-coral signal, lagoon links.
   Display: Archivo (variable width 62-125 — the width axis is the kinetic device).
   Body: Instrument Sans. Code only: JetBrains Mono. */
:root{
  --font-head:"Archivo","Archivo Fallback",Arial,sans-serif;
  --font-body:"Instrument Sans","Instrument Fallback",system-ui,-apple-system,sans-serif;
  --brand:#1f55e0; --brand-strong:#1740b0; --brand-bright:#7ea6ff;
  --coral:#f8330b; --coral-soft:#ff6a3d; --signal:#f8330b;
  --saffron:#ffb020; --saffron-deep:#e89a00; --on-saffron:#0a1733;
  --lagoon:#38a3ff; --cyan:#38a3ff; --lime:#3fae6a; --pink:#ff6a3d; --amber:#ffb020;
  --accent-2:#ffb020; --accent-3:#38a3ff;
  --grad-brand:linear-gradient(90deg,#1f55e0,#38a3ff);
  --grad-ink:none;
  --grad-cool:linear-gradient(135deg,#1f55e0,#38a3ff);
  --grad-hot:linear-gradient(90deg,#ffb020,#f8330b);
  --bg:#f4f6fb; --surface:#e9eef8; --surface-2:#dee5f4; --card:#ffffff;
  --border:#d3dbec; --border-2:#b9c5e0;
  --ink:#0a1733; --ink-2:#33415f; --muted:#4b5877; --faint:#6f7c99;
  --glass:rgba(251,252,251,.8); --glass-border:rgba(10,23,51,.1);
  --navy:#0a1733; --navy-2:#081230; --navy-3:#13285a; --abyss:#050d22;
  --navy-ink:#eef3ff; --navy-ink-2:#a9b8dc; --navy-faint:#7a89ad;
  --fs-display:clamp(48px,8.4vw,132px); --fs-h1:clamp(42px,6.2vw,92px);
  --fs-h2:clamp(32px,4.4vw,64px); --fs-h3:clamp(18px,1.5vw,21px);
  --fs-lead:clamp(17px,1.35vw,20px); --fs-body:16.5px;
  --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:28px;
  --sp-section:clamp(64px,8vw,120px);
  --container:1280px;
  --sh-glow:0 30px 80px -40px rgba(10,23,51,.5);
  --hdr:66px;
  --ease-out:cubic-bezier(.16,1,.3,1);
}
[data-theme="dark"]{
  --bg:#050d22; --surface:#0a1633; --surface-2:#0f1e42; --card:#0c193a;
  --border:rgba(238,243,255,.11); --border-2:rgba(238,243,255,.19);
  --ink:#eef3ff; --ink-2:#bac7e6; --muted:#93a3c8; --faint:#7382a6;
  --brand:#7ea6ff; --brand-strong:#a9c2ff;
  --glass:rgba(10,36,40,.7); --glass-border:rgba(238,243,255,.1);
  --brand-soft:rgba(126,166,255,.14);
}
body{font-family:var(--font-body);letter-spacing:0;font-stretch:100%}
h1,h2,h3,h4{font-family:var(--font-head);font-weight:780;letter-spacing:-.02em;font-stretch:108%}
h3{font-weight:700;letter-spacing:-.01em;font-stretch:100%}
::selection{background:var(--saffron);color:#0a1733}

/* grain: one fixed layer of fractal noise over the whole page (decorative, never interactive) */
body::before{content:none}
body::after{content:"";position:fixed;inset:0;z-index:900;pointer-events:none;opacity:.07;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E")}
[data-theme="dark"] body::after{mix-blend-mode:screen;opacity:.05;filter:invert(1)}

.container{max-width:var(--container)}
/* the second voice of a headline: same colour, narrower and lighter — a typographic change, not a colour accent */
.grad,.v2-grad{background:none;color:inherit;-webkit-text-fill-color:currentColor;font-weight:340;font-stretch:78%;letter-spacing:-.01em}
.section:not(.section--dark) .v2-grad--light{background:none}

/* ------------------------------------------------------------------ buttons */
.btn{border-radius:999px;font-family:var(--font-head);font-weight:700;letter-spacing:-.005em}
.btn--primary,.btn-primary{background:var(--grad-brand);background-size:160% 100%;border:0;color:#fff;
  box-shadow:0 14px 34px -14px rgba(110,155,255,.7),inset 0 1px 0 rgba(255,255,255,.25);transition:background-position .4s,transform .18s,box-shadow .2s}
.btn--primary:hover,.btn-primary:hover{background-position:100% 0;color:#fff;transform:translateY(-2px)}
.btn--light{background:#fff;color:#0a1733}
.btn--light:hover{color:#0a1733;box-shadow:0 18px 44px -16px rgba(255,255,255,.55)}
.btn--trial{background:linear-gradient(100deg,#f8330b,#ff7a59 45%,#ff6a3d);color:#fff;border:0;
  box-shadow:0 16px 40px -14px rgba(248,51,11,.65),inset 0 1px 0 rgba(255,255,255,.3)}
.btn--trial:hover{color:#fff;transform:translateY(-2px);box-shadow:0 20px 48px -14px rgba(248,51,11,.8)}

/* ------------------------------------------------------------------ header: ONE opaque sticky block (bar + section sub-bar) */
.v2nav{position:sticky;top:0;z-index:300;background:var(--bg);border-bottom:1px solid var(--border)}
[data-theme="dark"] .v2nav{background:#050d22}
.v2nav::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(47,99,240,.6),rgba(110,155,255,.6),rgba(248,51,11,.5),transparent)}
.v2nav__bar{max-width:1320px;margin:0 auto;display:flex;align-items:center;gap:10px;min-height:64px;padding:6px clamp(12px,2vw,24px)}
.v2nav__brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:800;font-size:19px;color:var(--ink);letter-spacing:-.02em;min-height:44px}
.v2nav__brand:hover{color:var(--ink)}
.v2nav__logo{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#fff;box-shadow:0 4px 14px -6px rgba(248,51,11,.6),inset 0 0 0 1px rgba(15,23,42,.06)}
.v2nav__logo img{width:28px;height:28px}
.v2nav__menu{display:flex;align-items:center;gap:4px;margin-left:auto}
.v2nav__links{display:flex;align-items:center;gap:2px}
.v2nav__links>a,.v2nav__trig{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border-radius:12px;border:0;background:none;
  font-family:var(--font-head);font-weight:600;font-size:14px;color:var(--ink-2);cursor:pointer;white-space:nowrap}
.v2nav__links>a:hover,.v2nav__trig:hover,.v2nav__trig[aria-expanded="true"],.v2nav__links>a[aria-current="page"],.v2nav__trig.is-current{color:var(--ink);background:var(--surface-2)}
.v2nav__trig .i{width:14px;height:14px;transition:transform .2s}
.v2nav__trig[aria-expanded="true"] .i{transform:rotate(180deg)}
.v2nav__group{position:relative}
.v2mega{position:absolute;top:calc(100% + 12px);left:50%;transform:translate(-50%,6px);min-width:560px;padding:14px;border-radius:22px;
  background:var(--card);border:1px solid var(--border);box-shadow:0 40px 90px -30px rgba(15,23,42,.45);
  display:grid;grid-template-columns:1.2fr 1fr;gap:10px;opacity:0;visibility:hidden;transition:opacity .18s,transform .18s,visibility .18s}
.v2nav__group.is-open .v2mega{opacity:1;visibility:visible;transform:translate(-50%,0)}
.v2mega__list{display:grid;gap:2px;align-content:start}
.v2mega__list a{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border-radius:14px;color:var(--ink)}
.v2mega__list a:hover,.v2mega__list a[aria-current="page"]{background:var(--surface)}
.v2mega__ic{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;flex:none;color:#fff;background:var(--grad-cool)}
.v2mega__ic .i{width:19px;height:19px}
.v2mega__list b{display:block;font-family:var(--font-head);font-size:14.5px;font-weight:700}
.v2mega__list small{display:block;font-size:13px;color:var(--muted);line-height:1.45;margin-top:2px}
.v2mega__feature{border-radius:16px;padding:18px;color:#fff;display:flex;flex-direction:column;gap:10px;justify-content:flex-end;min-height:220px;
  background:radial-gradient(120% 90% at 100% 0%,rgba(255,106,61,.55),transparent 55%),radial-gradient(120% 90% at 0% 100%,rgba(56,163,255,.45),transparent 55%),linear-gradient(160deg,#1b2a8a,#0a0f2e)}
.v2mega__feature b{font-family:var(--font-head);font-size:18px;line-height:1.2}
.v2mega__feature p{font-size:13.5px;color:rgba(255,255,255,.85);line-height:1.5}
.v2mega__feature a{color:#fff;font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:6px;min-height:40px}
.v2mega__tag{align-self:flex-start;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.18)}
.v2nav__actions{display:flex;align-items:center;gap:8px;margin-left:8px}
.v2theme{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--ink);cursor:pointer}
.v2theme .i{width:19px;height:19px}
.v2theme .v2theme__sun{display:none}
[data-theme="dark"] .v2theme .v2theme__sun{display:block}
[data-theme="dark"] .v2theme .v2theme__moon{display:none}
.v2nav__actions .btn{min-height:42px;padding:0 16px;font-size:14px}
.v2nav__ws .cta-short{display:none}
.v2nav__toggle{display:none;margin-left:auto;width:44px;height:44px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--ink);cursor:pointer}
.v2nav__toggle .i{width:22px;height:22px}

/* section sub-bar: lives INSIDE the header, so it can never overlap it; opaque; fades at the edges */
.v2sub{max-height:0;overflow:hidden;visibility:hidden;transition:max-height .25s,visibility .25s;border-top:1px solid transparent}
.v2nav.has-sub.is-scrolled .v2sub{max-height:60px;overflow:visible;visibility:visible;border-top-color:var(--border)}
.v2sub__in{max-width:1320px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:0 clamp(12px,2vw,24px);height:50px}
.v2sub__label{flex:none;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.v2sub__row{flex:1;min-width:0;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;padding:0 18px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent 100%)}
.v2sub__row::-webkit-scrollbar{display:none}
.v2sub__row a{flex:none;display:inline-flex;align-items:center;min-height:34px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.v2sub__row a:hover{color:var(--ink);background:var(--surface-2)}
.v2sub__row a.is-active{background:var(--ink);color:var(--bg)}
.v2sub__drop{display:none;position:relative;flex:1;min-width:0}
.v2sub__btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:40px;padding:0 12px;border-radius:12px;border:1px solid var(--border);
  background:var(--card);color:var(--ink);font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.v2sub__btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v2sub__btn .i{width:16px;height:16px;flex:none}
.v2sub__list{display:none}
.v2sub.is-open .v2sub__list{display:grid;position:absolute;left:0;right:0;top:calc(100% + 6px);max-height:60vh;overflow:auto;padding:6px;border-radius:14px;
  background:var(--card);border:1px solid var(--border);box-shadow:0 30px 60px -30px rgba(15,23,42,.5)}
.v2sub__list a{display:flex;align-items:center;min-height:42px;padding:0 12px;border-radius:10px;color:var(--ink-2);font-weight:600}
.v2sub__list a.is-active{background:var(--surface-2);color:var(--ink)}
.v2nav.is-open .v2sub{max-height:0;visibility:hidden}

/* legacy mockups carried from live: never clip their content */
.lwin,.dwin,.hx-browser,.hx-sf,.mk{container-type:inline-size}
.lwin-main{grid-template-columns:minmax(0,1fr) minmax(0,288px)}
.lwin *,.dwin *,.mk *{min-width:0}
@container (max-width:640px){
  .lwin-main{grid-template-columns:minmax(0,1fr)}
  .lwin-sub span:nth-child(n+4){display:none}
}
.l-bub,.l-act .t{overflow-wrap:anywhere}
.l-act{flex-wrap:wrap}

/* ------------------------------------------------------------------ hero (every page) */
.hero,.section--dark{background:var(--navy)}
.hero{padding-block:clamp(64px,9vw,128px) clamp(64px,8vw,112px)}
.hero::after{background:
  radial-gradient(46% 52% at 88% 0%,rgba(110,155,255,.42),transparent 64%),
  radial-gradient(44% 50% at 0% 100%,rgba(47,99,240,.42),transparent 62%),
  radial-gradient(30% 36% at 62% 58%,rgba(56,163,255,.16),transparent 66%),
  radial-gradient(26% 30% at 30% 8%,rgba(248,51,11,.16),transparent 70%) !important}
.hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:56px 56px;-webkit-mask-image:radial-gradient(110% 80% at 50% 0%,#000 20%,transparent 72%);mask-image:radial-gradient(110% 80% at 50% 0%,#000 20%,transparent 72%)}
.hero > .container,.hero > div:not(.hx-mesh):not(.v2orbs):not(.art-field):not(.ph-bg){position:relative;z-index:1}
.hero h1{font-size:var(--fs-h1);line-height:1.02;letter-spacing:-.03em;font-weight:800}
.hero .hero__sub,.hero .lead{color:#c3cbe6}
.v2orbs{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.v2orbs i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55}
.v2orbs i:nth-child(1){width:38vw;height:38vw;max-width:560px;max-height:560px;left:-10%;top:-20%;background:radial-gradient(circle,rgba(47,99,240,.75),transparent 70%)}
.v2orbs i:nth-child(2){width:34vw;height:34vw;max-width:500px;max-height:500px;right:-8%;top:0;background:radial-gradient(circle,rgba(110,155,255,.7),transparent 70%)}
.v2orbs i:nth-child(3){width:26vw;height:26vw;max-width:380px;max-height:380px;left:40%;bottom:-24%;background:radial-gradient(circle,rgba(248,51,11,.45),transparent 70%)}
.hero__eyebrow,.hero .eyebrow{border-radius:999px}
.section--dark{position:relative;overflow:hidden}
.section--dark::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(40% 50% at 100% 0%,rgba(110,155,255,.22),transparent 70%),radial-gradient(40% 50% at 0% 100%,rgba(47,99,240,.22),transparent 70%)}
.section--dark > .container{position:relative;z-index:1}
.section--tint{background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface) 60%,var(--bg)))}

/* hero promo strip (three linked tiles along the bottom of the home hero) */
.v2promo{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(40px,5vw,64px);
  border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(5,13,34,.55);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.v2promo a{display:flex;flex-direction:column;gap:8px;padding:22px 24px;color:#fff;min-height:128px;border-right:1px solid rgba(255,255,255,.1);transition:background .2s}
.v2promo a:last-child{border-right:0}
.v2promo a:hover{background:rgba(255,255,255,.06);color:#fff}
.v2promo b{font-family:var(--font-head);font-size:clamp(18px,1.7vw,22px);line-height:1.2;display:flex;justify-content:space-between;gap:10px}
.v2promo b .i{width:20px;height:20px;flex:none;transition:transform .2s}
.v2promo a:hover b .i{transform:translateX(4px)}
.v2promo span{font-size:14px;color:#aab6da}
.v2promo em{font-style:normal;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#ff9a80}

/* ------------------------------------------------------------------ section heads, eyebrows */
.section-head h2{font-size:var(--fs-h2);line-height:1.04}
.eyebrow{font-family:var(--font-head);font-weight:700;letter-spacing:.14em}
.eyebrow::before{background:var(--grad-brand) !important;height:3px !important;width:28px !important;border-radius:3px}

/* ------------------------------------------------------------------ cards: glass + gradient edge */
.card,.pain-card,.gov-card,.cmp-card,.fx-card,.ways-card,.connector-card,.pbox{border-radius:var(--r-lg)}
.card{background:color-mix(in srgb,var(--card) 88%,transparent);border-color:var(--border);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:relative}
.card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;opacity:0;transition:opacity .25s;
  background:var(--grad-brand);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.card:hover::before{opacity:1}
.card:hover{transform:translateY(-5px);box-shadow:0 30px 60px -34px rgba(47,99,240,.55)}
.icon-tile,.uc-badge{background:linear-gradient(135deg,rgba(47,99,240,.14),rgba(110,155,255,.18));color:var(--brand)}
[data-theme="dark"] .icon-tile,[data-theme="dark"] .uc-badge{color:#a9bcff}

/* ------------------------------------------------------------------ FAQ rows */
.faq{display:grid;gap:12px}
.faq details{border-radius:20px;border:1px solid var(--border);background:var(--card);overflow:hidden;transition:box-shadow .2s,border-color .2s}
.faq details[open]{border-color:color-mix(in srgb,var(--brand) 40%,var(--border));box-shadow:0 20px 50px -34px rgba(47,99,240,.6)}
.faq summary{padding:20px 24px;font-family:var(--font-head);font-weight:700;font-size:clamp(16px,1.3vw,19px);min-height:44px}
.faq details > :not(summary){padding-inline:24px}
.section--dark .faq details{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1)}

/* ------------------------------------------------------------------ tables */
.tbl-scroll{border-radius:20px;border:1px solid var(--border);overflow-x:auto;background:var(--card)}
.tbl-scroll table{border-collapse:collapse;width:100%}
.tbl-scroll th{font-family:var(--font-head)}

/* ------------------------------------------------------------------ CTA bands */
.cta-band{background:
  radial-gradient(60% 120% at 0% 0%,rgba(56,163,255,.55),transparent 60%),
  radial-gradient(60% 120% at 100% 100%,rgba(255,106,61,.55),transparent 60%),
  linear-gradient(120deg,#1b4dd8,#2f63f0 45%,#6e9bff);border-radius:var(--r-xl)}
.cta-band h2{font-size:clamp(30px,3.8vw,50px)}
.cta-band .btn--ghost{color:#fff;border-color:rgba(255,255,255,.6)}

/* full-bleed wave band */
.v2wave{position:relative;overflow:hidden;background:#061226;color:#fff;padding-block:clamp(72px,9vw,120px)}
.v2wave svg.v2wave__art{position:absolute;inset:0;width:100%;height:100%;opacity:.8}
.v2wave .container{position:relative;z-index:1;display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,72px);align-items:center}
.v2wave__badge{width:clamp(120px,14vw,180px);aspect-ratio:1;border-radius:28px;border:1px solid rgba(255,255,255,.2);display:grid;place-items:center;
  background:rgba(255,255,255,.04);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.v2wave__badge img{width:62%;height:auto;filter:drop-shadow(0 10px 30px rgba(248,51,11,.5))}
.v2wave h2{font-size:clamp(32px,4.4vw,58px);line-height:1.04;color:#fff;max-width:18ch}
.v2wave h2 .hl{color:#7ef0c4}
.v2wave p{margin-top:16px;font-size:var(--fs-lead);color:#c7d3ee;max-width:56ch}
.v2wave .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* ------------------------------------------------------------------ statement + principles */
.v2statement{font-family:var(--font-head);font-size:clamp(26px,3.2vw,44px);line-height:1.18;font-weight:400;letter-spacing:-.025em;color:var(--ink-2);max-width:40ch}
.v2statement b{font-weight:800;color:var(--ink)}
.v2principles{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,40px);margin-top:clamp(40px,5vw,64px)}
.v2principles div{padding-top:18px;position:relative}
.v2principles div::before{content:"";position:absolute;top:0;left:0;width:56px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--coral),var(--pink))}
.v2principles b{display:block;font-family:var(--font-head);font-size:clamp(18px,1.6vw,22px);color:var(--ink);line-height:1.25}
.v2principles span{display:block;margin-top:6px;font-size:16px;color:var(--muted);line-height:1.5}

/* ------------------------------------------------------------------ explorer (vertical tabs) */
.v2explorer{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:clamp(20px,3vw,40px);align-items:start}
.v2explorer__list{display:grid;border-top:1px solid var(--border)}
.v2explorer__tab{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;width:100%;min-height:64px;padding:16px 4px;border:0;border-bottom:1px solid var(--border);
  background:none;font-family:var(--font-head);font-weight:600;font-size:clamp(16px,1.4vw,20px);color:var(--muted);cursor:pointer;transition:color .2s}
.v2explorer__tab .i{width:18px;height:18px;opacity:0;transition:opacity .2s,transform .2s}
.v2explorer__tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--coral)}
.v2explorer__tab[aria-selected="true"] .i{opacity:1;transform:translateX(4px)}
.v2explorer__panel{border-radius:28px;background:var(--card);border:1px solid var(--border);padding:clamp(22px,3vw,36px);box-shadow:0 30px 70px -44px rgba(15,23,42,.5)}
.js .v2explorer__panel[hidden]{display:none}
.v2explorer__panel h3{font-size:clamp(22px,2.2vw,30px)}
.v2explorer__rows{display:grid;gap:14px;margin-top:18px}
.v2explorer__row{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:start}
.v2explorer__row .ic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#fff}
.v2explorer__row .ic .i{width:20px;height:20px}
.v2explorer__row .ic--easy{background:var(--grad-cool)}
.v2explorer__row .ic--risk{background:linear-gradient(135deg,#f8330b,#ff6a3d)}
.v2explorer__row .ic--ctrl{background:linear-gradient(135deg,#16a34a,#38a3ff)}
.v2explorer__row b{display:block;font-family:var(--font-head);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.v2explorer__row p{margin-top:3px;color:var(--ink-2);font-size:15.5px;line-height:1.55}
.v2explorer__caps{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
html:not(.js) .v2explorer{grid-template-columns:1fr}
html:not(.js) .v2explorer__list{display:none}
html:not(.js) .v2explorer__panels{display:grid;gap:16px}

/* before / after flow */
.v2ba{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,28px);margin-top:clamp(32px,4vw,52px)}
.v2ba__col{border-radius:26px;padding:clamp(20px,2.6vw,30px);border:1px solid var(--border)}
.v2ba__col--before{background:var(--surface)}
.v2ba__col--after{background:linear-gradient(160deg,rgba(47,99,240,.10),rgba(110,155,255,.10));border-color:color-mix(in srgb,var(--brand) 35%,var(--border))}
.v2ba__col h3{display:flex;align-items:center;gap:10px}
.v2ba__tag{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px}
.v2ba__col--before .v2ba__tag{background:rgba(148,163,184,.2);color:var(--muted)}
.v2ba__col--after .v2ba__tag{background:var(--grad-brand);color:#fff}
.v2ba__steps{display:grid;gap:0;margin-top:18px;counter-reset:ba}
.v2ba__steps li{position:relative;padding:12px 0 12px 44px;color:var(--ink-2);font-size:15.5px;line-height:1.5}
.v2ba__steps li::before{counter-increment:ba;content:counter(ba);position:absolute;left:0;top:10px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--font-head);font-weight:700;font-size:13px}
.v2ba__steps li:not(:last-child)::after{content:"";position:absolute;left:14px;top:42px;bottom:-8px;width:2px}
.v2ba__col--before .v2ba__steps li::before{background:var(--surface-2);color:var(--muted)}
.v2ba__col--before .v2ba__steps li::after{background:repeating-linear-gradient(180deg,var(--border-2) 0 4px,transparent 4px 8px)}
.v2ba__col--after .v2ba__steps li::before{background:var(--grad-brand);color:#fff}
.v2ba__col--after .v2ba__steps li::after{background:linear-gradient(180deg,var(--brand),var(--saffron))}

/* ------------------------------------------------------------------ resource cards */
.v2cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px)}
.v2cards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.v2cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
/* 3-up: six scenario cards in a 4-column grid left an unbalanced 4 + 2 on wide screens */
.v2cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1180px){.v2cards--4,.v2cards--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.v2cards--2,.v2cards--3,.v2cards--4{grid-template-columns:minmax(0,1fr)}}
.v2rcard .illus-label{align-self:flex-start;font-size:12px}
.v2-extimg{display:grid;place-items:center;width:100%;height:100%;font-family:var(--font-head);font-weight:800;font-size:12px;color:#fff;background:var(--lmc,#2f63f0);border-radius:8px}
.v2rcard{display:flex;flex-direction:column;border-radius:26px;overflow:hidden;background:var(--card);border:1px solid var(--border);color:var(--ink);
  transition:transform .25s,box-shadow .25s}
.v2rcard:hover{transform:translateY(-6px);box-shadow:0 34px 70px -40px rgba(47,99,240,.6);color:var(--ink)}
.v2rcard__art{aspect-ratio:16/9;display:block;background:#0a1733}
.v2rcard__art svg{width:100%;height:100%;display:block}
.v2rcard__body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.v2rcard__kind{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--coral)}
.v2rcard h3{font-size:clamp(18px,1.6vw,22px);line-height:1.25}
.v2rcard p{font-size:15px;color:var(--muted);line-height:1.55}
.v2rcard__more{margin-top:auto;padding-top:10px;display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--brand);min-height:40px}
[data-theme="dark"] .v2rcard__more{color:#9db4ff}

/* ------------------------------------------------------------------ high-def product mockups */
.mk{--mk-bg:#ffffff;--mk-surface:#f4f6fc;--mk-line:#e2e7f3;--mk-ink:#0a1733;--mk-muted:#5d6887;
  background:var(--mk-bg);color:var(--mk-ink);border-radius:22px;border:1px solid var(--mk-line);overflow:hidden;font-size:13.5px;line-height:1.45;text-align:left;
  box-shadow:0 50px 100px -50px rgba(10,23,51,.65),0 0 0 1px rgba(255,255,255,.04)}
[data-theme="dark"] .mk{--mk-bg:#0d1128;--mk-surface:#11173a;--mk-line:rgba(255,255,255,.09);--mk-ink:#eef2ff;--mk-muted:#9aa5c8}
.mk .i{width:15px;height:15px;flex:none}
.mk__bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:var(--mk-surface);border-bottom:1px solid var(--mk-line)}
.mk__bar i{width:11px;height:11px;border-radius:50%;background:#ff5f57;flex:none}
.mk__bar i:nth-child(2){background:#febc2e}.mk__bar i:nth-child(3){background:#28c840}
.mk__url{margin-left:10px;flex:1;min-width:0;display:flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:var(--mk-bg);border:1px solid var(--mk-line);color:var(--mk-muted);font-size:12.5px;white-space:normal;overflow-wrap:anywhere;line-height:1.35}
.mk__url .i{color:#16a34a;width:12px;height:12px}
.mk__body{display:grid;grid-template-columns:200px minmax(0,1fr)}
.mk__side{background:var(--mk-surface);border-right:1px solid var(--mk-line);padding:14px 10px;display:flex;flex-direction:column;gap:4px}
.mk__side span{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;color:var(--mk-muted);font-weight:600;font-size:13px}
.mk__side span.on{background:rgba(47,99,240,.12);color:#2f63f0}
[data-theme="dark"] .mk__side span.on{color:#9db4ff}
.mk__side small{margin:10px 10px 2px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mk-muted)}
.mk__main{padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0}
.mk__head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mk__head b{font-family:var(--font-head);font-size:15px}
.mk__chip{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600;background:var(--mk-surface);border:1px solid var(--mk-line);color:var(--mk-muted)}
.mk__chip--ok{background:rgba(22,163,74,.12);border-color:rgba(22,163,74,.3);color:#15803d}
[data-theme="dark"] .mk__chip--ok{color:#6ee7b0}
.mk__chip--ea{background:rgba(248,51,11,.12);border-color:rgba(248,51,11,.35);color:#c2410c}
[data-theme="dark"] .mk__chip--ea{color:#ff9a80}
.mk__chip--brand{background:rgba(47,99,240,.12);border-color:rgba(47,99,240,.3);color:#1b4dd8}
[data-theme="dark"] .mk__chip--brand{color:#9db4ff}
.mk__msg{max-width:88%;padding:10px 13px;border-radius:16px}
.mk__msg--me{align-self:flex-end;background:linear-gradient(135deg,#2f63f0,#6d5cf6);color:#fff;border-bottom-right-radius:5px}
.mk__msg--ai{align-self:flex-start;background:var(--mk-surface);border:1px solid var(--mk-line);border-bottom-left-radius:5px}
.mk__who{display:flex;align-items:center;gap:7px;font-family:var(--font-head);font-weight:700;font-size:12.5px;color:#2f63f0;margin-bottom:4px}
[data-theme="dark"] .mk__who{color:#9db4ff}
.mk__who img{width:18px;height:18px;border-radius:5px;background:#fff}
.mk__cites{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.mk__cite{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;background:rgba(47,99,240,.1);color:#1b4dd8;font-size:12px;font-weight:600}
[data-theme="dark"] .mk__cite{color:#9db4ff}
.mk__cite sup{font-size:10px;margin-left:1px}
.mk__approve{border-radius:16px;border:1px solid rgba(47,99,240,.35);padding:12px 14px;background:linear-gradient(180deg,rgba(47,99,240,.08),transparent)}
.mk__approve-hd{display:flex;align-items:center;gap:7px;font-family:var(--font-head);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#2f63f0}
[data-theme="dark"] .mk__approve-hd{color:#9db4ff}
.mk__diff{display:grid;gap:5px;margin-top:9px;font-family:var(--font-mono);font-size:12.5px}
.mk__diff span{display:block;padding:4px 8px;border-radius:7px}
.mk__diff .del{background:rgba(225,29,72,.1);color:#be123c;text-decoration:line-through}
.mk__diff .add{background:rgba(22,163,74,.12);color:#15803d}
[data-theme="dark"] .mk__diff .del{color:#fda4af}[data-theme="dark"] .mk__diff .add{color:#86efac}
.mk__btns{display:flex;gap:8px;margin-top:11px;flex-wrap:wrap}
.mk__b{display:inline-flex;align-items:center;gap:5px;padding:6px 13px;border-radius:999px;font-weight:700;font-size:12.5px;border:1px solid var(--mk-line);background:var(--mk-bg);color:var(--mk-ink)}
.mk__b--ok{background:#16a34a;border-color:#16a34a;color:#fff}
.mk__b--brand{background:#2f63f0;border-color:#2f63f0;color:#fff}
.mk__input{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;border:1px solid var(--mk-line);color:var(--mk-muted);background:var(--mk-bg)}
.mk__input > span:first-child{flex:1;min-width:0}
.mk__send{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#2f63f0,#6e9bff);color:#fff}
.mk__dots{display:inline-flex;gap:4px;padding:9px 12px;border-radius:14px;background:var(--mk-surface);border:1px solid var(--mk-line);align-self:flex-start}
.mk__dots i{width:6px;height:6px;border-radius:50%;background:var(--mk-muted)}

/* connector grid mockup */
.mk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px}
.mk-app{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:14px;background:var(--mk-surface);border:1px solid var(--mk-line)}
.mk-app__top{display:flex;align-items:center;justify-content:space-between;gap:6px}
.mk-mono{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:#fff;font-family:var(--font-head);font-weight:800;font-size:13px}
.mk-app b{font-family:var(--font-head);font-size:13px}
.mk-app small{font-size:12px;color:var(--mk-muted)}
.mk-dot{width:9px;height:9px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.18)}
.mk-dot--off{background:var(--mk-muted);box-shadow:none;opacity:.5}

/* salesforce record mockup */
.mk-sf__top{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#032d60;color:#fff}
.mk-sf__waffle{display:grid;grid-template-columns:repeat(3,4px);gap:2px}
.mk-sf__waffle i{width:4px;height:4px;border-radius:50%;background:#fff}
.mk-sf__app{font-family:var(--font-head);font-weight:700}
.mk-sf__search{margin-left:auto;display:flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.14);font-size:12.5px}
.mk-sf__rec{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--mk-line)}
.mk-sf__ava{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#ff9a3c;color:#fff}
.mk-sf__rec small{display:block;color:var(--mk-muted);font-size:12px}
.mk-sf__rec b{font-family:var(--font-head);font-size:17px}
.mk-sf__path{display:flex;gap:3px;padding:12px 16px 0}
.mk-sf__path span{flex:1;min-width:0;text-align:center;padding:6px 4px;font-size:12px;font-weight:700;color:var(--mk-muted);background:var(--mk-surface);
  clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%,8% 50%);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-sf__path span.done{background:rgba(22,163,74,.16);color:#15803d}
[data-theme="dark"] .mk-sf__path span.done{color:#86efac}
.mk-sf__path span.on{background:#0176d3;color:#fff}
.mk-sf__body{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);gap:14px;padding:14px 16px 16px}
.mk-sf__fields{display:grid;gap:9px;align-content:start;margin:0}
.mk-sf__fields div{padding-bottom:7px;border-bottom:1px solid var(--mk-line)}
.mk-sf__fields dt{font-size:12px;color:var(--mk-muted)}
.mk-sf__fields dd{margin:2px 0 0;font-weight:700}
.mk-changed{padding:1px 4px;border-radius:5px;background:rgba(22,163,74,.18);box-shadow:inset 0 -2px 0 #16a34a}
.mk-crew{border-radius:18px;padding:14px;color:#fff;
  background:radial-gradient(120% 90% at 100% 0%,rgba(255,106,61,.45),transparent 55%),radial-gradient(120% 90% at 0% 100%,rgba(47,99,240,.55),transparent 60%),linear-gradient(160deg,#141c52,#080b24);
  border:1px solid rgba(110,155,255,.4);box-shadow:0 20px 50px -24px rgba(110,155,255,.8)}
.mk-crew__hd{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mk-crew__hd b{font-family:var(--font-head);font-size:14px}
.mk-crew__ic{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:linear-gradient(135deg,#f8330b,#ff6a3d)}
.mk-crew__ea{font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px;background:rgba(255,255,255,.16)}
.mk-crew__status{display:flex;align-items:center;gap:8px;margin:10px 0 8px;font-size:12.5px;color:#c7d0f0}
.mk-live{width:9px;height:9px;border-radius:50%;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.6)}
.mk-crew__row{display:flex;align-items:center;gap:8px;padding:9px 0;border-top:1px solid rgba(255,255,255,.1);font-size:12.5px;flex-wrap:wrap}
.mk-crew__row .i{color:#6ee7b0}
.mk-crew__row--ask .i{color:#c7d6ff}
.mk-crew__row em{margin-left:auto;font-style:normal;color:#c7d6ff;text-decoration:underline;text-underline-offset:3px}
.mk-crew__row .mk__b{margin-left:auto;padding:4px 11px}
.mk-crew__bars{display:flex;align-items:flex-end;gap:5px;height:42px;margin-top:8px}
.mk-crew__bars i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(180deg,#6e9bff,#2f63f0)}

/* audit trail mockup */
.mk-audit{padding:16px;display:grid;gap:0}
.mk-audit__row{display:grid;grid-template-columns:22px 1fr auto;gap:12px;align-items:start;padding:11px 0;position:relative}
.mk-audit__row::before{content:"";position:absolute;left:10px;top:30px;bottom:-12px;width:2px;background:var(--mk-line)}
.mk-audit__row:last-child::before{display:none}
.mk-audit__dot{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff}
.mk-audit__dot .i{width:12px;height:12px}
.mk-audit__row b{display:block;font-family:var(--font-head);font-size:13.5px}
.mk-audit__row small{display:block;color:var(--mk-muted);font-size:12px;margin-top:2px}
.mk-audit__row code{font-family:var(--font-mono);font-size:12px;color:var(--mk-muted);white-space:nowrap}
.mk-mask{font-family:var(--font-mono);font-size:12px;padding:1px 6px;border-radius:5px;background:rgba(110,155,255,.16);color:#7c3aed}
[data-theme="dark"] .mk-mask{color:#c4b5fd}

/* engine / model picker mockup */
.mk-models{padding:16px;display:grid;gap:9px}
.mk-model{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid var(--mk-line);background:var(--mk-surface)}
.mk-model.on{border-color:#2f63f0;background:rgba(47,99,240,.1);box-shadow:0 0 0 3px rgba(47,99,240,.14)}
.mk-model b{display:block;font-family:var(--font-head);font-size:13.5px}
.mk-model small{display:block;color:var(--mk-muted);font-size:12px}
.mk-meter{display:flex;gap:3px}
.mk-meter i{width:6px;height:14px;border-radius:2px;background:var(--mk-line)}
.mk-meter i.f{background:linear-gradient(180deg,#38a3ff,#2f63f0)}
.mk-route{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border-radius:14px;border:1px dashed var(--mk-line);font-size:12.5px;color:var(--mk-muted)}

/* developer studio mockup */
.mk-dev{display:grid;grid-template-columns:170px minmax(0,1fr) 230px;min-height:320px}
.mk-dev__tree{background:var(--mk-surface);border-right:1px solid var(--mk-line);padding:12px 8px;font-family:var(--font-mono);font-size:12px;display:flex;flex-direction:column;gap:3px}
.mk-dev__tree span{padding:4px 8px;border-radius:6px;color:var(--mk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-dev__tree span.on{background:rgba(47,99,240,.14);color:#2f63f0}
[data-theme="dark"] .mk-dev__tree span.on{color:#9db4ff}
.mk-dev__code{padding:12px 0;font-family:var(--font-mono);font-size:12.5px;line-height:1.7;min-width:0;overflow:hidden}
.mk-dev__code div{display:grid;grid-template-columns:38px 1fr;white-space:pre;overflow:hidden}
.mk-dev__code div span:first-child{color:var(--mk-muted);text-align:right;padding-right:12px;opacity:.7}
.mk-dev__code .rm{background:rgba(225,29,72,.1)}
.mk-dev__code .ad{background:rgba(22,163,74,.12)}
.mk-dev__code .k{color:#6e9bff}.mk-dev__code .s{color:#0891b2}.mk-dev__code .c{color:var(--mk-muted)}
.mk-dev__chat{border-left:1px solid var(--mk-line);padding:12px;display:flex;flex-direction:column;gap:9px;background:var(--mk-surface)}
.mk-dev__term{grid-column:1 / -1;border-top:1px solid var(--mk-line);background:#0a1733;color:#b4f5c8;font-family:var(--font-mono);font-size:12px;padding:10px 14px;line-height:1.6}

/* ------------------------------------------------------------------ showcase layout */
.v2show{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,4vw,64px);align-items:center}
.v2show--flip{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.v2show--flip .v2show__copy{order:2}
.v2show__copy h2{font-size:clamp(28px,3.4vw,46px);line-height:1.06}
.v2show__copy p{margin-top:14px;font-size:var(--fs-lead);color:var(--muted)}
.section--dark .v2show__copy p{color:#b9c3e3}
.v2show__list{display:grid;gap:10px;margin-top:22px}
.v2show__list li{display:flex;gap:10px;align-items:flex-start;color:var(--ink-2)}
.section--dark .v2show__list li{color:#d3dbf3}
.v2show__list .i{width:20px;height:20px;color:var(--lime);margin-top:2px;stroke-width:2.4}
.v2show__visual{position:relative}
.v2show__visual::before{content:"";position:absolute;inset:8% -4% -6% 8%;border-radius:40px;z-index:-1;filter:blur(40px);opacity:.55;background:var(--grad-brand)}
.v2show__stack{display:grid;gap:18px}

/* ------------------------------------------------------------------ animated flow diagram */
.v2flow{border-radius:32px;border:1px solid var(--border);background:var(--card);padding:clamp(16px,2.4vw,28px);overflow:hidden}
.section--dark .v2flow{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.1)}
.section--dark .v2flow svg{color:#eef2ff !important}
.section--dark .v2flow__legend{color:#b9c3e3}
.v2flow svg{width:100%;height:auto;display:block}
.v2flow .fl-path{fill:none;stroke-width:2.4;stroke-linecap:round}
.v2flow .fl-pulse{fill:none;stroke-width:3.2;stroke-linecap:round;stroke-dasharray:14 220}
.v2flow text{font-family:var(--font-head);font-weight:700}
.v2flow .fl-sub{font-family:var(--font-body);font-weight:500}
.v2flow__legend{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:14px;font-size:14px;color:var(--muted);justify-content:center}
.v2flow__legend span{display:inline-flex;align-items:center;gap:8px}
.v2flow__legend i{width:22px;height:3px;border-radius:3px}
.v2flow__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.v2flow__steps{display:none;counter-reset:fs;margin:16px 0 0;padding:0;gap:8px}
.v2flow__steps li{list-style:none;position:relative;padding:10px 12px 10px 46px;border-radius:14px;background:var(--surface);color:var(--ink-2);font-size:15px;line-height:1.45}
.section--dark .v2flow__steps li{background:rgba(255,255,255,.05);color:#d3dbf3}
.v2flow__steps li::before{counter-increment:fs;content:counter(fs);position:absolute;left:10px;top:9px;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--grad-brand);color:#fff;font-weight:800;font-size:13px}

/* ------------------------------------------------------------------ use cases */
.v2filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:26px}
.v2filters__lbl{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.v2chip{min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--border-2);background:var(--card);color:var(--ink-2);font-weight:600;font-size:14px;cursor:pointer;font-family:inherit}
.v2chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.v2uc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,24px)}
.v2uc-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1040px){.v2uc-grid--3{grid-template-columns:minmax(0,1fr)}}
.v2uc{border-radius:28px;background:var(--card);border:1px solid var(--border);overflow:hidden;display:flex;flex-direction:column}
.v2uc[hidden]{display:none}
.v2uc__art{display:block;background:#0a1733;aspect-ratio:21/8}
.v2uc__art svg{width:100%;height:100%;display:block}
.v2uc__body{padding:22px 24px 26px;display:grid;gap:14px}
.v2uc__meta{display:flex;flex-wrap:wrap;gap:6px}
.v2uc__meta span{font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--surface);color:var(--ink-2);border:1px solid var(--border)}
.v2uc__meta .ed{background:rgba(47,99,240,.12);color:var(--brand);border-color:transparent}
[data-theme="dark"] .v2uc__meta .ed{color:#9db4ff}
.v2uc__meta .ea{background:rgba(248,51,11,.12);color:#c2410c;border-color:transparent}
[data-theme="dark"] .v2uc__meta .ea{color:#ff9a80}
.v2uc h3{font-size:clamp(20px,1.9vw,26px);line-height:1.2}
.v2uc dl{display:grid;gap:10px;margin:0}
.v2uc dt{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.v2uc dd{margin:3px 0 0;color:var(--ink-2);font-size:15.5px;line-height:1.55}
.v2uc__caps{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.v2uc__caps span{font-size:12.5px;padding:4px 10px;border-radius:8px;background:var(--surface);color:var(--ink-2)}
.v2uc__helps{border-radius:18px;padding:14px 16px;background:linear-gradient(160deg,rgba(47,99,240,.08),rgba(110,155,255,.08));border:1px solid color-mix(in srgb,var(--brand) 25%,var(--border))}
.v2uc__helps h4{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);font-weight:800}
[data-theme="dark"] .v2uc__helps h4{color:#9db4ff}
.v2uc__helps ul{display:grid;gap:6px;margin-top:8px}
.v2uc__helps li{font-size:15px;color:var(--ink-2);line-height:1.5}
.v2uc__helps li b{color:var(--ink)}
.v2empty{padding:30px;border-radius:20px;border:1px dashed var(--border-2);text-align:center;color:var(--muted)}

/* ------------------------------------------------------------------ scenarios */
.illus-label{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-size:13px;font-weight:700;
  background:rgba(245,158,11,.14);color:#92400e;border:1px solid rgba(245,158,11,.4)}
[data-theme="dark"] .illus-label{color:#fcd34d}
.illus-label .i{width:15px;height:15px}
.section--dark .illus-label{color:#fcd34d}
.v2scen{border-radius:32px;background:var(--card);border:1px solid var(--border);padding:clamp(22px,3vw,40px);display:grid;gap:22px;scroll-margin-top:100px}
.v2scen + .v2scen{margin-top:clamp(24px,3vw,36px)}
.v2scen__head{display:grid;gap:12px;justify-items:start}
.v2scen__head h3{font-size:clamp(24px,2.6vw,36px);line-height:1.12}
.v2scen__who{font-size:15px;color:var(--muted)}
/* industry-descriptor format: the industry leads, the photo carries the subject */
.v2scen__ind{font-family:var(--font-head);font-size:clamp(15px,1.5vw,18px);font-weight:700;color:var(--brand);letter-spacing:-.01em}
[data-theme="dark"] .v2scen__ind{color:#9db4ff}
.v2scen__photo{margin:calc(clamp(22px,3vw,40px) * -1) calc(clamp(22px,3vw,40px) * -1) 0;border-radius:32px 32px 0 0;overflow:hidden;position:relative}
/* .ph img{height:auto} is declared later in this file at the same specificity, so it would win and
   the banner would render at its natural ~800px. The extra class keeps the clamp. */
.v2scen__photo .ph img{width:100%;height:clamp(150px,22vw,260px);object-fit:cover}
.v2scen__photo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(47,99,240,.34),rgba(10,23,51,.28) 58%,rgba(5,13,34,.5));mix-blend-mode:multiply}
.v2rcard__ed{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);margin-top:2px}
.v2rcard__ed .i{width:14px;height:14px;color:var(--brand)}
.v2scen__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(16px,2.4vw,28px)}
.v2scen__block h4{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--coral);font-weight:800}
.v2scen__block p,.v2scen__block li{color:var(--ink-2);font-size:15.5px;line-height:1.6}
.v2scen__block p{margin-top:6px}
.v2scen__block ul{display:grid;gap:6px;margin-top:8px;padding-left:18px;list-style:disc}
.v2scen__steps{counter-reset:st;display:grid;gap:10px;margin-top:10px}
.v2scen__steps li{position:relative;padding:12px 14px 12px 52px;border-radius:14px;background:var(--surface);list-style:none}
.v2scen__steps li::before{counter-increment:st;content:counter(st);position:absolute;left:12px;top:11px;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;
  background:var(--grad-brand);color:#fff;font-weight:800;font-size:13px}
.v2scen__controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-top:10px}
.v2scen__controls div{border-radius:14px;padding:12px;border:1px solid var(--border);background:var(--surface)}
.v2scen__controls b{display:flex;align-items:center;gap:7px;font-family:var(--font-head);font-size:14px}
.v2scen__controls b .i{width:16px;height:16px;color:var(--brand)}
.v2scen__controls span{display:block;font-size:13.5px;color:var(--muted);margin-top:4px;line-height:1.5}

/* ------------------------------------------------------------------ white papers */
.wp-hero .wp-meta{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:18px;color:#b9c3e3;font-size:14px}
.wp-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:start}
.wp-toc{position:sticky;top:100px;border-radius:20px;border:1px solid var(--border);background:var(--card);padding:18px}
.wp-toc strong{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.wp-toc ol{display:block;padding-left:20px;list-style:decimal;color:var(--muted);font-size:14px}
.wp-toc li{margin:4px 0;line-height:1.4}
.wp-toc a{display:inline;color:var(--ink-2);font-weight:600}
.wp-toc a:hover{color:var(--brand)}
.wp-actions{display:grid;gap:8px;margin-top:16px}
/* download list on /white-papers */
.wp-dl{display:grid;gap:10px;margin-top:8px}
.wp-dl li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:14px;
  padding:14px 16px;border-radius:16px;border:1px solid var(--border);background:var(--card)}
.wp-dl__t{font-family:var(--font-head);font-weight:700;font-size:15.5px;line-height:1.35}
.wp-dl__m{font-size:13px;color:var(--muted);white-space:nowrap}
@media (max-width:700px){.wp-dl li{grid-template-columns:1fr;gap:8px;justify-items:start}}
.wp-body{max-width:760px}
.wp-body h2{font-size:clamp(26px,2.6vw,36px);margin-top:48px;scroll-margin-top:100px;line-height:1.12}
.wp-body h2:first-child{margin-top:0}
.wp-body h3{font-size:20px;margin-top:28px}
.wp-body p,.wp-body li{font-size:17.5px;line-height:1.75;color:var(--ink-2)}
.wp-body p{margin-top:16px}
.wp-body ul,.wp-body ol{margin-top:14px;padding-left:22px;display:grid;gap:8px}
.wp-body ul{list-style:disc}.wp-body ol{list-style:decimal}
.wp-body strong{color:var(--ink)}
.wp-body a{text-decoration:underline;text-underline-offset:3px}
.wp-body figure{margin:28px 0;border-radius:24px;border:1px solid var(--border);background:var(--card);padding:18px}
.wp-body figure svg{width:100%;height:auto;display:block}
.wp-body figcaption{margin-top:10px;font-size:14px;color:var(--muted)}
.wp-body table{width:100%;border-collapse:collapse;font-size:15px}
.wp-body th,.wp-body td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.wp-body th{font-family:var(--font-head);background:var(--surface)}
.wp-callout{margin-top:22px;border-radius:18px;padding:16px 18px;border-left:4px solid var(--brand);background:var(--surface)}
.wp-callout p{margin-top:0}
.wp-sources{margin-top:40px;padding-top:20px;border-top:1px solid var(--border)}
.wp-sources li{font-size:15px}

/* ------------------------------------------------------------------ legal pages */
.legal .legal__layout{gap:clamp(28px,4vw,64px)}
.legal__toc{border-radius:20px;border:1px solid var(--border);background:var(--card);padding:18px}

/* model wall: vendor logos shown as local glyphs (no external image hosts) */
.logo-mark .lm--glyph{background:var(--lmc);width:28px;height:28px}
.logo-mark .lm--glyph .lm-fb{display:block;width:18px;height:18px;color:#fff}
.prov-mark--glyph{background:var(--lmc,#2f63f0)}
.prov-mark--glyph .lm-fb,.prov-mark--glyph svg{display:block;color:#fff}

/* ------------------------------------------------------------------ footer */
.v2foot{position:relative;overflow:hidden;background:#050d22;color:#aab6da;padding-top:clamp(56px,7vw,96px);margin-top:0}
.v2foot::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(40% 60% at 0% 0%,rgba(47,99,240,.25),transparent 70%),radial-gradient(40% 60% at 100% 100%,rgba(248,51,11,.14),transparent 70%)}
.v2foot > *{position:relative}
.v2foot__cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding-bottom:clamp(36px,5vw,56px);border-bottom:1px solid rgba(255,255,255,.1)}
.v2foot__cta h2{color:#fff;font-size:clamp(28px,3.6vw,48px);line-height:1.05;max-width:18ch}
.v2foot__cta .btns{display:flex;flex-wrap:wrap;gap:10px}
.v2foot__grid{display:grid;grid-template-columns:1.6fr repeat(5,1fr);gap:32px;padding-block:clamp(36px,5vw,56px)}
.v2foot__logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:800;font-size:20px;color:#fff}
.v2foot__logo img{width:34px;height:34px;border-radius:10px;background:#fff;padding:3px}
.v2foot__tag{margin-top:14px;font-size:14.5px;line-height:1.6}
.v2foot__mail{display:inline-flex;margin-top:14px;font-weight:700;color:#9db4ff;min-height:40px;align-items:center}
.v2foot__by{margin-top:4px;font-size:14px}
.v2foot__by a{color:#9db4ff;font-weight:700}
.v2foot__col h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#fff;margin-bottom:10px;font-weight:700}
.v2foot__col a{display:flex;align-items:center;min-height:36px;font-size:14.5px;color:#aab6da}
.v2foot__col a:hover,.v2foot__legal a:hover,.v2foot__mail:hover{color:#fff}
.v2foot__bar{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;padding-block:22px 34px;border-top:1px solid rgba(255,255,255,.1);font-size:13.5px}
.v2foot__legal{display:flex;flex-wrap:wrap;gap:4px 16px}
.v2foot__legal a{color:#aab6da;display:inline-flex;align-items:center;min-height:36px}
.v2foot__ind{flex-basis:100%;color:#8390b8;font-size:13px;line-height:1.6}
.v2foot__note{flex-basis:100%;color:#8390b8;font-size:13px}

/* ------------------------------------------------------------------ motion */
@media (prefers-reduced-motion:no-preference){
  .v2orbs i{animation:v2drift 20s ease-in-out infinite alternate}
  .v2orbs i:nth-child(2){animation-duration:26s;animation-direction:alternate-reverse}
  .v2orbs i:nth-child(3){animation-duration:30s}
  .v2flow .fl-pulse{animation:v2dash 4.2s linear infinite}
  .v2flow .fl-pulse.d2{animation-delay:1.2s}.v2flow .fl-pulse.d3{animation-delay:2.4s}
  .v2flow .fl-node{animation:v2glow 3.4s ease-in-out infinite alternate}
  .mk-live{animation:v2ping 2s infinite}
  .mk__dots i{animation:v2blink 1.2s infinite}.mk__dots i:nth-child(2){animation-delay:.2s}.mk__dots i:nth-child(3){animation-delay:.4s}
  .mk-crew__bars i{animation:v2bar 2.8s ease-in-out infinite alternate;transform-origin:bottom}
  .mk-crew__bars i:nth-child(2n){animation-delay:.5s}.mk-crew__bars i:nth-child(3n){animation-delay:1s}
  .v2wave__line{animation:v2wave 12s ease-in-out infinite alternate}
  .v2wave__line:nth-child(2n){animation-duration:16s}
  html.js [data-reveal="zoom"]{transform:scale(.96)}
}
@keyframes v2drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(5%,7%,0) scale(1.15)}}
@keyframes v2dash{from{stroke-dashoffset:234}to{stroke-dashoffset:0}}
@keyframes v2glow{from{opacity:.75}to{opacity:1}}
@keyframes v2ping{0%{box-shadow:0 0 0 0 rgba(52,211,153,.6)}70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
@keyframes v2blink{0%,80%,100%{opacity:.3}40%{opacity:1}}
@keyframes v2bar{from{transform:scaleY(.55)}to{transform:scaleY(1)}}
@keyframes v2wave{from{transform:translateX(0)}to{transform:translateX(-6%)}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  html.js [data-reveal]{opacity:1 !important;transform:none !important}
}

/* ------------------------------------------------------------------ responsive */
@media (max-width:1180px){
  .v2nav__links>a,.v2nav__trig{padding:0 9px;font-size:13.5px}
  .v2nav__ws .cta-full{display:none}.v2nav__ws .cta-short{display:inline}
  .v2foot__grid{grid-template-columns:1fr 1fr 1fr}
  .v2foot__brand{grid-column:1 / -1}
}
@media (max-width:1040px){
  .v2nav__toggle{display:grid;place-items:center}
  .v2nav__menu{position:fixed;inset:72px 8px auto 8px;max-height:calc(100vh - 88px);overflow-y:auto;flex-direction:column;align-items:stretch;gap:10px;padding:14px;
    border-radius:22px;background:var(--card);border:1px solid var(--border);box-shadow:0 40px 90px -30px rgba(15,23,42,.5);
    opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility .2s}
  .v2nav.is-open .v2nav__menu{opacity:1;visibility:visible;transform:none}
  .v2nav__links{flex-direction:column;align-items:stretch}
  .v2nav__links>a,.v2nav__trig{min-height:48px;font-size:16px;justify-content:space-between;padding:0 12px}
  .v2mega{position:static;transform:none;min-width:0;display:none;grid-template-columns:1fr;box-shadow:none;border:0;padding:4px 0 8px;opacity:1;visibility:visible;background:transparent}
  .v2nav__group.is-open .v2mega{display:grid;transform:none}
  .v2mega__feature{min-height:0}
  .v2nav__actions{margin:6px 0 0;flex-wrap:wrap}
  .v2nav__actions .btn{flex:1 1 auto;justify-content:center;min-height:46px}
  .v2nav__ws .cta-full{display:inline}.v2nav__ws .cta-short{display:none}
  .v2show,.v2show--flip,.v2explorer,.v2ba,.v2scen__grid,.wp-layout{grid-template-columns:minmax(0,1fr)}
  .v2show--flip .v2show__copy{order:0}
  .v2cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v2principles{grid-template-columns:repeat(2,1fr)}
  .v2uc-grid{grid-template-columns:minmax(0,1fr)}
  .mk-dev{grid-template-columns:150px minmax(0,1fr)}
  .mk-dev__chat{display:none}
  .wp-toc{position:static}
  .v2wave .container{grid-template-columns:1fr}
}
@media (max-width:640px){
  .v2promo{grid-template-columns:1fr}
  .v2promo a{border-right:0;border-bottom:1px solid rgba(255,255,255,.1);min-height:0}
  .v2promo a:last-child{border-bottom:0}
  .v2cards,.v2principles{grid-template-columns:minmax(0,1fr)}
  .mk__body{grid-template-columns:minmax(0,1fr)}
  .mk__side{display:none}
  .mk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mk-sf__body{grid-template-columns:minmax(0,1fr)}
  .mk-sf__search{display:none}
  .mk-dev{grid-template-columns:minmax(0,1fr)}
  .mk-dev__tree{display:none}
  .mk-dev__code div{grid-template-columns:28px 1fr}
  .mk-audit__row{grid-template-columns:22px 1fr}
  .mk-audit__row code{grid-column:2}
  .v2foot__grid{grid-template-columns:1fr 1fr}
  .v2foot__cta .btns .btn{flex:1 1 100%;justify-content:center}
  .v2sub__row{display:none}
  .v2sub__label{display:none}
  .v2sub__drop{display:block}
  .v2flow__scroll svg{min-width:760px}
  .v2flow__steps{display:grid}
  .v2wave__badge{width:110px}
  .v2filters{gap:6px}
  .hero h1{font-size:clamp(34px,10vw,46px)}
}

/* ------------------------------------------------------------------ print (white papers and legal) */
@media print{
  .v2nav,.v2foot,.v2sub,.wp-actions,.aqc-fab,.skip,.v2orbs,.hx-mesh{display:none !important}
  body::before{display:none}
  body{background:#fff;color:#000;font-size:11pt}
  .hero,.section--dark,.wp-hero{background:#fff !important;color:#000 !important;padding:0 0 12pt !important}
  .hero::before,.hero::after,.section--dark::after{display:none !important}
  .hero h1,.hero p,.wp-hero .wp-meta{color:#000 !important}
  .grad,.v2-grad{color:#000 !important;-webkit-text-fill-color:#000 !important;background:none !important}
  .wp-layout{grid-template-columns:1fr}
  .wp-toc{position:static;border:1px solid #ccc}
  .wp-body{max-width:none}
  .wp-body p,.wp-body li{font-size:11pt;line-height:1.5;color:#000}
  .wp-body figure{break-inside:avoid;border:1px solid #ccc}
  .wp-body h2{break-after:avoid}
  .wp-body a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#444}
  html.js [data-reveal]{opacity:1 !important;transform:none !important}
  /* the PDF build renders these pages: the hero photo, the "keep reading" rail and the motion
     pause control are screen devices — in print they only cost ink. The paper's own hero already
     reads as the cover page, so there is no second title block. */
  .ph-bg,#more-papers,.art-toggle{display:none !important}
  .wp-body ul,.wp-body ol{break-inside:avoid-page}
}

/* ============================================================================
   STAGE 2 — "Torque" art direction. Everything below overrides the stage-1 look.
   One memorable thing: the live torque field + the giant kinetic headline. Everything
   around it is flat, colour-blocked and quiet.
   ========================================================================== */

/* base.css sets html,body{overflow-x:hidden} on small screens, which turns <body> into a scroll
   container that never scrolls, so every position:sticky element (header, story stage) stops sticking.
   clip hides the same overflow without creating a scroll container. */
html,body{overflow-x:clip}

/* ------------------------------------------------------------------ reveal: no per-section fade-and-slide */
html.js [data-reveal],html.js [data-reveal].is-visible{opacity:1;transform:none;transition:none}

/* ------------------------------------------------------------------ buttons + micro-interactions */
.btn{border-radius:10px;font-family:var(--font-head);font-weight:700;font-stretch:104%;letter-spacing:0;
  transform:translate3d(var(--mx,0px),var(--my,0px),0);transition:transform .35s var(--ease-out),background-color .2s,box-shadow .3s var(--ease-out),color .2s,border-color .2s}
.btn .i{transition:transform .35s var(--ease-out)}
.btn:hover .i{transform:translateX(5px)}
.btn:active{transform:translate3d(var(--mx,0px),var(--my,0px),0) scale(.96)}
.btn--primary,.btn-primary{background:var(--ink);color:var(--bg);box-shadow:none;border:0}
.btn--primary:hover,.btn-primary:hover{background:var(--ink);color:var(--bg);box-shadow:4px 4px 0 0 var(--saffron);transform:translate3d(calc(var(--mx,0px) - 2px),calc(var(--my,0px) - 2px),0)}
[data-theme="dark"] .btn--primary,[data-theme="dark"] .btn-primary{background:var(--saffron);color:#0a1733}
[data-theme="dark"] .btn--primary:hover,[data-theme="dark"] .btn-primary:hover{background:var(--saffron);color:#0a1733;box-shadow:4px 4px 0 0 var(--signal)}
.btn--trial,.hero .btn--light[data-trial]{background:var(--saffron);color:#0a1733;border:0;box-shadow:none}
.btn--trial:hover,.hero .btn--light[data-trial]:hover{background:#ffc04d;color:#0a1733;box-shadow:4px 4px 0 0 var(--signal);transform:translate3d(calc(var(--mx,0px) - 2px),calc(var(--my,0px) - 2px),0)}
.btn--light{background:#eef3ff;color:#0a1733}
.btn--light:hover{color:#0a1733;background:#fff;box-shadow:4px 4px 0 0 var(--saffron)}
.btn--ghost{background:transparent;border:1.5px solid color-mix(in srgb,currentColor 45%,transparent)}
.btn--ghost:hover{border-color:currentColor;background:color-mix(in srgb,currentColor 8%,transparent)}
.btn--secondary{border-radius:10px}
:focus-visible{outline:3px solid var(--saffron);outline-offset:3px}

/* ------------------------------------------------------------------ header */
.v2nav{background:var(--bg)}
[data-theme="dark"] .v2nav{background:#050d22}
.v2nav::after{background:linear-gradient(90deg,var(--saffron) 0 18%,var(--signal) 18% 22%,transparent 22%);height:2px;bottom:-2px}
.v2nav__brand{font-stretch:112%;font-weight:800}
.v2nav__logo{border-radius:9px;box-shadow:inset 0 0 0 1px rgba(10,23,51,.12)}
.v2nav__links>a,.v2nav__trig{font-family:var(--font-body);font-weight:600;border-radius:8px}
.v2nav__links>a[aria-current="page"],.v2nav__trig.is-current{box-shadow:inset 0 -2px 0 var(--signal)}
.v2mega{border-radius:14px}
.v2mega__ic{border-radius:9px;background:var(--ink);color:var(--saffron)}
[data-theme="dark"] .v2mega__ic{background:var(--saffron);color:#0a1733}
.v2mega__feature{border-radius:10px;background:#0a1733;color:#eef3ff;box-shadow:inset 6px 0 0 var(--saffron)}
.v2mega__tag{border-radius:4px;background:var(--saffron);color:#0a1733}
.v2theme,.v2nav__toggle{border-radius:9px}
.v2sub__label{letter-spacing:0;text-transform:none;font-size:13px}
.v2sub__row a{border-radius:6px}
.v2sub__row a.is-active{background:var(--ink);color:var(--bg);box-shadow:inset 0 -2px 0 var(--saffron)}

/* ------------------------------------------------------------------ sections: colour blocks with stacked-sheet edges */
main > section{position:relative}
.section:not(.section--dark):not(.section--tint){background:var(--bg)}
.section--dark{background:var(--navy);overflow:clip}
.section--dark::after{content:none}
.section--tint{background:var(--surface)}
[data-theme="dark"] .section--dark{background:#0a1733}
[data-theme="dark"] .section--tint{background:#0a1633}
main > section.section--dark:not(:first-child),
main > section.section--tint:not(:first-child),
main > .section--dark + section.section:not(.section--dark),
main > .section--tint + section.section:not(.section--tint):not(.section--dark),
main > .v2wave,
main > .v2wave + section{border-radius:clamp(26px,4vw,56px) clamp(26px,4vw,56px) 0 0;margin-top:calc(-1 * clamp(26px,4vw,56px))}
main > .section--dark + section.section--dark{border-radius:0;margin-top:0;border-top:1px solid rgba(238,243,255,.08)}

/* section heads: editorial, left aligned, heading left and the lede set against it */
.section-head{text-align:left;max-width:none;margin-inline:0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);column-gap:clamp(24px,5vw,88px);align-items:end}
.section-head > *{grid-column:1;margin-inline:0}
.section-head > h2 + p{grid-column:2;grid-row:1 / span 2;align-self:end;max-width:46ch;margin-top:0}
.section-head h2{font-size:var(--fs-h2);line-height:.96;letter-spacing:-.03em;font-weight:800;font-stretch:112%;max-width:17ch;text-wrap:balance}
.section-head--left{display:block}
.eyebrow{font-family:var(--font-body);font-weight:600;letter-spacing:0;text-transform:none;font-size:15px;color:var(--brand);gap:10px}
.eyebrow::before{background:var(--signal) !important;height:2px !important;width:22px !important;border-radius:0}
.section--dark .eyebrow{color:var(--saffron)}
.section--dark .section-head p{color:var(--navy-ink-2)}

/* cards: flat, bordered, one radius family; hover is a border change and a small lift */
.card,.pain-card,.gov-card,.cmp-card,.fx-card,.ways-card,.connector-card,.pbox{border-radius:14px}
.card{background:var(--card);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;transition:transform .35s var(--ease-out),border-color .2s}
.card::before{content:none}
.card:hover{transform:translateY(-3px);box-shadow:none;border-color:var(--ink)}
.section--dark .card{background:rgba(238,243,255,.04)}
.section--dark .card:hover{border-color:var(--saffron)}
.icon-tile,.uc-badge{background:var(--ink);color:var(--saffron);border-radius:9px}
[data-theme="dark"] .icon-tile,[data-theme="dark"] .uc-badge{background:var(--saffron);color:#0a1733}
.section--dark .icon-tile{background:var(--saffron);color:#0a1733}
.chip{border-radius:6px}
.pill{border-radius:4px}
.faq details{border-radius:12px}
.faq details[open]{border-color:var(--ink);box-shadow:inset 4px 0 0 var(--saffron)}
.tbl-scroll{border-radius:12px}

/* CTA bands: a saffron block with ink type */
.cta-band{background:var(--saffron);color:#0a1733;border-radius:18px;box-shadow:none}
.cta-band::before,.cta-band::after{content:none !important}
.cta-band h2,.cta-band h3,.cta-band p,.cta-band .trial__num,.cta-band .trial__num b,.cta-band .trial__num span{color:#0a1733 !important}
.cta-band .btn--light{background:#0a1733;color:#eef3ff}
.cta-band .btn--light[data-trial]{background:#0a1733;color:var(--saffron)}
.cta-band .btn--light:hover{background:#0a1733;color:var(--saffron);box-shadow:4px 4px 0 0 var(--signal)}
.cta-band .btn--ghost{color:#0a1733 !important;border-color:rgba(10,23,51,.45) !important}

/* the trial wave: full-bleed saffron with petrol line work */
.v2wave{background:var(--saffron);color:#0a1733}
.v2wave svg.v2wave__art{opacity:.35}
.v2wave__line{stroke:#0a1733}
.v2wave h2{color:#0a1733;font-weight:800;font-stretch:112%;letter-spacing:-.03em;line-height:.95}
.v2wave h2 .hl{color:#0a1733;display:block;font-weight:340;font-stretch:78%}
.v2wave p{color:#1f2b4d}
.v2wave__badge{background:#fff;border:0;border-radius:18px;box-shadow:8px 8px 0 0 #0a1733}
.v2wave__badge img{filter:none}
.v2wave .btn--trial{background:#0a1733;color:var(--saffron)}
.v2wave .btn--trial:hover{background:#0a1733;color:var(--saffron);box-shadow:4px 4px 0 0 #fff}
.v2wave .btn--ghost{color:#0a1733 !important;border-color:rgba(10,23,51,.5) !important}

/* ------------------------------------------------------------------ hero (every page): live torque field */
.hero,.hero.section--dark{background:var(--abyss);overflow:hidden}
.hero::before,.hero::after{content:none !important;background:none !important}
.hero .hx-mesh,.hero .v2orbs{display:none}
/* no z-index here: a stacking context would isolate the canvas blend from the photo behind it */
.art-field{position:absolute;inset:0;pointer-events:none;overflow:hidden;
  background:
    radial-gradient(38% 52% at 84% 22%,rgba(248,51,11,.30),transparent 62%),
    radial-gradient(46% 60% at 70% 90%,rgba(255,176,32,.16),transparent 64%),
    repeating-radial-gradient(ellipse 130% 95% at 82% 26%,transparent 0 26px,rgba(126,166,255,.13) 26px 27.5px),
    #050d22}
.art-field::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,13,34,.7) 0%,rgba(5,13,34,.5) 40%,rgba(5,13,34,0) 72%)}
.hero .hx-cta{box-shadow:none;animation:none}
.art-canvas{position:absolute;inset:0;width:100% !important;height:100% !important;max-width:none;opacity:0;transition:opacity 1.4s ease}
.art-field.is-live .art-canvas{opacity:1}
.art-toggle{position:absolute;top:14px;right:clamp(12px,2vw,28px);z-index:3;display:inline-flex;align-items:center;justify-content:center;width:136px;gap:8px;min-height:40px;padding:0 14px;border-radius:8px;
  border:1px solid rgba(238,243,255,.22);background:rgba(5,13,34,.72);color:#eef3ff;font:600 13px var(--font-body);cursor:pointer;transition:background-color .2s,border-color .2s}
.art-toggle:hover{background:#0a1733;border-color:rgba(238,243,255,.5)}
.art-toggle .i{width:14px;height:14px}
.art-toggle__play,.motion-off .art-toggle__pause{display:none}
.motion-off .art-toggle__play{display:block}
html:not(.js) .art-toggle{display:none}
.motion-off *,.motion-off *::before,.motion-off *::after{animation-play-state:paused !important}
@media (prefers-reduced-motion:reduce){.art-toggle{display:none}}
@media (max-width:760px){.art-toggle{width:40px;padding:0;top:10px}.art-toggle span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}
.hero > .container,.hero > div:not(.art-field):not(.hx-mesh):not(.v2orbs):not(.ph-bg){position:relative;z-index:1}
.hero h1{font-size:var(--fs-h1);line-height:.94;letter-spacing:-.035em;font-weight:820;font-stretch:112%;text-wrap:balance}
.hero h1 .grad{font-weight:330;font-stretch:78%;color:var(--navy-ink-2);-webkit-text-fill-color:var(--navy-ink-2)}
.hero .hero__sub,.hero .lead{color:#bac7e6}
.hero__eyebrow,.hero .eyebrow{border-radius:6px}
.kw{display:inline-block}
/* every hero reads left-aligned, like the home page */
.hero > .container{text-align:left}
.hero .hero__cta,.hero .cta-row,.hero .hero__actions{justify-content:flex-start}
.hero .hero__eyebrow,.hero .eyebrow,.hero h1,.hero .hero__sub,.hero .lead,.hero .hero__note{margin-inline:0;text-align:left}
.hero h1{max-width:18ch}
.hero .section-head{display:block}
.hero .section-head p,.hero .hero__sub,.hero .lead{max-width:62ch}
.hero .section-head .eyebrow,.hero .eyebrow{justify-content:flex-start;justify-self:start}
.hero .hero__cta,.hero .hero__trust{justify-content:flex-start !important;margin-inline:0 !important}

/* kinetic headline: one orchestrated entrance, words rise out of their own line box */
@media (prefers-reduced-motion:no-preference){
  html.js [data-kinetic] .kw{animation:kw-in 1s var(--ease-out) backwards;animation-delay:calc(var(--k) * 65ms + 150ms);transition:transform .6s var(--ease-out)}
}
@keyframes kw-in{from{opacity:0;transform:translateY(.42em) rotate(2.5deg);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(-20% -10% -20% -10%)}}

/* home hero: headline across the page, lead copy left, the two edition routes right */
.hero--hx{padding-block:clamp(36px,4.6vw,68px) 0}
.hero--hx .hx-hero{max-width:1360px}
.hero--hx .hx-copy{text-align:left;max-width:none;margin:0}
.hero--hx .hero__eyebrow{margin:0 0 clamp(18px,2.2vw,30px);display:flex;flex-wrap:wrap;align-items:center;gap:12px;background:none;border:0;padding:0;
  color:#bac7e6;font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.hero--hx .hero__eyebrow .pill{background:var(--saffron);color:#0a1733;border-radius:4px;letter-spacing:0;text-transform:none;font-size:13px;font-weight:700;padding:4px 10px}
.hero--hx h1{font-size:clamp(50px,9.4vw,150px);line-height:.84;letter-spacing:-.045em;font-weight:840;font-stretch:115%;color:#eef3ff;max-width:none;margin:0}
.hero--hx h1 .grad{display:block;font-size:.42em;line-height:1.02;margin-top:.34em;letter-spacing:-.015em;font-weight:320;font-stretch:76%;max-width:26ch}
.hx-lower{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,3.4vw,56px);margin-top:clamp(30px,3.6vw,56px);align-items:start}
.hx-lead{padding-top:6px;border-top:2px solid var(--signal);max-width:460px}
.hx-lead .hero__sub{margin:18px 0 0;max-width:40ch;font-size:clamp(17px,1.3vw,19px);line-height:1.55;text-align:left}
.hx-lead .hero__cta{justify-content:flex-start;margin-top:26px;flex-wrap:wrap;gap:12px}
.hx-lead .hx-note{justify-content:flex-start;text-align:left;margin:16px 0 0;color:#93a3c8;font-size:14px}
.hero--hx .hx-routes{margin:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(14px,1.6vw,22px);align-items:start}
.hero--hx .hx-route--sf{margin-top:clamp(0px,5.4vw,88px)}
.hero--hx .hx-route{border-radius:16px;background:rgba(10,23,51,.78);border:1px solid rgba(238,243,255,.14);box-shadow:0 40px 80px -40px rgba(0,0,0,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hero--hx .hx-route:hover{transform:translateY(-4px)}
.hx-route__ic{background:var(--saffron) !important;color:#0a1733 !important;border-radius:9px !important}
.hx-route__kicker{letter-spacing:0 !important;text-transform:none !important;color:var(--saffron) !important;font-size:13px !important}
.hx-tag{border-radius:4px !important}
.hx-route__link{color:#eef3ff !important}
/* the title wraps differently in the fallback face; reserving two lines keeps the card still when Archivo arrives */
.hero--hx .hx-route__title{line-height:1.05;min-height:2.1em;display:flex;align-items:flex-end}
@container (max-width:520px){.hx-sf__body{grid-template-columns:minmax(0,1fr)}}
.hero--hx .v2promo{margin-top:clamp(40px,5vw,72px);border-radius:0;border:0;border-top:1px solid rgba(238,243,255,.14);background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;max-width:1360px}
.v2promo a{padding:22px clamp(14px,2vw,28px) 26px;border-right:1px solid rgba(238,243,255,.1)}
.v2promo a:hover{background:rgba(255,176,32,.08)}
.v2promo em{letter-spacing:0;text-transform:none;font-size:13px;color:var(--saffron)}
.v2promo span{color:#a9b8dc}

/* ------------------------------------------------------------------ photography (Pexels, self-hosted) */
.ph{display:block;margin:0}
.ph img{display:block;width:100%;height:auto}
.ph--duo img{filter:grayscale(1) contrast(1.05) brightness(.88)}
.ph-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.ph-bg .ph,.ph-bg img{width:100%;height:100%;object-fit:cover}
/* duotone: a colour blend keeps the photograph's luminance, so the image still reads as a photograph */
.ph-bg::after{content:"";position:absolute;inset:0;z-index:1;background:#1c46c8;mix-blend-mode:color;opacity:.92}
/* the hero: photo, then the live field over it, then a scrim under the type */
.hero .ph-bg img{filter:grayscale(1) contrast(1.06) brightness(.6)}
.hero .ph-bg::before{content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(90deg,rgba(5,13,34,.88) 0%,rgba(5,13,34,.6) 36%,rgba(5,13,34,.3) 66%,rgba(5,13,34,.14) 100%)}
.hero .art-field{background:
    radial-gradient(42% 56% at 82% 26%,rgba(47,99,240,.18),transparent 64%),
    radial-gradient(40% 52% at 18% 84%,rgba(16,35,83,.3),transparent 66%)}
.hero .art-field::after{background:linear-gradient(90deg,rgba(5,13,34,.3) 0%,rgba(5,13,34,.1) 42%,rgba(5,13,34,0) 66%)}
.hero .art-canvas{mix-blend-mode:screen}
/* card art */
.v2rcard__art,.v2uc__art{display:block;overflow:hidden;position:relative}
.v2rcard__art .ph,.v2uc__art .ph{height:100%}
.v2rcard__art img,.v2uc__art img{height:100%;object-fit:cover;aspect-ratio:16/9}
.ph--art{position:relative}
.v2rcard__art::after,.v2uc__art::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(140deg,rgba(47,99,240,.35),rgba(10,23,51,.3) 60%,rgba(5,13,34,.45));mix-blend-mode:multiply}

/* ------------------------------------------------------------------ full-bleed photographic band */
.pband{position:relative;isolation:isolate;overflow:hidden;color:#fff;
  padding-block:clamp(56px,8vw,112px);background:var(--abyss)}
.pband .ph-bg img{filter:grayscale(1) contrast(1.06) brightness(.5)}
/* a scrim under the copy so the text keeps its contrast whatever the photograph does */
.pband .ph-bg::before{content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(90deg,rgba(5,13,34,.9) 0%,rgba(5,13,34,.66) 46%,rgba(5,13,34,.34) 100%)}
.pband__inner{position:relative;z-index:3;max-width:760px}
.pband__inner .eyebrow{color:var(--sky,#a9c2ff)}
.pband__inner h2{color:#fff;font-size:clamp(26px,3.4vw,44px);line-height:1.1;margin-top:10px}
.pband__inner p{color:#d6e0f7;font-size:clamp(15.5px,1.5vw,18px);line-height:1.6;margin-top:14px}
.pband__note{color:#a9b8dc !important;font-size:13.5px !important}
@media print{.pband{display:none !important}}

/* ------------------------------------------------------------------ spotlight on product visuals (cursor-reactive) */
.spot{position:relative}
.spot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:5;opacity:0;transition:opacity .35s;
  background:radial-gradient(360px circle at var(--sx,50%) var(--sy,50%),rgba(255,176,32,.16),transparent 62%)}
.spot.is-lit::after{opacity:1}

/* ------------------------------------------------------------------ life of a request (pinned story) */
.story{padding-block:var(--sp-section)}
.story__head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);column-gap:clamp(24px,5vw,88px);align-items:end;margin-bottom:clamp(36px,5vw,72px)}
.story__head h2{font-size:clamp(40px,6.4vw,96px);line-height:.9;letter-spacing:-.04em;font-weight:840;font-stretch:115%;max-width:12ch}
.story__head p{color:var(--ink-2);font-size:var(--fs-lead);max-width:44ch}
.story__grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(28px,5vw,88px);align-items:start}
.story__stage{position:sticky;top:calc(var(--hdr) + 20px);background:var(--bg);padding:6px 0 10px;z-index:2}
.story__frame{border-radius:18px;background:#0a1733;color:#eef3ff;border:1px solid rgba(10,23,51,.2);overflow:hidden;box-shadow:14px 14px 0 0 var(--saffron)}
[data-theme="dark"] .story__frame{border-color:rgba(238,243,255,.14);box-shadow:14px 14px 0 0 rgba(255,176,32,.85)}
.story__bar{display:flex;align-items:center;gap:6px;min-height:42px;padding:0 16px;border-bottom:1px solid rgba(238,243,255,.1);font-size:13px;color:#a9b8dc}
.story__bar i{width:10px;height:10px;border-radius:50%;background:rgba(238,243,255,.22)}
.story__bar span:first-of-type{margin-left:10px}
.story__count{margin-left:auto;font-variant-numeric:tabular-nums;color:#eef3ff}
.story__count b{color:var(--saffron)}
.story__scenes{position:relative;height:clamp(360px,34vw,440px)}
.st-scene{position:absolute;inset:0;padding:clamp(18px,2.6vw,34px);opacity:0;visibility:hidden;transform:translateY(18px);
  transition:opacity .45s,transform .7s var(--ease-out),visibility 0s linear .7s}
.st-scene.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .45s,transform .7s var(--ease-out),visibility 0s}
html:not(.js) .st-s0{opacity:1;visibility:visible;transform:none}
.story__progress{height:4px;background:rgba(238,243,255,.1)}
.story__progress i{display:block;height:100%;width:calc(var(--p,.2) * 100%);background:var(--saffron);transition:width .5s var(--ease-out)}
.story__illus{font-size:13px;color:var(--muted);margin-top:22px}
.story__steps{display:grid}
.story__step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:18px;min-height:64vh;align-content:center;padding-block:24px;position:relative}
.story__step::before{content:"";position:absolute;left:21px;top:0;bottom:0;width:2px;background:var(--border)}
.story__step:first-child::before{top:50%}
.story__step:last-child::before{bottom:50%}
.story__n{position:relative;z-index:1;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-head);font-weight:800;font-size:16px;
  background:var(--bg);color:var(--ink);border:2px solid var(--border-2);transition:background-color .3s,border-color .3s,color .3s,transform .4s var(--ease-out)}
.story__step.is-on .story__n{background:var(--saffron);border-color:var(--saffron);color:#0a1733;transform:scale(1.12)}
.story__step h3{font-size:clamp(26px,2.6vw,38px);line-height:1;letter-spacing:-.025em;font-weight:800;font-stretch:110%;margin-top:4px}
.story__step p{margin-top:12px;color:var(--ink-2);font-size:17px;line-height:1.6;max-width:42ch}
.story__step h3{width:fit-content;background:linear-gradient(transparent 64%,rgba(255,176,32,0) 64%);transition:background .4s}
.story__step.is-on h3{background:linear-gradient(transparent 64%,rgba(255,176,32,.45) 64%)}

/* scene 0: sources flow into the Workmate */
.st-s0{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);grid-template-rows:repeat(3,auto);gap:12px clamp(20px,3vw,40px);align-content:center}
.st-src{grid-column:1;position:relative;background:rgba(238,243,255,.06);border:1px solid rgba(238,243,255,.13);border-radius:12px;padding:12px 14px;
  opacity:0;transform:translateX(-18px);transition:opacity .5s,transform .6s var(--ease-out);transition-delay:calc(var(--d) * 130ms + 120ms)}
.is-on .st-src{opacity:1;transform:none}
.st-src::after{content:"";position:absolute;left:100%;top:50%;width:clamp(20px,3vw,40px);height:2px;background:linear-gradient(90deg,var(--saffron),rgba(255,176,32,0))}
.st-tag{display:inline-block;font-size:12px;font-weight:700;color:#0a1733;background:#7ea6ff;border-radius:4px;padding:1px 7px;margin-bottom:6px}
.st-src b,.st-rec b{display:block;font-family:var(--font-head);font-size:16px;font-weight:700;line-height:1.25}
.st-src small,.st-hub small,.st-rec small{display:block;font-size:13px;color:#a9b8dc;margin-top:2px}
.st-hub{grid-column:2;grid-row:1 / span 3;align-self:center;border-radius:16px;padding:22px 20px;background:var(--saffron);color:#0a1733;position:relative}
.st-hub b{display:block;font-family:var(--font-head);font-size:clamp(20px,2vw,26px);font-weight:800;line-height:1.05;margin-top:12px}
.st-hub small{color:#1f2b4d}
.st-hub__dot{display:block;width:14px;height:14px;border-radius:50%;background:#0a1733}
.is-on .st-hub__dot{animation:st-ping 1.8s infinite}
@keyframes st-ping{0%{box-shadow:0 0 0 0 rgba(10,23,51,.45)}80%,100%{box-shadow:0 0 0 14px rgba(10,23,51,0)}}

/* scene 1: cited answer */
.st-s1{display:flex;flex-direction:column;gap:14px;justify-content:center}
.st-q{align-self:flex-end;max-width:80%;background:#eef3ff;color:#0a1733;border-radius:14px 14px 4px 14px;padding:10px 14px;font-weight:600;font-size:15px}
.st-a{max-width:94%;background:rgba(238,243,255,.06);border:1px solid rgba(238,243,255,.13);border-radius:14px 14px 14px 4px;padding:14px 16px;
  opacity:0;transform:translateY(10px);transition:opacity .5s .35s,transform .6s var(--ease-out) .35s}
.is-on .st-a{opacity:1;transform:none}
.st-who{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--saffron)}
.st-who img{width:16px;height:16px;border-radius:4px;background:#fff}
.st-a p{margin-top:8px;font-size:15px;line-height:1.55;color:#eef3ff}
.st-cites{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.st-cites span{font-size:12.5px;font-weight:600;border-radius:4px;padding:3px 8px;background:rgba(126,166,255,.14);color:#a9c2ff}
.st-cites sup{color:var(--saffron)}
.st-chips{display:flex;flex-wrap:wrap;gap:8px}
.st-chips span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:#a9b8dc;border:1px solid rgba(238,243,255,.16);border-radius:4px;padding:3px 8px}
.st-chips .i,.st-card__hd .i,.st-b .i,.st-ok .i{width:14px;height:14px}

/* scene 2: approval */
.st-s2{display:grid;place-items:center}
.st-card{position:relative;width:min(100%,440px);background:#eef3ff;color:#0a1733;border-radius:14px;padding:18px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.st-card__hd{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px}
.st-diff{display:grid;gap:6px;margin-top:14px;font-size:14px}
.st-diff span{border-radius:6px;padding:6px 10px}
.st-diff .del{background:rgba(248,51,11,.1);color:#9a2a10;text-decoration:line-through}
.st-diff .add{background:rgba(31,85,224,.12);color:#1740b0;font-weight:600}
.st-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.st-b{display:inline-flex;align-items:center;gap:6px;border-radius:8px;padding:7px 12px;font-size:13.5px;font-weight:700;border:1.5px solid rgba(10,23,51,.25)}
.st-b--ok{background:#0a1733;color:#eef3ff;border-color:#0a1733}
.is-on .st-b--ok{animation:st-press 2.6s .9s both}
@keyframes st-press{0%,40%{transform:none;background:#0a1733}50%{transform:scale(.92)}60%,100%{transform:none;background:#1f55e0;border-color:#1f55e0}}
.st-cursor{position:absolute;width:18px;height:18px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 5px rgba(248,51,11,.25);left:78%;top:88%;opacity:0}
.is-on .st-cursor{animation:st-move 2.6s .2s both}
@keyframes st-move{0%{opacity:0;left:78%;top:88%}25%{opacity:1}55%{left:52px;top:calc(100% - 36px);opacity:1}80%{opacity:1}100%{left:52px;top:calc(100% - 36px);opacity:0}}

/* scene 3: the write-back */
.st-s3{display:grid;place-items:center}
.st-rec{width:min(100%,460px);background:#fff;color:#0a1733;border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.st-rec__hd{padding:14px 16px;background:#e9eef8}
.st-rec .st-rec__hd small{color:#4b5877}
.st-rec dl{margin:0;padding:6px 16px}
.st-rec dl div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;padding:9px 0;border-bottom:1px solid #dee5f4;font-size:14px}
.st-rec dt{color:#4b5877}
.st-rec dd{margin:0;font-weight:600;position:relative}
.st-hot{transition:background-color .6s .9s}
.is-on .st-hot{background-color:rgba(255,176,32,.22)}
.st-old{display:inline-block;transition:opacity .4s .6s}
.st-new{position:absolute;left:0;top:0;opacity:0;transform:translateY(8px);transition:opacity .5s .9s,transform .6s var(--ease-out) .9s}
.is-on .st-old{opacity:0}
.is-on .st-new{opacity:1;transform:none}
.st-ok{display:flex;align-items:center;gap:8px;margin:10px 16px 14px;font-size:13.5px;font-weight:700;color:#1f55e0;opacity:0;transition:opacity .4s 1.5s}
.is-on .st-ok{opacity:1}

/* scene 4: the audit trail */
.st-s4{display:grid;align-content:center}
.st-log{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.st-log li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;padding:9px 12px;border-radius:8px;background:rgba(238,243,255,.05);border-left:3px solid var(--saffron);
  font-size:14px;opacity:0;transform:translateX(14px);transition:opacity .4s,transform .5s var(--ease-out);transition-delay:calc(var(--d) * 110ms + 100ms)}
.is-on .st-log li{opacity:1;transform:none}
.st-log b{font-family:var(--font-head);font-weight:800;color:#eef3ff}
.st-log span{color:#a9b8dc}

/* ------------------------------------------------------------------ connector constellation */
.cn{margin:clamp(28px,3.4vw,48px) 0}
.cn__filters{display:flex;flex-wrap:wrap;gap:8px}
.cn__f{min-height:40px;padding:0 14px;border-radius:8px;border:1.5px solid var(--border-2);background:transparent;color:var(--ink-2);font:600 14px var(--font-body);cursor:pointer;
  transition:background-color .2s,color .2s,border-color .2s,transform .2s var(--ease-out)}
.cn__f:hover{border-color:var(--ink);color:var(--ink)}
.cn__f:active{transform:scale(.96)}
.cn__f[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.cn__stage{margin-top:16px;border-radius:20px;background:#0a1733;overflow-x:auto;position:relative;scrollbar-width:thin}
.cn__svg{display:block;width:100%;height:auto;min-width:720px}
.cn__orbits ellipse{fill:none;stroke:rgba(238,243,255,.09);stroke-dasharray:2 7}
.cn-link{fill:none;stroke:rgba(126,166,255,.28);stroke-width:1.2;stroke-dasharray:3 6;transition:stroke .3s,opacity .3s,stroke-width .3s}
.cn-node circle{fill:#7ea6ff;transition:fill .3s}
.cn-node text{fill:#eef3ff;font:600 15px var(--font-body);transition:opacity .3s,fill .3s}
.cn-node{transition:opacity .3s}
.cn.is-filtered .cn-link:not(.is-hl){opacity:.1}
.cn.is-filtered .cn-node:not(.is-hl){opacity:.28}
.cn-link.is-hl{stroke:var(--saffron);stroke-width:2}
.cn-node.is-hl circle{fill:var(--saffron)}
.cn__nodes,.cn__links{transition:transform .8s var(--ease-out)}
.cn__core > circle:first-child{fill:var(--saffron)}
.cn__ring{fill:none;stroke:rgba(255,176,32,.55);stroke-width:1.5;stroke-dasharray:4 8;transform-origin:600px 310px}
.cn__core-t{fill:#0a1733;font:800 18px var(--font-head)}
.cn__core-s{fill:#0a1733;font:600 12.5px var(--font-body)}
.cn__cap{font-size:14px;color:var(--muted);margin-top:12px;max-width:70ch}
@media (prefers-reduced-motion:no-preference){
  .cn-link{animation:cn-flow 2.4s linear infinite}
  .cn__ring{animation:cn-spin 28s linear infinite}
}
@keyframes cn-flow{to{stroke-dashoffset:-18}}
@keyframes cn-spin{to{transform:rotate(360deg)}}

/* ------------------------------------------------------------------ two editions: pinned horizontal rail */
.hrail__hint{display:none}
@media (min-width:1041px){
  .hrail.is-on{height:var(--rail-h,auto);width:calc(100vw - var(--sbw,0px));margin-left:calc(50% - (100vw - var(--sbw,0px)) / 2)}
  .hrail.is-on .hrail__sticky{position:sticky;top:var(--hdr);height:calc(100vh - var(--hdr));overflow:hidden;display:flex;align-items:center;background:#0a1733}
  .hrail.is-on .hrail__track{display:flex;flex-wrap:nowrap;align-items:center;gap:clamp(28px,3vw,56px);width:max-content;max-width:none;margin:0;
    padding-inline:max(24px,calc((100vw - var(--sbw,0px) - var(--container)) / 2)) 8vw;transform:translate3d(var(--rx,0px),0,0);will-change:transform}
  .hrail.is-on .hrail__intro{flex:0 0 min(460px,32vw);display:block;margin:0}
  .hrail.is-on .hrail__intro h2{max-width:10ch}
  .hrail.is-on .hrail__intro p{margin-top:18px}
  .hrail.is-on .hrail__hint{display:flex;align-items:center;gap:10px;margin-top:26px;font-weight:600;color:var(--saffron)}
  .hrail.is-on .hrail__hint::after{content:"";width:64px;height:2px;background:var(--saffron)}
  .hrail.is-on .edlane{flex:0 0 min(1060px,76vw);display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);column-gap:clamp(24px,2.6vw,40px);align-content:center;margin:0}
  .hrail.is-on .edlane > *{grid-column:1}
  .hrail.is-on .edlane .edlane__mock{grid-column:2;grid-row:1 / span 7;align-self:center;margin:0}
  .hrail.is-on .edseam{flex:0 0 auto;align-self:stretch}
  .section--rail.is-railed{padding-block:0}
}

/* ------------------------------------------------------------------ footer */
.v2foot__cta{border-radius:18px;background:var(--saffron);color:#0a1733}
.v2foot__cta h2{color:#0a1733;font-stretch:112%;font-weight:800;letter-spacing:-.03em}
.v2foot__cta .btn--trial{background:#0a1733;color:var(--saffron)}
.v2foot__cta .btn--trial:hover{background:#0a1733;color:var(--saffron);box-shadow:4px 4px 0 0 #fff}
.v2foot__cta .btn--ghost{color:#0a1733 !important;border-color:rgba(10,23,51,.45) !important}

/* ------------------------------------------------------------------ responsive (stage 2) */
@media (max-width:1180px){
  .hx-lower{grid-template-columns:minmax(0,1fr)}
  .hx-lead{max-width:640px}
}
@media (max-width:900px){
  .section-head,.story__head{grid-template-columns:minmax(0,1fr)}
  .section-head > h2 + p{grid-column:1;grid-row:auto;margin-top:16px}
  .story__head p{margin-top:16px}
  .story__grid{grid-template-columns:minmax(0,1fr);gap:0}
  .story__stage{top:calc(var(--hdr) + 6px);padding-bottom:8px}
  .story__scenes{height:300px}
  .story__illus{margin-top:12px}
  .story__step{min-height:78vh;align-content:end;padding-bottom:14vh}
  .st-s0{grid-template-columns:minmax(0,1fr);gap:8px}
  .st-hub{grid-column:1;grid-row:auto;padding:12px 14px}
  .st-hub b{margin-top:6px;font-size:18px}
  .st-src{padding:8px 12px}
  .st-src::after{display:none}
  .st-src small{display:none}
  .st-a p{font-size:14px}
  .st-log li{grid-template-columns:80px minmax(0,1fr);padding:6px 10px;font-size:13px}
}
@media (max-width:760px){
  .hero--hx .hx-routes{grid-template-columns:minmax(0,1fr)}
  .hero--hx .hx-route--sf{margin-top:0}
}
@media (max-width:640px){
  .hero--hx h1{font-size:clamp(44px,13.4vw,64px)}
  .hero--hx h1 .grad{font-size:.5em}
  .v2promo a{border-right:0;border-bottom:1px solid rgba(238,243,255,.1)}
  .story__head h2{font-size:clamp(38px,11vw,56px)}
  .story__frame{box-shadow:8px 8px 0 0 var(--saffron)}
  .st-scene{padding:14px}
  .story__scenes{height:290px}
  .st-q{font-size:14px}
  .st-cites span:nth-child(3),.st-chips{display:none}
  .st-log li:nth-child(n+5){display:none}
}
@media (prefers-reduced-motion:reduce){
  .st-scene,.st-scene *{transition:none !important;animation:none !important}
}
@media print{
  .art-field,.story__stage{display:none !important}
  body::after{display:none}
}