/* Orbit: the official BCCloud marketing design. Motion lives in motion.css. */
:root{--sky-zenith:#050a12;--sky-deep:#09111b;--cloud:#edf5fb;--cloud-dim:#96a9ba;--glint:#a3e7ff;--glint-rgb:163,231,255;--line:#a3d8ff24;--muted:#91a5b7;--display:"DM Sans","Segoe UI",sans-serif;--radius:16px}
body.orbit-site{background:#050a12;color:#edf5fb}
.orbit-site main{overflow:clip}
.wrap{width:min(1600px,calc(100% - 104px));max-width:none}
.top{background:#050a12a6;border-bottom:1px solid #a8d9f21f;backdrop-filter:none;box-shadow:none}
.top.is-scrolled{background:#070d17f5;border-color:#91cffb2e;box-shadow:0 8px 28px #0002}
.nav-inner{height:82px;gap:25px}
.brand{font-size:26px;letter-spacing:-1px;font-weight:500;gap:10px}
.brand b{font-weight:500}.brand-cloud{color:var(--glint);width:36px;height:27px}.brand-dot{display:none}
.desktop-nav{gap:28px;font-size:12px;color:#c2d0df}.nav-actions{gap:25px}
.btn{border-radius:11px;min-height:55px;padding:14px 25px;transition:transform .28s cubic-bezier(.22,1,.36,1),background-color .25s}
.btn-primary{background:linear-gradient(115deg,#a3e7ff,#67cdf4);border-color:#b6eafa77;color:#061a27;box-shadow:inset 0 1px 0 #ffffff66,0 7px 25px #42baff15}
.btn-primary:hover{background:#b3edff;box-shadow:inset 0 1px 0 #ffffff88,0 7px 25px #42baff15}
.btn-small{min-height:40px;border-radius:9px;padding:9px 20px;font-size:12px}
.btn-secondary{background:#0a1523;border-color:#91c6e535}.icon{stroke-width:1.55}
.hero{grid-template-columns:.95fr 1.15fr;gap:42px;min-height:760px;padding:72px 0 90px;isolation:isolate}
.orbit-horizon{position:absolute;left:50%;top:-110px;width:100vw;max-width:2200px;height:calc(100% + 165px);margin-left:max(-50vw,-1100px);z-index:-2;pointer-events:none;mask-image:linear-gradient(#000 70%,transparent 99%);opacity:.96}
.orbit-horizon picture,.orbit-horizon img{display:block;width:100%;height:100%}.orbit-horizon img{object-fit:cover;object-position:55% 38%}
.orbit-horizon::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#050a12a1,transparent 55%),linear-gradient(0deg,#050a12,transparent 23%);pointer-events:none}
.hero-copy{z-index:3;align-self:center;padding-top:0;min-width:0}
.hero-eyebrow{font:400 9px/1.8 var(--body);letter-spacing:3.1px;color:#9ccef0;display:flex;align-items:center;gap:11px;margin-bottom:29px}
.hero-eyebrow>span{width:23px;height:1px;background:#89cfe7}
.hero h1{font-size:clamp(43px,3.75vw,66px);line-height:1.13;letter-spacing:-2.7px;font-weight:500;max-width:none}
.hero h1 .gradient-text{white-space:nowrap}
.gradient-text{color:#a3e7ff;background:linear-gradient(110deg,#c9f2ff,#7cd9ff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hero .lede{margin:27px 0 32px;font-size:clamp(15px,1.12vw,19px);line-height:1.75;max-width:560px;color:#c1cfdf}
.hero .cta-row{gap:30px}.hero-tour-link{display:inline-flex;align-items:center;gap:18px;font-size:13px;color:#b3e6ff;padding:14px 0;transition:color .2s}.hero-tour-link:hover{color:white}.hero-tour-link .icon{width:17px;height:17px}
.hero-note{margin-top:21px;font-size:10px;color:#91a8ba;gap:7px}.hero-note .icon{width:13px;height:13px}.hero-note a:hover{color:#e1f7ff}
.hero-signature{margin-top:56px;display:flex;gap:18px;align-items:flex-start}.hero-signature>span{height:56px;width:1px;background:linear-gradient(#91d5ed,transparent)}.hero-signature p{font:9px/1.9 var(--body);letter-spacing:2.7px;color:#8fb3ce}
.hero-visual{padding:25px 0 185px;z-index:2;isolation:isolate;align-self:center;margin-right:-8px}
.hero-visual::before{inset:-8% -5%;background:radial-gradient(ellipse at 80% 30%,#6fcfff1e,transparent 65%);filter:none}
.hero-window{border-radius:15px;background:#09111d;border-color:#95d4fc63;box-shadow:0 30px 70px #0007,inset 0 1px 0 #d4f4ff2e;transform:none;transition:transform .65s cubic-bezier(.22,1,.36,1)}
.hero-window:hover{transform:translateY(-4px)}
.window-bar{background:linear-gradient(100deg,#0b1420,#101e30);border-color:#8bd7ff1f;color:#b7cfdf;height:38px;font-size:10px;padding-inline:16px}.window-dots i{width:5px;height:5px}.hero-window-label{color:#86a5bd;font-size:9px}
.hero-window>picture{display:block}.hero-window img{width:100%;height:auto;opacity:1}.hero-window .preview-prompt{position:static;background:#0b1828;border-top:1px solid #8bd7ff24;font-size:12px;padding:12px 18px;letter-spacing:.15px}.preview-play{border-color:#93dfff50;background:#172e41}.preview-prompt>.icon{color:#9cdfff}
.orbit-one{width:100%;height:100%;left:4%;top:-1%;opacity:.16;border-color:#92cff54d;transform:rotate(-18deg)}.orbit-two{display:none}.orbit-star{right:0;top:1%;color:#c3edff;opacity:.8;font-size:20px}
.hero-workspaces{position:absolute;right:23px;top:-28px;display:flex;gap:9px;z-index:4;transform:rotate(-3deg)}
.hero-workspaces a{display:flex;gap:9px;align-items:center;padding:11px 16px;background:#0a1726f2;border:1px solid #8bc8ef38;border-radius:8px;font-size:10px;color:#c3daec;box-shadow:0 8px 25px #0004;transition:transform .3s,background-color .3s}
.hero-workspaces a:first-child{border-color:#81d9ff90;background:#113048;color:#afeaff}.hero-workspaces a:hover{transform:translateY(-3px);background:#15324a}.hero-workspaces .icon{width:15px;height:15px;color:#7fd1f4}
.hero-assistant{position:absolute;bottom:25px;left:-27%;width:72%;z-index:4;display:block;padding:19px 21px 17px;background:linear-gradient(125deg,#0d2032f7,#09131ffb);border:1px solid #8fd8ff6b;border-radius:13px;box-shadow:0 20px 50px #0006;transform:rotate(2deg);transition:transform .45s cubic-bezier(.22,1,.36,1),border-color .3s}
.hero-assistant:hover{transform:rotate(0deg) translateY(-4px);border-color:#bcecff}
.hero-panel-heading{display:flex;align-items:center;gap:10px;font-size:13px;color:#b0eaff}.hero-panel-heading>.icon{width:20px;height:20px}.hero-panel-chip{margin-left:auto;font-size:7px;letter-spacing:1px;color:#88a9c1;border:1px solid #90c5e326;padding:3px 5px;border-radius:3px}
.hero-command{display:flex;align-items:center;gap:10px;margin-top:15px;padding:10px 10px 10px 12px;border:1px solid #8bbadd2c;border-radius:6px;color:#a9bed1;background:#060f1b44;font-size:10px}.hero-send{display:grid;place-items:center;margin-left:auto;width:29px;height:27px;border-radius:5px;background:#8bdcff;color:#09253b;flex-shrink:0}.hero-send .icon{width:15px;height:15px}
.hero-prompt-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.hero-prompt-tags>span{font-size:8px;border:1px solid #91bad12c;border-radius:15px;padding:3px 8px;color:#a9c8df}
.hero-sharing{position:absolute;right:-10px;bottom:7px;z-index:4;width:42%;padding:17px;background:linear-gradient(120deg,#0c1827fa,#101f2df8);border:1px solid #92d6ff70;border-radius:11px;box-shadow:0 20px 40px #0005;transform:rotate(2deg);transition:transform .45s cubic-bezier(.22,1,.36,1),border-color .3s}.hero-sharing:hover{transform:rotate(0deg) translateY(-4px);border-color:#b9e9ff}
.hero-sharing-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px}.hero-sharing-top .icon{width:14px;height:14px;color:#86b0cb}
.hero-shared-folder{display:flex;gap:11px;align-items:center;margin-top:18px;font-size:11px}.hero-shared-folder>.icon{width:30px;height:30px;color:#84d7fd;fill:#53b6e62b}.hero-shared-folder small{display:block;font-size:8px;color:#97acc0;margin-top:3px}
.hero-share-footer{display:flex;align-items:center;gap:9px;margin-top:21px;border-top:1px solid #8fbbe124;padding-top:12px;font-size:8px;color:#b3dff6}.hero-share-footer>.icon{width:12px;height:12px;margin-left:auto}.hero-share-people{display:flex;padding-left:4px;margin-right:3px}.hero-share-people i{display:grid;place-items:center;font-style:normal;font-size:8px;width:21px;height:21px;border:1px solid #10263c;border-radius:50%;margin-left:-4px;color:#d4ebfa;background:#365c75}.hero-share-people i:nth-child(2){background:#485467}.hero-share-people i:nth-child(3){background:#253a53}
.visual-caption{position:absolute;right:4px;bottom:-21px;font-size:9px;color:#8da6bb;letter-spacing:.2px}
.benefits{position:relative;z-index:2;grid-template-columns:repeat(4,1fr);padding:34px 0 36px;border-top:1px solid #a2d9ff32;border-bottom:1px solid #a2d9ff24;background:transparent;gap:0}
.benefits>div{padding-inline:32px;border-right:1px solid #9bd4ef24}.benefits>div:first-child{padding-left:0}.benefits>div:last-child{border:0}.benefits strong{font-size:20px;font-weight:500;letter-spacing:-.4px}.benefits span{color:#8ca6bd;font-size:11px;margin-top:5px}
.section{padding-block:110px}.section-heading{gap:40px;margin-bottom:38px}.section-heading h2,.tour-heading h2{font-size:clamp(36px,3.15vw,53px);line-height:1.12;letter-spacing:-1.9px}.section-heading>p{font-size:14px;color:#a0b3c5;line-height:1.8}.eyebrow{font-size:9px;letter-spacing:2px;color:#93c5e2}.eyebrow>span{background:#93dbf5}.muted-heading{color:#a1c1d8}
.feature-grid{gap:23px}.feature-card{background:linear-gradient(135deg,#0c1725,#08121e);border-color:#96d2f62b;border-radius:17px;box-shadow:inset 0 1px 0 #e0f5ff08;padding:31px;transition:border-color .3s,translate .45s cubic-bezier(.22,1,.36,1)}.feature-card:hover{border-color:#9bd6ff6b;box-shadow:inset 0 1px 0 #e0f5ff08;translate:0 -5px;transform:none}.feature-card h3{font-size:25px;letter-spacing:-.8px;font-weight:500}.feature-card>p:not(.feature-kicker){color:#98adc0;font-size:13px;line-height:1.8}.feature-kicker{color:#80bfe2;letter-spacing:1.1px;font-size:8px}.feature-art{border-bottom:1px solid #8bc7ec1d;margin-bottom:28px}.space-row,.share-file,.restored-file{background:linear-gradient(120deg,#142538,#0e1c2d);border-color:#92c5e230;box-shadow:0 8px 25px #0002}.space-row:first-child{border-color:#71cff558}.mini-icon.lavender,.mini-icon.peach{background:#75bfe416;color:#9ad5f6}.recovery-orbit{border-color:#8dd3ed37;color:#a1e5ff}.text-link{color:#a3e0ff;font-size:12px}.text-link:hover{color:#effaff}
.assistant-section{padding-top:50px}.assistant-grid{border-radius:20px;border:1px solid #8dd7ff38;background:radial-gradient(ellipse at 85% 20%,#12344c6b,transparent 60%),#0a1421;box-shadow:0 26px 70px #0003;overflow:hidden}.assistant-copy h2{font-size:clamp(35px,3.3vw,53px);letter-spacing:-1.8px}.assistant-preview{background:#09131f;border-color:#98d3ff43;box-shadow:0 25px 55px #0005}.assistant-preview-heading{color:#a4daef}.assistant-preview figcaption{color:#9db7ca}.assistant-benefits p{color:#97b0c5}.assistant-prompts{border-color:#89c1e424}.assistant-prompts>span{background:#0d1b2b;border-color:#95cbe032;color:#a9c5d9}
.tour-section{position:relative;padding:105px 0 95px;background:radial-gradient(ellipse at 50% 12%,#17344b6b,transparent 64%),#060d17;border-block:1px solid #8dd4ff21;overflow:clip}.tour-section::before{content:"";position:absolute;left:8%;right:8%;top:0;height:1px;background:linear-gradient(90deg,transparent,#8bd8fb88,transparent);pointer-events:none}.tour-heading h2{font-size:clamp(38px,3.4vw,56px)}.tour-heading>p:last-child{font-size:14px;color:#9db3c7}.tour-tabs{gap:8px;margin-top:35px}.tour-tabs button{border-radius:8px;background:#0a1625;border-color:#93c7e624;transition:color .2s,background-color .2s,border-color .2s}.tour-tabs button[aria-selected=true]{background:#17394f;color:#b6ecff;border-color:#90d7ff72;box-shadow:inset 0 1px 0 #bdefff22}.tour-frame{margin-top:22px;border-color:#91cfff51;border-radius:15px;box-shadow:0 35px 85px #0007}.tour-frame .window-bar{height:42px}.tour-screen{background:#080f1a}.tour-caption{background:linear-gradient(120deg,#0d1b2b,#081422);border-color:#88bfdf2a}.tour-number{color:#8bccea;letter-spacing:2px}.tour-description h3{font-size:25px;letter-spacing:-.8px}.tour-description p{color:#a0b5ca}.video-control{border-color:#a0dcfc5b;background:#0c2034ed;backdrop-filter:none;box-shadow:0 4px 14px #0004}.demo-picker select{background-color:#0a1929;border-color:#8fc8e83a}.tour-bottom{color:#99b3c8}
.personal-section{padding-block:115px;gap:90px}.personal-copy h2{font-size:clamp(35px,3.4vw,54px);letter-spacing:-1.8px}.personal-copy>p:not(.eyebrow){font-size:14px;color:#9db4c9}.personal-art{background:radial-gradient(ellipse,#153c584d,transparent 69%)}.personal-cloud{animation:none!important;background:none;border:0;box-shadow:none}.personal-cloud svg{color:#a3e7ff}.theme-orbit{border-color:#84c3ed30}.theme-palette{background:#0f2033;border-color:#93cef448}.theme-star{color:#a8dfff}
.subscriptions-section{padding-top:45px}.subscription-grid{gap:23px}.subscription-card{border-color:#90c9e830;background:linear-gradient(135deg,#0d1a2a,#091320);border-radius:16px;box-shadow:inset 0 1px 0 #e2f5ff08;transition:translate .4s cubic-bezier(.22,1,.36,1),border-color .3s}.subscription-card:hover{translate:0 -5px;transform:none;border-color:#9bdcff6b}.subscription-pro{background:radial-gradient(ellipse at 85% 0,#1a4e7066,transparent 65%),#0b1c2c;border-color:#94dfff91;box-shadow:inset 0 1px 0 #c8f1ff33,0 18px 50px #0e578314}.subscription-pro .plan-kicker,.plan-ai strong,.plan-ai-link{color:#a7eaff}.subscription-card .plan-price{letter-spacing:-1.4px}.plan-discount{color:#b7eaf8;background:#77d3f31a;border-color:#8cdaff36}.plan-icon{background:#8ed7ff12;color:#9ddff9}.plan-features .icon{color:#90d5f8}.subscription-included{color:#a0b7ca}
.faq-section{padding-top:25px;gap:90px}.faq-intro h2{font-size:clamp(35px,3.1vw,51px);letter-spacing:-1.8px}.faq-list details{border-color:#89bfdc28}.faq-list summary{font-weight:500;font-size:15px;color:#d8e6f1;padding-block:23px}.faq-list details[open] summary{color:#abe7ff}.faq-list details p{color:#9bb2c6;line-height:1.85;font-size:13px}.faq-intro>p:last-child{color:#91a9bf}
.closing{position:relative;border-radius:19px;overflow:hidden;padding:82px 35px 77px;margin-bottom:70px;border:1px solid #8cd1ff43;background:linear-gradient(90deg,#07111beb,#0a1a2c8c),url('assets/orbit/horizon.webp') 50% 70%/cover;box-shadow:0 20px 80px #0004}.closing-glow{display:none}.closing h2{font-size:clamp(44px,4.3vw,70px);line-height:1.06;letter-spacing:-2.7px}.closing>p:not(.eyebrow){color:#aec7da}.closing .btn{margin-top:28px}.closing-note{font-size:10px;color:#92b0c8}
.foot{border-top:1px solid #8ec6e02b;padding-block:38px 33px;align-items:center}.foot .brand{font-size:23px}.foot p{color:#819db3}.foot nav{gap:27px;font-size:12px;color:#9eb5c7}.copyright{color:#7393ad;font-size:10px}.skip-link:focus{background:#a3e7ff;color:#071827}a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #a3e7ff;outline-offset:5px}
@media(min-width:1750px){.hero{min-height:calc(100svh - 83px);gap:50px;padding-top:70px;padding-bottom:85px}.hero-visual{margin-right:0}.hero h1{font-size:67px}.hero-assistant{bottom:6px}.hero-sharing{bottom:-5px}.visual-caption{bottom:-33px}}
@media(max-width:1200px){.wrap{width:calc(100% - 72px)}.desktop-nav{gap:16px;font-size:11px}.nav-actions{gap:17px}.hero{gap:22px;min-height:700px;padding-block:93px 115px}.hero h1{font-size:clamp(39px,4vw,48px);letter-spacing:-1.8px}.hero-eyebrow{font-size:8px;letter-spacing:2px}.hero .lede{font-size:15px}.hero .cta-row{gap:20px}.hero-tour-link{font-size:11px;gap:10px}.hero .btn{font-size:12px;padding:13px 18px}.hero-assistant{width:83%;left:-39%;bottom:1px;padding:16px}.hero-sharing{width:46%;right:-7px;bottom:-8px;padding:14px}.hero-panel-chip{display:none}.hero-prompt-tags{gap:4px}.hero-prompt-tags>span{font-size:7px;padding:3px 6px}.hero-sharing-top{font-size:9px}.hero-shared-folder{font-size:10px;gap:7px}.hero-workspaces{right:10px;gap:6px}.hero-workspaces a{font-size:9px;padding:9px 11px}.hero-command{font-size:9px;gap:5px}.hero-signature{margin-top:44px}.visual-caption{bottom:-44px}.feature-card{padding:25px}.feature-card h3{font-size:22px}.feature-grid,.subscription-grid{gap:16px}.section-heading>p{font-size:13px}.personal-section,.faq-section{gap:50px}.benefits>div{padding-inline:22px}.benefits strong{font-size:18px}.benefits span{font-size:10px}}
@media(max-width:960px){.wrap{width:calc(100% - 56px)}.nav-inner{height:73px}.hero{grid-template-columns:minmax(0,1fr);gap:60px;padding:72px 0 120px;min-height:0}.hero-copy{text-align:center;max-width:680px;margin-inline:auto}.hero-eyebrow{justify-content:center}.hero h1{font-size:clamp(43px,6.3vw,62px);letter-spacing:-2.4px}.hero .lede{max-width:none;margin:23px 0 26px;font-size:17px}.hero .cta-row,.hero-note{justify-content:center}.hero-signature{display:none}.hero-visual{width:min(700px,90%);margin:auto;padding-bottom:185px}.hero-workspaces{top:-34px;right:22px}.hero-assistant{width:61%;left:-6%;bottom:0;padding:19px}.hero-sharing{width:39%;right:-5%;bottom:-12px;padding:17px}.hero-window{transform:none}.hero-command{font-size:10px}.hero-prompt-tags>span{font-size:8px}.hero-panel-heading{font-size:12px}.hero-sharing-top{font-size:10px}.visual-caption{bottom:-43px}.orbit-horizon{height:112%;top:-80px;mask-image:linear-gradient(#000 82%,transparent 100%)}.orbit-horizon img{object-position:64% 50%}.orbit-horizon::after{background:linear-gradient(0deg,#050a12,transparent 35%),linear-gradient(#050a1255,transparent)}.benefits{padding-block:30px;grid-template-columns:repeat(2,1fr);gap:28px 0}.benefits>div{padding:0 28px;text-align:left}.benefits>div:nth-child(odd){padding-left:0}.benefits>div:nth-child(even){border:0}.section{padding-block:80px}.assistant-section{padding-top:15px}.feature-card{padding:27px}.section-heading h2{font-size:43px}.tour-section{padding:78px 0}.tour-tabs{gap:6px}.tour-tabs button{font-size:11px}.personal-section{gap:45px}.subscriptions-section{padding-top:20px}.faq-section{padding-top:5px;gap:40px}.closing{padding-block:65px;margin-bottom:45px}.closing h2{font-size:57px}.foot{padding-block:30px}.mobile-nav{background:#08111c}.mobile-nav a{border-bottom:1px solid #91b8d214;padding:13px 4px}.mobile-nav a:last-child{border:0}}
@media(max-width:700px){.wrap{width:calc(100% - 40px)}.nav-inner{height:68px;gap:15px}.brand{font-size:23px}.brand-cloud{width:29px;height:23px}.nav-actions{gap:10px}.nav-actions .btn{font-size:11px;padding:8px 13px;min-height:37px}.hero{padding-top:55px;gap:48px;padding-bottom:105px}.hero-copy{text-align:left;width:100%}.hero-eyebrow{justify-content:flex-start;font-size:7px;letter-spacing:1.7px;margin-bottom:22px}.hero h1{font-size:clamp(32px,6.8vw,46px);letter-spacing:-1.4px;line-height:1.16}.hero .lede{font-size:14px;margin:20px 0 24px;line-height:1.7}.hero .cta-row,.hero-note{justify-content:flex-start}.hero .cta-row{gap:19px}.hero .btn{min-height:48px;padding:12px 18px;font-size:12px}.hero-tour-link{font-size:11px;gap:10px}.hero-note{font-size:9px;flex-wrap:wrap;gap:7px}.hero-visual{width:95%;margin:auto;padding-top:13px;padding-bottom:140px}.hero-workspaces{top:-36px;right:0;gap:5px}.hero-workspaces a{padding:7px 9px;font-size:8px;gap:6px}.hero-workspaces .icon{width:12px;height:12px}.hero-window{border-radius:11px}.hero-window .window-bar{height:29px;font-size:8px;padding-inline:10px}.hero-window-label{display:none}.preview-prompt{font-size:8px;padding:22px 10px 11px;gap:7px}.preview-play{width:21px;height:21px}.preview-play .icon{width:9px;height:9px}.hero-assistant{left:-2%;bottom:2px;width:66%;padding:13px 12px 11px;border-radius:9px}.hero-panel-heading{font-size:10px;gap:7px}.hero-panel-heading>.icon{width:16px;height:16px}.hero-command{margin-top:10px;padding:7px 6px;font-size:7px;gap:3px}.hero-send{width:20px;height:20px}.hero-send .icon{width:12px;height:12px}.hero-prompt-tags{margin-top:8px;gap:3px}.hero-prompt-tags>span{font-size:6px;padding:2px 4px}.hero-prompt-tags>span:nth-child(2){display:none}.hero-sharing{width:36%;right:-3%;bottom:13px;padding:11px;border-radius:8px}.hero-sharing-top{font-size:8px;gap:4px}.hero-sharing-top .icon{width:11px;height:11px}.hero-shared-folder{font-size:8px;gap:6px;margin-top:13px}.hero-shared-folder>.icon{width:20px;height:20px;flex-shrink:0}.hero-shared-folder small{font-size:6px;line-height:1.4}.hero-share-footer{font-size:7px;margin-top:13px;padding-top:9px;gap:4px}.hero-share-people{display:none}.hero-share-footer>.icon{width:9px;height:9px}.visual-caption{font-size:8px;bottom:-28px;right:0}.orbit-horizon{height:112%;top:-70px;opacity:.8}.orbit-horizon img{object-position:57% 40%}.hero-visual::before{display:none}.orbit-one{display:none}.orbit-star{font-size:15px;top:-32px;right:20px}.benefits{padding-block:25px;gap:22px 0}.benefits>div{padding-right:0;padding-left:20px}.benefits strong{font-size:17px}.benefits span{font-size:9px;line-height:1.6}.section{padding-block:63px}.section-heading{gap:20px;margin-bottom:28px}.section-heading h2,.tour-heading h2{font-size:35px;letter-spacing:-1.3px}.section-heading>p{font-size:12px}.eyebrow{font-size:8px;letter-spacing:1.4px}.feature-grid{gap:17px}.feature-card{border-radius:13px;padding:25px}.feature-card h3{font-size:24px}.feature-card>p:not(.feature-kicker){font-size:13px}.feature-art{margin-bottom:24px}.assistant-section{padding-top:12px}.assistant-grid{border-radius:14px}.assistant-copy h2{font-size:34px;letter-spacing:-1.2px}.assistant-preview{width:min(100%,360px);margin:auto}.assistant-prompts>span{font-size:10px}.tour-section{padding:60px 0}.tour-heading>p:last-child{font-size:12px}.tour-tabs{margin-top:25px;gap:6px}.tour-tabs button{font-size:10px;padding:9px 10px}.tour-frame{border-radius:10px;margin-top:16px}.tour-frame .window-bar{height:33px;font-size:8px;padding-inline:10px}.recording-label{font-size:7px}.tour-description h3{font-size:22px}.tour-description p{font-size:12px}.video-control{font-size:10px}.tour-bottom{font-size:10px;line-height:1.7}.personal-section{gap:25px}.personal-copy h2{font-size:35px;letter-spacing:-1.3px}.personal-copy>p:not(.eyebrow){font-size:13px}.subscriptions-section{padding-top:16px}.subscription-grid{gap:16px}.subscription-card{border-radius:13px}.faq-section{padding-top:8px;gap:25px}.faq-intro h2{font-size:35px;letter-spacing:-1.3px}.faq-list summary{font-size:13px;padding-block:20px}.faq-list details p{font-size:12px}.closing{width:calc(100% - 40px);padding:55px 22px 48px;border-radius:14px;background-position:65% 65%;margin-bottom:35px}.closing h2{font-size:43px;letter-spacing:-1.6px}.closing>p:not(.eyebrow){font-size:12px}.closing .eyebrow{font-size:7px}.closing .btn{font-size:12px}.foot{gap:25px}.foot nav{gap:23px;font-size:11px}.copyright{padding-top:0}}
@media(max-width:360px){.wrap{width:calc(100% - 32px)}.brand{font-size:21px}.nav-actions{gap:7px}.nav-actions .btn{padding:7px 10px;font-size:10px}.hero h1{font-size:27px;letter-spacing:-1.1px}.hero .cta-row{gap:14px}.hero-tour-link{font-size:10px;gap:5px}.hero .btn{font-size:11px;padding:11px 14px}.hero-command{font-size:6px}.hero-sharing{padding:9px}.hero-sharing-top{font-size:7px}.hero-shared-folder{font-size:7px}.hero-panel-heading{font-size:9px}.hero-assistant{padding:11px}.hero-visual{padding-bottom:140px}.benefits strong{font-size:16px}.closing{width:calc(100% - 32px)}}
@media(prefers-reduced-motion:reduce){.hero-window,.hero-window:hover,.hero-assistant,.hero-assistant:hover,.hero-sharing,.hero-sharing:hover,.hero-workspaces{transform:none}.orbit-horizon{translate:none}.feature-card:hover,.subscription-card:hover{transform:none;translate:none}}
.demo-quality-picker{max-width:1120px;margin:18px auto 0;display:flex;align-items:center;justify-content:flex-end;gap:12px}.demo-quality-picker[hidden]{display:none}.demo-quality-picker label{font-size:10px;color:#91aec4}.demo-quality-picker select{font:500 11px var(--font-body,'DM Sans',sans-serif);color:#d2ecff;background:#0d2032;border:1px solid #95cceb38;border-radius:7px;padding:9px 27px 9px 11px;max-width:100%}.demo-quality-picker option{background:#0d2032}.demo-quality-picker+ .tour-bottom{margin-top:18px}@media(max-width:700px){.demo-quality-picker{justify-content:space-between;gap:8px}.demo-quality-picker label{font-size:9px}.demo-quality-picker select{font-size:10px;padding:9px 10px}}
.demo-quality-status{font-size:10px;color:#b4d8ed;min-width:52px;text-align:right}.demo-quality-status:empty{display:none}@media(max-width:700px){.demo-quality-picker{flex-wrap:wrap}.demo-quality-status{flex-basis:100%;font-size:9px}}

/* Readable supporting copy and a clear path from comparison to preview. */
.desktop-nav { font-size: 14px; gap: 22px; }
.btn-small { min-height: 44px; font-size: 14px; }
.hero .lede { font-size: clamp(17px, 1.2vw, 19px); }
.hero .btn, .hero-tour-link { font-size: 15px; }
.hero-note { font-size: 14px; color: #b9ccdd; flex-wrap: wrap; }
.hero-note a { text-underline-offset: 4px; }
.benefits span { font-size: 14px; line-height: 1.6; }
.section-heading > p, .feature-card > p:not(.feature-kicker),
.assistant-capabilities p, .tour-heading > p:last-child, .tour-description p,
.personal-copy > p:not(.eyebrow), .faq-list details p,
.faq-intro > p:last-child, .closing > p:not(.eyebrow) { font-size: 16px; line-height: 1.7; }
.text-link, .feature-card .text-link { font-size: 15px; min-height: 44px; }
.assistant-lede { font-size: 17px; line-height: 1.7; }
.assistant-capabilities h3 { font-size: 17px; }
.assistant-availability, .assistant-preview figcaption { font-size: 14px; line-height: 1.6; }
.assistant-prompts > span, .assistant-prompts p { font-size: 14px; }
.faq-list summary { font-size: 17px; line-height: 1.5; }
.closing .btn { max-width: 100%; white-space: normal; }
.closing-note, .foot p, .copyright { font-size: 14px; line-height: 1.6; }
.subscription-billing { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; font-size: 14px; line-height: 1.6; }
.preview-badge { color: #c1ecff; border: 1px solid #8bd7ff45; background: #11283b; border-radius: 6px; padding: 5px 10px; font-size: 13px; }
.subscription-availability { color: #b9ccdd; max-width: 750px; margin: -8px 0 28px; font-size: 16px; line-height: 1.7; }
.subscription-next-step { display: flex; justify-content: space-between; align-items: center; gap: 28px; padding: 28px 32px; margin-top: 28px; background: #0b1927; border: 1px solid #8bd7ff35; border-radius: 14px; }
.subscription-next-step h3 { font: 500 24px/1.3 var(--display); letter-spacing: -.5px; }
.subscription-next-step p { margin: 8px 0 0; color: #b9ccdd; font-size: 16px; line-height: 1.6; }
.subscription-next-step .btn { flex-shrink: 0; }
.plan-description { font-size: 16px; min-height: 3.4em; line-height: 1.7; }
.plan-pricing { margin-top: 0; }
.plan-kicker { font-size: 13px; }
.plan-price { font-size: 14px; }
.plan-discount { font-size: 13px; line-height: 1.5; }
.plan-note { font-size: 16px; line-height: 1.6; }
.plan-discount[hidden] { display: none; }
.plan-features { font-size: 16px; line-height: 1.6; }
.plan-features > li > span { min-width: 0; }
.plan-features small { display: block; white-space: normal; margin-top: 3px; font-size: 14px; line-height: 1.6; }
.subscription-included { font-size: 15px; line-height: 1.7; }
.tour-playback { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 24px; border-block: 1px solid #8bd7ff24; background: #0b1828; }
.tour-playback p { color: #b9ccdd; font-size: 14px; line-height: 1.6; margin: 0; }
.tour-playback .video-control { position: static; transform: none; flex-shrink: 0; min-height: 44px; font-size: 14px; border-radius: 8px; }
.tour-playback .video-control:hover { transform: none; }
.demo-quality-picker label, .demo-quality-status { font-size: 13px; }
.demo-quality-picker select { min-height: 44px; font-size: 14px; }
.demo-picker label, .demo-picker > span { font-size: 13px; line-height: 1.6; }
.demo-picker select { min-height: 44px; font-size: 15px; }
.tour-tabs button { min-height: 44px; font-size: 14px; }
.tour-bottom, .tour-bottom > span, .tour-bottom .text-link { font-size: 14px; }
.foot nav { flex-wrap: wrap; font-size: 14px; }
.foot nav a { padding-block: 10px; }

@media (max-width: 1100px) and (min-width: 961px) {
  .desktop-nav { gap: 14px; }
  .nav-actions { gap: 16px; }
}

@media (max-width: 960px) {
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 0; }
  .feature-card > p:not(.feature-kicker) { min-height: 0; }
  .feature-card .text-link { margin-top: 20px; }
  .subscription-next-step { align-items: flex-start; flex-direction: column; }
  .mobile-nav a { font-size: 15px; min-height: 44px; }
}

@media (max-width: 700px) {
  .nav-actions .btn { min-height: 44px; font-size: 14px; padding: 9px 12px; }
  .menu-toggle { min-width: 44px; min-height: 44px; }
  .hero { padding-top: 38px; padding-bottom: 52px; gap: 28px; }
  .hero-eyebrow { font-size: 10px; letter-spacing: 1.3px; }
  .hero .lede { font-size: 17px; line-height: 1.65; }
  .hero .cta-row { gap: 8px 20px; flex-wrap: wrap; }
  .hero .btn, .hero-tour-link { font-size: 15px; min-height: 48px; }
  .hero-note { font-size: 14px; line-height: 1.6; gap: 8px; margin-top: 12px; }
  .hero-visual { width: 100%; margin: 0; padding: 0; display: grid; gap: 14px; }
  .hero-workspaces { display: none; }
  .hero-workspaces a { justify-content: center; flex: 1; font-size: 11px; padding: 9px 6px; min-height: 44px; }
  .hero-window img { max-height: 325px; object-fit: cover; object-position: center top; }
  .hero-window .window-bar { font-size: 10px; height: 34px; }
  .hero-window .preview-prompt { font-size: 14px; min-height: 44px; padding: 10px 12px; }
  .hero-assistant, .hero-assistant:hover { position: static; transform: none; width: 100%; padding: 14px 16px; }
  .hero-panel-heading { font-size: 14px; }
  .hero-panel-chip { font-size: 10px; letter-spacing: .4px; }
  .hero-command { font-size: 12px; line-height: 1.5; padding: 9px 10px; }
  .hero-command .hero-send { flex-shrink: 0; }
  .hero-command, .hero-prompt-tags, .hero-sharing, .visual-caption, .orbit-star { display: none; }
  .eyebrow { font-size: 10px; }
  .tour-tabs { flex-wrap: wrap; justify-content: flex-start; }
  .tour-tabs button { padding: 10px 12px; }
  .tour-playback { align-items: flex-start; padding: 14px 16px; gap: 12px; }
  .tour-playback .video-control { padding: 8px 10px; }
  .demo-quality-picker { gap: 10px; }
  .demo-picker { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .demo-picker select { grid-column: 1; grid-row: auto; }
  .subscription-billing { font-size: 14px; line-height: 1.6; }
  .subscription-next-step { padding: 24px; gap: 20px; }
  .subscription-next-step .btn { width: 100%; padding-inline: 12px; font-size: 15px; }
  .closing .btn { font-size: 15px; }
  .foot nav { gap: 8px 24px; }
}

@media (max-width: 360px) {
  .nav-inner { gap: 8px; }
  .brand { gap: 6px; font-size: 20px; }
  .nav-actions { gap: 6px; }
}

/* Subscription period and checkout controls. */
.subscription-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
/* Pro is the one recommended plan: it gets the brightest edge and a filled
   badge. Max keeps the AI tint but steps back to the standard border. */
.subscription-card.subscription-pro:not(.subscription-max) { border-color: #b7e7ff; }
.subscription-max { border-color: #90c9e830; box-shadow: inset 0 1px 0 #e2f5ff08; }
.subscription-pro .plan-kicker.plan-recommended { color: #071c29; background: #9de3ff; border-color: #c3f0ff; font-weight: 600; }
@media (max-width: 1399px) {
  .subscription-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .subscription-grid { grid-template-columns: minmax(0, 1fr); }
}
.billing-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; margin: 24px 0 30px; }
.billing-controls[hidden] { display: none; }
.billing-toggle { display: inline-flex; gap: 4px; padding: 5px; max-width: 100%; border: 1px solid #98d9f44a; border-radius: 12px; background: #0a1928; }
.billing-toggle button { min-width: 110px; min-height: 44px; padding: 10px 20px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #bed6e8; font: 500 16px/1.4 var(--body); cursor: pointer; }
.billing-toggle button:hover { background: #91d6f51a; color: #e3f5ff; }
.billing-toggle button[aria-pressed="true"] { color: #071c29; background: #9de3ff; border-color: #c3f0ff; box-shadow: inset 0 1px 0 #fff6; }
.billing-toggle button:focus-visible, .plan-checkout:focus-visible { outline: 3px solid #c2eeff; outline-offset: 4px; }
.billing-summary { flex: 1 1 280px; margin: 0; color: #acc1d3; font-size: 16px; line-height: 1.6; }
.subscription-card .plan-features { margin-bottom: 28px; }
.subscription-card .plan-checkout { width: 100%; min-height: 48px; margin-top: auto; padding: 12px 14px; gap: 10px; font-size: 16px; line-height: 1.4; white-space: normal; text-align: center; }
.plan-checkout > .icon { flex-shrink: 0; }
.subscription-account { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 22px; margin: -8px 0 26px; color: #b9ccdd; font-size: 16px; line-height: 1.6; }
.subscription-account p { margin: 0; }
.subscription-account a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: #ace4fc; text-underline-offset: 5px; }
.subscription-account [hidden], .plan-current-billing[hidden] { display: none; }
.subscription-account a:focus-visible { outline: 3px solid #c2eeff; outline-offset: 4px; border-radius: 4px; }
.subscription-card .plan-checkout[aria-disabled="true"] { background: #163f56; border-color: #85c6e066; color: #d4f3ff; cursor: default; box-shadow: none; }
.plan-checkout[aria-disabled="true"] > .icon { display: none; }
.subscription-card .plan-current-billing { margin: 12px 0 0; color: #b5dbe9; text-align: center; font-size: 16px; line-height: 1.5; }
@media (max-width: 700px) {
  .billing-controls { gap: 16px; margin-block: 22px 27px; }
  .billing-summary { flex-basis: 100%; }
}

/* Connected workflows: spacious editorial rows with lightweight vector artwork. */
.workflows { margin-top: 20px; }
.workflow-row { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center; gap: clamp(38px, 5.2vw, 84px); padding: 46px 0; border-top: 1px solid #92cee52b; }
.workflow-copy { min-width: 0; }
.workflow-marker { display: flex; align-items: center; gap: 15px; margin: 0 0 17px; color: #9dd5ee; font-size: 14px; line-height: 1.5; }
.workflow-marker > span { color: #bdeaff; font-variant-numeric: tabular-nums; font-size: 14px; padding-right: 15px; border-right: 1px solid #98d4f34a; }
.workflow-copy > h3 { margin: 0; font: 500 clamp(27px, 2.3vw, 37px)/1.18 var(--display); letter-spacing: -1.2px; max-width: 580px; }
.workflow-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 30px; margin-top: 29px; }
.workflow-details h4 { margin: 0 0 8px; font: 500 18px/1.4 var(--display); color: #e1eef8; letter-spacing: -.2px; }
.workflow-details p { margin: 0; font-size: 16px; line-height: 1.7; color: #acc1d3; }
.workflow-link { margin-top: 26px; min-height: 44px; font-size: 16px; }
.faq-list p[id] { scroll-margin-block-start: 145px; }
.workflow-row-reverse .workflow-copy { grid-column: 2; grid-row: 1; }
.workflow-row-reverse .workflow-art { grid-column: 1; grid-row: 1; }
.workflow-art { min-width: 0; min-height: 350px; position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 19px; padding: 28px 22px; font-size: 14px; line-height: 1.5; color: #bed7e8; }
.workflow-art::before { content: ""; position: absolute; inset: 3% -3%; z-index: -2; background: radial-gradient(ellipse at 50% 50%, #24628b3b, transparent 68%); pointer-events: none; }
.workflow-orbit { position: absolute; width: 100%; aspect-ratio: 1.35; max-height: 370px; border: 1px solid #91d4f41e; border-radius: 50%; transform: rotate(-18deg); z-index: -1; }
.workflow-art .icon { flex-shrink: 0; width: 20px; height: 20px; }
.kit-illustration, .today-illustration { width: min(100%, 410px); border: 1px solid #93d7f44a; border-radius: 17px; background: linear-gradient(130deg, #132b40, #0a1828 85%); box-shadow: 0 22px 50px #0004, inset 0 1px 0 #d4f4ff12; }
.kit-illustration { padding: 24px 25px 0; transform: rotate(-2deg); }
.art-heading { display: flex; align-items: center; gap: 14px; }
.art-heading > div { min-width: 0; }
.art-heading strong { display: block; margin-top: 3px; font-size: 21px; font-weight: 500; color: #e6f5fe; line-height: 1.35; }
.art-heading > div > span { color: #9bbbd1; font-size: 14px; }
.art-icon { display: grid; place-items: center; width: 46px; height: 46px; background: #74cdf515; color: #ace8ff; border: 1px solid #8cd8fb2b; border-radius: 12px; flex-shrink: 0; }
.art-icon .icon { width: 24px; height: 24px; }
.kit-steps { display: grid; gap: 17px; margin: 26px 0; }
.kit-steps > div { display: flex; align-items: center; gap: 12px; min-width: 0; }
.kit-steps > div > span:nth-child(2) { flex: 1; font-size: 14px; }
.art-check { display: grid; place-items: center; width: 24px; height: 24px; background: #83dbef19; border: 1px solid #91dbe852; color: #a7edee; border-radius: 7px; flex-shrink: 0; }
.art-check .icon { width: 16px; height: 16px; }
.art-check-pending { background: transparent; border-color: #99bddc4d; }
.kit-art-footer { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-inline: -25px; padding: 16px 23px; border-top: 1px solid #95cfe62e; color: #a6d8ee; font-size: 14px; }
.kit-art-footer > span, .art-caption-pill { display: flex; align-items: center; gap: 10px; }
.kit-art-footer > span > .icon { width: 17px; height: 17px; }
.art-caption-pill { position: relative; justify-content: center; max-width: 100%; padding: 10px 16px; background: #102439; border: 1px solid #97d7f444; border-radius: 30px; box-shadow: 0 10px 25px #0003; font-size: 14px; line-height: 1.5; text-align: center; }
.art-caption-pill .icon { color: #9cdef8; width: 18px; height: 18px; }
.workflow-document-art { min-height: 415px; }
.workflow-document-art::before { background: radial-gradient(ellipse at 50% 45%, #28637d38, transparent 67%); }
.document-illustration { position: relative; width: min(88%, 320px); padding: 27px 25px 0; border: 1px solid #99d7f751; border-radius: 8px 30px 8px 8px; background: linear-gradient(145deg, #1b354b, #0c1a2a); box-shadow: 0 22px 50px #0005; transform: rotate(-5deg); }
.document-fold { position: absolute; top: 0; right: 0; width: 26px; height: 26px; border-bottom: 1px solid #96cfeb4a; border-left: 1px solid #96cfeb4a; border-radius: 0 29px 0 7px; background: #2a4a60; }
.document-category { display: block; color: #a5c7da; font-size: 14px; margin-bottom: 7px; }
.document-illustration > strong { font-size: 25px; font-weight: 500; letter-spacing: -.6px; color: #e5f6ff; }
.document-lines { display: grid; gap: 13px; padding: 25px 0; }
.document-lines > i { height: 4px; width: 93%; border-radius: 3px; background: #9cc6df2b; }
.document-lines > i:nth-child(2), .document-lines > i:last-child { width: 69%; }
.document-lines > span { display: block; margin: 3px -8px; padding: 7px 8px; border-radius: 5px; background: #8bd4ed20; color: #d0f0ff; font-size: 14px; }
.document-review { display: flex; align-items: center; gap: 8px; padding: 13px 0; border-top: 1px solid #94cce733; color: #b4e6ec; font-size: 14px; }
.document-review .icon { width: 17px; height: 17px; }
.document-collection { position: relative; width: min(100%, 380px); margin-top: -6px; padding: 16px 18px; background: #0c2032f5; border: 1px solid #9eddf454; border-radius: 11px; box-shadow: 0 14px 35px #0005; transform: rotate(2deg); }
.document-collection > span { display: flex; align-items: center; gap: 9px; font-size: 14px; color: #c0eaff; }
.document-collection > div { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.document-collection > div > span { padding: 4px 9px; border: 1px solid #91c8e12b; border-radius: 5px; font-size: 14px; color: #a8c5d9; }
.today-illustration { padding: 24px 26px; transform: rotate(2deg); }
.today-art-heading { display: flex; align-items: center; gap: 15px; }
.today-art-heading > div > span { display: block; font-size: 14px; color: #a4c2d7; }
.today-art-heading strong { display: block; margin-top: 2px; color: #e7f5ff; font-weight: 500; font-size: 30px; letter-spacing: -.8px; }
.today-sun { display: block; width: 44px; height: 44px; flex-shrink: 0; border: 1px solid #b5e9fe9c; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #e0f9ff, #7ac8e2 58%, #467b98); box-shadow: 0 0 30px #8acfea24; }
.today-art-star { margin-left: auto; color: #a4d8f1; font-size: 24px; }
.today-agenda { position: relative; display: grid; gap: 23px; margin-top: 26px; }
.today-agenda::before { content: ""; position: absolute; top: 13px; bottom: 19px; left: 5px; width: 1px; background: linear-gradient(#98d8f565, #98d8f514); }
.today-agenda > div { position: relative; display: flex; align-items: flex-start; gap: 16px; }
.agenda-dot { display: block; width: 11px; height: 11px; margin-top: 6px; flex-shrink: 0; border-radius: 50%; background: #97d9f3; border: 2px solid #264f6a; box-shadow: 0 0 0 5px #12283c; }
.today-agenda > div:nth-child(2) .agenda-dot { background: #b4c7e9; }
.today-agenda > div:nth-child(3) .agenda-dot { background: #9dd7cf; }
.today-agenda strong { display: block; color: #dbeefa; font-size: 16px; line-height: 1.45; font-weight: 500; }
.today-agenda > div > div > span { display: block; margin-top: 3px; font-size: 14px; color: #a1bdd1; }
.cloud-tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 30px; }
.cloud-tool { display: flex; flex-direction: column; min-width: 0; padding: 29px 28px 23px; border: 1px solid #91cfe22e; border-radius: 14px; background: linear-gradient(135deg, #0d1b2a, #091421); }
.cloud-tool-icon { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 21px; background: #9edcff0c; color: #a9e3fb; border: 1px solid #9ddaff2a; border-radius: 11px; }
.cloud-tool-icon > .icon { width: 22px; height: 22px; }
.cloud-tool h3 { margin: 0 0 12px; font: 500 23px/1.28 var(--display); letter-spacing: -.65px; }
.cloud-tool p { margin: 0; color: #acc1d3; font-size: 16px; line-height: 1.7; }
.cloud-tool .text-link { align-self: flex-start; margin-top: auto; padding-top: 19px; font-size: 16px; line-height: 1.5; }

@media (max-width: 1200px) {
  .workflow-row { gap: 35px; }
  .workflow-details { column-gap: 22px; }
  .workflow-art { padding-inline: 12px; }
  .cloud-tools { gap: 16px; }
  .cloud-tool { padding: 25px 23px 20px; }
}

@media (max-width: 960px) {
  .workflow-row { grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 38px 0; }
  .workflow-copy { max-width: 720px; }
  .workflow-row-reverse .workflow-copy, .workflow-row-reverse .workflow-art { grid-column: auto; grid-row: auto; }
  .workflow-art { width: min(100%, 550px); justify-self: center; min-height: 0; padding-block: 22px; }
  .workflow-document-art { padding-top: 25px; }
  .workflow-art::before { inset: -3%; }
  .cloud-tools { grid-template-columns: minmax(0, 1fr); gap: 14px; margin-top: 20px; }
  .cloud-tool { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 20px; padding: 25px; }
  .cloud-tool-icon { grid-column: 1; grid-row: 1 / span 3; margin: 0; }
  .cloud-tool h3, .cloud-tool p, .cloud-tool .text-link { grid-column: 2; }
  .cloud-tool .text-link { justify-self: start; padding-top: 12px; }
}

@media (max-width: 700px) {
  .workflows { margin-top: 12px; }
  .workflow-row { gap: 15px; padding: 30px 0; }
  .workflow-marker { margin-bottom: 13px; gap: 12px; }
  .workflow-marker > span { padding-right: 12px; }
  .workflow-copy > h3 { font-size: 29px; line-height: 1.2; letter-spacing: -.9px; }
  .workflow-details { grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 24px; }
  .workflow-details h4 { margin-bottom: 6px; font-size: 18px; }
  .workflow-details p { font-size: 16px; line-height: 1.65; }
  .workflow-art { padding: 21px 9px 12px; gap: 16px; }
  .workflow-orbit { width: 100%; }
  .kit-illustration { padding: 21px 18px 0; }
  .art-heading { gap: 11px; }
  .art-heading strong { font-size: 20px; }
  .kit-steps { gap: 15px; margin: 22px 0; }
  .kit-steps > div { gap: 9px; }
  .kit-art-footer { margin-inline: -18px; padding: 14px 17px; }
  .art-caption-pill { padding: 9px 12px; gap: 8px; }
  .document-illustration { width: min(89%, 320px); padding-inline: 22px; }
  .document-collection { padding: 14px; }
  .document-collection > div { gap: 6px; }
  .document-collection > div > span { padding: 4px 7px; }
  .today-illustration { padding: 22px 20px; }
  .today-art-heading { gap: 12px; }
  .today-agenda { gap: 20px; margin-top: 22px; }
  .cloud-tools { margin-top: 22px; }
  .cloud-tool { gap: 0 14px; padding: 22px 18px; }
  .cloud-tool h3 { font-size: 23px; }
  .cloud-tool p { font-size: 16px; line-height: 1.65; }
}

@media (max-width: 380px) {
  .workflow-art { padding-inline: 5px; }
  .kit-art-footer > .icon { display: none; }
  .document-illustration { width: 93%; }
  .cloud-tool { display: flex; padding: 23px; }
  .cloud-tool-icon { margin-bottom: 18px; }
}