:root{--ink:#173c36;--deep:#10342f;--paper:#f3f1ea;--sand:#e5ddcf;--sage:#cbd8c6;--mono:'DM Mono',monospace;--sans:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans)}a{color:inherit;text-decoration:none}.ref-nav{height:82px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(23,60,54,.17);background:#f7f5ee}.brand{font-size:19px;font-weight:600;letter-spacing:-.05em}.ref-nav nav{display:flex;align-items:center;gap:25px;font-size:13px}.nav-cta{padding:12px 17px;border-radius:24px;background:var(--ink);color:#fff;font-weight:600}.ref-hero{min-height:600px;padding:145px 9vw 90px;color:#fff;background:linear-gradient(90deg,rgba(4,24,22,.91) 0%,rgba(4,24,22,.73) 43%,rgba(4,24,22,.17) 100%),url('assets/cm-systems-case-aerial.png') center/cover}.eyebrow{margin:0 0 22px;font:11px var(--mono);letter-spacing:.1em}.ref-hero .eyebrow{color:#b5e5d5}.ref-hero h1{max-width:920px;margin:0;font-size:clamp(50px,6.6vw,92px);line-height:.98;letter-spacing:-.075em}.ref-hero>p:not(.eyebrow){max-width:650px;margin:27px 0 0;font-size:18px;line-height:1.58;color:#e0ece6}.jump-links{display:flex;gap:24px;margin-top:40px}.jump-links a{padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.8);font-size:13px;font-weight:600}.jump-links span{margin-left:10px}.product-story{min-height:820px;padding:105px 8vw;display:grid;grid-template-columns:minmax(300px,.86fr) minmax(500px,1.14fr);gap:8vw;align-items:center}.dark-story{background:var(--deep);color:#f7f5ef}.sand-story{background:var(--sand)}.sage-story{background:var(--sage)}.story-copy h2{margin:0;font-size:clamp(37px,4.5vw,62px);line-height:1;letter-spacing:-.07em}.story-copy>p:not(.eyebrow){max-width:520px;font-size:17px;line-height:1.58;margin:25px 0}.dark-story .eyebrow{color:#a7d7c8}.story-points{margin:37px 0;border-top:1px solid currentColor}.story-points div{display:flex;gap:17px;padding:14px 0;border-bottom:1px solid currentColor;font-size:14px;line-height:1.45}.story-points b{font:11px var(--mono);padding-top:3px}.outline-link{display:inline-flex;gap:16px;margin-top:29px;border-bottom:1px solid currentColor;padding-bottom:6px;font-size:14px;font-weight:600}.product-visual{position:relative;margin:0;padding:16px 16px 0;background:#f8fafb;box-shadow:17px 18px 0 rgba(9,37,31,.15);overflow:hidden}.screen-frame{height:470px;overflow:hidden;background:#fff}.screen-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}.kontor-visual .screen-frame img{height:auto;transform:translateY(-7.2%)}.callout{position:absolute;z-index:1;max-width:245px;padding:15px 16px;background:rgba(255,255,255,.96);color:var(--ink);box-shadow:0 10px 27px rgba(9,37,31,.18);font-size:13px;line-height:1.35}.callout span{display:block;margin-bottom:8px;color:#28705e;font:10px var(--mono);letter-spacing:.07em}.callout strong{font-size:14px;line-height:1.2}.callout-top{top:9%;right:4%}.callout-bottom{bottom:12%;left:4%}.product-visual figcaption{padding:15px 2px;color:#617b73;font:10px var(--mono);letter-spacing:.07em;text-transform:uppercase}.ref-cta{padding:115px 8vw;text-align:center;background:#d7c7ad}.ref-cta h2{max-width:800px;margin:0 auto;font-size:clamp(42px,5.5vw,73px);line-height:.98;letter-spacing:-.075em}.ref-cta>p:not(.eyebrow){max-width:580px;margin:24px auto;font-size:17px;line-height:1.55}.ref-cta a{display:inline-flex;gap:17px;padding:16px 20px;background:var(--ink);color:#fff;font-size:14px;font-weight:600}@media(max-width:850px){.ref-nav nav>a:not(.nav-cta){display:none}.ref-hero{min-height:530px;padding:110px 7vw 65px}.product-story{min-height:0;grid-template-columns:1fr;gap:50px;padding:78px 7vw}.screen-frame{height:390px}.product-visual{max-width:760px}.jump-links{flex-wrap:wrap}.ref-cta{padding:85px 7vw}}@media(max-width:520px){.ref-nav{height:70px;padding:0 7vw}.product-visual{padding:8px 8px 0}.screen-frame{height:255px}.callout{position:relative;max-width:none;top:auto;right:auto;bottom:auto;left:auto;margin:9px 0}.product-visual figcaption{padding:12px 2px}.ref-hero h1{font-size:49px}.jump-links{gap:16px}.story-copy h2{font-size:39px}}
