.demos-page{--font-display:'Space Grotesk',Arial,sans-serif}
.page-shell{max-width:1680px;margin-inline:auto;padding-inline:5%}
.gallery-hero{padding-top:72px}
.gallery-eyebrow{display:flex;align-items:center;gap:12px;font-size:12px!important;letter-spacing:.15em;text-transform:uppercase;color:#a6bfdf;margin:0 0 31px;line-height:1.8}
.gallery-eyebrow>span{width:22px;height:1px;flex:none;background:#8fbbff;box-shadow:0 0 12px #578dff}
.gallery-intro{display:grid;grid-template-columns:1.7fr 1fr;gap:7%;align-items:center}
.gallery-intro>*{min-width:0}
#demos-title{font:700 clamp(40px,5.7vw,88px)/1.06 var(--font-display);letter-spacing:-.055em;margin:0}
#demos-title>.heading-phrase{display:block;width:max-content;max-width:none}
#demos-title .hero-blue{color:#8fbaff;margin-top:9px;text-shadow:0 0 60px #3773d918}
.gallery-intro-copy{padding-top:12px;max-width:420px}
.gallery-intro-copy p{font-size:17px;line-height:1.85;color:#aebed6;margin:0}
.gallery-explore{display:inline-flex;gap:32px;align-items:center;font-size:14px;min-height:48px;margin-top:18px;border-bottom:1px solid #759acc50}
.gallery-explore span{font-size:24px;color:#93beff;transition:transform .25s}
.gallery-explore:hover span{transform:translateY(4px)}
.gallery-footnote{display:flex;align-items:center;justify-content:space-between;margin-top:51px;padding:18px 0;border-bottom:1px solid #7ea7ef29;color:#9bb1cf;font-size:12px}
#motion-toggle{min-height:44px;background:none;border:0;padding:0 0 0 12px;display:flex;align-items:center;gap:12px;font-size:12px;color:#aebed6}
#motion-toggle:hover{color:#fff}
.gallery-section{padding-top:65px;padding-bottom:100px;scroll-margin-top:28px}
.gallery-heading{display:flex;justify-content:space-between;align-items:end;gap:60px;margin-bottom:31px}
.gallery-heading>*{min-width:0}
.gallery-heading .gallery-eyebrow{margin-bottom:19px}
.gallery-heading h2{font:500 clamp(30px,3vw,44px)/1.15 var(--font-display);letter-spacing:-.045em;margin:0}
.gallery-heading>p{max-width:430px;margin:0;color:#9db0cd;font-size:15px;line-height:1.8}
.gallery-filters{display:flex;gap:30px;align-items:center;flex-wrap:wrap;border-bottom:1px solid #7ea7ef29;margin-bottom:36px}
.gallery-filters button{position:relative;border:0;background:none;padding:16px 0;min-height:50px;font-size:14px;color:#9eb2d0;transition:color .2s}
.gallery-filters button:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#8bbaff;box-shadow:0 0 14px #4b8fff;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.gallery-filters button[aria-pressed=true]{color:#eff6ff}
.gallery-filters button[aria-pressed=true]:after{transform:scaleX(1)}
.gallery-filters button:hover{color:#fff}
.filter-note{margin-left:auto;font-size:12px;color:#9bb1cf}
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:65px 45px}
.demo-tile{min-width:0}
.demo-tile[hidden]{display:none}
.demo-link{display:block;outline-offset:8px}
.demo-window{position:relative;transform-style:preserve-3d;border:1px solid #7caae840;border-radius:6px;overflow:hidden;background:#0b1425;box-shadow:0 18px 40px #01050c30;transition:border-color .3s,box-shadow .3s}
.window-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 14px;background:linear-gradient(100deg,#0e213d,#101a2a);color:#a7bddb;font-size:11px;border-bottom:1px solid #7caae82e}
.window-dots{display:flex;gap:5px;min-width:29px}
.window-dots i{width:4px;height:4px;border-radius:50%;background:#6b86ab}
.window-bar>span:last-child{font-size:14px;line-height:1}
.demo-screen{position:relative;overflow:hidden;aspect-ratio:1440/1000}
.demo-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.preview-invite{position:absolute;right:20px;bottom:20px;display:flex;align-items:center;gap:24px;padding:13px 17px;border:1px solid #a5c8fb80;border-radius:4px;background:#091b32eb;box-shadow:0 0 30px #236ddc35;font-size:13px;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}
.preview-invite>span{font-size:20px;color:#a5ccff}
.demo-link:hover .demo-window,.demo-link:focus-visible .demo-window{border-color:#9cc6ff;box-shadow:0 0 30px #397af624,0 22px 45px #01050c40}
.demo-link:hover img{transform:scale(1.018)}
.demo-link:hover .preview-invite,.demo-link:focus-visible .preview-invite{opacity:1;transform:none}
.demo-caption{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:22px}
.demo-caption>div{min-width:0}
.demo-industry{font-size:12px;letter-spacing:.025em;line-height:1.7;color:#9fb5d3;margin:0 0 5px}
.demo-caption h3{font:500 clamp(23px,2.1vw,32px)/1.2 var(--font-display);letter-spacing:-.035em;margin:0;color:#eaf2ff}
.demo-arrow{border:1px solid #7caae840;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex:none;color:#9bc3ff;font-size:22px;transition:background .25s,border-color .25s,transform .25s}
.demo-link:hover .demo-arrow{transform:rotate(45deg);background:#163b6e;border-color:#91bcf5}
.demo-description{font-size:15px;line-height:1.8;color:#a3b6d1;margin:13px 58px 0 0;max-width:490px}
.gallery-closing{padding-bottom:85px}
.closing-line{height:1px;background:linear-gradient(90deg,#b3d4ff80,#4979bd40 40%,#4979bd15);box-shadow:0 0 18px #266ae72b}
.gallery-closing-content{display:grid;grid-template-columns:1.4fr 1fr;gap:70px;align-items:center;padding-top:70px}
.gallery-closing-content>*{min-width:0}
.gallery-closing h2{font:500 clamp(38px,4.5vw,64px)/1.12 var(--font-display);letter-spacing:-.045em;margin:0;color:#ecf3ff;max-width:650px}
.gallery-closing h2 .heading-phrase{display:block;width:max-content}
.gallery-closing p:not(.gallery-eyebrow){max-width:500px;font-size:16px;line-height:1.8;color:#a8bad4;margin:24px 0 0}
.gallery-closing-actions{justify-self:end;display:flex;flex-direction:column;gap:24px}
.gallery-closing-actions .primary-action{font-size:15px;padding:19px 24px;gap:40px}
.gallery-call{display:flex;gap:18px;align-items:center;min-height:44px;font-size:13px;color:#a8bad4}
.gallery-call strong{font-size:16px;font-weight:500;color:#e2edfe}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1100px){.gallery-intro{grid-template-columns:1.5fr 1fr;gap:6%}.gallery-intro-copy p{font-size:16px}.filter-note{display:none}.gallery-grid{column-gap:30px}.gallery-heading>p{max-width:340px}.gallery-closing-content{gap:35px}}
@media(max-width:800px){.gallery-hero{padding-top:45px}.gallery-intro{grid-template-columns:1fr;gap:28px}#demos-title{font-size:clamp(40px,7.6vw,70px)}.gallery-intro-copy{max-width:530px;padding:0}.gallery-footnote{margin-top:26px}.gallery-heading{align-items:start;flex-direction:column;gap:22px}.gallery-heading>p{max-width:530px}.gallery-grid{gap:42px 25px}.gallery-section{padding-top:42px;padding-bottom:60px}.demo-caption{margin-top:17px;gap:10px}.demo-arrow{width:38px;height:38px}.demo-description{margin-right:0;font-size:14px}.gallery-closing-content{grid-template-columns:1fr;gap:30px;padding-top:45px}.gallery-closing-actions{justify-self:start}.gallery-closing{padding-bottom:55px}}
@media(max-width:560px){.page-shell{padding-inline:6%}.gallery-hero{padding-top:34px}.gallery-eyebrow{font-size:11px!important;margin-bottom:25px}#demos-title{font-size:10vw}.gallery-intro-copy p{font-size:16px;line-height:1.8}.gallery-explore{margin-top:15px}.gallery-footnote{font-size:11px;margin-top:23px;padding-block:13px}.gallery-grid{grid-template-columns:1fr;gap:40px}.gallery-filters{gap:0;display:grid;grid-template-columns:1fr 1fr;margin-bottom:28px}.gallery-filters button{text-align:left;padding:15px 10px 15px 0;font-size:13px}.gallery-filters button:after{right:18px}.gallery-heading{gap:20px;margin-bottom:18px}.gallery-heading>p{font-size:14px}.gallery-heading h2{font-size:32px}.demo-caption h3{font-size:27px}.demo-arrow{width:44px;height:44px}.demo-description{font-size:15px}.window-bar{padding:9px 12px}.gallery-closing-actions{width:100%}.gallery-closing-actions .primary-action{gap:15px;padding:18px;font-size:14px}.gallery-call{flex-wrap:wrap;gap:8px 16px}.gallery-closing .gallery-eyebrow{margin-bottom:23px}.gallery-closing h2{font-size:43px}}
@media(prefers-reduced-motion:reduce){.demo-window,.demo-screen img{transform:none!important}}
.motion-paused .demo-window,.motion-paused .demo-screen img{transform:none!important}
