/* Closing: one line, what the agents do, and one action. After T3 Code's close. */
.closing{padding:clamp(96px,12vw,176px) 24px clamp(96px,11vw,160px);text-align:center;color:var(--sky-ink);background:var(--sky-paper)}
.closing h2{max-width:15ch;margin:0 auto;font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-weight:500;font-size:clamp(44px,6.2vw,92px);line-height:1;letter-spacing:-.045em;text-wrap:balance}
.closing p{max-width:620px;margin:28px auto 0;font-size:clamp(17px,1.4vw,19px);line-height:1.6;color:#46607f;text-wrap:pretty}
.closing-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:40px}
.closing-actions a{display:inline-flex;align-items:center;min-height:52px;padding:0 24px;border-radius:12px;font-size:16px;text-decoration:none;transition:background-color 160ms,box-shadow 160ms}
.closing-primary{background:var(--sky-ink);color:#fff}.closing-primary:hover{background:#0f2f57}
.closing-secondary{color:var(--sky-ink);box-shadow:inset 0 0 0 1px #15396240}.closing-secondary:hover{box-shadow:inset 0 0 0 1px var(--sky-ink)}
@supports (animation-timeline: view()){@media(prefers-reduced-motion:no-preference){body:not(.reduced) .closing>*{animation:close-rise linear both;animation-timeline:view();animation-range:entry 10% entry 70%}body:not(.reduced) .closing p{animation-range:entry 20% entry 80%}body:not(.reduced) .closing-actions{animation-range:entry 30% entry 90%}}}
@keyframes close-rise{from{opacity:0;translate:0 32px}to{opacity:1;translate:0 0}}
/* The closing line, and headings marked data-reads, read themselves in as you scroll: each word fills from faint to full, in order, like Saturn's statements. */
@supports (animation-timeline: view()){@media(prefers-reduced-motion:no-preference){
 body:not(.reduced) h2.reads{animation:none;view-timeline:--close-line block}
 body:not(.reduced) h2.reads .close-word{animation:word-fill linear both;animation-timeline:--close-line;animation-range:cover calc(10% + var(--i) * var(--step)) cover calc(16% + var(--i) * var(--step))}
}}
@keyframes word-fill{from{opacity:.22}to{opacity:1}}
/* The seam: a bank of the printed clouds. Its tops start behind the last product card, and as you
   scroll the bank rises, the nearer layers furthest, like the footer's three depths. The lowest
   row hangs upside down, so the bank ends on cloud outlines, not a line. The near layer always
   covers the paper's bottom edge with its densest rows. ?seam=off shows the paper closing. */
:root{--cloud-ink:#0346b7}
.orbit{position:relative;z-index:2}
.sky-seam{--rise:.6;position:relative;z-index:1;container-type:inline-size;height:30cqw;margin-top:calc(-96px - 8cqw);overflow-x:clip;pointer-events:none;background:var(--sky-paper)}
.seam-cloud{position:absolute;bottom:var(--b);left:var(--x);width:var(--w);height:auto;max-width:none;transform:translateY(calc((1 - var(--rise)) * var(--travel))) scale(var(--flip,1),var(--turn,1))}
.seam-cloud.far{--w:34cqw;--b:14cqw;--travel:4cqw;opacity:.45}
.seam-cloud.mid{--w:42cqw;--b:6cqw;--travel:6cqw;opacity:.85}
.seam-cloud.near{--w:52cqw;--b:-4cqw;--travel:8cqw}
/* The lowest row hangs upside down, so the bank ends on the round tops of clouds, each at its own height, not on a fade. */
.seam-cloud.low{--w:56cqw;--b:-14cqw;--travel:10cqw;--turn:-1}
.f1{--x:6cqw}.f2{--x:58cqw;--flip:-1}
.m1{--x:-6cqw;--flip:-1}.m2{--x:62cqw}
.n1{--x:-12cqw}.n2{--x:22cqw;--flip:-1}.n3{--x:56cqw}
.seam-cloud.l1{--x:-22cqw;--flip:-1;--b:-12cqw}.seam-cloud.l2{--x:14cqw;--w:60cqw;--b:-16cqw}.seam-cloud.l3{--x:54cqw;--flip:-1;--b:-13cqw}
/* One sky from the clouds to the ground: the closing holds the clouds' blue, and the footer starts from it and only gets lighter. */
.closing.on-sky{position:relative;padding-top:calc(17vw + 48px);color:#fff;background:var(--cloud-ink)}
.closing.on-sky + .site-foot{background:linear-gradient(180deg,var(--cloud-ink) 0%,color-mix(in oklab,var(--cloud-ink) 80%,var(--sky-middle)) 18%,var(--sky-middle) 55%,var(--sky-low) 100%)}
.closing.on-sky p{color:#dbe6f6}
.closing.on-sky .closing-primary{background:#fff;color:var(--sky-ink)}.closing.on-sky .closing-primary:hover{background:var(--sky-pill)}
.closing.on-sky .closing-secondary{color:#fff;box-shadow:inset 0 0 0 1px #ffffff70}.closing.on-sky .closing-secondary:hover{box-shadow:inset 0 0 0 1px #fff}
@media(max-width:1180px){.sky-seam{margin-top:calc(-80px - 8cqw)}}
@media(max-width:760px){.sky-seam{margin-top:calc(-56px - 8cqw)}}
@media(max-width:680px){
 .sky-seam{height:60cqw;margin-top:calc(-56px - 10cqw)}
 .seam-cloud.far{--w:70cqw;--b:28cqw;--travel:5cqw}.seam-cloud.mid{--w:86cqw;--b:12cqw;--travel:8cqw}.seam-cloud.near{--w:100cqw;--b:-8cqw;--travel:11cqw}.seam-cloud.low{--w:110cqw;--b:-26cqw;--travel:14cqw}
 .closing.on-sky{padding-top:calc(30vw + 32px)}
 .f1{--x:-14cqw}.f2{--x:46cqw}.m1{--x:-30cqw}.m2{--x:40cqw}.n1{--x:-50cqw}.n2{--x:12cqw}.n3{--x:66cqw}.seam-cloud.l1{--x:-60cqw;--b:-24cqw}.seam-cloud.l2{--x:0cqw;--flip:1;--b:-30cqw}.seam-cloud.l3{--x:55cqw;--b:-26cqw}
}
/* Footer: a still sky, with printed clouds that drift slowly across it at three depths. */
.site-foot{position:relative;isolation:isolate;overflow:hidden;container-type:inline-size;display:flex;flex-direction:column;color:#fff;background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-middle) 52%,var(--sky-low) 100%)}
.foot-upper{position:relative;min-height:calc(460px + 10cqw);padding-bottom:0}
.foot-sky{position:absolute;inset:0;z-index:-1;pointer-events:none}
.foot-cloud{position:absolute;left:0;height:auto;max-width:none;will-change:transform;animation:foot-drift linear infinite}
.foot-cloud.far{top:2%;width:min(36cqw,560px);opacity:.3;animation-duration:240s;animation-delay:-150s}
.foot-cloud.mid{bottom:2%;width:min(56cqw,760px);opacity:.8;animation-duration:170s;animation-delay:-40s;transform:scaleX(-1)}
.foot-cloud.near{bottom:-22%;width:min(76cqw,1000px);animation-duration:120s;animation-delay:-70s}
@keyframes foot-drift{from{translate:-100% 0}to{translate:100cqw 0}}
.site-foot:not(.in-view) .foot-cloud{animation-play-state:paused}
.foot-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:64px;width:100%;max-width:1440px;margin:0 auto;padding:88px 56px 0}
.foot-lead{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.foot-lead h2{max-width:520px;margin:0;font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-weight:400;font-size:48px;line-height:52px;letter-spacing:-.03em}
.foot-cta{padding:12px 20px;border-radius:99px;background:#fff;color:var(--sky-ink);font-size:15px;line-height:20px;text-decoration:none}
.foot-cta:hover{background:var(--sky-pill)}
.foot-links{display:grid;grid-template-columns:repeat(3,minmax(140px,auto));gap:48px}
.foot-links div{display:flex;flex-direction:column;gap:10px}
.foot-links h3{margin:0 0 4px;font-size:13px;line-height:18px;font-weight:500;color:#d6e2f3}
.foot-links a{font-size:15px;line-height:22px;color:#fff;text-decoration:none;text-shadow:0 1px 10px #0845a7}
.foot-links a:hover{text-decoration:underline;text-underline-offset:4px}
/* The ground: a paper band the clouds sink behind. The wordmark and the company line sit on it. */
/* The wordmark stands in front of the clouds, white, across the whole width. */
.foot-base{position:relative;z-index:1;margin-top:-17cqw;pointer-events:none}
.foot-word{margin:0;padding:0 2cqw;white-space:nowrap;font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-weight:500;font-size:22.6cqw;line-height:.74;letter-spacing:-.06em;color:#fff;opacity:.92;padding-bottom:max(1.2cqw,12px)}
.foot-legal{margin:0;font-size:13px;line-height:20px;color:#e3ebf7;text-shadow:0 1px 10px #0845a7}
@media(max-width:900px){
 .site-foot{min-height:0}
 .foot-inner{grid-template-columns:minmax(0,1fr);gap:48px;padding:64px 24px 0}
 .foot-lead h2{font-size:34px;line-height:38px}
 .foot-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
 .foot-upper{min-height:0;padding-bottom:calc(140px + 12cqw)}
 .foot-cloud.far{width:90cqw;top:1%}.foot-cloud.mid{width:110cqw;bottom:-4%}.foot-cloud.near{width:150cqw;bottom:-14%}
}
@media(prefers-reduced-motion:reduce){.foot-cloud{animation:none}}
.reduced .foot-cloud{animation:none}
@supports (animation-timeline: view()){@media(prefers-reduced-motion:no-preference){body:not(.reduced) .foot-word{animation:word-rise linear both;animation-timeline:view();animation-range:entry 0% entry 100%}}}
@keyframes word-rise{from{translate:0 30%;opacity:.3}to{translate:0 0;opacity:.92}}