.marketing { --blue:#2563eb; --navy:#10243e; --subtle:#66788e; --rule:#e4eaf1; color:var(--navy); background:white; }
.marketing-width { max-width:1440px; padding-inline:64px; margin-inline:auto; }
.marketing h1,.marketing h2,.marketing h3,.marketing p,.marketing figure { margin:0; }
.marketing em { color:var(--blue); font-style:normal; }
.marketing .wordmark { font-size:30px; letter-spacing:-1.6px; font-weight:600; }
.marketing .button { font-size:13px; min-height:48px; padding:15px 22px; border-radius:6px; }
.marketing .button .arrow { font-size:20px; }
.marketing-nav { background:#ffffffed; border-bottom:1px solid var(--rule); position:sticky; top:0; z-index:5; backdrop-filter:blur(16px); }
.marketing-nav>.marketing-width { display:flex; align-items:center; justify-content:space-between; height:92px; }
.marketing-nav nav { display:flex; gap:34px; align-items:center; font-size:12px; }
.marketing-nav nav>a:hover,.text-cta:hover { color:var(--blue); }
.nav-entry { border-left:1px solid var(--rule); padding-left:34px; font-weight:550; }
#mobile-nav-toggle { display:none; background:none; border:1px solid var(--rule); border-radius:6px; padding:7px 11px; color:var(--navy); }
.skip-link { position:fixed; left:12px; top:-100px; padding:15px; background:var(--navy); color:white; z-index:50; }.skip-link:focus { top:12px; }
.marketing-kicker { font-size:10px; letter-spacing:1.6px; font-weight:600; line-height:1.7; color:var(--subtle); }
.marketing-hero { padding-top:76px; padding-bottom:68px; }
.marketing-hero>.marketing-kicker { display:flex; align-items:center; gap:10px; }.marketing-hero>.marketing-kicker span { width:6px; height:6px; border-radius:50%; background:var(--blue); }
.hero-heading { display:grid; grid-template-columns:1.8fr 1fr; align-items:end; gap:50px; margin:24px 0 52px; }
.hero-heading h1 { font-size:clamp(42px,4.8vw,70px); letter-spacing:-3.6px; line-height:1.1; font-weight:500; }
.hero-intro p { font-size:15px; line-height:1.85; color:var(--subtle); margin-bottom:24px; }.hero-secondary { display:block; margin-top:16px; color:var(--subtle); font-size:11px; }
.hero-proof { position:relative; display:grid; grid-template-columns:minmax(0,1.8fr) minmax(0,1fr); gap:18px; align-items:start; }
.hero-proof figure { overflow:hidden; border:1px solid var(--rule); border-radius:9px; background:#f8fafc; }
.image-label { display:flex; justify-content:space-between; gap:12px; font-size:9px; letter-spacing:.6px; padding:15px 18px; border-bottom:1px solid var(--rule); color:var(--subtle); background:white; }
.hero-proof img { width:100%; display:block; object-fit:cover; object-position:50% 50%; height:390px; }.hero-proof .hero-model { margin-top:56px; }.hero-model img { object-position:44% 50%; }
.hero-proof figcaption { font-size:11px; color:var(--subtle); padding:15px 18px; background:white; border-top:1px solid var(--rule); }.caption-dot { width:5px; height:5px; border-radius:50%; background:#16a379; display:inline-block; margin-right:6px; }
.proof-note { font-size:10px; color:var(--subtle); line-height:1.8; margin-top:17px!important; }
.platform-intro { padding-top:55px; padding-bottom:84px; border-top:1px solid var(--rule); scroll-margin-top:120px; }.platform-intro>div:not(.connection-thread) { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; margin-top:24px; }
.marketing h2 { font-size:clamp(32px,3vw,46px); letter-spacing:-1.9px; line-height:1.2; font-weight:500; }.platform-intro p:not(.marketing-kicker) { font-size:15px; color:var(--subtle); line-height:1.9; max-width:500px; }
.connection-thread { display:flex; align-items:center; justify-content:space-between; margin-top:46px; padding-top:20px; border-top:1px solid #c7d8f6; font-size:12px; color:var(--navy); }.connection-thread span { position:relative; }.connection-thread span:before { content:''; position:absolute; top:-24px; left:0; width:6px; height:6px; background:var(--blue); border-radius:50%; }.connection-thread span:last-child:before { left:auto; right:0; }
.inside-section { padding-top:38px; padding-bottom:90px; scroll-margin-top:115px; }.section-heading { display:flex; justify-content:space-between; gap:60px; align-items:end; margin-bottom:42px; }.section-heading h2 { margin-top:18px; }.section-heading>p { max-width:330px; color:var(--subtle); font-size:14px; line-height:1.85; }
.chapter-layout { display:grid; grid-template-columns:290px minmax(0,1fr); gap:56px; }.chapter-navigation>button,.module-index>button { width:100%; display:flex; align-items:center; gap:16px; text-align:left; background:none; border:0; border-bottom:1px solid var(--rule); color:var(--subtle); padding:20px 0; font-size:14px; }.chapter-navigation>button>span,.module-index>button>span { font-size:10px; color:#9aa8b9; }.chapter-navigation>button>b,.module-index>button>b { margin-left:auto; font-weight:400; }.chapter-navigation>button[aria-selected=true],.module-index>button[aria-selected=true] { color:var(--blue); border-bottom-color:var(--blue); }.chapter-navigation>button[aria-selected=true]>span { color:var(--blue); }
#chapter-copy { margin-top:32px; }#chapter-copy h3 { font-size:23px; font-weight:500; line-height:1.35; letter-spacing:-.6px; }#chapter-copy p { margin-top:16px; color:var(--subtle); font-size:13px; line-height:1.9; }
.chapter-figure { align-self:start; min-width:0; }.screenshot-open { background:#f8fafc; padding:0; border:1px solid var(--rule); border-radius:9px; overflow:hidden; position:relative; width:100%; color:var(--navy); display:block; }.screenshot-open img { width:100%; height:auto; display:block; }.chapter-figure .screenshot-open img { aspect-ratio:1.66; object-fit:cover; object-position:50% 0; }.screenshot-open>span { position:absolute; bottom:15px; right:16px; background:#ffffffed; padding:10px 15px; border:1px solid var(--rule); border-radius:5px; font-size:10px; box-shadow:0 4px 18px #10243e0c; }.screenshot-open:hover>span { color:var(--blue); }.chapter-figure figcaption,.wide-product figcaption { color:var(--subtle); font-size:10px; line-height:1.8; margin-top:15px; }
.drawing-story { background:#f7faff; border-block:1px solid #e7eef9; padding:76px 0; }.drawing-story .section-heading { margin-bottom:40px; }.wide-product .screenshot-open { background:white; border-color:#dae4f2; box-shadow:0 20px 55px -35px #123d8140; }.wide-product img { aspect-ratio:1.95; object-fit:cover; }.drawing-footnote { display:grid; grid-template-columns:1fr 1.4fr .6fr; gap:50px; align-items:start; padding-top:40px; }.drawing-footnote h3 { font-size:24px; font-weight:500; line-height:1.35; letter-spacing:-.6px; }.drawing-footnote p { font-size:13px; color:var(--subtle); line-height:1.85; }.text-cta { display:flex; align-items:center; gap:12px; font-size:12px; color:var(--blue); border-bottom:1px solid #c4d7fd; padding:8px 0 14px; }
.module-section { padding-top:90px; padding-bottom:100px; scroll-margin-top:120px; }.module-editorial { display:grid; grid-template-columns:290px minmax(0,1fr); gap:100px; }.module-index>button { padding:20px 0; }.module-index>button[aria-selected=true]>span { color:var(--blue); }#module-details { border-top:1px solid var(--rule); padding-top:22px; }#module-details h3 { font-size:26px; font-weight:500; line-height:1.4; letter-spacing:-.75px; max-width:480px; margin-top:15px; }#module-details dl { margin:28px 0 0; }#module-details dl>div { display:grid; grid-template-columns:170px 1fr; gap:24px; padding:18px 0; border-top:1px solid var(--rule); }#module-details dt { font-size:13px; font-weight:550; line-height:1.6; }#module-details dd { margin:0; font-size:13px; color:var(--subtle); line-height:1.8; }
.own-workspace { padding-top:55px; padding-bottom:75px; border-top:1px solid var(--rule); }.own-workspace>div { display:grid; grid-template-columns:1fr 1.2fr auto; gap:50px; align-items:center; margin-top:25px; }.own-workspace>div>p { color:var(--subtle); font-size:14px; line-height:1.85; }.workspace-flow { margin-top:36px!important; font-size:11px; color:var(--subtle); display:flex; gap:20px; align-items:center; }.workspace-flow span { color:#9bb1cd; }
.contact-section { border-block:1px solid var(--rule); padding:80px 0; scroll-margin-top:90px; }.contact-layout { display:grid; grid-template-columns:1fr 1fr; gap:110px; }.contact-copy h2 { margin-top:22px; }.contact-copy>p:not(.marketing-kicker) { margin-top:28px; font-size:14px; color:var(--subtle); line-height:1.9; max-width:390px; }.contact-rule { width:60px; height:1px; background:#bfcee2; margin-top:40px; }.contact-copy .contact-detail { font-size:12px!important; }.contact-two { display:grid; grid-template-columns:1fr 1fr; gap:20px; }#contact-form .field { margin-top:0; margin-bottom:23px; }#contact-form label { font-size:12px; }#contact-form input,#contact-form textarea { width:100%; border:1px solid #dce4ee; border-radius:6px; padding:14px; background:white; font:inherit; font-size:13px; color:var(--navy); }#contact-form input { height:48px; }#contact-form textarea { resize:vertical; min-height:140px; line-height:1.8; }#contact-form ::placeholder { color:#91a0b3; }#contact-form small { color:var(--subtle); font-size:10px; }.contact-submit { display:flex; gap:24px; align-items:center; justify-content:space-between; margin-top:26px; }.contact-submit>p { font-size:10px; color:var(--subtle); line-height:1.8; max-width:230px; }.contact-submit button { flex-shrink:0; }.contact-honey { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }#contact-success { padding:60px 0; }#contact-success>span { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:#ecf8f1; color:#168b5b; font-size:23px; margin-bottom:25px; }#contact-success h3 { font-weight:500; font-size:30px; letter-spacing:-.8px; margin:20px 0; }#contact-success>p:last-of-type { font-size:14px; color:var(--subtle); line-height:1.8; }#send-another { margin-top:24px; padding-left:0; color:var(--blue); }
.marketing-footer { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:50px; padding-top:50px; padding-bottom:48px; }.marketing-footer>div>p { color:var(--subtle); font-size:12px; line-height:1.8; margin-top:16px; }.marketing-footer>div:not(:first-child) { display:flex; flex-direction:column; gap:16px; padding-top:7px; font-size:11px; color:var(--subtle); }.marketing-footer a:hover { color:var(--blue); }.marketing-footer .footer-note { font-size:9px; margin-top:auto; }
.screenshot-dialog { width:calc(100vw - 48px); max-width:1800px; max-height:90vh; padding:0; border:1px solid var(--rule); border-radius:12px; background:white; box-shadow:0 20px 100px #10243e44; }.screenshot-dialog::backdrop { background:#10243e88; backdrop-filter:blur(5px); }.screenshot-dialog>div { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:16px 24px; }.screenshot-dialog p { font-size:12px; color:var(--subtle); }.screenshot-dialog button { border:0; background:#f3f6fa; border-radius:50%; width:32px; height:32px; font-size:23px; color:var(--navy); }.screenshot-dialog img { display:block; width:100%; height:auto; }
.marketing .hidden,.count-badge.hidden { display:none!important; }
@media(min-width:1600px) { .marketing-hero { padding-top:90px; }.hero-proof img { height:420px; } }
@media(max-width:1100px) { .marketing-width { padding-inline:36px; }.hero-heading { gap:35px; grid-template-columns:1.5fr 1fr; }.hero-heading h1 { font-size:53px; letter-spacing:-2.5px; }.hero-proof img { height:320px; }.chapter-layout { gap:30px; grid-template-columns:240px minmax(0,1fr); }.module-editorial { gap:50px; grid-template-columns:240px minmax(0,1fr); }.contact-layout { gap:60px; }.contact-submit { align-items:start; flex-direction:column; }.own-workspace>div { grid-template-columns:1fr 1fr; gap:35px; }.own-workspace .button { justify-self:start; }.drawing-footnote { grid-template-columns:1fr 1.4fr; }.drawing-footnote a { justify-self:start; }.platform-intro>div:not(.connection-thread) { gap:50px; } }
@media(max-width:760px) { .marketing-width { padding-inline:22px; }.marketing-nav>.marketing-width { height:76px; }.marketing .wordmark { font-size:27px; }.marketing-nav>.marketing-width>nav { display:none; }#mobile-nav-toggle { display:block; }#mobile-nav { display:flex; flex-direction:column; gap:0; align-items:stretch; padding:10px 22px 20px; }#mobile-nav a { padding:14px 0; border-top:1px solid var(--rule); }.marketing-hero { padding-top:48px; padding-bottom:45px; }.marketing-kicker { font-size:9px; letter-spacing:1.15px; }.hero-heading { display:block; margin:22px 0 35px; }.hero-heading h1 { font-size:clamp(36px,7.6vw,55px); letter-spacing:-1.8px; }.hero-intro { margin-top:25px; }.hero-intro p { font-size:14px; }.hero-proof { gap:12px; grid-template-columns:1.35fr 1fr; }.hero-proof img { height:245px; object-position:47% 50%; }.hero-proof .hero-model { margin-top:35px; }.hero-proof .image-label { padding:12px 10px; font-size:8px; letter-spacing:0; flex-direction:column; gap:6px; }.hero-proof figcaption { font-size:9px; line-height:1.6; padding:12px 10px; }.proof-note { font-size:9px; }.marketing h2 { font-size:34px; letter-spacing:-1.3px; }.platform-intro { padding-top:38px; padding-bottom:45px; }.platform-intro>div:not(.connection-thread) { display:block; margin-top:20px; }.platform-intro>div>p { margin-top:22px; font-size:14px!important; }.connection-thread { margin-top:30px; font-size:10px; }.section-heading { display:block; margin-bottom:28px; }.section-heading>p { margin-top:20px; font-size:13px; }.inside-section { padding-top:25px; padding-bottom:50px; }.chapter-layout { display:flex; flex-direction:column; gap:25px; }.chapter-navigation { display:grid; grid-template-columns:1fr 1fr; gap:0 16px; }.chapter-navigation>button { font-size:12px; gap:10px; padding:17px 0; }#chapter-copy { grid-column:1/-1; margin-top:24px; }#chapter-copy h3 { font-size:24px; }#chapter-copy p { font-size:13px; margin-top:12px; }.chapter-figure { width:100%; }.chapter-figure .screenshot-open img { aspect-ratio:1.4; }.drawing-story { padding:48px 0; }.wide-product img { aspect-ratio:1.4; object-position:50% 50%; }.drawing-footnote { display:block; padding-top:28px; }.drawing-footnote p { margin-top:20px; }.drawing-footnote a { display:inline-flex; margin-top:20px; }.module-section { padding-top:55px; padding-bottom:55px; }.module-editorial { display:block; }.module-index { display:flex; overflow-x:auto; gap:22px; margin-bottom:25px; padding-bottom:8px; }.module-index>button { width:auto; flex-shrink:0; font-size:12px; gap:9px; padding:14px 0; }.module-index>button>b { display:none; }#module-details h3 { font-size:24px; }#module-details dl>div { grid-template-columns:1fr; gap:7px; padding:15px 0; }#module-details dt,#module-details dd { font-size:12px; }.own-workspace { padding-top:35px; padding-bottom:42px; }.own-workspace>div { display:block; margin-top:20px; }.own-workspace>div>p { font-size:13px; margin:24px 0; }.workspace-flow { gap:10px; flex-wrap:wrap; font-size:10px; line-height:1.8; }.contact-section { padding:48px 0; }.contact-layout { display:block; }.contact-copy>p:not(.marketing-kicker) { margin-top:22px; }.contact-rule,.contact-copy .contact-detail { display:none; }#contact-form { margin-top:32px; }.contact-two { grid-template-columns:1fr; gap:0; }.contact-submit { gap:18px; }.contact-submit>p { max-width:none; }.contact-submit>button { width:100%; }.marketing-footer { grid-template-columns:1fr 1fr; gap:30px; padding-top:36px; padding-bottom:35px; }.marketing-footer>div:first-child { grid-column:1/-1; }.marketing-footer>div:not(:first-child) { font-size:10px; }.screenshot-dialog { width:calc(100vw - 20px); }.screenshot-dialog>div { padding:14px; }.screenshot-dialog p { font-size:10px; }.screenshot-open>span { font-size:9px; bottom:10px; right:10px; padding:8px 10px; } }
@media(prefers-reduced-motion:no-preference) { .marketing a,.marketing button { transition:color .18s,border-color .18s,background .18s; }html { scroll-behavior:smooth; } }

.marketing .hero-screenshot { display: block; width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; cursor: zoom-in; }
.marketing .hero-screenshot:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
/* Crawlable content progressively enhances into the existing module tabs. */
.module-panel[hidden] { display:none; }.module-panel+.module-panel { margin-top:60px; }.enhanced .module-panel { margin-top:0; }
.product-paths { display:flex; gap:28px; flex-wrap:wrap; margin-top:28px; font-size:12px; }.product-paths a { color:var(--blue); text-decoration:none; border-bottom:1px solid #c7d8f6; padding-bottom:7px; }
#contact-form fieldset { border:0; padding:0; margin:0; min-width:0; }
.faq-section { display:grid; grid-template-columns:1fr 1.6fr; gap:100px; padding-block:110px; }.faq-intro h2 { font-size:48px; line-height:1.1; letter-spacing:-2px; font-weight:500; margin:25px 0; }.faq-intro>p:not(.marketing-kicker) { font-size:14px; line-height:1.8; color:var(--subtle); margin-bottom:32px; }.faq-answers { border-top:1px solid var(--rule); }.faq-item { border-bottom:1px solid var(--rule); scroll-margin-top:32px; }.faq-item summary { display:grid; grid-template-columns:28px 1fr 24px; align-items:start; gap:16px; padding:23px 0; list-style:none; cursor:pointer; font-size:16px; line-height:1.6; letter-spacing:-.15px; }.faq-item summary::-webkit-details-marker { display:none; }.faq-number { color:#91a1b5; font-size:10px; padding-top:6px; }.faq-toggle { color:var(--blue); text-align:right; font-size:23px; line-height:1.2; transition:transform .18s ease; }.faq-item[open] .faq-toggle { transform:rotate(45deg); }.faq-item[open] summary { color:var(--blue); }.faq-item>p { margin:0 40px 18px 44px; font-size:14px; color:var(--subtle); line-height:1.9; }.faq-permalink { display:inline-block; margin:0 0 25px 44px; font-size:10px; color:var(--subtle); text-decoration:none; }.faq-permalink:hover { color:var(--blue); }.faq-item summary:focus-visible { outline:2px solid var(--blue); outline-offset:4px; border-radius:2px; }
.guide .marketing-nav nav { display:flex; }.breadcrumbs { display:flex; gap:12px; font-size:11px; color:var(--subtle); padding-top:32px; }.breadcrumbs a { text-decoration:none; }.guide-hero { padding:70px 0 55px; max-width:960px; }.guide-hero h1 { font-weight:500; font-size:66px; line-height:1.06; letter-spacing:-3px; margin:30px 0; }.guide-hero>p:not(.marketing-kicker) { font-size:18px; line-height:1.8; color:var(--subtle); max-width:760px; margin-bottom:30px; }.guide-figure { margin:0 0 70px; border:1px solid var(--rule); border-radius:8px; overflow:hidden; }.guide-figure img { width:100%; height:auto; display:block; }.guide-figure figcaption { color:var(--subtle); padding:14px 20px; font-size:11px; line-height:1.6; }.guide-story section { display:grid; grid-template-columns:40px minmax(220px,1fr) 1.6fr; gap:30px; padding:35px 0; border-top:1px solid var(--rule); }.guide-story h2,.guide-modules h2 { font-size:24px; font-weight:500; letter-spacing:-.6px; margin:0; line-height:1.4; }.guide-story section>p:last-child { color:var(--subtle); font-size:15px; line-height:1.85; margin:0; }.guide-modules>section { padding:45px 0; border-top:1px solid var(--rule); }.guide-modules dl { margin-top:24px; }.guide-modules dl>div { display:grid; grid-template-columns:1fr 2fr; gap:40px; padding:16px 0; border-top:1px solid var(--rule); font-size:14px; line-height:1.8; }.guide-modules dd { margin:0; color:var(--subtle); }.guide-next { display:flex; justify-content:space-between; gap:40px; border-top:1px solid var(--rule); padding:65px 0; margin-top:45px; }.guide-next h2 { font-size:40px; font-weight:500; letter-spacing:-1.5px; margin:0; }.guide-next p { color:var(--subtle); font-size:14px; margin-bottom:22px; }.guide-reviewed { font-size:11px; line-height:1.8; color:var(--subtle); margin-bottom:50px; }
@media(max-width:760px) { .faq-section { grid-template-columns:1fr; gap:35px; padding-block:65px; }.faq-intro h2 { font-size:36px; letter-spacing:-1.5px; }.faq-item summary { font-size:15px; gap:10px; grid-template-columns:24px 1fr 20px; }.faq-item>p { margin-left:34px; margin-right:8px; font-size:13px; }.faq-permalink { margin-left:34px; }.product-paths { gap:18px; }.marketing:not(.enhanced):not(.guide) #mobile-nav { display:flex; gap:15px; flex-wrap:wrap; }.guide .marketing-nav { height:auto; }.guide .marketing-nav>.marketing-width { flex-wrap:wrap; gap:18px; padding-block:22px; }.guide .marketing-nav nav { gap:18px; flex-wrap:wrap; font-size:11px; }.guide-hero { padding:40px 0; }.guide-hero h1 { font-size:42px; letter-spacing:-2px; }.guide-hero>p:not(.marketing-kicker) { font-size:15px; }.guide-story section { grid-template-columns:24px 1fr; gap:18px; padding:28px 0; }.guide-story section>p:last-child { grid-column:2; font-size:14px; }.guide-story h2 { font-size:21px; }.guide-modules dl>div { grid-template-columns:1fr; gap:6px; }.guide-next { flex-direction:column; gap:15px; padding-block:40px; }.guide-next h2 { font-size:34px; }.guide-figure { margin-bottom:40px; } }
@media(prefers-reduced-motion:reduce) { .faq-toggle { transition:none; } }