body.integrations-page{
  --integration-black:#080807;
  --integration-cream:#ece7d8;
  --integration-gray:#b9b8ad;
  --integration-orange:#e34812;
  --integration-line:#5b594f;
  --integration-edge:max(clamp(1.25rem,5vw,5.5rem),calc((100vw - 92rem)/2));
  --paper:var(--integration-black);
  --ink:var(--integration-cream);
  --muted:#aaa391;
  --tag:var(--integration-orange);
  min-height:100dvh;
  overflow-x:clip;
  background:var(--integration-black);
  color:var(--integration-cream);
}
.integrations-page .integrations-app{
  grid-template-columns:4.25rem minmax(0,1fr);
  grid-template-areas:"nav doc" "terminal terminal";
  gap:0;
  padding:1.25rem 0 0 1rem;
  overflow:visible;
}
.integrations-page .integrations-rail{align-self:start}
.integrations-page .icon-rail .rail-link{background:rgba(236,231,216,.95);color:var(--integration-black)}
.integrations-page .icon-rail .rail-link:hover{background:var(--integration-orange)}
.integrations-page .icon-rail .rail-link::after{background:var(--integration-cream);color:var(--integration-black)}
.integrations-page .integrations-doc{width:100%;max-width:none;margin:0;padding:0;overflow:visible}
.integrations-hero{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(20rem,.95fr) minmax(24rem,1.05fr);
  grid-template-rows:1fr auto;
  gap:clamp(2rem,5vw,6rem);
  min-height:calc(100svh - 1.25rem);
  padding:clamp(1.25rem,2.5vw,2.5rem) var(--integration-edge) clamp(2rem,4vw,3.5rem);
  overflow:hidden;
  background:
    radial-gradient(circle at 75% 46%,rgba(227,72,18,.1),transparent 29rem),
    linear-gradient(90deg,rgba(236,231,216,.025) 1px,transparent 1px) 0 0/5rem 100%,
    var(--gage-distress-image) left top/320px 320px repeat,
    var(--integration-black);
}
.integrations-hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:linear-gradient(112deg,rgba(255,255,255,.025),transparent 34% 70%,rgba(227,72,18,.03));
  pointer-events:none;
}
.integrations-hero-copy{align-self:center;max-width:48rem;padding-block:clamp(5rem,11vh,8rem)}
.integrations-mark{
  display:block;
  width:max-content;
  margin-bottom:clamp(3rem,8vh,6rem);
  color:var(--integration-cream);
  font:800 1rem/1 var(--font-display);
  font-stretch:82%;
  letter-spacing:-.035em;
  text-decoration:none;
}
.integrations-mark:is(:hover,:focus-visible){color:var(--integration-orange)}
.integrations-mark:focus-visible{outline:2px solid var(--integration-orange);outline-offset:.4rem}
.integrations-kicker{
  display:flex;
  align-items:center;
  gap:.65rem;
  margin:0 0 1.3rem;
  color:#bdb6a4;
  font:700 .65rem/1.2 var(--mono);
  letter-spacing:.11em;
  text-transform:uppercase;
}
.integrations-kicker span{width:.72rem;height:.72rem;border:.18rem solid var(--integration-orange);border-radius:50%;box-shadow:0 0 .75rem rgba(227,72,18,.55)}
.integrations-hero h1{
  max-width:9ch;
  margin:0;
  color:var(--integration-cream);
  font-family:var(--font-display);
  font-size:clamp(4.5rem,2rem + 5vw,8.75rem);
  font-weight:800;
  font-stretch:82%;
  line-height:.82;
  letter-spacing:-.055em;
}
.integrations-hero-copy>p:last-child{max-width:38rem;margin:clamp(1.6rem,3vw,2.5rem) 0 0;color:#aaa391;font-size:clamp(1rem,.89rem + .42vw,1.32rem);font-weight:620;line-height:1.55}
.integration-topology{
  position:relative;
  align-self:center;
  justify-self:center;
  width:min(39rem,42vw);
  aspect-ratio:1;
  border:1px solid rgba(236,231,216,.2);
  border-radius:50%;
  transform:rotate(-5deg);
}
.topology-orbit,.topology-axis,.topology-hub,.topology-node,.topology-pulse{position:absolute}
.topology-orbit{inset:17%;border:1px solid rgba(236,231,216,.2);border-radius:50%}
.topology-orbit-two{inset:34%;border-color:rgba(227,72,18,.68)}
.topology-axis-horizontal{top:50%;left:-8%;width:116%;border-top:1px solid rgba(236,231,216,.28)}
.topology-axis-vertical{top:-8%;left:50%;height:116%;border-left:1px solid rgba(236,231,216,.22)}
.topology-hub,.topology-node{display:grid;place-items:center;border:1px solid rgba(236,231,216,.65);background:var(--integration-black);font:750 .62rem/1 var(--mono);letter-spacing:.11em}
.topology-hub{top:50%;left:50%;width:6.7rem;aspect-ratio:1;border:.55rem solid var(--integration-cream);border-radius:50%;background:var(--integration-orange);color:var(--integration-black);font-family:var(--font-display);font-size:1.05rem;letter-spacing:-.02em;transform:translate(-50%,-50%)}
.topology-node{min-width:5.4rem;padding:.65rem .75rem;color:var(--integration-cream);transform:rotate(5deg)}
.topology-node::before{content:"";position:absolute;left:-.32rem;width:.5rem;height:.5rem;border-radius:50%;background:var(--integration-orange)}
.topology-node-books{top:8%;left:15%}
.topology-node-time{top:14%;right:1%}
.topology-node-team{right:-4%;bottom:18%}
.topology-node-api{bottom:7%;left:10%}
.topology-pulse{width:.7rem;height:.7rem;border-radius:50%;background:var(--integration-cream);box-shadow:0 0 .8rem rgba(236,231,216,.8)}
.topology-pulse-one{top:49.2%;left:13%;animation:topology-cross-x 5.5s linear infinite}
.topology-pulse-two{top:74%;left:49.2%;animation:topology-cross-y 6.4s linear infinite reverse}
@keyframes topology-cross-x{to{transform:translateX(calc(min(39rem,42vw) * .74))}}
@keyframes topology-cross-y{to{transform:translateY(calc(min(39rem,42vw) * -.5))}}
.integrations-jump{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:1.15rem;
  border-top:1px solid rgba(236,231,216,.56);
  color:var(--integration-cream);
  font-size:.82rem;
  font-weight:720;
  text-decoration:none;
}
.integrations-jump b{color:var(--integration-orange);font-size:1.25rem;line-height:1}
.integrations-jump:is(:hover,:focus-visible){color:var(--integration-orange);outline:0}
.integrations-jump:focus-visible{box-shadow:inset 0 2px var(--integration-orange)}
.integrations-ledger{margin:0;padding:0}
.integration-family{
  position:relative;
  display:grid;
  grid-template-columns:minmax(16rem,.72fr) minmax(0,1.28fr);
  gap:clamp(3rem,8vw,8rem);
  min-height:78svh;
  padding:clamp(5rem,10vh,8rem) var(--integration-edge);
  color:var(--integration-black);
}
.integration-family::before{content:"";position:absolute;inset:0;opacity:.62;background:var(--gage-distress-image) left top/320px 320px repeat;pointer-events:none}
.integration-family-heading,.integration-register,.integration-request{position:relative}
.integration-family-heading{align-self:start}
.integration-port{display:block;width:3.1rem;height:3.1rem;margin-bottom:clamp(2rem,4vw,3.5rem);border:.55rem solid currentColor;border-radius:50%;background:var(--integration-orange);box-shadow:0 0 0 .35rem var(--integration-orange)}
.integration-family-heading h2{max-width:8ch;margin:0;font-family:var(--font-display);font-size:clamp(3.5rem,1.8rem + 3.2vw,6rem);font-weight:800;font-stretch:82%;line-height:.84;letter-spacing:-.05em}
.integration-family-heading p{max-width:27rem;margin:clamp(1.5rem,3vw,2.5rem) 0 0;font-size:clamp(1rem,.9rem + .35vw,1.18rem);font-weight:620;line-height:1.5}
.integration-register{align-self:center;display:grid;border-top:2px solid currentColor}
.integration-entry{display:grid;grid-template-columns:minmax(10rem,.55fr) minmax(0,1.45fr);gap:clamp(1.5rem,4vw,4rem);padding:clamp(1.3rem,3vw,2rem) 0;border-bottom:1px solid color-mix(in srgb,currentColor 52%,transparent)}
.integration-entry h3{grid-column:1;grid-row:2;margin:0;font-family:var(--font-display);font-size:clamp(1.35rem,1rem + 1vw,2.1rem);font-weight:800;font-stretch:82%;line-height:1.05;letter-spacing:-.025em}
.integration-entry>p:last-child{grid-column:2;grid-row:1/3;align-self:center;max-width:46rem;margin:0;font-size:clamp(.98rem,.91rem + .25vw,1.15rem);line-height:1.58}
.integration-state{grid-column:1;grid-row:1;margin:0;color:color-mix(in srgb,currentColor 70%,transparent);font:700 .58rem/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.integration-family-paper{background:var(--integration-cream)}
.integration-family-gray{background:var(--integration-gray)}
.integration-family-dark{background:var(--integration-black);color:var(--integration-cream)}
.integration-family-dark .integration-family-heading h2{font-size:clamp(3rem,1.6rem + 2.5vw,5rem)}
.integration-family-open{grid-template-rows:1fr auto;background:var(--integration-cream)}
.integration-family-dark .integration-port{color:var(--integration-cream)}
.integration-request{
  grid-column:1/-1;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:2rem;
  margin-top:clamp(3rem,7vh,5rem);
  padding:1.25rem 0 0;
  border-top:2px solid currentColor;
  color:inherit;
  text-decoration:none;
}
.integration-request span{font-size:.8rem;font-weight:700}
.integration-request strong{font-family:var(--font-display);font-size:clamp(1.45rem,1rem + 1.6vw,2.5rem);font-weight:800;font-stretch:82%;letter-spacing:-.025em}
.integration-request:is(:hover,:focus-visible) strong{color:var(--integration-orange)}
.integration-request:focus-visible{outline:2px solid var(--integration-orange);outline-offset:.5rem}
.integrations-page .footer{width:100%;margin:0;padding-inline:var(--integration-edge);clip-path:none;box-shadow:none;color:var(--footer-ink)}
.integrations-page .footer::before{inset:0}
.integrations-page .terminal-shell{left:calc(50% - .5rem);grid-template-columns:minmax(11rem,1fr) minmax(30rem,48vw) minmax(11rem,1fr);min-height:clamp(18rem,36svh,26rem);margin-top:0}
.integrations-page .terminal-wing{align-content:center;padding-block:clamp(2.25rem,5vh,3.75rem)}
.integrations-page .terminal-echo{display:grid;align-content:center;grid-column:2;padding:clamp(2.5rem,6vh,4rem) clamp(1.5rem,4vw,3.5rem);font-size:clamp(.7rem,.62rem + .2vw,.86rem);letter-spacing:.035em}
.integrations-page .terminal-echo::after{top:1.5rem;right:1.5rem}
.integrations-page .gimbal-rail{left:1.75rem!important}
.integrations-page .gimbal-tick-label{right:auto;left:calc(100% + .65rem)}
@media(max-width:74rem){
  .integrations-hero{grid-template-columns:minmax(19rem,.95fr) minmax(21rem,1.05fr)}
  .integration-family{grid-template-columns:minmax(15rem,.68fr) minmax(0,1.32fr);gap:clamp(2.5rem,6vw,5rem)}
  .integration-entry{grid-template-columns:minmax(8.5rem,.5fr) minmax(0,1.5fr)}
}
@media(max-width:55.9375rem){
  .integrations-page .integrations-app{grid-template-columns:minmax(0,1fr);grid-template-areas:"nav" "doc" "terminal";gap:0;padding:1rem 0 0}
  .integrations-page .integrations-rail{margin-inline:1rem}
  .integrations-hero{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;min-height:auto;margin-top:1rem;padding-top:2rem}
  .integrations-hero-copy{padding-block:2rem 0}
  .integrations-mark{margin-bottom:4rem}
  .integration-topology{grid-row:2;width:min(34rem,82vw);margin-block:1rem}
  .integrations-jump{grid-row:3}
  .integration-family{grid-template-columns:minmax(0,1fr);gap:3rem;min-height:auto;padding-block:5rem}
  .integration-family-heading h2{max-width:10ch}
  .integration-entry{grid-template-columns:minmax(9rem,.55fr) minmax(0,1.45fr)}
  .integrations-page .terminal-shell{grid-template-columns:0 minmax(0,1fr) 0;min-height:clamp(17rem,38svh,22rem)}
  .integrations-page .terminal-shell{left:50%}
}
@media(max-width:40rem){
  .integrations-hero{padding-inline:1.25rem}
  .integrations-hero h1{font-size:clamp(4.2rem,20vw,6.8rem)}
  .integration-topology{width:min(28rem,88vw)}
  .topology-hub{width:5.4rem}
  .topology-node{min-width:4.4rem;padding:.5rem;font-size:.52rem}
  .integration-family{padding:4.5rem 1.25rem}
  .integration-family-heading h2{font-size:clamp(3.5rem,17vw,5.3rem)}
  .integration-entry{grid-template-columns:minmax(0,1fr);gap:.5rem;padding-block:1.3rem}
  .integration-entry h3,.integration-entry>p:last-child,.integration-state{grid-column:1;grid-row:auto}
  .integration-entry>p:last-child{margin-top:.45rem}
  .integration-request{align-items:flex-start;flex-direction:column;gap:.5rem}
  .integrations-page .footer{padding-inline:1.25rem}
}
@media(prefers-reduced-motion:reduce){.topology-pulse{animation:none}}