/* Generated by tools/theme.mjs from the <style> in index.html. Do not edit here. */
@font-face{font-family:"Inter Tight";src:url("../fonts/inter-tight-var-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/ibm-plex-mono-400-latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/ibm-plex-mono-500-latin.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

/* ---------- tokens: sampled from the company profile ---------- */
:root{
  --ink:#121413;
  --ink-2:#1d201e;
  --ink-line:#2a2d2b;
  --ink-grid:#1b1e1c;
  --paper:#f3f0ea;
  --rule:#d9d5cc;
  --grey:#8a8a85;
  --grey-dark:#5a5c58;
  --mint:#14f0a8;

  --sans:"Inter Tight",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;

  --gutter:clamp(1.25rem,6.7vw,6rem);
  --max:1360px;
  --gap:clamp(1rem,2.2vw,2rem);
  --bay:clamp(5.5rem,3.5rem + 7vw,10.5rem);
  --nav-h:4.5rem;
  --ease:cubic-bezier(.16,1,.3,1);
}

/* surfaces: the profile alternates ink pages and paper pages */
.s-ink{background:var(--ink);color:var(--paper);--fg:var(--paper);--fg-2:var(--grey);--fg-label:var(--grey);--line:var(--ink-line);--focus:var(--mint);--btn-bg:var(--mint);--btn-fg:var(--ink);--btn-sq:var(--ink);--btn-bg-h:var(--paper)}
.s-paper{background:var(--paper);color:var(--ink);--fg:var(--ink);--fg-2:var(--grey-dark);--fg-label:var(--grey-dark);--line:var(--rule);--focus:var(--ink);--btn-bg:var(--ink);--btn-fg:var(--paper);--btn-sq:var(--mint);--btn-bg-h:#000}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--nav-h);background:var(--ink);scrollbar-color:#3b3e3c var(--ink)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.55;font-weight:400;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-kerning:normal;caret-color:var(--mint)}
::selection{background:var(--mint);color:var(--ink)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--ink)}
::-webkit-scrollbar-thumb{background:#3b3e3c;border:2px solid var(--ink)}
::-webkit-scrollbar-thumb:hover{background:var(--grey-dark)}
img,svg{display:block;max-width:100%}
[hidden]{display:none!important}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0}
ol,ul{padding:0;list-style:none}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus,var(--mint));outline-offset:3px}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:1rem;top:-4rem;z-index:100;background:var(--mint);color:var(--ink);padding:.75rem 1rem;font:500 .875rem/1 var(--sans);text-decoration:none}
.skip:focus{top:1rem}

.shell{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.bay{position:relative;padding-block:var(--bay)}

/* ---------- brand atoms ---------- */
/* wordmark: Inter Tight 600, -0.035em, square full stop 0.15em on the baseline */
.wm{font-family:var(--sans);font-weight:600;letter-spacing:-.035em;line-height:1;white-space:nowrap;font-feature-settings:"ss01" 0}
.wm-sq{display:inline-block;width:.15em;height:.15em;background:var(--mint);margin-left:.08em;vertical-align:baseline}
/* the square full stop that ends key lines */
.p{display:inline-block;width:.14em;height:.14em;margin-left:.03em;background:var(--mint);color:transparent;overflow:hidden;vertical-align:baseline;line-height:0;font-size:inherit}
.label{font:400 .75rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-label)}
.label-m{font:500 .75rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase}

/* section folio: page number + square, then the section name, as on every profile page */
.folio{margin-bottom:clamp(1.5rem,2.5vw,2rem)}
.folio-n{display:flex;align-items:center;gap:.6rem;font:400 .75rem/1 var(--mono);letter-spacing:.12em;color:var(--fg-label);font-variant-numeric:tabular-nums}
.folio-n::after{content:"";width:.5rem;height:.5rem;background:var(--mint)}
.folio-t{margin-top:clamp(2.75rem,5vw,4.25rem)}

.h2{font-weight:500;font-size:clamp(2.35rem,1.3rem + 3.6vw,4.4rem);line-height:1.04;letter-spacing:-.036em;text-wrap:balance}
.h2 .tone{display:block;color:var(--grey)}
.lede{font-size:clamp(1.0625rem,.98rem + .35vw,1.25rem);line-height:1.5;letter-spacing:-.008em;max-width:34em}
.lede b{font-weight:500}
.muted{color:var(--fg-2)}

/* buttons: square corners, the square travels on hover */
.btn{display:inline-flex;align-items:center;gap:.9rem;min-height:3.25rem;padding:0 1.25rem 0 1.4rem;border:0;border-radius:0;background:var(--btn-bg);color:var(--btn-fg);font:500 1rem/1 var(--sans);letter-spacing:-.01em;text-decoration:none;cursor:pointer;transition:background-color .35s var(--ease),color .35s var(--ease)}
.btn-sq{width:.5rem;height:.5rem;background:var(--btn-sq);transition:transform .45s var(--ease)}
.btn:hover{background:var(--btn-bg-h)}
.btn:hover .btn-sq{transform:translateX(.3rem)}
.btn:active .btn-sq{transform:translateX(.3rem) scale(.8)}
.btn-sm{min-height:2.5rem;padding:0 1rem 0 1.1rem;font-size:.9375rem;gap:.7rem}
.btn-sm .btn-sq{width:.4375rem;height:.4375rem}
.link-arrow{display:inline-flex;align-items:center;gap:.6rem;min-height:3.25rem;font:500 1rem/1 var(--sans);letter-spacing:-.01em;text-decoration:none;color:var(--fg)}
.link-arrow span{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:.2em;transition:background-size .45s var(--ease)}
.link-arrow:hover span{background-size:0 1px;background-position:100% 100%}
.link-arrow svg{width:.95rem;height:.95rem;transition:transform .45s var(--ease)}
.link-arrow:hover svg{transform:translateY(.2rem)}

