/* One frame follows the existing content widths through every section. */
:root{
  --grid-margin:calc(24 * var(--layout-unit));
  --grid-pad:calc(44 * var(--layout-unit));
  --grid-content:calc(1140 * var(--layout-unit));
  --grid-pair-gap:6px;
  --grid-line:#385B7E33;
  --grid-faint:#385B7E1F;
  --grid-top:calc(96 * var(--layout-unit));
}
.opening{padding-bottom:0}
.hero{margin:var(--grid-top) var(--grid-margin) 0;column-gap:var(--grid-pair-gap);row-gap:0;background:#9CB8D8}
.product-stage,.workflow-panel,.office-scene,.office-foreground,.ascii-hand,
.btn,.wf-card,.wf-mobile-result,.wf-composer,.wf-mini-date,.wf-mini-pipeline span,
input,select,textarea{border-radius:0}
.workflow-panel{--grid-line:#C4DEFF38;--grid-faint:#C4DEFF24}
.grid-section{position:relative;isolation:isolate;width:calc(100% - 2 * var(--grid-margin));margin:0 var(--grid-margin);border-radius:0}
.workflows,.setup,.expansion,.faq,.site-footer{--grid-line:#B9D7FF30;--grid-faint:#B9D7FF18}
.workflows,.setup{padding-inline:var(--grid-pad)}
/* Keep each section’s blue atmosphere independent of its position in the page. */
.workflows{background:radial-gradient(ellipse 80% 100% at 50% 100%,#102D57,transparent 85%),#090D14}
.setup{background:radial-gradient(ellipse 80% 100% at 50% 0%,#102D57,transparent 85%),#090D14}
.wf-inner,.setup-inner,.grid-content{max-width:var(--grid-content);margin-inline:auto;position:relative;z-index:2}

/* Decorative layers never catch a pointer or enter the accessibility tree. */
.opening::before,.section-cross::before,.section-cross::after{box-sizing:border-box}
.page-rails{position:absolute;inset:0;z-index:1;pointer-events:none;
  border-inline:1px solid var(--grid-line);
  background:linear-gradient(var(--grid-line),var(--grid-line)) left var(--grid-pair-gap) top/1px 100% no-repeat,
    linear-gradient(var(--grid-line),var(--grid-line)) right var(--grid-pair-gap) top/1px 100% no-repeat;
  background-origin:border-box;
}
.opening>.page-rails{left:var(--grid-margin);right:var(--grid-margin);height:var(--grid-top)}
.opening::before{content:"";position:absolute;z-index:7;top:var(--grid-top);left:0;right:0;height:calc(var(--grid-pair-gap) + 1px);border-block:1px solid var(--grid-line);pointer-events:none}
.product-stage>.grid-seam,.workflow-panel>.grid-seam{display:none}
/* Reconstruct the complete 3:2 frame inside the two clipped hero scenes. */
.product-stage>.page-rails{width:calc(100% * 5 / 3 + var(--grid-pair-gap));right:auto}
.workflow-panel>.page-rails{width:calc(100% * 5 / 2 + var(--grid-pair-gap));left:auto;right:0}
.product-stage>.page-rails,.office-scene>.page-rails{--grid-line:#385B7E26;--grid-faint:#385B7E20}
.product-stage{box-shadow:inset -1px 0 var(--grid-line)}
.workflow-panel{box-shadow:inset 1px 0 var(--grid-line)}
.grid-seam{position:absolute;z-index:1;left:0;right:0;top:0;height:calc(var(--grid-pair-gap) + 1px);border-block:1px solid var(--grid-line);pointer-events:none}
.office-scene>.page-rails{z-index:8;--grid-line:#385B7E45}
.office-scene>.grid-seam{display:none}
/* Outside the clipped scenes, extend each boundary through the white margins. */
.section-cross{display:block;position:relative;height:0;pointer-events:none}
.section-cross::before,.section-cross::after{content:"";position:absolute;top:0;width:var(--grid-margin);height:calc(var(--grid-pair-gap) + 1px);border-block:1px solid var(--grid-line);pointer-events:none}
.section-cross::before{left:0}
.section-cross::after{right:0}
.hero-intro,.hero-waitlist,.office-copy,.workflow-copy,.feature-detail{z-index:8}
.work-scene{z-index:4}

/* Rules in the gaps stay quieter than the active blue workflow connector. */
.wf-cards{--row-gap:calc(26 * var(--layout-unit));row-gap:var(--row-gap)}
.wf-card{z-index:1}
.wf-card:nth-child(n+4)::before{content:"";position:absolute;left:0;right:0;top:calc(var(--row-gap) / -2 - 1px);height:1px;background:var(--grid-faint);pointer-events:none}
.setup-steps{--step-gap:calc(24 * var(--layout-unit));column-gap:var(--step-gap)}
.setup-steps li+li{border-top:0}
.setup-rail,.setup-fill{border-radius:0}

footer.grid-section>.grid-seam,.footer-endcap>.grid-seam{left:calc(-1 * var(--grid-margin));right:calc(-1 * var(--grid-margin))}
.footer-endcap{height:var(--grid-top);background:#FFF}
.footer-endcap>.grid-seam{top:calc(-1 * var(--grid-pair-gap))}

@media(max-width:1200px){
  .product-stage>.page-rails,.workflow-panel>.page-rails{width:100%;left:0;right:0}
  .product-stage,.workflow-panel{box-shadow:none}
  .workflow-panel>.grid-seam{display:block}
}
@media(max-width:1100px){
  :root{--grid-pad:28px}
  .wf-cards{--row-gap:26px}
  .setup-steps{--step-gap:18px}
}
@media(max-width:760px){
  :root{--grid-margin:12px;--grid-pad:24px;--grid-pair-gap:4px}
  .wf-card::before{display:none}
  .setup{padding-inline:var(--grid-pad)}
  .wf-inner,.setup-inner{max-width:none}
}
@media(max-width:680px){:root{--grid-top:82px}}

/* One title scale across the product sections. */
.workflows .wf-heading h2,.setup h2,.engineering .eng-heading,.expansion h2,.faq h2{
  font:400 clamp(calc(30 * var(--layout-unit)),3.3vw,calc(48 * var(--layout-unit)))/1.08 "Geist",Arial,sans-serif;
  font-stretch:normal;letter-spacing:-.055em;
}