/* Legal CRM offering, retaining Shoreside's lake, sail, and typography. */
.hero h1{max-width:1100px;font-size:clamp(52px,6.4vw,98px)}
.hero-content>p{max-width:770px;text-wrap:pretty}
.crm-panel{min-width:0;padding:35px 30px;background:linear-gradient(135deg,#244b58,#193944);display:flex;flex-direction:column;justify-content:center}
.crm-top,.crm-foot{display:flex;justify-content:space-between;align-items:center;gap:16px}
.crm-top{padding-bottom:26px;border-bottom:1px solid #ffffff20}
.crm-wordmark{font-size:11px;letter-spacing:1.6px}.crm-wordmark small{font-size:8px;color:#b4cdce;letter-spacing:.5px}
.demo-label{font-size:7px;letter-spacing:1px;color:#bdcfd0;text-align:right}
.crm-heading{display:flex;align-items:center;justify-content:space-between;padding:30px 0}.crm-heading .eyebrow{font-size:8px;color:#b4cdce;letter-spacing:1.6px}
.crm-heading h3{font-size:22px;font-weight:450;letter-spacing:-.6px;line-height:1.3;margin-top:10px}
.live-dot{width:8px;height:8px;border-radius:50%;background:#b6d5c0;box-shadow:0 0 0 6px #b6d5c015;flex-shrink:0}
.pipeline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pipeline>div{padding:16px;border:1px solid #ffffff24;background:#ffffff06;border-radius:4px}
.pipeline span{font-size:11px;display:block;color:#dbe7e5}.pipeline strong{font-size:30px;font-weight:400;display:block;margin:11px 0 3px;letter-spacing:-1px}.pipeline p{font-size:10px;color:#b9cdcf}
.crm-task{display:flex;gap:13px;align-items:center;background:#d6e4db0b;border:1px solid #b6d5c033;padding:18px 14px;margin-top:18px;border-radius:4px}.task-check{border:1px solid #b6d5c0;border-radius:50%;padding:2px 5px;font-size:10px;color:#b6d5c0}.crm-task strong{font-size:11px;font-weight:500}.crm-task p{font-size:10px;color:#b9cdcf;margin-top:4px}
.crm-foot{padding-top:27px;color:#a9c3c7;font-size:7px;letter-spacing:1px}
.scope-note{font-size:11px;color:var(--muted);margin-top:24px;max-width:820px}
.practice-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 30px}.practice-tabs button{border:1px solid #bbc9c5;border-radius:30px;background:transparent;padding:12px 21px;font-size:12px;transition:background .2s,color .2s}.practice-tabs button[aria-pressed=true]{color:var(--paper);background:var(--ink);border-color:var(--ink)}
.workflow-example{display:grid;grid-template-columns:1fr 1fr;gap:70px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:35px 0;min-height:235px}.workflow-example h3{font-size:28px;font-weight:450;letter-spacing:-.8px;margin:18px 0 14px}.workflow-example p:not(.eyebrow){font-size:13px;color:var(--muted);max-width:460px}.workflow-example ol{display:grid;grid-template-columns:1fr 1fr;gap:25px 20px;list-style:none;counter-reset:stages;padding:0;margin:8px 0;align-content:center}.workflow-example li{font-size:12px;line-height:1.6;counter-increment:stages;display:flex;align-items:flex-start;gap:12px}.workflow-example li:before{content:counter(stages,decimal-leading-zero);color:#718a8a;font-size:10px;border-bottom:1px solid #a9bab2;padding-bottom:5px}
.integrations{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;background:#edf0eb}.integrations h2{margin-top:22px}.integrations p:not(.eyebrow),.integrations li{font-size:13px;color:var(--muted)}.integrations ul{padding-left:18px;line-height:2.2;margin:22px 0}.integrations .text-link{margin-top:28px}
@media(max-width:1100px){nav{gap:20px}.crm-panel{padding:28px 22px}.crm-top{gap:10px;flex-wrap:wrap}.workflow-example{gap:35px}.integrations{gap:40px}}
@media(max-width:700px){.hero h1{font-size:clamp(39px,9vw,62px);letter-spacing:-1.7px;line-height:1.13}.hero-content>p{max-width:440px}.hero{min-height:650px}.crm-panel{padding:30px 24px}.crm-top{flex-wrap:nowrap}.crm-heading h3{font-size:22px}.crm-foot{font-size:6px}.workflow-example,.integrations{grid-template-columns:1fr;gap:25px}.workflow-example{min-height:0}.workflow-example ol{margin:0;gap:22px 16px}.practice-tabs{gap:8px}.practice-tabs button{font-size:11px;padding:10px 15px}.workflow-example h3{font-size:26px}.workflow .section-head p br{display:none}.scope-note{font-size:10px}}
@media(max-width:380px){.brand>span{font-size:14px}.brand{gap:7px}.nav-cta{margin-right:12px;padding:9px 12px}.crm-top{flex-wrap:wrap}.hero-content .eyebrow{font-size:7px;letter-spacing:1px}.hero-actions .button{font-size:11px;gap:20px}}