/* ---------- navigation ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:50;height:var(--nav-h);color:var(--paper);transition:background-color .4s var(--ease),color .4s var(--ease),box-shadow .4s var(--ease)}
.nav[data-surface="paper"]{color:var(--ink);--focus:var(--ink);--btn-bg:var(--ink);--btn-fg:var(--paper);--btn-sq:var(--mint);--btn-bg-h:#000}
.nav[data-surface="ink"]{--focus:var(--mint);--btn-bg:var(--mint);--btn-fg:var(--ink);--btn-sq:var(--ink);--btn-bg-h:var(--paper)}
.nav.is-scrolled[data-surface="ink"]{background:rgba(18,20,19,.94);box-shadow:0 1px 0 var(--ink-line)}
.nav.is-scrolled[data-surface="paper"]{background:rgba(243,240,234,.95);box-shadow:0 1px 0 var(--rule)}
@supports (backdrop-filter:blur(1px)){
  .nav.is-scrolled[data-surface="ink"]{background:rgba(18,20,19,.82);backdrop-filter:blur(14px) saturate(1.2)}
  .nav.is-scrolled[data-surface="paper"]{background:rgba(243,240,234,.84);backdrop-filter:blur(14px) saturate(1.2)}
}
.nav.nav.is-open[data-surface]{background:var(--ink);color:var(--paper);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 1px 0 var(--ink-line)}
.nav-in{height:100%;display:flex;align-items:center;gap:2rem}
.nav-brand{font-size:1.625rem;text-decoration:none;display:inline-flex;align-items:baseline;padding-block:.5rem}
.nav-links{display:flex;gap:clamp(1.25rem,2.4vw,2.25rem);margin-left:auto}
.nav-links a{font:400 .75rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding-block:.6rem;opacity:.72;transition:opacity .3s var(--ease);background:linear-gradient(currentColor,currentColor) 0 calc(100% - .2rem)/0 1px no-repeat;transition:opacity .3s var(--ease),background-size .45s var(--ease)}
.nav-links a:hover,.nav-links a[aria-current="true"]{opacity:1;background-size:100% 1px}
.nav-toggle{display:none;margin-left:auto;align-items:center;gap:.6rem;min-height:2.75rem;padding:0 .25rem;background:none;border:0;font:500 .75rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.nav-toggle i{display:grid;gap:4px;width:16px}
.nav-toggle i::before,.nav-toggle i::after{content:"";height:1.5px;background:currentColor;transition:transform .4s var(--ease)}
.nav-toggle[aria-expanded="true"] i::before{transform:translateY(2.75px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] i::after{transform:translateY(-2.75px) rotate(-45deg)}
.nav-panel{position:fixed;inset:var(--nav-h) 0 0;z-index:49;background:var(--ink);color:var(--paper);padding:2rem var(--gutter) 3rem;display:flex;flex-direction:column;gap:2.5rem;overflow:auto}
.nav-panel[hidden]{display:none}
.nav-panel ol{display:grid;border-top:1px solid var(--ink-line)}
.nav-panel li a{display:flex;align-items:baseline;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--ink-line);font-size:1.75rem;font-weight:500;letter-spacing:-.03em;text-decoration:none}
.nav-panel li a small{font:400 .75rem/1 var(--mono);letter-spacing:.12em;color:var(--grey);min-width:1.75rem}
.nav-panel .btn{align-self:flex-start;--btn-bg:var(--mint);--btn-fg:var(--ink);--btn-sq:var(--ink);--btn-bg-h:var(--paper)}
@media (max-width:62em){
  .nav-links{display:none}
  .nav-toggle{display:inline-flex}
  .nav-in .btn-sm{order:2}
}
@media (max-width:30em){.nav-in{gap:1rem}.nav-in .btn-sm{padding:0 .85rem;font-size:.875rem}.nav-toggle span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}

/* ---------- cover (hero) ---------- */
.cover{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
/* the column grid printed on the profile covers */
.cover-grid{position:absolute;inset:0;z-index:-1;pointer-events:none}
.cover-grid::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:min(100% - 2*var(--gutter),var(--max));transform:translateX(-50%);background:linear-gradient(to right,var(--ink-grid) 1px,transparent 1px) 0 0/calc(100%/12) 100%;border-right:1px solid var(--ink-grid)}
.cover-grid::after{content:"";position:absolute;left:0;right:0;top:var(--nav-h);bottom:4.25rem;border-block:1px solid var(--ink-grid)}
.hero{flex:1;padding-top:calc(var(--nav-h) + clamp(2.5rem,6vh,4.5rem));padding-bottom:clamp(2.5rem,6vh,4rem);align-items:end;row-gap:3rem}
.hero-copy{grid-column:1/span 7;align-self:end}
.cover-wm{font-size:clamp(6.25rem,2rem + 14.5vw,15.5rem);margin-left:-.045em;padding-bottom:.2em;color:var(--paper)}
.tagline{font:500 .8125rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--paper);margin-top:clamp(.75rem,2vh,1.5rem)}
.hero-brand{margin:0;font:inherit}
.hero-brand .cover-wm,.hero-brand .tagline{display:block}
.hero .statement{margin-top:clamp(1.75rem,4vh,2.75rem);font-weight:500;font-size:clamp(1.7rem,1.15rem + 1.75vw,2.75rem);line-height:1.08;letter-spacing:-.03em;max-width:17em;text-wrap:balance}
.hero .statement .tone{display:block;color:var(--grey)}
.hero .lede{margin-top:1.1rem;color:var(--grey);max-width:31em}
.hero .lede b{color:var(--paper)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 2rem;margin-top:clamp(1.75rem,3.5vh,2.5rem)}
.cover-foot{height:4.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.cover-foot .label{color:var(--grey)}

/* ---------- the run log ---------- */
.runlog{grid-column:8/span 5;align-self:end;position:relative;background:rgba(18,20,19,.9);border:1px solid var(--ink-line);display:flex;flex-direction:column}
.rl-head{display:flex;align-items:center;gap:.7rem;padding:.8rem .8rem .8rem 1.1rem;border-bottom:1px solid var(--ink-line)}
.rl-live{width:.5rem;height:.5rem;background:var(--mint);flex:none}
.runlog.is-running .rl-live{animation:rl-blink 1.8s steps(2,jump-none) infinite}
.runlog:not(.is-running) .rl-live{background:transparent;box-shadow:inset 0 0 0 1px var(--grey)}
@keyframes rl-blink{50%{opacity:.25}}
.rl-title{font:500 .6875rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.rl-sub{font:400 .6875rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
.rl-pause{margin-left:auto;display:inline-flex;align-items:center;gap:.5rem;min-height:2.25rem;padding:0 .7rem;background:none;border:1px solid var(--ink-line);font:500 .6875rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--paper);cursor:pointer;transition:border-color .3s var(--ease)}
.rl-pause:hover{border-color:var(--grey)}
.rl-pause svg{width:.6rem;height:.6rem}
.rl-feed{height:clamp(18rem,40vh,24.5rem);overflow:hidden;-webkit-mask-image:linear-gradient(#000 64%,transparent);mask-image:linear-gradient(#000 64%,transparent)}
.rl-row{display:grid;grid-template-rows:1fr;transition:grid-template-rows .7s var(--ease)}
.rl-row.is-new{grid-template-rows:0fr}
.rl-clip{min-height:0;overflow:hidden}
.rl-in{display:grid;grid-template-columns:.5rem minmax(0,1fr) auto;column-gap:.95rem;align-items:baseline;padding:.8rem 1.1rem;border-bottom:1px solid var(--ink-2);transition:opacity .7s var(--ease),transform .7s var(--ease),filter .7s var(--ease),background-color 2.4s var(--ease)}
.rl-row.is-new .rl-in{opacity:0;transform:translateY(-.5rem);filter:blur(3px)}
.rl-row.is-hot .rl-in{background-color:rgba(20,240,168,.055)}
.rl-sq{width:.5rem;height:.5rem;background:var(--mint);align-self:center;grid-row:1}
.rl-row.human .rl-sq{background:transparent;box-shadow:inset 0 0 0 1px var(--paper)}
.rl-ev{font-size:.96875rem;line-height:1.3;letter-spacing:-.008em;color:var(--paper);min-width:0}
.rl-time{font:400 .6875rem/1 var(--mono);color:var(--grey);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.rl-meta{grid-column:2/span 2;margin-top:.3rem;font:400 .6875rem/1.35 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.rl-row.human .rl-meta b{font-weight:500;color:var(--paper)}
.rl-tray{border-top:1px solid var(--ink-line);padding:.9rem 1.1rem 1rem}
.rl-tray-h{display:flex;justify-content:space-between;gap:1rem}
.rl-tray-h .rl-title{color:var(--paper)}
.rl-exc{margin-top:.7rem;display:grid;gap:.45rem}
.rl-exc li{display:grid;grid-template-columns:.5rem minmax(0,1fr) auto;align-items:center;column-gap:.95rem;padding:.6rem .75rem;border:1px solid var(--ink-line);background:var(--ink-2);transition:opacity .6s var(--ease),transform .6s var(--ease),border-color .6s var(--ease)}
.rl-exc li.is-new{opacity:0;transform:translateY(.5rem)}
.rl-exc li.is-done{opacity:0;transform:translateX(1rem)}
.rl-exc li::before{content:"";width:.5rem;height:.5rem;box-shadow:inset 0 0 0 1px var(--paper)}
.rl-exc li.is-resolving::before{background:var(--paper)}
.rl-exc li span{font-size:.875rem;line-height:1.3;min-width:0}
.rl-exc li small{font:500 .625rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grey);white-space:nowrap}
.rl-exc li.is-resolving small{color:var(--paper)}
.rl-empty{margin-top:.7rem;display:flex;align-items:center;gap:.95rem;padding:.6rem .75rem;border:1px dashed var(--ink-line);font-size:.875rem;color:var(--grey)}
.rl-empty::before{content:"";width:.5rem;height:.5rem;box-shadow:inset 0 0 0 1px var(--grey-dark);flex:none}
.rl-empty[hidden]{display:none}
.rl-foot{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.4rem;padding:.75rem 1.1rem;border-top:1px solid var(--ink-line);font:400 .6875rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.rl-foot span{display:inline-flex;align-items:center;gap:.5rem}
.rl-foot b{font-weight:500;color:var(--paper);font-variant-numeric:tabular-nums}
.rl-foot .k-a{width:.5rem;height:.5rem;background:var(--mint)}
.rl-foot .k-h{width:.5rem;height:.5rem;box-shadow:inset 0 0 0 1px var(--paper)}
.rl-foot .rl-note{margin-left:auto}

/* ---------- 02 the problem ---------- */
.problem-copy{grid-column:1/span 5}
.problem-copy .body{margin-top:clamp(2.5rem,5vw,4rem);max-width:30em}
.problem-copy .body p+p{margin-top:.5rem}
.until{margin-top:clamp(3rem,7vw,6rem);font-weight:500;font-size:clamp(2.2rem,1.3rem + 3vw,3.9rem);line-height:1;letter-spacing:-.04em}
.problem-fig{grid-column:7/span 6;align-self:start;display:grid;gap:clamp(2.5rem,5vw,4rem);padding-top:clamp(0rem,4vw,3rem)}
.tangle{position:relative;aspect-ratio:400/290}
.tangle-svg{width:100%;height:100%;overflow:visible}
.tangle-lines path{fill:none;stroke:var(--ink);stroke-width:.7;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 2.4s var(--ease),opacity .45s var(--ease),stroke-width .45s var(--ease)}
.tangle-lines .w0{opacity:.32}
.tangle-lines .w1{opacity:.18}
.js .tangle:not(.is-in) .tangle-lines path{stroke-dashoffset:1}
.tangle.is-focus .tangle-lines path{opacity:.06}
.tangle.is-focus .tangle-lines path.on{opacity:.9;stroke-width:1.1}
.tangle-nodes{position:absolute;inset:0}
.tn{position:absolute;left:var(--x);top:var(--y);display:flex;align-items:center;gap:.55rem;transform:translate(-.3125rem,-50%);font:500 .6875rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;cursor:default;padding:.35rem .4rem .35rem 0}
.tn-sq{width:.625rem;height:.625rem;background:var(--paper);box-shadow:inset 0 0 0 1px var(--ink);flex:none;transition:background-color .3s var(--ease)}
.tn span{background:var(--paper);padding:.15rem .1rem}
.tn.on .tn-sq{background:var(--ink)}
.chart{position:relative}
.chart svg{width:100%;height:auto;overflow:visible}
.chart .ax{fill:none;stroke:var(--rule);stroke-width:.9}
.chart .ln{fill:none;stroke-width:1.1;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1.8s var(--ease) .4s}
.chart .ln-u{stroke:var(--ink)}
.chart .ln-a{stroke:var(--grey-dark);stroke-dasharray:.012 .01;transition:none}
.js .chart:not(.is-in) .ln-u{stroke-dashoffset:1}
.js .chart .ln-a{clip-path:inset(0 100% 0 0);transition:clip-path 1.8s var(--ease) .55s}
.js .chart.is-in .ln-a{clip-path:inset(0 0 0 0)}
.chart-l{position:absolute;font:500 .6875rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.chart-l.u{right:0;top:4%}
.chart-l.a{right:0;top:57%;color:var(--grey-dark);font-weight:400}
.chart-c{margin-top:.8rem;font:400 .625rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--grey-dark)}

/* ---------- 03 the solution ---------- */
.solution{grid-template-rows:auto 1fr auto}
.solution-copy{grid-column:1/span 5;grid-row:1}
.solution-copy .lede{margin-top:clamp(2.5rem,5vw,4rem);max-width:21em}
.solution-note{grid-column:1/span 4;grid-row:3;align-self:end;margin-top:3rem}
.solution-note::before{content:"";display:block;width:2.25rem;height:1px;background:var(--grey-dark);margin-bottom:1.25rem}
.solution-note p{color:var(--grey)}
.ring-wrap{grid-column:6/span 7;grid-row:1/span 3;align-self:center;padding-inline:clamp(3.75rem,6vw,5.5rem)}
.ring{position:relative;aspect-ratio:1;max-width:36rem;margin-inline:auto}
.ring svg{width:100%;height:100%;overflow:visible}
.ring-base{fill:none;stroke:#4a4d4b;stroke-width:1;vector-effect:non-scaling-stroke}
.ring-arc{fill:none;stroke:var(--mint);stroke-width:2.2;vector-effect:non-scaling-stroke;stroke-dasharray:3 7;stroke-dashoffset:0}
.ring-node{fill:var(--mint)}
.ring-ping{fill:none;stroke:var(--mint);stroke-width:1;vector-effect:non-scaling-stroke;opacity:0;transform-box:fill-box;transform-origin:center}
.ring-wm{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(2.5rem,1.6rem + 2.8vw,4.25rem);pointer-events:none}
.ring-labels li{position:absolute;left:var(--x);top:var(--y);display:grid;gap:.4rem;font:500 .75rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.ring-labels li small{font-weight:400;font-size:.625rem;color:var(--grey);letter-spacing:.1em}
.ring-labels .t{transform:translate(-50%,calc(-100% - 1.1rem));text-align:center}
.ring-labels .r{transform:translate(1.4rem,-50%)}
.ring-labels .rb{transform:translate(1.25rem,.9rem)}
.ring-labels .lb{transform:translate(calc(-100% - 1.25rem),.9rem);text-align:right}
.ring-labels .l{transform:translate(calc(-100% - 1.4rem),-50%);text-align:right}
.ring-labels .lt{transform:translate(calc(-100% - 1.25rem),calc(-100% - .5rem));text-align:right}
.ring-labels .rt{transform:translate(1.25rem,calc(-100% - .5rem))}
@media (prefers-reduced-motion:no-preference){
  .ring.is-live .ring-arc{animation:ring-sweep 14s linear infinite}
  .ring.is-live .ring-ping{animation:ring-ping 14s var(--ease) infinite;animation-delay:calc(var(--k) * 1.7s)}
  .ring.is-live .ring-labels li{animation:ring-lit 14s linear infinite;animation-delay:calc(var(--k) * 1.7s)}
}
@keyframes ring-sweep{0%{stroke-dasharray:0 7;opacity:1}85%{stroke-dasharray:7 0;opacity:1}94%{stroke-dasharray:7 0;opacity:0}100%{stroke-dasharray:0 7;opacity:0}}
@keyframes ring-ping{0%{opacity:.9;transform:scale(1)}9%{opacity:0;transform:scale(3.2)}100%{opacity:0;transform:scale(3.2)}}
@keyframes ring-lit{0%,10%{color:var(--mint)}13%,100%{color:var(--paper)}}

/* ---------- 04 how abriq works ---------- */
.how{border-top:1px solid var(--ink-line);padding-top:calc(var(--bay) * .72)}
.solution-note{padding-bottom:0}
#solution{padding-bottom:calc(var(--bay) * .72)}
.how .h2{max-width:none}
.lanes{margin-top:clamp(3.5rem,7vw,6rem);display:grid;row-gap:clamp(3.25rem,5.5vw,5rem)}
.lane{display:grid;grid-template-columns:minmax(8rem,11.5rem) minmax(0,1fr);align-items:start}
.lane h3{font:500 .75rem/.625rem var(--mono);letter-spacing:.12em;text-transform:uppercase;padding-top:0}
.track{--pad:3rem;--end:2.4rem;--line:calc(var(--pad) + (100% - var(--pad)) * (var(--n) - 1) / 6 + var(--end));position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding-left:var(--pad)}
.track::before{content:"";position:absolute;left:0;top:.3125rem;height:1px;width:var(--line);background:#4a4d4b}
.track::after{content:"";position:absolute;top:calc(.3125rem - 4px);left:var(--line);border-left:8px solid #6a6d6b;border-block:4.5px solid transparent}
.step{position:relative;padding-right:1rem}
.nd{display:block;position:relative;z-index:1;width:.625rem;height:.625rem;background:var(--mint)}
.step > span{display:block;margin-top:1rem;font-size:.9375rem;line-height:1.3;letter-spacing:-.005em;max-width:10.5em}
.hr{position:absolute;left:.3125rem;bottom:calc(100% - .3125rem + .55rem);width:.9rem;height:1.65rem;border-left:1px dotted var(--grey);border-top:1px dotted var(--grey);font:500 .6875rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.hr i{position:absolute;left:100%;top:-.3125rem;width:.625rem;height:.625rem;box-shadow:inset 0 0 0 1px var(--paper)}
.hr b{position:absolute;left:calc(100% + 1.1rem);top:-.3125rem;font-weight:500;line-height:.625rem}
.pk{position:absolute;left:0;top:calc(.3125rem - 2.5px);width:var(--line);height:6px;overflow:hidden;pointer-events:none}
.pk::after{content:"";position:absolute;left:0;top:0;width:6px;height:6px;background:var(--paper);transform:translateX(-10px);opacity:0}
@media (prefers-reduced-motion:no-preference){
  .lanes.is-in .pk::after{animation:pk-run var(--dur,7s) cubic-bezier(.45,0,.55,1) infinite;animation-delay:var(--dl,0s)}
}
@keyframes pk-run{0%{transform:translateX(-10px);opacity:0}6%{opacity:1}88%{opacity:1}100%{transform:translateX(var(--run,600px));opacity:0}}
.legend{display:flex;flex-wrap:wrap;gap:1rem 2.5rem;margin-top:clamp(3.5rem,6vw,5.5rem);padding-top:1.5rem;border-top:1px solid var(--ink-line)}
.legend span{display:inline-flex;align-items:center;gap:.7rem}
.legend i{width:.625rem;height:.625rem;background:var(--mint)}
.legend i.o{background:transparent;box-shadow:inset 0 0 0 1px var(--paper)}

/* ---------- 05 the platform ---------- */
.platform-copy{grid-column:1/span 4}
.platform-copy .h2 .tone{margin-top:.35em}
.modules{grid-column:6/span 7;margin-top:calc(.75rem + clamp(2.75rem,5vw,4.25rem) + 1rem + clamp(1.5rem,2.5vw,2rem));display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(4,auto);grid-auto-flow:column;column-gap:clamp(1.5rem,3.5vw,3rem);border-bottom:0}
.mod{position:relative;padding:1.1rem 0 1.75rem;border-top:1px solid var(--rule);display:grid;grid-template-columns:1fr auto;align-content:start;column-gap:1rem}
.mod:nth-child(4),.mod:nth-child(8){border-bottom:1px solid var(--rule)}
.mod::after{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.mod:hover::after{transform:scaleX(1)}
.mod .n{font:400 .75rem/1 var(--mono);letter-spacing:.1em;color:var(--grey-dark);font-variant-numeric:tabular-nums}
.mod .s{width:.5625rem;height:.5625rem;background:var(--mint);justify-self:end}
.mod h3{grid-column:1/-1;margin-top:1.1rem;font-weight:600;font-size:clamp(1.5rem,1.2rem + .9vw,2rem);line-height:1.05;letter-spacing:-.03em}
.mod p{grid-column:1/-1;margin-top:.6rem;font-size:.96875rem;line-height:1.45;color:var(--grey-dark);max-width:21em}

/* ---------- 06 business impact ---------- */
.impact{margin-top:clamp(3rem,6vw,5rem);border-bottom:1px solid var(--rule)}
.impact > div{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;padding-block:clamp(1.4rem,2.6vw,2.2rem);border-top:1px solid var(--rule)}
.impact dt{grid-column:1/span 8;font-weight:600;font-size:clamp(1.55rem,.95rem + 2.3vw,3rem);line-height:1;letter-spacing:-.035em;text-transform:uppercase}
.impact dd{grid-column:9/span 4;color:var(--grey-dark);max-width:22em}
.impact .p{transition:transform .9s var(--ease)}
.js .impact:not(.is-in) .p{transform:translateY(-1.2em) scale(.4)}
.impact > div:nth-child(2) .p{transition-delay:.08s}
.impact > div:nth-child(3) .p{transition-delay:.16s}
.impact > div:nth-child(4) .p{transition-delay:.24s}
.impact > div:nth-child(5) .p{transition-delay:.32s}

/* ---------- 07 built to scale ---------- */
.scale-copy{grid-column:1/span 5}
.units{font-weight:500;font-size:clamp(2.35rem,1.3rem + 3.6vw,4.4rem);line-height:1.04;letter-spacing:-.036em}
.units span{display:block}
.units span:nth-child(1){color:var(--grey)}
.units span:nth-child(2){color:var(--grey-dark)}
.scale-copy h3{margin-top:clamp(2.25rem,4vw,3.5rem);font-weight:500;font-size:clamp(1.6rem,1.2rem + 1.3vw,2.4rem);letter-spacing:-.035em;line-height:1.1}
.scale-copy p{margin-top:1.5rem;color:var(--grey-dark);max-width:27em}
.scale-fig{grid-column:6/span 7;align-self:center;padding-top:2rem}
.sc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(.75rem,2vw,1.5rem)}
.sc-col{display:flex;flex-direction:column}
.sc-col .label-m{margin-bottom:1rem;font-size:.6875rem;font-variant-numeric:tabular-nums}
.sc-box{aspect-ratio:1;border:1px solid var(--rule)}
.sc-box svg{width:100%;height:100%}
.sc-box rect.fill{transition:clip-path 1.6s var(--ease)}
.js .scale-fig:not(.is-in) .sc-box rect.fill{clip-path:inset(0 0 100% 0)}
.sc-col:nth-child(2) rect.fill{transition-delay:.2s}
.sc-col:nth-child(3) rect.fill{transition-delay:.4s}
.sc-drop{height:clamp(3rem,6vw,5.5rem);width:0;margin-inline:auto;border-left:1px dashed var(--rule)}
.sc-teams{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(.75rem,2vw,1.5rem)}
.sc-team{display:grid;justify-items:center;gap:.9rem}
.sc-team .sq3{display:flex;gap:.3rem;position:relative;z-index:1;background:var(--paper);padding-inline:.4rem}
.sc-team .sq3 i{width:clamp(.8rem,1.4vw,1.1rem);aspect-ratio:1;box-shadow:inset 0 0 0 1.25px var(--ink)}
.sc-team .label{font-size:.625rem;color:var(--grey-dark)}
.sc-teams::before{content:"";position:absolute;left:16.66%;right:16.66%;top:calc(clamp(.8rem,1.4vw,1.1rem)/2);height:1.5px;background:var(--mint)}
.sc-cap{margin-top:2rem;text-align:center;font:500 .75rem/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.fine{margin-top:clamp(4rem,7vw,6rem);font:400 .6875rem/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grey-dark)}

/* ---------- 08 why abriq ---------- */
.why-h{font-weight:500;font-size:clamp(2rem,1.2rem + 2.8vw,3.6rem);line-height:1.08;letter-spacing:-.036em;max-width:21em;text-wrap:balance}
.why-h .tone{display:block;color:var(--grey)}
.why-h .wm{letter-spacing:-.035em}
.compare{width:100%;margin-top:clamp(3rem,6vw,5rem);border-collapse:collapse;table-layout:fixed}
.compare th,.compare td{text-align:left;vertical-align:middle;padding:1rem 0;border-bottom:1px solid var(--rule)}
.compare thead th{padding-block:0 1rem;font:400 .75rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grey-dark)}
.compare thead th:last-child{font:600 1.5rem/1 var(--sans);letter-spacing:-.035em;text-transform:none;color:var(--ink)}
.compare td:first-child,.compare th:first-child{padding-right:2rem;border-right:1px solid var(--rule)}
.compare td:last-child,.compare th:last-child{padding-left:2rem}
.compare tbody tr:last-child td{border-bottom:1px solid var(--grey)}
.compare td{font-size:clamp(1rem,.95rem + .35vw,1.25rem);letter-spacing:-.01em;line-height:1.3}
.compare td:first-child{color:var(--grey)}
.compare td i{display:inline-block;width:.6rem;height:.6rem;margin-right:1rem;vertical-align:.05em}
.compare td:first-child i{box-shadow:inset 0 0 0 1px var(--grey)}
.compare td:last-child i{background:var(--mint)}
.manifesto{margin-top:clamp(3.5rem,7vw,6rem);font-weight:600;font-size:clamp(1.15rem,.85rem + 1.2vw,1.9rem);line-height:1.2;letter-spacing:-.025em;text-transform:uppercase}
.manifesto .wm{text-transform:none;margin-inline:.3em}

/* ---------- 09 vision ---------- */
.vision-h{font-weight:500;letter-spacing:-.038em}
.vision-h .pre{display:block;color:var(--grey);font-size:clamp(1.85rem,1.1rem + 2.6vw,3.35rem);line-height:1.1;max-width:17em;text-wrap:balance}
.vision-h .big{display:block;margin-top:clamp(2.5rem,5vw,4.5rem);font-size:clamp(3.1rem,1.5rem + 6.2vw,7.5rem);line-height:.98;letter-spacing:-.045em;max-width:9.5em}
.vis-rule{position:relative;height:.9rem;margin-top:clamp(3.5rem,7vw,6rem);display:flex;align-items:center}
.vis-rule::before{content:"";flex:1;height:1px;background:#4a4d4b;transform-origin:left;transition:transform 1.6s var(--ease)}
.vis-rule i{width:.9rem;height:.9rem;background:var(--mint);margin-left:.4rem;transition:transform .8s var(--ease) 1.2s,opacity .5s var(--ease) 1.2s}
.js .vis-rule:not(.is-in)::before{transform:scaleX(0)}
.js .vis-rule:not(.is-in) i{transform:translateY(-1.5rem);opacity:0}
.vision .body{margin-top:2rem;color:var(--grey);max-width:32em;font-size:clamp(1.0625rem,.98rem + .35vw,1.25rem)}

/* ---------- close: book a demo ---------- */
.close{position:relative;isolation:isolate;overflow:hidden}
.close .cover-grid::after{top:0;bottom:0}
.close-in{row-gap:4rem;align-items:start}
.close-brand{grid-column:1/span 6}
.close-wm{font-size:clamp(5.5rem,2rem + 11vw,12.5rem);margin-left:-.045em;padding-bottom:.2em}
.close-brand .tagline{margin-top:1.25rem}
.close-brand .sign{margin-top:1.75rem;font-size:clamp(1.6rem,1.2rem + 1.3vw,2.4rem);letter-spacing:-.03em;color:var(--grey);line-height:1.1}
.contact{margin-top:clamp(3rem,7vw,6rem);display:grid;gap:.75rem}
.contact a,.contact span{font:500 .8125rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
.contact .ph{color:var(--grey);font-weight:400}
.demo{grid-column:8/span 5;border:1px solid var(--ink-line);background:rgba(18,20,19,.92);padding:clamp(1.5rem,3vw,2.5rem)}
.demo h2{font-weight:500;font-size:clamp(2rem,1.5rem + 1.5vw,2.75rem);line-height:1;letter-spacing:-.036em}
.demo > p{margin-top:.9rem;color:var(--grey);font-size:1rem;max-width:26em}
.form{margin-top:2rem;display:grid;gap:1.25rem}
.field{display:grid;gap:.5rem;min-width:0;border:0;margin:0;padding:0}
.field > label,.field legend{font:400 .6875rem/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--grey);padding:0}
.field legend{margin-bottom:.5rem}
.field label small,.field legend small{text-transform:none;letter-spacing:.02em;color:var(--grey-dark)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.inp{width:100%;min-height:3rem;padding:.7rem .85rem;background:transparent;border:1px solid var(--ink-line);border-radius:0;font-size:1rem;color:var(--paper);transition:border-color .3s var(--ease),background-color .3s var(--ease)}
.inp::placeholder{color:#6a6d6b}
.inp:hover{border-color:#44474a}
.inp:focus{outline:none;border-color:var(--mint);background:var(--ink-2)}
.inp:focus-visible{outline:none}
textarea.inp{min-height:5.5rem;resize:vertical;line-height:1.45}
.inp[aria-invalid="true"]{border-color:#ff8a7a}
.err{font-size:.8125rem;line-height:1.3;color:#ff8a7a}
.err[hidden]{display:none}
.sizes .opts{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.opt{position:relative;display:flex;align-items:center;gap:.7rem;min-height:2.9rem;padding:.55rem .8rem;border:1px solid var(--ink-line);cursor:pointer;font-size:.9375rem;transition:border-color .3s var(--ease),background-color .3s var(--ease)}
.opt:hover{border-color:#44474a}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt i{width:.625rem;height:.625rem;box-shadow:inset 0 0 0 1px var(--grey);flex:none;transition:background-color .25s var(--ease),box-shadow .25s var(--ease)}
.opt:has(input:checked){border-color:var(--paper);background:var(--ink-2)}
.opt:has(input:checked) i{background:var(--mint);box-shadow:none}
.opt:has(input:focus-visible){outline:2px solid var(--mint);outline-offset:2px}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin-top:.5rem}
.form-foot p{font-size:.8125rem;color:var(--grey);max-width:22em;line-height:1.4}
.btn[disabled]{cursor:progress;opacity:.8}
.btn.is-busy .btn-sq{animation:busy .9s var(--ease) infinite}
@keyframes busy{50%{transform:translateX(.3rem) rotate(90deg)}}
.status{font-size:.9375rem;line-height:1.4}
.status:empty{display:none}
.status.is-error{color:#ff8a7a}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.sent{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--ink-line)}
.sent[hidden]{display:none}
.sent h3{font-weight:500;font-size:1.75rem;letter-spacing:-.03em;line-height:1.1}
.sent p{margin-top:.75rem;color:var(--grey)}

.foot{border-top:1px solid var(--ink-line)}
.foot-in{display:flex;flex-wrap:wrap;align-items:center;gap:1.25rem 2.5rem;padding-block:2rem}
.foot-in .wm{font-size:1.5rem}
.foot-in nav{margin-left:auto}
.foot-in nav ul{display:flex;flex-wrap:wrap;gap:.5rem 1.75rem}
.foot-in nav a{font:400 .6875rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--grey);padding-block:.5rem;display:inline-block}
.foot-in nav a:hover{color:var(--paper)}
.foot-base{padding-block:1.25rem 1.75rem;border-top:1px solid var(--ink-line)}
.foot-base small{display:block;font:400 .6875rem/1.7 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
.foot-base .sep{margin-inline:.9em;color:var(--grey-dark)}
.foot-base a{color:var(--paper);text-decoration:underline;text-decoration-color:var(--grey-dark);text-underline-offset:.3em;transition:text-decoration-color .3s var(--ease)}
.foot-base a:hover{text-decoration-color:var(--mint)}
.foot-base a{white-space:nowrap}
@media (max-width:46em){.foot-base .sep{display:none}.foot-base .credit{display:block}}

/* ---------- responsive ---------- */
@media (max-width:74em){
  .runlog{grid-column:7/span 6}
  .hero-copy{grid-column:1/span 6}
  .modules{grid-column:5/span 8}
  .platform-copy{grid-column:1/span 4}
}
@media (max-width:62em){
  .hero{align-items:start}
  .hero-copy,.runlog{grid-column:1/-1}
  .runlog{max-width:40rem}
  .problem-copy,.problem-fig,.solution-copy,.solution-note,.ring-wrap,.platform-copy,.modules,.scale-copy,.scale-fig,.close-brand,.demo{grid-column:1/-1}
  .problem-fig{padding-top:3.5rem;max-width:40rem}
  .solution{grid-template-rows:none}
  .solution-copy,.ring-wrap,.solution-note{grid-row:auto}
  .ring-wrap{margin-top:3rem;padding-inline:4.25rem}
  .modules{margin-top:3rem!important}
  .impact dt{grid-column:1/-1}
  .impact dd{grid-column:1/-1;margin-top:.75rem}
  .scale-fig{margin-top:3rem;max-width:40rem}
  .demo{max-width:40rem}
  .lane{grid-template-columns:1fr;row-gap:1.5rem}
}
@media (max-width:46em){
  .track{display:block;padding-left:1.9rem}
  .track::before{top:.3rem;left:.3125rem;width:1px;height:calc(100% - 1.5rem)}
  .track::after,.pk{display:none}
  .step{padding:0 0 1.35rem}
  .step:last-child{padding-bottom:0}
  .nd{position:absolute;left:-1.9rem;top:.3rem}
  .step > span{margin-top:0;max-width:none}
  .step{display:flex;flex-direction:column}
  .hr{position:static;order:2;display:flex;align-items:center;gap:.55rem;width:auto;height:auto;border:0;margin-top:.55rem}
  .hr i,.hr b{position:static}
  .modules{grid-template-columns:1fr;grid-auto-flow:row;grid-template-rows:none}
  .mod:nth-child(4){border-bottom:0}
  .compare td:first-child,.compare th:first-child{padding-right:1rem}
  .compare td:last-child,.compare th:last-child{padding-left:1rem}
  .compare td{padding-left:1.25rem;text-indent:-1.25rem}
  .compare td:last-child{padding-left:2.25rem}
  .compare td i{margin-right:.65rem}
  .two,.sizes .opts{grid-template-columns:1fr}
  .cover-foot .label:first-child{display:none}
  .cover-foot{justify-content:flex-start}
  .ring-labels li{font-size:.625rem}
  .ring-labels li small{font-size:.5625rem}
  .ring-wrap{padding-inline:3.25rem}
}
@media (max-width:30em){
  .rl-sub{display:none}
  .rl-in{padding-inline:.9rem;column-gap:.75rem}
  .tn{font-size:.5625rem;gap:.35rem}
  .tn-sq{width:.5rem;height:.5rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
@media print{.nav,.runlog,.skip{display:none}.cover{min-height:auto}}
