@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200..800&display=swap");

:root {
  --ink: #2c234d;
  --ink-soft: #4d446b;
  --body: #55515f;
  --muted: #707b8e;
  --line: #e3e1eb;
  --line-soft: #eeeef4;
  --surface: #fff;
  --surface-soft: #f7f7f7;
  --surface-tint: #fafafa;
  --dark: #041319;
  --dark-soft: #0c111d;
  --accent: #008342;
  --accent-hover: #006f43;
  --cta-brand: rgb(255 149 0);
  --cta-brand-hover: #e88700;
  --green: #2eaa78;
  --amber: #ff8a3d;
  --purple: #9932cc;
  --red: #ef4444;
  --text-light: #fcf6f0;
  --font-family: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: var(--font-family);
  --font-body: var(--font-family);
  --container: 1400px;
  --radius-large: 24px;
  --radius-medium: 16px;
  --radius-small: 10px;
  --shadow-card: 0 1px 2px rgb(4 19 25 / 4%), 0 12px 32px -16px rgb(4 19 25 / 12%);
  --shadow-pop: 0 4px 12px rgb(4 19 25 / 6%), 0 24px 48px -20px rgb(4 19 25 / 18%);
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 96px; }

body {
  margin: 0;
  color: var(--body);
  background: var(--surface);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
h1, h2, h3, p, figure { margin: 0; }
h1, h2, h3 { color: var(--ink); font-family: var(--font-display); font-weight: 550; letter-spacing: -.035em; line-height: 1.08; }

.container { width: min(var(--container), calc(100% - 48px)); margin-inline: auto; }
.section { padding-block: 112px; }
.section--soft { background: var(--surface-soft); }
.section--dark { color: rgb(252 246 240 / 76%); background: var(--dark); }
.section--dark h2, .section--dark h3 { color: var(--text-light); }
.section-heading { max-width: 700px; margin-bottom: 48px; }
.section-heading h2, .section-copy h2 { margin-bottom: 20px; font-size: clamp(2.25rem, 4.1vw, 3.5rem); }
.section-heading > p:last-child, .section-copy > p:not(.eyebrow) { max-width: 590px; font-size: 1.05rem; }
.section-heading--center { margin-inline: auto; text-align: center; }
.section-heading--center > p:last-child { margin-inline: auto; }
.eyebrow { margin-bottom: 16px; color: var(--accent); font-size: .76rem; font-weight: 750; letter-spacing: .13em; line-height: 1.3; text-transform: uppercase; }
.section--dark .eyebrow { color: #82d6ab; }
.lead { color: var(--ink-soft); font-size: clamp(1.08rem, 1.6vw, 1.22rem); line-height: 1.65; }

.site-header { position: sticky; z-index: 20; top: 0; border-bottom: 1px solid rgb(227 225 235 / 75%); background: rgb(255 255 255 / 90%); backdrop-filter: blur(14px); }
.header-inner { display: flex; min-height: 82px; align-items: center; justify-content: space-between; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; letter-spacing: -.04em; }
.brand img { width: 32px; height: 32px; object-fit: contain; }
.primary-navigation { display: flex; align-items: center; gap: 34px; color: var(--ink-soft); font-size: .92rem; font-weight: 550; }
.primary-navigation > a:not(.button):hover, .site-footer nav a:hover { color: var(--accent); }
.primary-navigation [aria-current="page"]:not(.button) { color: var(--accent); }
.menu-toggle { display: none; }

.site-nav-shell { position: sticky; top: 0; z-index: 20; width: 100%; color: #041319; background: #fff; }
.site-nav-header { position: relative; z-index: 2; top: auto; height: 76px; border-bottom-color: rgb(33 34 38 / 4%); background: #fff; backdrop-filter: none; }
.site-nav-inner { display: flex; align-items: center; width: min(100%, 1312px); height: 100%; margin: 0 auto; padding: 0 48px; }
.site-nav-brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 9px; margin-right: 32px; color: #041319; font-family: var(--font-display); font-size: 1.05rem; font-weight: 700; letter-spacing: -.04em; white-space: nowrap; }
.site-nav-brand img { width: 48px; height: 48px; object-fit: contain; }
.primary-nav { display: flex; align-self: stretch; align-items: center; gap: 24px; }
.primary-nav > a, .primary-nav-trigger { position: relative; display: inline-flex; align-items: center; justify-content: center; height: 100%; padding: 0; border: 0; color: #45474d; background: transparent; font: inherit; font-size: 15px; line-height: 20px; white-space: nowrap; transition: color 180ms ease; }
.primary-nav > a:hover, .primary-nav-trigger:hover, .primary-nav-trigger[aria-expanded="true"] { color: #041319; }
.primary-nav-trigger { gap: 9px; }
.nav-chevron { display: inline-block; width: 8px; height: 8px; margin-top: -4px; transform: rotate(45deg); border-right: 1.4px solid currentColor; border-bottom: 1.4px solid currentColor; transition: transform 180ms ease; }
.primary-nav-trigger[aria-expanded="true"] .nav-chevron, .mobile-accordion-trigger[aria-expanded="true"] .nav-chevron { margin-top: 4px; transform: rotate(225deg); }
.site-nav-cta, .mobile-nav-cta, .landing-button, .button, .team-platform-link, .feature-hero-cta, .feature-offering-cta, .get-started-submit { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 12px; padding: 0 18px; border: 1px solid var(--cta-brand); border-radius: 4px; color: #080808; background: var(--cta-brand); font-family: var(--font-body); font-size: .88rem; font-weight: 550; line-height: 1; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease; }
.site-nav-cta { margin-left: auto; }
.site-nav-cta:hover, .mobile-nav-cta:hover, .landing-button:hover, .button:hover, .team-platform-link:hover, .feature-hero-cta:hover, .feature-offering-cta:hover, .get-started-submit:hover { transform: translateY(-1px); border-color: var(--cta-brand-hover); background: var(--cta-brand-hover); }
.site-nav-cta:focus-visible, .mobile-nav-cta:focus-visible, .landing-button:focus-visible, .button:focus-visible, .team-platform-link:focus-visible, .feature-hero-cta:focus-visible, .feature-offering-cta:focus-visible, .get-started-submit:focus-visible { outline: 3px solid rgb(255 149 0 / 45%); outline-offset: 3px; }
.button-label { display: inline-grid; max-width: 100%; overflow: hidden; line-height: 1.25; vertical-align: bottom; }
.button-label > span { grid-area: 1 / 1; transition: transform 360ms cubic-bezier(.22, 1, .36, 1); }
.button-label > span[aria-hidden="true"] { transform: translateY(110%); }
:is(.site-nav-cta, .mobile-nav-cta, .landing-button, .button, .team-platform-link, .feature-hero-cta, .feature-offering-cta, .get-started-submit, .text-link, .nav-text-link):is(:hover, :focus-visible) .button-label > span:first-child { transform: translateY(-110%); }
:is(.site-nav-cta, .mobile-nav-cta, .landing-button, .button, .team-platform-link, .feature-hero-cta, .feature-offering-cta, .get-started-submit, .text-link, .nav-text-link):is(:hover, :focus-visible) .button-label > span[aria-hidden="true"] { transform: translateY(0); }
.button-icon { display: inline-block; width: 16px; height: 16px; flex: 0 0 auto; stroke-width: 1.8; }
:is(.site-nav-cta, .mobile-nav-cta, .landing-button, .button, .team-platform-link, .feature-hero-cta, .feature-offering-cta, .get-started-submit, .nav-text-link) .button-icon { transition: transform 180ms ease; }
:is(.site-nav-cta, .mobile-nav-cta, .landing-button, .button, .team-platform-link, .feature-hero-cta, .feature-offering-cta, .get-started-submit, .nav-text-link):is(:hover, :focus-visible) .button-icon[data-lucide="arrow-up-right"] { transform: translate(2px, -2px); }
:is(.site-nav-cta, .mobile-nav-cta):is(:hover, :focus-visible) .button-icon[data-lucide="arrow-down"] { transform: translateY(2px); }
.site-nav-toggle { display: none; width: 32px; height: 32px; padding: 4px; border: 0; color: #041319; background: transparent; }
.site-nav-toggle svg { width: 24px; height: 24px; overflow: visible; }
.site-nav-toggle path { fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.5; transition: transform 200ms ease; transform-origin: 12px 12px; }
.site-nav-toggle[aria-expanded="true"] .toggle-top { transform: translateY(4px) rotate(45deg); }
.site-nav-toggle[aria-expanded="true"] .toggle-bottom { transform: translateY(-4px) rotate(-45deg); }
.mega-menu { position: absolute; z-index: 1; top: 68px; right: 0; left: 0; height: 0; overflow: hidden; background: #fff; box-shadow: 0 18px 32px rgb(13 23 28 / 8%); pointer-events: none; transition: height 440ms cubic-bezier(.4, 0, .2, 1); }
.mega-menu[hidden] { display: none; }
.mega-menu.is-open { pointer-events: auto; }
.mega-inner { display: grid; grid-template-columns: minmax(0, 1fr) 392px; gap: 28px; width: min(100%, 1256px); min-height: 500px; margin: 0 auto; padding: 32px 0 24px; }
.mega-main { display: flex; min-width: 0; flex-direction: column; }
.mega-columns { display: grid; flex: 1 1 auto; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; min-height: 390px; }
.menu-column { min-width: 0; }
.nav-menu-eyebrow { margin: 0 0 22px; color: #797c86; font-size: 13px; font-weight: 500; line-height: 20px; }
.menu-item { display: block; min-height: 78px; margin: 0 0 12px; border-radius: 6px; color: #041319; transition: color 160ms ease; }
.menu-item:hover, .menu-item:focus-visible { color: #08728c; }
.menu-item strong { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; line-height: 20px; }
.menu-item span { display: block; max-width: 240px; color: #797c86; font-size: 12px; line-height: 18px; }
.mega-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 48px; padding-top: 12px; border-top: 1px solid #ededed; color: #25292d; font-size: 11px; }
.mega-footer p { margin: 0; }
.mega-footer p span { padding-left: 8px; color: #74777b; }
.nav-text-link { flex: 0 0 auto; color: #202428; font-size: 12px; font-weight: 600; transition: color 160ms ease; }
.nav-text-link:hover { color: #0a819c; }
.nav-featured-card { display: flex; width: 100%; height: 424px; flex-direction: column; overflow: hidden; padding: 24px; border-radius: 16px; color: #fff; background: #002f46; }
.nav-feature-art { position: relative; display: grid; min-height: 0; place-items: center; overflow: hidden; aspect-ratio: 712 / 472; border-radius: 8px; background: #d9faff; }
.nav-feature-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nav-featured-copy { padding: 10px 1px 1px; }
.nav-featured-copy h2 { margin: 0 0 7px; color: #fff; font-size: 16px; font-weight: 600; }
.nav-featured-copy p { margin: 0 0 10px; color: rgb(255 255 255 / 78%); font-size: 13px; line-height: 19px; }
.nav-featured-copy .nav-text-link { color: #fff; }
.nav-featured-copy .nav-text-link:hover { color: #8ee8f0; }
.mobile-navigation { display: none; }

.button--block { width: 100%; }
.button-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.text-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; color: var(--accent); font-weight: 650; }
.text-link > span[aria-hidden="true"] { transition: transform .2s ease; }
.text-link:hover > span[aria-hidden="true"] { transform: translateX(4px); }

.hero { overflow: hidden; padding-block: 90px 105px; }
.hero-layout { display: grid; min-height: 510px; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); align-items: center; gap: 54px; }
.hero-copy { position: relative; z-index: 2; }
.hero-copy h1 { max-width: 620px; margin-bottom: 22px; font-size: clamp(3.25rem, 6.2vw, 5.2rem); }
.hero-copy h1 span { color: var(--accent); }
.hero-copy .lead { max-width: 540px; }
.hero-note { margin-top: 24px; color: var(--muted); font-size: .85rem; }
.eyebrow-dot { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--green); vertical-align: 1px; }
.hero-visual { position: relative; display: grid; min-height: 470px; place-items: center; }
.hero-orbit { position: absolute; width: min(92%, 490px); aspect-ratio: 1; border: 1px solid rgb(0 131 66 / 12%); border-radius: 50%; background: radial-gradient(circle, rgb(46 170 120 / 12%), transparent 68%); }
.hero-dashboard { position: relative; z-index: 1; width: 100%; border: 1px solid rgb(227 225 235 / 75%); border-radius: var(--radius-large); box-shadow: var(--shadow-pop); }
.floating-card { position: absolute; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--line-soft); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-pop); }
.floating-card strong, .floating-card small { display: block; }
.floating-card strong { color: var(--ink); font-size: .83rem; }
.floating-card small { margin-top: 2px; color: var(--muted); font-size: .72rem; }
.floating-card b { color: var(--accent); font-size: .9rem; }
.floating-card--activity { top: 10%; right: -2%; }
.floating-card--deal { bottom: 8%; left: -4%; }
.card-icon, .feature-icon { display: grid; width: 40px; height: 40px; flex: 0 0 auto; place-items: center; border-radius: 12px; color: var(--accent); background: rgb(0 131 66 / 9%); font-size: 1.2rem; font-weight: 700; }
.card-icon--green { color: var(--accent); background: rgb(46 170 120 / 12%); }
.card-icon--purple { color: var(--purple); background: rgb(153 50 204 / 10%); }
.avatar-stack { display: flex; }
.avatar-stack i { display: grid; width: 30px; height: 30px; place-items: center; margin-left: -6px; border: 2px solid var(--surface); border-radius: 50%; color: var(--ink); background: #eee6f7; font-size: .58rem; font-style: normal; font-weight: 700; }
.avatar-stack i + i { background: #e0f0e8; }

.landing-hero { position: relative; z-index: 2; overflow: visible; padding: 0; background: #fff; color: #111; font-family: var(--font-body); }
.landing-hero-layout { display: grid; width: min(1180px, calc(100% - 48px)); min-height: 419px; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); align-items: center; gap: 60px; }
.landing-hero-copy { max-width: 620px; }
.landing-hero-copy h1 { margin-bottom: 16px; color: #080808; font-family: var(--font-display); font-size: clamp(2.25rem, 2.5vw, 2.45rem); font-weight: 400; letter-spacing: -.035em; line-height: 1.3; }
.landing-hero-copy > p { max-width: 490px; color: #171717; font-size: .84rem; line-height: 1.65; }
.landing-hero-highlights { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.landing-hero-highlights li { padding: 5px 10px; border: 1px solid #e8e8e8; border-radius: 999px; color: #3c3c3c; background: #fafafa; font-size: .66rem; line-height: 1.3; }
.landing-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.recent-contacts-card { position: relative; z-index: 3; width: 100%; padding: 24px 25px 22px; transform: translateY(92px); border: 1px solid #e5e7eb; border-radius: 12px; color: #111827; background: #fff; box-shadow: 0 12px 34px rgb(17 24 39 / 7%); font-family: var(--font-body); }
.recent-contacts-card h2 { margin: 0 0 15px; color: #111827; font-family: var(--font-display); font-size: 1.08rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.35; }
.recent-contact { padding-block: 17px; border-bottom: 1px solid #e9ebef; }
.recent-contact:first-of-type { padding-top: 10px; padding-bottom: 19px; }
.recent-contact:nth-last-of-type(1) { border-bottom: 0; }
.recent-contact-heading { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto 34px; align-items: center; gap: 11px; }
.contact-mark { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 11px; }
.contact-mark svg { width: 21px; height: 21px; stroke-width: 2; }
.contact-mark--customer { color: #08a978; background: #e7f7f1; }
.contact-mark--lead { color: #3978f6; background: #eef2ff; }
.contact-mark--qualified { color: #8750e9; background: #f3effb; }
.recent-contact-name { min-width: 0; }
.recent-contact-name strong, .recent-contact-name small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recent-contact-name strong { color: #111827; font-size: .88rem; font-weight: 600; letter-spacing: -.015em; }
.recent-contact-name small { margin-top: 5px; color: #657084; font-size: .76rem; }
.contact-status { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; font-size: .69rem; font-weight: 500; white-space: nowrap; }
.contact-status > span { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; }
.contact-status--active { color: #087f5b; background: #e2f7ed; }
.contact-status--active > span { background: #10b981; }
.contact-status--follow-up { color: #876600; background: #fff5d6; }
.contact-status--follow-up > span { background: #eab308; }
.contact-status--qualified { color: #1765d1; background: #e5f0ff; }
.contact-status--qualified > span { background: #2878f0; }
.contact-chevron { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #647084; background: #f1f3f6; }
.contact-chevron svg { width: 17px; height: 17px; stroke-width: 1.8; }
.contact-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.contact-tags span { padding: 6px 11px; border-radius: 999px; color: #4b5565; background: #f0f1f3; font-size: .68rem; line-height: 1.2; }
.contact-description { margin: 12px 0 0; color: #657084; font-size: .79rem; line-height: 1.5; }
.contact-meta { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; color: #657084; font-size: .7rem; }
.contact-meta span { display: inline-flex; align-items: center; gap: 7px; }
.contact-meta svg { width: 15px; height: 15px; flex: 0 0 auto; stroke-width: 1.7; }
.contact-meta span + span { padding-left: 15px; border-left: 1px solid #d9dde4; }
.contact-deals { display: flex; min-height: 52px; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding: 7px 10px 7px 14px; border: 1px solid #e3e6eb; border-radius: 10px; color: #657084; font-size: .75rem; }
.contact-deal-icons { display: flex; gap: 7px; }
.contact-deal-icons svg { display: block; width: 31px; height: 31px; padding: 7px; border-radius: 9px; color: #0da979; background: #e9f8f2; stroke-width: 1.9; }
.contact-deal-icons svg:nth-child(2) { color: #168aca; background: #eaf5fb; }
.contact-deal-icons svg:nth-child(3) { color: #8454df; background: #f2edfb; }
.landing-photo-strip { position: relative; z-index: 1; width: 100%; height: clamp(270px, 27vw, 410px); overflow: hidden; background: #2e2924; }
.landing-photo-strip img { width: 100%; height: 100%; object-fit: cover; object-position: center 44%; }

.workspace-section { min-height: 100svh; padding: clamp(88px, 10vw, 148px) 0; color: #fff; background: rgb(70, 14, 50); }
.workspace-heading { max-width: 720px; margin: 0 auto 56px; text-align: center; }
.workspace-eyebrow { margin-bottom: 16px; color: #fff; font-size: 12px; font-weight: 600; letter-spacing: .04em; }
.workspace-card { position: sticky; top: 14vh; display: grid; min-height: min(560px, 68vh); grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(28px, 5vw, 76px); padding: clamp(28px, 5vw, 60px); margin-bottom: 8vh; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 24px; background: #fff; box-shadow: var(--shadow-pop); transform-origin: top center; will-change: transform, filter; backface-visibility: hidden; }
.workspace-card:nth-of-type(2) { background: #fbfcff; }
.workspace-card:nth-of-type(3) { background: #fafffc; }
.workspace-copy { position: relative; z-index: 1; }
.workspace-card-eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 18px; color: var(--muted); font-size: 12px; font-weight: 600; }
.workspace-card-eyebrow svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 1.7; }
.workspace-card:nth-of-type(1) .workspace-card-eyebrow svg { color: var(--accent); }
.workspace-card:nth-of-type(2) .workspace-card-eyebrow svg { color: var(--green); }
.workspace-card:nth-of-type(3) .workspace-card-eyebrow svg { color: var(--amber); }
.workspace-copy h3 { max-width: 420px; margin-bottom: 16px; font-size: clamp(26px, 3.2vw, 42px); }
.workspace-copy > p:not(.workspace-card-eyebrow) { max-width: 430px; margin-bottom: 28px; color: var(--muted); font-size: 15px; }
.workspace-visual { min-width: 0; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 18px; background: var(--surface-soft); box-shadow: var(--shadow-card); }
.workspace-visual img { width: 100%; height: clamp(260px, 34vw, 420px); object-fit: cover; object-position: center; }
.workspace-stack-end { height: 20vh; }

.sales-visibility-section { padding: clamp(84px, 8vw, 120px) 24px; background: #fff; }
.sales-visibility-layout { display: grid; width: min(100%, 1280px); grid-template-columns: minmax(0, .78fr) minmax(0, 1.18fr); align-items: center; gap: clamp(56px, 5.7vw, 96px); margin-inline: auto; }
.sales-visibility-copy h2 { max-width: 480px; margin-bottom: 24px; color: #09142f; font-size: clamp(2.25rem, 3vw, 2.8rem); letter-spacing: -.045em; line-height: 1.12; }
.sales-visibility-lede { max-width: 480px; color: #748098; font-size: .98rem; line-height: 1.65; }
.sales-visibility-list { margin-top: 30px; padding: 0; list-style: none; }
.sales-visibility-list li { display: flex; align-items: flex-start; gap: 12px; padding: 19px 0; border-bottom: 1px solid #eceef2; color: #101a34; font-size: .91rem; font-weight: 550; line-height: 1.5; }
.sales-visibility-list li:last-child { border-bottom: 0; }
.sales-visibility-list li svg { width: 19px; height: 19px; flex: 0 0 auto; margin-top: 1px; color: #355bff; stroke-width: 1.8; }
.sales-visibility-visual { display: grid; min-width: 0; grid-template-columns: .75fr 1fr; gap: 8px; aspect-ratio: 1.15; }
.sales-visibility-side { display: flex; min-width: 0; flex-direction: column; align-items: stretch; justify-content: center; gap: 8px; }
.sales-team-photo { height: 55%; min-height: 240px; overflow: hidden; border-radius: 15px; background: #b49a72; }
.sales-team-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 42%; }
.efficiency-card { display: flex; height: 33%; min-height: 170px; flex-direction: column; justify-content: center; padding: 22px 24px; border-radius: 15px; color: #fff; background: linear-gradient(145deg, #355bff, #8796ff); }
.efficiency-card h3 { max-width: 275px; margin-bottom: 22px; color: #fff; font-family: var(--font-body); font-size: clamp(1.1rem, 1.45vw, 1.4rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.32; }
.efficiency-card p { color: rgb(255 255 255 / 90%); font-size: .84rem; line-height: 1.55; }
.sales-overview-panel { display: grid; min-width: 0; place-items: center; padding: clamp(20px, 2.2vw, 36px); border-radius: 16px; background: #355bff url("../images/fNPoLkV9VpfpwhjhTVrxdURZWc.158ot17.png") center / cover no-repeat; }
.sales-overview-card { display: flex; width: 100%; min-height: 72%; flex-direction: column; justify-content: space-between; padding: 22px 22px 18px; border-radius: 13px; background: #fff; box-shadow: 0 12px 28px rgb(18 35 110 / 13%); }
.sales-overview-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sales-overview-heading h3 { color: #111; font-family: var(--font-body); font-size: .92rem; font-weight: 650; letter-spacing: -.02em; }
.sales-overview-heading > span { display: grid; width: 22px; height: 22px; place-items: center; border: 1px solid #eceef2; border-radius: 50%; color: #101a34; font-size: .75rem; }
.sales-gauge { position: relative; display: grid; width: min(58%, 210px); aspect-ratio: 1; place-items: center; align-self: center; margin: 16px 0; border-radius: 50%; background: repeating-conic-gradient(from -90deg, #edf0f6 0deg 3deg, transparent 3deg 5deg); }
.sales-gauge::before { position: absolute; inset: 0; border-radius: 50%; background: repeating-conic-gradient(from -90deg, #3484ff 0deg 3deg, transparent 3deg 5deg); content: ""; mask: conic-gradient(#000 0deg 281deg, transparent 281deg 360deg); }
.sales-gauge-center { position: relative; display: flex; width: 72%; aspect-ratio: 1; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; background: #fff; text-align: center; }
.sales-gauge-center strong { color: #111; font-size: clamp(1.65rem, 2.3vw, 2.25rem); font-weight: 650; letter-spacing: -.05em; line-height: 1; }
.sales-gauge-center span { margin-top: 4px; color: #858b99; font-size: .58rem; }
.sales-overview-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; color: #3e4655; font-size: clamp(.48rem, .58vw, .62rem); }
.sales-overview-legend span { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.legend-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #2d62ff; }
.legend-dot--pale { background: #eff1f5; }
.legend-dot--cyan { background: #21b8f4; }
.legend-dot--dark { background: #111; }

.solutions-section { position: relative; overflow: hidden; padding: clamp(72px, 6vw, 96px) 24px; background: rgb(70, 14, 41); }
.solutions-layout { width: min(100%, 1280px); margin-inline: auto; }
.solutions-heading { max-width: 1280px; margin: 0 auto clamp(24px, 2.2vw, 32px); }
.solutions-eyebrow { margin-bottom: 12px; color: rgb(255 255 255 / 72%); font-size: .74rem; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; }
.solutions-heading h2 { max-width: 1280px; color: #fff; font-size: clamp(2.2rem, 3.2vw, 3rem); font-weight: 450; letter-spacing: -.05em; line-height: 1.12; }
.solutions-content { display: grid; grid-template-columns: minmax(280px, .54fr) minmax(0, 1fr); align-items: center; gap: clamp(42px, 6.2vw, 96px); }
.solutions-accordion { border-left: 2px solid rgb(255 255 255 / 18%); }
.solutions-accordion-item { position: relative; border-bottom: 1px solid rgb(255 255 255 / 22%); }
.solutions-accordion-item::before { position: absolute; top: 0; bottom: -1px; left: -2px; width: 2px; background: transparent; content: ""; transition: background-color 200ms ease; }
.solutions-accordion-item.is-active::before { background: #53d8ec; }
.solutions-accordion-item h3 { margin: 0; }
.solutions-accordion-trigger { display: flex; width: 100%; min-height: 76px; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0 18px 20px; border: 0; color: #fff; background: transparent; cursor: pointer; font-size: clamp(.98rem, 1.2vw, 1.12rem); font-weight: 560; line-height: 1.35; text-align: left; }
.solutions-accordion-trigger > svg { width: 17px; height: 17px; flex: 0 0 auto; color: rgb(255 255 255 / 70%); transition: transform 240ms ease; }
.solutions-accordion-item.is-active .solutions-accordion-trigger > svg { transform: rotate(180deg); }
.solutions-accordion-trigger:focus-visible { outline: 2px solid #53d8ec; outline-offset: -2px; }
.solutions-accordion-panel { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows 340ms cubic-bezier(.2, .75, .25, 1), opacity 220ms ease; }
.solutions-accordion-item.is-active .solutions-accordion-panel { grid-template-rows: 1fr; opacity: 1; }
.solutions-accordion-panel-inner { min-height: 0; overflow: hidden; padding: 0 22px 0 20px; }
.solutions-accordion-item.is-active .solutions-accordion-panel-inner { padding-bottom: 27px; }
.solutions-accordion-panel p { max-width: 440px; color: rgb(255 255 255 / 76%); font-size: .92rem; line-height: 1.6; }
.solutions-accordion-panel a { display: inline-flex; align-items: center; gap: 7px; margin-top: 24px; color: #fff; font-size: .85rem; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.solutions-accordion-panel a span { text-decoration: none; }
.solutions-accordion-panel a:hover { color: #75e5f3; }
.solutions-visual { position: relative; min-width: 0; overflow: hidden; aspect-ratio: 1.33; border-radius: 22px; background: #e5e9ee; box-shadow: 0 20px 48px rgb(20 34 56 / 12%); isolation: isolate; }
.solutions-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0; transform: scale(1.035); transition: opacity 420ms ease, transform 700ms cubic-bezier(.2, .75, .25, 1); }
.solutions-visual img.is-active { opacity: 1; transform: scale(1); }
.solutions-visual-caption { position: absolute; right: 18px; bottom: 18px; left: 18px; width: fit-content; max-width: calc(100% - 36px); padding: 9px 13px; border: 1px solid rgb(255 255 255 / 36%); border-radius: 999px; color: #142238; background: rgb(255 255 255 / 88%); box-shadow: 0 4px 18px rgb(20 34 56 / 10%); font-size: .72rem; font-weight: 600; backdrop-filter: blur(12px); }

.team-platform-section { padding: clamp(88px, 9vw, 132px) 24px; background: #fff; }
.team-platform-layout { display: grid; width: min(100%, 1240px); grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); align-items: center; gap: clamp(56px, 7vw, 104px); margin-inline: auto; }
.team-platform-copy h2 { max-width: 570px; margin-bottom: 56px; color: #101010; font-size: clamp(1.75rem, 2.25vw, 2.15rem); font-weight: 450; letter-spacing: -.04em; line-height: 1.35; }
.team-platform-benefits { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.team-platform-benefit { min-width: 0; }
.team-platform-icon { display: grid; width: 48px; height: 48px; place-items: center; margin-bottom: 20px; border: 1px solid #e9e9ec; border-radius: 50%; color: #343944; }
.team-platform-icon svg { width: 21px; height: 21px; stroke: currentColor; stroke-width: 1.5; }
.team-platform-benefit h3 { margin-bottom: 10px; color: #161616; font-family: var(--font-body); font-size: .95rem; font-weight: 600; letter-spacing: -.02em; }
.team-platform-benefit p, .team-platform-summary { color: #696d75; font-size: .91rem; line-height: 1.65; }
.team-platform-summary { margin-top: 34px; }
.team-platform-link { margin-top: 32px; }
.team-platform-visual { position: relative; min-width: 0; overflow: hidden; aspect-ratio: 1.03; border-radius: 5px; background: #eee; }
.team-platform-visual > img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.team-platform-metrics { position: absolute; right: clamp(16px, 2.2vw, 36px); bottom: clamp(16px, 2.2vw, 36px); display: flex; gap: 8px; }
.team-metric-card { display: flex; width: clamp(108px, 8.4vw, 138px); min-height: 108px; flex-direction: column; justify-content: space-between; padding: 12px; border: 1px solid rgb(16 26 52 / 6%); border-radius: 5px; background: #fff; box-shadow: 0 6px 20px rgb(0 0 0 / 10%); }
.team-metric-label { display: flex; align-items: center; gap: 7px; color: #626874; font-size: .63rem; white-space: nowrap; }
.team-metric-label svg { display: grid; width: 22px; height: 22px; flex: 0 0 auto; padding: 4px; place-items: center; border-radius: 5px; color: #17335d; background: #fff0c2; stroke-width: 1.8; }
.team-metric-card:nth-child(2) .team-metric-label svg { color: #2e6840; background: #d9f5bd; }
.team-metric-card strong { color: #202432; font-size: 1.1rem; font-weight: 600; letter-spacing: -.04em; }
.team-metric-card small { color: #868a92; font-size: .58rem; line-height: 1.35; }

.crm-showcase { overflow: hidden; background: #fff4e5; }
.crm-showcase-intro { max-width: 650px; margin: 0 auto 48px; text-align: center; }
.crm-showcase-intro .eyebrow { margin-bottom: 12px; }
.crm-showcase-intro h2 { margin-bottom: 16px; color: #1769f5; font-size: clamp(2rem, 4vw, 2.8rem); }
.crm-showcase-intro > p:last-child { color: #302d2a; font-size: .98rem; line-height: 1.65; }
.crm-showcase-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: 26px; }
.crm-showcase-tab { min-height: 38px; padding: 0 19px; border: 1px solid rgb(255 255 255 / 85%); border-radius: 999px; color: #252525; background: #fff; box-shadow: 0 3px 10px rgb(94 67 36 / 8%); cursor: pointer; font-size: .8rem; transition: color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease; }
.crm-showcase-tab:hover { transform: translateY(-1px); box-shadow: 0 5px 14px rgb(94 67 36 / 12%); }
.crm-showcase-tab[aria-selected="true"] { color: #111; font-weight: 700; }
.crm-showcase-tab:focus-visible, .crm-showcase-arrow:focus-visible { outline: 3px solid #1769f5; outline-offset: 3px; }
.crm-showcase-feature { min-height: 70px; margin: 0 auto 28px; text-align: center; }
.crm-showcase-feature-title { margin-bottom: 6px; color: #171717; font-family: var(--font-body); font-size: 1rem; font-weight: 650; letter-spacing: 0; line-height: 1.35; }
.crm-showcase-feature-description { max-width: 600px; margin-inline: auto; color: #403b36; font-size: .88rem; line-height: 1.55; }
.crm-showcase-visual { position: relative; width: min(100%, 1120px); margin-inline: auto; }
.crm-showcase-image { width: 100%; max-height: 700px; margin-inline: auto; border: 1px solid rgb(25 34 55 / 10%); border-radius: 12px 12px 0 0; background: #fff; box-shadow: 0 16px 45px rgb(89 65 36 / 13%); object-fit: contain; object-position: center top; }
.crm-showcase-arrow { position: absolute; z-index: 1; top: 50%; display: grid; width: 42px; height: 42px; place-items: center; padding: 0; transform: translateY(-50%); border: 0; border-radius: 50%; color: #252525; background: rgb(255 255 255 / 88%); box-shadow: 0 2px 10px rgb(0 0 0 / 8%); cursor: pointer; }
.crm-showcase-arrow svg { width: 20px; height: 20px; stroke-width: 1.8; }
.crm-showcase-arrow:hover { background: #fff; }
.crm-showcase-arrow--previous { left: -60px; }
.crm-showcase-arrow--next { right: -60px; }

.trust-strip { padding-block: 35px; border-bottom: 1px solid var(--line-soft); }
.trust-content { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.trust-content > p { color: var(--muted); font-size: .88rem; white-space: nowrap; }
.trust-content strong { color: var(--ink); }
.logo-list { display: flex; flex: 1; align-items: center; justify-content: space-around; gap: 30px; }
.logo-list img { width: auto; max-width: 105px; max-height: 34px; opacity: .62; filter: grayscale(1); }

.split-layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 82px; }
.image-panel { overflow: hidden; padding: 26px; border-radius: var(--radius-large); }
.image-panel--lavender { background: #f1eff8; }
.image-panel img { width: 100%; border-radius: 14px; box-shadow: var(--shadow-card); }

.feature-showcase { display: flex; flex-direction: column; align-items: stretch; }
.showcase-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.showcase-card { position: relative; overflow: hidden; min-height: 260px; padding: 30px; border: 1px solid var(--line-soft); border-radius: var(--radius-large); background: var(--surface); box-shadow: var(--shadow-card); }
.showcase-card--large { grid-row: span 2; display: flex; flex-direction: column; justify-content: space-between; }
.showcase-copy { position: relative; z-index: 1; max-width: 440px; }
.showcase-copy h3 { margin: 18px 0 10px; font-size: 1.55rem; }
.showcase-copy p, .showcase-card--stat > p:last-of-type { max-width: 420px; color: var(--muted); font-size: .92rem; }
.showcase-card img { width: 100%; max-height: 260px; margin: 26px auto -30px; object-fit: contain; object-position: center top; }
.number-tag { display: inline-grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: var(--accent); background: rgb(0 131 66 / 9%); font-size: .77rem; font-weight: 750; }
.showcase-card--stat { display: flex; min-height: 285px; flex-direction: column; align-items: flex-start; justify-content: center; background: #f8f5fb; }
.showcase-card--stat .eyebrow { margin: 22px 0 8px; }
.showcase-card--stat h3 { margin-bottom: 12px; color: var(--ink); font-size: 3.7rem; }
.showcase-card--stat h3 span { color: var(--accent); }
.stat-bars { display: flex; width: 100%; height: 34px; align-items: end; gap: 7px; margin-top: 16px; }
.stat-bars i { flex: 1; height: 35%; border-radius: 5px 5px 0 0; background: #b3dfc6; }
.stat-bars i:nth-child(2n) { height: 64%; }.stat-bars i:nth-child(3n) { height: 82%; }.stat-bars i:last-child { height: 100%; background: var(--accent); }
.showcase-card--wide { min-height: 245px; }
.showcase-card--wide img { max-height: 165px; margin-top: 18px; }

.feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.feature-card, .metric-card { min-height: 225px; padding: 28px; border: 1px solid var(--line-soft); border-radius: var(--radius-medium); background: var(--surface); box-shadow: 0 5px 22px rgb(44 35 77 / 3%); }
a.feature-card { display: block; transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
a.feature-card:hover { transform: translateY(-3px); border-color: #d6e5dc; box-shadow: var(--shadow-card); }
a.feature-card:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.feature-card h3, .metric-card h3 { margin: 25px 0 10px; font-size: 1.18rem; }
.feature-card p, .metric-card p { color: var(--muted); font-size: .92rem; }
.feature-icon--orange { color: #cc6f2d; background: rgb(255 138 61 / 13%); }
.feature-icon--blue { color: #5271c8; background: rgb(82 113 200 / 11%); }
.feature-icon--pink { color: #b24d7d; background: rgb(178 77 125 / 11%); }
.center-link { text-align: center; }

.power-layout { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 80px; }
.section-copy--light > p:not(.eyebrow) { color: rgb(252 246 240 / 69%); }
.power-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.power-card { min-height: 210px; padding: 24px; border: 1px solid rgb(255 255 255 / 12%); border-radius: var(--radius-medium); background: rgb(255 255 255 / 5%); }
.power-card--accent { background: rgb(46 170 120 / 14%); }
.power-card h3 { margin: 22px 0 10px; font-size: 1.15rem; }
.power-card p { color: rgb(252 246 240 / 65%); font-size: .88rem; }
.check-list { display: grid; gap: 13px; margin-top: 28px; padding: 0; list-style: none; }
.check-list li { display: flex; align-items: center; gap: 10px; }
.check-list li span { color: #82d6ab; font-weight: 800; }
.check-list--dark li span { color: var(--accent); }

.process-layout { grid-template-columns: .8fr 1.2fr; }
.steps-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.steps-list li { display: grid; grid-template-columns: 52px 1fr; gap: 20px; padding: 26px 0; border-bottom: 1px solid var(--line); }
.steps-list li:first-child { padding-top: 0; }
.steps-list li:last-child { border-bottom: 0; }
.steps-list li > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; color: var(--accent); background: rgb(0 131 66 / 9%); font-size: .78rem; font-weight: 750; }
.steps-list h3 { margin: 2px 0 8px; font-size: 1.2rem; }
.steps-list p { color: var(--muted); font-size: .92rem; }
.steps-list--light li { border-color: rgb(255 255 255 / 14%); }
.steps-list--light li > span { color: #82d6ab; background: rgb(130 214 171 / 12%); }
.steps-list--light p { color: rgb(252 246 240 / 68%); }

.testimonial-layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 80px; }
.testimonial-score h2 { margin-bottom: 24px; font-size: clamp(2rem, 3.5vw, 3rem); }
.rating { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.rating span { color: #ef9c3d; letter-spacing: .12em; }
.rating strong { color: var(--ink); }
.testimonial-score > p:last-child { color: var(--muted); font-size: .88rem; }
.quote-card { padding: 38px; border: 1px solid var(--line-soft); border-radius: var(--radius-large); background: var(--surface); box-shadow: var(--shadow-card); }
.quote-card blockquote { color: var(--ink-soft); font-family: var(--font-display); font-size: clamp(1.35rem, 2.5vw, 1.9rem); letter-spacing: -.02em; line-height: 1.4; }
.quote-card figcaption { display: flex; align-items: center; gap: 13px; margin-top: 28px; }
.quote-card figcaption img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.quote-card figcaption strong, .quote-card figcaption small { display: block; }
.quote-card figcaption strong { color: var(--ink); font-size: .87rem; }
.quote-card figcaption small { color: var(--muted); font-size: .77rem; }

.integration-layout { display: flex; flex-direction: column; align-items: center; }
.integration-art { display: grid; width: 100%; min-height: 230px; place-items: center; }
.integration-art img { width: min(780px, 100%); max-height: 350px; object-fit: contain; }

.pricing-grid { display: grid; max-width: 850px; grid-template-columns: 1fr 1fr; gap: 18px; margin-inline: auto; }
.price-card { padding: 32px; border: 1px solid var(--line); border-radius: var(--radius-large); background: var(--surface); box-shadow: var(--shadow-card); }
.price-card .eyebrow { margin-bottom: 12px; }
.price-card h3 { margin-bottom: 12px; font-size: 1.6rem; }
.price-card > p:not(.eyebrow) { min-height: 54px; margin-bottom: 22px; color: var(--muted); font-size: .92rem; }
.price-card--featured { border-color: rgb(0 131 66 / 42%); box-shadow: 0 10px 36px rgb(0 131 66 / 9%); }

.faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list details:first-child { border-top: 1px solid var(--line); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0; color: var(--ink); cursor: pointer; font-family: var(--font-display); font-size: 1.08rem; font-weight: 600; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: var(--accent); font-size: 1.35rem; transition: transform .2s ease; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details > p { max-width: 650px; padding: 0 36px 22px 0; color: var(--muted); font-size: .93rem; }

.blog-layout > .section-heading { max-width: 630px; }
.blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.blog-card { overflow: hidden; padding: 14px 14px 22px; border: 1px solid var(--line-soft); border-radius: var(--radius-medium); background: var(--surface); }
.blog-card img { width: 100%; height: 190px; margin-bottom: 22px; border-radius: 11px; object-fit: cover; }
.blog-card .eyebrow { margin-inline: 8px; font-size: .68rem; }
.blog-card h3 { min-height: 62px; margin: 0 8px; font-size: 1.15rem; line-height: 1.3; }
.blog-card .text-link { margin: 18px 8px 0; font-size: .88rem; }

.closing-cta { padding-block: 68px; color: rgb(252 246 240 / 74%); background: var(--accent-hover); }
.closing-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.closing-cta h2 { max-width: 760px; color: var(--surface); font-size: clamp(2rem, 4vw, 3.4rem); }
.closing-cta .eyebrow { color: #b6e8cc; }

.site-footer { color: #4d5055; background: #fff; }
.footer-top { display: grid; grid-template-columns: minmax(180px, 1.2fr) repeat(3, minmax(105px, .8fr)) minmax(180px, 1fr); gap: clamp(24px, 2.5vw, 36px); padding-block: 64px 56px; border-bottom: 1px solid var(--line); }
.footer-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.brand--footer { color: #041319; }
.brand--footer img { filter: none; }
.footer-brand > p { max-width: 230px; color: #707b8e; font-size: .9rem; }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; font-size: .86rem; }
.footer-column h2 { margin-bottom: 4px; color: #202124; font-family: var(--font-body); font-size: .95rem; font-weight: 650; letter-spacing: -.02em; }
.footer-column a, .footer-contact a, .footer-bottom a { color: #0755a5; transition: color 180ms ease; }
.footer-column a:hover, .footer-contact a:hover, .footer-bottom a:hover { color: #003b79; text-decoration: underline; text-underline-offset: 3px; }
.footer-contact { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; font-size: .84rem; }
.footer-contact-group { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.footer-contact h2 { color: #202124; font-family: var(--font-body); font-size: .95rem; font-weight: 650; letter-spacing: -.02em; }
.footer-contact address { color: #707b8e; font-style: normal; line-height: 1.65; }
.footer-social-links { display: flex; flex-wrap: wrap; gap: 9px; }
.footer-social-links a { display: grid; width: 36px; height: 36px; place-items: center; color: #5c5d62; background: #f1f1f1; transition: color 180ms ease, background-color 180ms ease; }
.footer-social-links a:hover { color: #fff; background: #0755a5; }
.footer-social-links svg { width: 18px; height: 18px; fill: currentColor; }
.footer-social-links a:nth-child(4) svg { fill: none; stroke: currentColor; stroke-width: 1.8; }
.footer-social-links .footer-social-dot { fill: currentColor; stroke: none; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-block: 22px; color: #707b8e; font-size: .78rem; }

.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.metric-card { min-height: 210px; }
.metric-card h3 { margin-top: 22px; }
.feature-hero { grid-template-columns: 1fr 1fr; }
.feature-hero-visual { min-height: 410px; }
.feature-hero-visual .hero-dashboard { max-height: 400px; object-fit: contain; }
.insight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.insight-card { overflow: hidden; padding: 32px; border: 1px solid var(--line-soft); border-radius: var(--radius-large); background: var(--surface); box-shadow: var(--shadow-card); }
.insight-card .section-copy h2 { font-size: 2rem; }
.insight-card .section-copy > p:not(.eyebrow) { font-size: .94rem; }
.insight-card img { width: 100%; max-height: 270px; margin-top: 26px; border-radius: 12px; object-fit: contain; object-position: center top; }
.insight-card--revenue { grid-column: 1 / -1; display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 38px; background: #f8f5fb; }
.insight-card--revenue img { margin: 0; }

@media (max-width: 980px) {
  .crm-showcase-arrow--previous { left: 12px; }
  .crm-showcase-arrow--next { right: 12px; }
  .hero.landing-hero { padding: 0; }
  .landing-hero-layout { grid-template-columns: minmax(0, 1.2fr) minmax(300px, .9fr); gap: 34px; }
  .landing-hero-copy h1 { font-size: clamp(2rem, 4vw, 2.4rem); }
  .recent-contacts-card { padding-inline: 20px; }
}

@media (max-width: 980px) {
  .section { padding-block: 84px; }
  .hero { padding-block: 70px 85px; }
  .hero-layout { grid-template-columns: 1fr 1fr; gap: 30px; }
  .hero-copy h1 { font-size: clamp(3rem, 7vw, 4.3rem); }
  .floating-card--activity { right: -3%; }
  .split-layout, .power-layout, .testimonial-layout, .faq-layout { gap: 44px; }
  .trust-content { align-items: flex-start; flex-direction: column; gap: 22px; }
  .logo-list { width: 100%; justify-content: space-between; }
  .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) and (min-width: 761px) {
  .sales-visibility-layout { width: min(100%, 760px); grid-template-columns: 1fr; gap: 44px; }
  .sales-visibility-copy h2, .sales-visibility-lede { max-width: 620px; }
  .sales-visibility-visual { width: 100%; }
  .solutions-content { grid-template-columns: minmax(260px, .72fr) minmax(0, 1fr); gap: 34px; }
  .solutions-heading h2 { font-size: clamp(2rem, 3.2vw, 2.5rem); }
  .team-platform-layout { width: min(100%, 760px); grid-template-columns: 1fr; gap: 40px; }
  .team-platform-copy h2 { max-width: 650px; margin-bottom: 36px; }
  .team-platform-visual { width: 100%; }
}

@media (max-width: 1050px) and (min-width: 761px) {
  .site-nav-inner { padding-right: 24px; padding-left: 24px; }
  .site-nav-brand { margin-right: 20px; }
  .primary-nav { gap: 15px; }
  .primary-nav > a, .primary-nav-trigger { font-size: 13px; }
  .mega-inner { padding-right: 24px; padding-left: 24px; }
}

@media (max-width: 760px) {
  .site-nav-header { height: 68px; }
  .site-nav-inner { justify-content: space-between; padding: 0 20px; }
  .site-nav-brand { margin: 0; }
  .primary-nav, .site-nav-cta { display: none; }
  .site-nav-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .mega-menu { display: none !important; }
  .landing-hero-layout { min-height: 0; grid-template-columns: 1fr; gap: 28px; padding-block: 48px 42px; }
  .recent-contacts-card { width: min(100%, 440px); justify-self: center; transform: none; }
  .mobile-navigation { display: block; max-height: 0; overflow: hidden; background: #fff; box-shadow: 0 4px 30px rgb(0 0 0 / 6%); opacity: 0; transition: max-height 360ms cubic-bezier(.2, .75, .25, 1), opacity 200ms ease; }
  .mobile-navigation.is-open { max-height: 78vh; overflow-y: auto; opacity: 1; }
  .mobile-navigation-inner { padding: 4px 20px 16px; }
  .mobile-nav-link, .mobile-accordion-trigger { display: flex; width: 100%; min-height: 44px; align-items: center; justify-content: space-between; padding: 0; border: 0; border-bottom: 1px solid var(--line); color: #4d5055; background: transparent; font: inherit; font-size: 13px; text-align: left; }
  .mobile-accordion-trigger .nav-chevron { width: 7px; height: 7px; }
  .mobile-accordion { display: block; max-height: 0; overflow: hidden; transition: max-height 260ms cubic-bezier(.2, .75, .25, 1); }
  .mobile-accordion.is-open { max-height: 520px; }
  .mobile-accordion-inner { padding: 10px 0 8px 12px; }
  .mobile-accordion .menu-item { min-height: 0; margin-bottom: 13px; }
  .mobile-accordion .menu-item strong { font-size: 12px; }
  .mobile-accordion .menu-item span { font-size: 11px; }
  .mobile-nav-cta { width: 100%; margin-top: 16px; }
  .workspace-card { position: relative; top: auto; min-height: 0; grid-template-columns: 1fr; gap: 28px; margin-bottom: 24px; padding: 28px 22px; }
  .workspace-visual img { height: 260px; }
  .workspace-stack-end { height: 0; }
  .sales-visibility-section { padding: 68px 18px; }
  .sales-visibility-layout { gap: 32px; }
  .sales-visibility-copy h2 { margin-bottom: 18px; font-size: clamp(2rem, 8vw, 2.5rem); }
  .sales-visibility-list { margin-top: 20px; }
  .sales-visibility-list li { padding-block: 15px; font-size: .84rem; }
  .sales-visibility-visual { min-height: 480px; aspect-ratio: auto; }
  .sales-overview-panel { padding: 16px; }
  .sales-overview-card { padding: 18px 14px 14px; }
  .sales-gauge { width: min(72%, 180px); }
  .sales-overview-legend { gap: 7px 5px; font-size: .48rem; }
  .solutions-section { padding: 68px 18px; }
  .solutions-heading { margin-bottom: 28px; }
  .solutions-heading h2 { font-size: clamp(2rem, 8vw, 2.5rem); }
  .solutions-content { grid-template-columns: 1fr; gap: 28px; }
  .solutions-visual { order: -1; aspect-ratio: 1.2; border-radius: 16px; }
  .solutions-accordion-trigger { min-height: 68px; padding-left: 16px; font-size: .95rem; }
  .solutions-accordion-panel-inner { padding-inline: 16px; }
  .solutions-accordion-item.is-active .solutions-accordion-panel-inner { padding-bottom: 22px; }
  .solutions-accordion-panel p { font-size: .85rem; }
  .solutions-accordion-panel a { margin-top: 18px; }
  .team-platform-section { padding: 68px 18px; }
  .team-platform-layout { gap: 32px; }
  .team-platform-copy h2 { margin-bottom: 30px; font-size: clamp(1.6rem, 7vw, 1.9rem); }
  .team-platform-benefits { gap: 20px; }
  .team-platform-icon { width: 42px; height: 42px; margin-bottom: 15px; }
  .team-platform-benefit h3 { font-size: .84rem; }
  .team-platform-benefit p, .team-platform-summary { font-size: .8rem; }
  .team-platform-summary { margin-top: 25px; }
  .team-platform-link { margin-top: 24px; }
  .team-platform-visual { aspect-ratio: .95; }
  .team-platform-metrics { right: 12px; bottom: 12px; gap: 6px; }
  .team-metric-card { width: clamp(100px, 34vw, 128px); min-height: 94px; padding: 9px; }
  .team-metric-label { gap: 5px; font-size: .56rem; }
  .team-metric-label svg { width: 19px; height: 19px; }
  .team-metric-card strong { font-size: 1rem; }
  .team-metric-card small { font-size: .53rem; }
}

@media (prefers-reduced-motion: reduce) {
  .solutions-accordion-item::before,
  .solutions-accordion-trigger > svg,
  .solutions-accordion-panel,
  .solutions-visual img { transition: none; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 74px; }
  .container { width: min(100% - 36px, var(--container)); }
  .section { padding-block: 68px; }
  .header-inner { min-height: 70px; }
  .menu-toggle { display: flex; width: 42px; height: 42px; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); cursor: pointer; }
  .menu-toggle span { width: 17px; height: 2px; border-radius: 2px; background: var(--ink); transition: transform .2s ease; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .primary-navigation { position: absolute; top: calc(100% + 1px); right: 0; left: 0; display: none; align-items: stretch; gap: 0; padding: 10px 18px 22px; border-bottom: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-card); }
  .primary-navigation.is-open { display: flex; flex-direction: column; }
  .primary-navigation > a:not(.button) { padding: 13px 5px; }
  .primary-navigation .button { margin-top: 10px; }
  .hero.landing-hero { padding: 0; }
  .landing-hero-layout { width: min(100% - 36px, 620px); min-height: 0; grid-template-columns: 1fr; gap: 28px; padding-block: 48px 42px; }
  .landing-hero-copy h1 { max-width: 570px; margin-bottom: 14px; font-size: clamp(2rem, 9vw, 2.7rem); line-height: 1.2; }
  .landing-hero-copy > p { font-size: .9rem; }
  .landing-hero-highlights { margin-top: 16px; }
  .landing-hero-actions { gap: 10px; margin-top: 23px; }
  .landing-photo-strip { height: 250px; }
  .landing-photo-strip img { object-position: 62% 42%; }
  .crm-showcase-intro { margin-bottom: 32px; }
  .crm-showcase-tabs { gap: 8px; margin-bottom: 22px; }
  .crm-showcase-tab { min-height: 36px; padding-inline: 13px; font-size: .74rem; }
  .crm-showcase-feature { min-height: 0; margin-bottom: 22px; }
  .crm-showcase-feature-description { font-size: .82rem; }
  .crm-showcase-arrow { width: 34px; height: 34px; }
  .crm-showcase-arrow svg { width: 18px; height: 18px; }
  .crm-showcase-arrow--previous { left: 8px; }
  .crm-showcase-arrow--next { right: 8px; }
  .crm-showcase-image { border-radius: 8px 8px 0 0; }
  .hero { padding-block: 58px 66px; }
  .hero-layout, .split-layout, .power-layout, .testimonial-layout, .faq-layout, .process-layout, .feature-hero { grid-template-columns: 1fr; }
  .hero-layout { gap: 18px; }
  .hero-copy h1 { max-width: 590px; font-size: clamp(2.9rem, 12vw, 4.3rem); }
  .hero-visual { min-height: 330px; margin-top: 20px; }
  .floating-card { padding: 11px 12px; }
  .floating-card--activity { top: 0; right: 0; }
  .floating-card--deal { bottom: 2%; left: 0; }
  .trust-content { gap: 20px; }
  .trust-content > p { white-space: normal; }
  .logo-list { flex-wrap: wrap; justify-content: flex-start; gap: 20px 30px; }
  .logo-list img { max-width: 82px; max-height: 28px; }
  .split-layout, .power-layout, .testimonial-layout, .faq-layout { gap: 34px; }
  .image-panel { padding: 18px; }
  .showcase-grid { grid-template-columns: 1fr; }
  .showcase-card--large { grid-row: auto; }
  .showcase-card--stat { min-height: 250px; }
  .feature-grid, .metric-grid, .pricing-grid, .blog-grid { grid-template-columns: 1fr; }
  .feature-card, .metric-card { min-height: auto; }
  .power-cards { gap: 10px; }
  .power-card { min-height: 190px; padding: 18px; }
  .steps-list li { grid-template-columns: 44px 1fr; gap: 14px; }
  .quote-card { padding: 26px; }
  .price-card > p:not(.eyebrow) { min-height: 0; }
  .insight-grid { grid-template-columns: 1fr; }
  .insight-card--revenue { grid-column: auto; grid-template-columns: 1fr; gap: 15px; }
  .closing-cta { padding-block: 54px; }
  .closing-cta-inner { align-items: flex-start; flex-direction: column; }
  .footer-top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 28px; padding-block: 40px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-column { gap: 12px; }
  .footer-bottom { padding-block: 18px; }
}

@media (max-width: 980px) {
  .footer-top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 28px; padding-block: 40px; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .button-label > span { transform: none !important; transition: none !important; }
  .button-label > span[aria-hidden="true"] { display: none; }
  .button-icon { transform: none !important; }
}





























/* ---------------- Header ---------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: transparent;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line-2);
}

.site-header .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 76px;
}

.logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
  color: var(--ink);
}

.logo svg {
  width: 22px;
  height: 22px;
}

.nav-main {
  display: flex;
  align-items: center;
  gap: 36px;
}

.nav-main a {
  font-size: 14.5px;
  font-weight: 500;
  color: var(--ink-2);
  display: flex;
  align-items: center;
  gap: 4px;
}

.nav-main a:hover {
  color: var(--ink);
}

.nav-main a svg {
  width: 11px;
  height: 11px;
  opacity: .6;
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 22px;
}

.nav-actions .signin {
  font-size: 14.5px;
  font-weight: 500;
}

.nav-toggle {
  display: none;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: none;
  align-items: center;
  justify-content: center;
}

.nav-toggle span,
.nav-toggle span::before,
.nav-toggle span::after {
  content: "";
  display: block;
  width: 18px;
  height: 1.6px;
  background: var(--ink);
  position: relative;
  transition: .2s;
}

.nav-toggle span::before {
  position: absolute;
  top: -6px;
}

.nav-toggle span::after {
  position: absolute;
  top: 6px;
}

@media (max-width: 940px) {
  .nav-main {
    display: none;
  }

  .nav-actions .signin {
    display: none;
  }

  .nav-toggle {
    display: flex;
  }
}

.mobile-nav {
  display: none;
  position: fixed;
  inset: 76px 0 0 0;
  z-index: 99;
  background: #fff;
  overflow-y: auto;
}

.mobile-nav.open {
  display: block;
}

.mobile-nav nav {
  display: flex;
  flex-direction: column;
  padding: 24px;
  gap: 4px;
}

.mobile-nav a {
  padding: 14px 4px;
  font-size: 17px;
  font-weight: 500;
  color: var(--ink);
  border-bottom: 1px solid var(--line-2);
}

.mobile-nav a.btn {
  border: none;
  margin-top: 16px;
  text-align: center;
}

/* ---------------- Card navigation ---------------- */
.card-nav-header {
  height: 96px;
  background: transparent;
  border-bottom: 0;
  backdrop-filter: none;
  display: flow-root;
}

.top-banner {
  --hero-background: var(--surface-2);
  /* background: var(--hero-background); */
  background: linear-gradient(
    124deg,
    rgba(0, 45, 26, 0.46) 0%,
    rgba(0, 45, 26, 0.46) 14.286%,
    rgba(0, 55, 31, 0.46) 14.286%,
    rgba(0, 55, 31, 0.46) 28.572%,
    rgba(0, 65, 36, 0.46) 28.572%,
    rgba(0, 65, 36, 0.46) 42.858%,
    rgba(0, 75, 41, 0.46) 42.858%,
    rgba(0, 75, 41, 0.46) 57.144%,
    rgba(0, 85, 46, 0.46) 57.144%,
    rgba(0, 85, 46, 0.46) 71.43%,
    rgba(0, 95, 51, 0.46) 71.43%,
    rgba(0, 95, 51, 0.46) 85.716%,
    rgba(0, 105, 56, 0.46) 85.716%,
    rgba(0, 105, 56, 0.46) 100.002%
  ),
  linear-gradient(
    316deg,
    #002d1a 0%,
    #002d1a 14.286%,
    #00371f 14.286%,
    #00371f 28.572%,
    #004124 28.572%,
    #004124 42.858%,
    #004b29 42.858%,
    #004b29 57.144%,
    #00552e 57.144%,
    #00552e 71.43%,
    #005f33 71.43%,
    #005f33 85.716%,
    #006938 85.716%,
    #006938 100.002%
  );
  /* background:linear-gradient(124deg, rgba(232, 252, 33, 0.46) 0%, rgba(232, 252, 33, 0.46) 14.286%, rgba(196, 218, 49, 0.46) 14.286%, rgba(196, 218, 49, 0.46) 28.572%, rgba(161, 185, 64, 0.46) 28.572%, rgba(161, 185, 64, 0.46) 42.858%, rgba(125, 151, 80, 0.46) 42.858%, rgba(125, 151, 80, 0.46) 57.144%, rgba(89, 117, 96, 0.46) 57.144%, rgba(89, 117, 96, 0.46) 71.43%, rgba(54, 84, 111, 0.46) 71.43%, rgba(54, 84, 111, 0.46) 85.716%, rgba(18, 50, 127, 0.46) 85.716%, rgba(18, 50, 127, 0.46) 100.002%), linear-gradient(316deg, rgb(248, 151, 43) 0%, rgb(248, 151, 43) 14.286%, rgb(246, 132, 46) 14.286%, rgb(246, 132, 46) 28.572%, rgb(243, 113, 49) 28.572%, rgb(243, 113, 49) 42.858%, rgb(241, 94, 52) 42.858%, rgb(241, 94, 52) 57.144%, rgb(239, 75, 55) 57.144%, rgb(239, 75, 55) 71.43%, rgb(236, 56, 58) 71.43%, rgb(236, 56, 58) 85.716%, rgb(234, 37, 61) 85.716%, rgb(234, 37, 61) 100.002%); */
}

.card-nav-container {
  position: relative;
  width: 90%;
  max-width: 800px;
  margin: 24px auto 0;
  z-index: 99;
}

.card-nav {
  position: relative;
  height: 60px;
  overflow: hidden;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(4, 19, 25, .12);
  transition: height .4s cubic-bezier(.22, 1, .36, 1);
  will-change: height;
}

.card-nav-top {
  position: absolute;
  inset: 0 0 auto;
  height: 60px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 8px 8px 18px;
}

.card-nav-menu {
  order: 0;
  display: flex;
  width: 38px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 6px;
}

.card-nav-menu span {
  display: block;
  width: 28px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transition: transform .3s ease, opacity .3s ease;
}

.card-nav-menu.open span:first-child {
  transform: translateY(4px) rotate(45deg);
}

.card-nav-menu.open span:last-child {
  transform: translateY(-4px) rotate(-45deg);
}

.card-nav-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--ink);
  transform: translate(-50%, -50%);
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
}

.card-nav-logo img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.logo img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.card-nav-cta {
  display: inline-flex;
  height: 44px;
  align-items: center;
  gap: 6px;
  padding: 0 15px;
  border-radius: var(--radius-sm);
  background: var(--blue);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  transition: background .2s ease, transform .2s ease;
}

.card-nav-cta:hover {
  background: var(--blue-2);
  transform: translateY(-1px);
}

.card-nav-cta svg,
.nav-card-links svg {
  width: 15px;
  height: 15px;
  stroke-width: 1.8;
}

.card-nav-content {
  position: absolute;
  left: 0;
  right: 0;
  top: 60px;
  bottom: 8px;
  z-index: 1;
  display: flex;
  align-items: stretch;
  gap: 12px;
  padding: 0 8px 8px;
  visibility: hidden;
  pointer-events: none;
}

.card-nav.open .card-nav-content {
  visibility: visible;
  pointer-events: auto;
}

.nav-card {
  display: flex;
  min-width: 0;
  min-height: 60px;
  flex: 1 1 0;
  flex-direction: column;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 9px;
  background: var(--card-bg);
  color: var(--card-text);
  opacity: 0;
  transform: translateY(50px);
  transition: opacity .4s ease, transform .4s cubic-bezier(.22, 1, .36, 1);
}

.card-nav.open .nav-card {
  opacity: 1;
  transform: translateY(0);
}

.card-nav.open .nav-card:nth-child(2) {
  transition-delay: .08s;
}

.card-nav.open .nav-card:nth-child(3) {
  transition-delay: .16s;
}

.nav-card-label {
  font-size: 22px;
  font-weight: 400;
  letter-spacing: -.5px;
}

.nav-card-links {
  display: flex;
  margin-top: auto;
  flex-direction: column;
  gap: 3px;
}

.nav-card-links a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  font-size: 15px;
  transition: opacity .2s ease;
}

.nav-card-links a:hover {
  opacity: .72;
}

@media (max-width: 768px) {
  .card-nav-header {
    height: 84px;
  }

  .card-nav-container {
    margin-top: 12px;
  }

  .card-nav-top {
    padding-left: 10px;
  }

  .card-nav-menu {
    order: 2;
  }

  .card-nav-logo {
    position: static;
    transform: none;
    order: 1;
    margin: 0 auto;
  }

  .card-nav-cta {
    display: none;
  }

  .card-nav-content {
    position: absolute;
    flex-direction: column;
    gap: 8px;
  }

  .nav-card {
    flex: none;
    min-height: 88px;
  }

  .nav-card-label {
    font-size: 19px;
  }

  .nav-card-links a {
    font-size: 14px;
  }
}

.faq-section {
  min-height: 680px;
  padding: 145px 24px 90px;
  background: #fff2df;
}
.faq-carousel { position: relative; width: min(100%, 1400px); margin-inline: auto; }
.faq-content { width: min(100%, 860px); min-height: 285px; margin-inline: auto; }
.faq-content h2 { margin-bottom: 52px; color: #080808; font-size: clamp(2rem, 3vw, 2.65rem); font-weight: 500; letter-spacing: -.045em; }
.faq-slide h3 { margin-bottom: 24px; color: #353535; font-family: var(--font-body); font-size: clamp(1.2rem, 1.65vw, 1.6rem); font-weight: 450; letter-spacing: -.025em; line-height: 1.35; }
.faq-slide p { max-width: 860px; color: #4c4c4c; font-size: clamp(1rem, 1.3vw, 1.25rem); line-height: 1.55; }
.faq-slide a { color: #0668e8; text-decoration: underline; text-underline-offset: 3px; }
.faq-arrow { position: absolute; top: 210px; display: grid; width: 58px; height: 58px; place-items: center; padding: 0; border: 0; border-radius: 50%; color: #111; background: rgb(0 0 0 / 6%); cursor: pointer; transition: background-color 180ms ease, transform 180ms ease; }
.faq-arrow:hover { background: rgb(0 0 0 / 10%); transform: scale(1.04); }
.faq-arrow:focus-visible, .faq-dots button:focus-visible { outline: 2px solid #111; outline-offset: 4px; }
.faq-arrow svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.faq-arrow--previous { left: 0; }
.faq-arrow--next { right: 0; }
.faq-dots { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 130px; }
.faq-dots button { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 50%; background: #b5b5b5; cursor: pointer; transition: background-color 180ms ease, transform 180ms ease; }
.faq-dots button[aria-current="true"] { background: #454545; transform: scale(1.08); }

.product-ecosystem,
.home-products { position: relative; min-height: auto; overflow: hidden; isolation: isolate; background: rgb(70, 14, 41); }
.product-ecosystem__image { position: absolute; z-index: -1; inset: 0; background: rgb(70, 14, 41); }
.product-ecosystem__content { position: relative; }
.product-ecosystem__head { max-width: 900px; margin: 0 0 48px; text-align: left; }
.product-ecosystem__head .eyebrow { margin-bottom: 16px; color: #f3c8da; }
.product-ecosystem__head h2 { margin-bottom: 18px; color: #fff; font-size: clamp(34px, 4.5vw, 56px); }
.product-ecosystem__head > p:last-child { max-width: 760px; color: rgb(255 255 255 / 82%); }
.product-carousel__viewport { overflow: hidden; margin: 0 -24px; padding: 0 24px 12px; }
.product-carousel__track { display: flex; gap: 20px; transition: transform .45s cubic-bezier(.22, 1, .36, 1); }
.product-card { display: flex; flex: 0 0 calc((100% - 40px) / 3); min-width: 0; min-height: 374px; flex-direction: column; padding: 24px; scroll-snap-align: start; border: 1px solid rgb(205 201 196 / 82%); border-radius: var(--radius-large); background: rgb(255 255 255 / 94%); box-shadow: 0 12px 26px rgb(65 55 46 / 10%); }
.product-card__icon { display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; margin-bottom: 24px; border: 1px solid #e5eef7; border-radius: 10px; color: rgb(255, 144, 0); background: #fbfdff; }
.product-card__icon svg { width: 24px; height: 24px; stroke-width: 1.7; }
.product-card h3 { margin: 28px 0 16px; color: var(--ink); font-size: 21px; line-height: 1.18; }
.product-card p { color: var(--ink-soft); font-size: 15px; line-height: 1.55; }
.product-card__link { display: inline-flex; width: fit-content; align-items: center; gap: 7px; margin-top: auto; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--radius-small); color: var(--ink); font-size: 14px; font-weight: 600; text-decoration: none; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.product-card__link:hover { transform: translateY(-2px); border-color: var(--ink); background: rgb(255 255 255 / 72%); }
.product-card__link svg { width: 15px; height: 15px; transition: transform .2s ease; }
.product-card__link:hover svg { transform: translate(2px, -2px); }
.product-carousel__controls { display: flex; align-items: center; gap: 10px; margin-top: 30px; }
.product-carousel__button { display: inline-flex; width: 58px; height: 58px; align-items: center; justify-content: center; padding: 0; border: 2px solid rgb(255 144 0 / 35%); border-radius: 50%; color: rgb(255, 144, 0); background: rgb(255 255 255 / 22%); cursor: pointer; transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
.product-carousel__button--next { border-color: rgb(255, 144, 0); color: rgb(255, 144, 0); }
.product-carousel__button:hover:not(:disabled) { transform: translateY(-2px); background: rgb(255 255 255 / 72%); }
.product-carousel__button:disabled { cursor: not-allowed; opacity: .45; }
.product-carousel__button svg { width: 21px; height: 21px; stroke-width: 1.5; }
.product-carousel__button:focus-visible { outline: 3px solid rgb(255, 144, 0); outline-offset: 3px; }
.product-carousel__progress { width: 110px; height: 4px; margin-left: auto; overflow: hidden; border-radius: 999px; background: rgb(153 50 204 / 17%); }
.product-carousel__progress span { display: block; width: 33.333%; height: 100%; transform: translateX(0); background: var(--purple); transition: transform .45s ease; }

.spin-cta-section { overflow: hidden; padding: clamp(76px, 8vw, 116px) 24px 0; background: radial-gradient(ellipse at 50% 0, #fff 0, #fff5e9 48%, #ffe8ca 100%); text-align: center; }
.spin-cta-content { width: min(100%, 1180px); margin-inline: auto; }
.spin-cta-eyebrow { margin-bottom: 14px; color: var(--accent); font-size: .76rem; font-weight: 750; letter-spacing: .13em; line-height: 1.3; text-transform: uppercase; }
.spin-cta-content h2 { margin-bottom: 18px; color: #080808; font-size: clamp(2.4rem, 5vw, 4.25rem); font-weight: 500; letter-spacing: -.055em; }
.spin-cta-description { max-width: 650px; margin-inline: auto; color: #4c4c4c; font-size: clamp(1rem, 1.3vw, 1.15rem); line-height: 1.65; }
.spin-cta-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 28px; }
.spin-cta-preview { overflow: hidden; width: min(100%, 1080px); margin: 68px auto 0; border: 1px solid rgb(44 35 20 / 12%); border-bottom: 0; border-radius: 14px 14px 0 0; background: #fff; box-shadow: 0 28px 70px rgb(64 43 14 / 16%); text-align: left; }
.spin-cta-preview-bar { display: flex; height: 44px; align-items: center; gap: 7px; padding-inline: 16px; border-bottom: 1px solid #ece9e5; background: #fff; }
.spin-cta-preview-bar > span { width: 8px; height: 8px; border-radius: 50%; background: #d9d6d1; }
.spin-cta-preview-bar > span:first-child { background: #ff6f61; }
.spin-cta-preview-bar > span:nth-child(2) { background: #f6bd4f; }
.spin-cta-preview-bar > span:nth-child(3) { background: #57c65b; }
.spin-cta-preview-bar p { margin-left: 8px; color: #77736e; font-size: .72rem; }
.spin-cta-preview img { width: 100%; height: auto; }

.get-started-page { min-height: 100vh; background: #faf9f7; }
.get-started-section { min-height: min(790px, calc(100vh - 68px)); padding-block: clamp(48px, 7vw, 82px); background: #fff; }
.get-started-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: clamp(36px, 4vw, 60px); }
.get-started-intro { display: flex; flex-direction: column; align-self: stretch; padding-top: 12px; }
.get-started-intro > .eyebrow { margin-bottom: 14px; }
.get-started-intro h1 { max-width: 510px; margin-bottom: 20px; color: var(--ink); font-size: clamp(2.5rem, 4vw, 3.6rem); letter-spacing: -.055em; line-height: 1.08; }
.get-started-intro > p:not(.eyebrow) { max-width: 510px; color: var(--muted); font-size: .98rem; line-height: 1.7; }
.get-started-info-cards { display: grid; flex: 1; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 36px; }
.get-started-info-card { display: grid; min-height: 92px; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 14px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 12px; background: #fff; }
.get-started-info-icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 9px; }
.get-started-info-icon svg { width: 17px; height: 17px; }
.get-started-info-icon--green { color: #008342; background: #e8f5ee; }
.get-started-info-icon--orange { color: #d97722; background: #fff0e5; }
.get-started-info-icon--purple { color: #9645c8; background: #f5eafa; }
.get-started-info-card h2 { margin-bottom: 5px; color: var(--ink); font-size: .9rem; letter-spacing: -.02em; }
.get-started-info-card p { color: var(--muted); font-size: .77rem; line-height: 1.5; }
.get-started-info-card a { display: inline-block; margin-top: 5px; color: #008342; font-size: .78rem; font-weight: 650; text-decoration: underline; text-underline-offset: 2px; }
.get-started-form { display: grid; width: 100%; height: 100%; align-content: space-between; gap: 10px; padding: clamp(20px, 2.5vw, 30px); border: 1px solid #e9e5df; border-radius: 12px; background: #fff; box-shadow: 0 18px 55px rgb(35 25 15 / 6%); }
.get-started-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.get-started-form label { display: grid; gap: 6px; color: #28262b; font-size: .8rem; font-weight: 650; }
.get-started-form label > span > span { color: #b43b4b; }
.get-started-form input, .get-started-form select, .get-started-form textarea { width: 100%; min-height: 40px; padding: 8px 11px; border: 1px solid #d9d6d0; border-radius: 6px; color: #242329; background: #fff; font: inherit; font-size: .84rem; font-weight: 400; }
.get-started-form textarea { min-height: 58px; resize: vertical; }
.get-started-form :is(input, select, textarea):focus-visible { border-color: #315bea; outline: 3px solid rgb(49 91 234 / 14%); }
.get-started-location-status { color: #69666e; font-size: .72rem; line-height: 1.45; }
.get-started-location-status:empty { display: none; }
.get-started-location-retry { justify-self: start; padding: 0; border: 0; color: #0755a5; background: transparent; font: inherit; font-size: .76rem; text-decoration: underline; cursor: pointer; }
.get-started-submit { justify-self: start; }
.get-started-form-status { color: #385b48; font-size: .84rem; line-height: 1.55; }

@media (max-width: 760px) {
  .faq-section { min-height: 600px; padding: 86px 22px 72px; }
  .faq-carousel { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
  .faq-content { min-height: 290px; grid-column: 1 / -1; padding-inline: 2px; }
  .faq-content h2 { margin-bottom: 42px; font-size: clamp(1.9rem, 8vw, 2.4rem); }
  .faq-slide h3 { margin-bottom: 18px; font-size: 1.2rem; }
  .faq-slide p { font-size: 1rem; }
  .faq-arrow { position: static; width: 48px; height: 48px; margin-top: 24px; }
  .faq-arrow--previous { justify-self: start; margin-left: 8px; }
  .faq-arrow--next { justify-self: end; margin-right: 8px; }
  .faq-arrow svg { width: 25px; height: 25px; }
  .faq-dots { grid-column: 1 / -1; gap: 12px; margin-top: 28px; }
  .faq-dots button { width: 8px; height: 8px; }
  .spin-cta-section { padding: 76px 18px 0; }
  .spin-cta-content h2 { font-size: clamp(2.2rem, 10vw, 3.2rem); }
  .spin-cta-description { font-size: .98rem; }
  .spin-cta-actions { gap: 10px; }
  .spin-cta-actions .landing-button { width: 100%; }
  .spin-cta-preview { margin-top: 44px; border-radius: 11px 11px 0 0; }
  .spin-cta-preview-bar { height: 38px; padding-inline: 12px; }
  .get-started-section { min-height: calc(100svh - 60px); padding: 42px 0; }
  .get-started-layout { grid-template-columns: 1fr; gap: 30px; }
  .get-started-intro { padding-top: 0; }
  .get-started-intro h1 { font-size: clamp(2.2rem, 9vw, 3rem); }
  .get-started-info-cards { gap: 10px; margin-top: 22px; }
  .get-started-info-cards { flex: initial; grid-template-rows: none; }
  .get-started-info-card { min-height: 92px; }
  .get-started-form { gap: 14px; padding: 20px; }
  .get-started-form-row { gap: 10px; }
}

@media (min-width: 761px) and (max-width: 980px) {
  .get-started-section { padding-inline: 0; }
  .get-started-layout { grid-template-columns: 1fr; gap: 32px; }
  .get-started-intro { padding-top: 0; }
  .get-started-info-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: none; }
  .get-started-info-card { align-content: start; grid-template-columns: 1fr; }
  .get-started-form { height: auto; }
}

@media (max-width: 900px) {
  .product-card { flex-basis: calc((100% - 20px) / 2); }
}

@media (max-width: 600px) {
  .product-ecosystem__head { margin-bottom: 36px; }
  .product-carousel__viewport { overflow-x: auto; margin: 0 -24px; padding-right: 24px; padding-left: 24px; scrollbar-width: none; scroll-snap-type: x mandatory; }
  .product-carousel__viewport::-webkit-scrollbar { display: none; }
  .product-carousel__track { transition: none; }
  .product-card { flex-basis: min(82vw, 320px); min-height: 350px; }
  .product-carousel__controls { margin-top: 22px; }
}

/* scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(28px) scale(.98);
  transition: opacity .8s cubic-bezier(.22, 1, .36, 1), transform .8s cubic-bezier(.22, 1, .36, 1);
}

.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}

.feature-detail-page .site-nav-shell,
.feature-marketing-hero,
.features-overview-hero {
  background: rgb(70 14 41);
}

.feature-detail-page .site-nav-header {
  border-bottom-color: rgb(255 255 255 / 12%);
  background: transparent;
}

.feature-detail-page .site-nav-brand,
.feature-detail-page .primary-nav > a,
.feature-detail-page .primary-nav-trigger,
.feature-detail-page .site-nav-toggle {
  color: #fff;
}

.feature-detail-page .primary-nav > a:hover,
.feature-detail-page .primary-nav-trigger:hover,
.feature-detail-page .primary-nav-trigger[aria-expanded="true"] {
  color: rgb(255 255 255 / 78%);
}

.feature-marketing-hero {
  overflow: hidden;
  padding: 18px 0 0;
  color: #fff;
  text-align: center;
}

.feature-marketing-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.feature-breadcrumb {
  display: flex;
  align-self: flex-start;
  align-items: center;
  gap: 10px;
  color: rgb(255 255 255 / 72%);
  font-size: .7rem;
  font-weight: 650;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.feature-breadcrumb a:hover,
.feature-breadcrumb [aria-current="page"] {
  color: #fff;
}

.feature-marketing-copy {
  width: min(100%, 880px);
  padding: 56px 0 0;
}

.feature-hero-eyebrow {
  margin-bottom: 14px;
  color: #b9d6ff;
  font-size: .75rem;
  font-weight: 750;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.feature-marketing-copy h1 {
  max-width: 900px;
  margin: 0 auto 20px;
  color: #fff;
  font-size: clamp(2.6rem, 5.2vw, 4.5rem);
  font-weight: 600;
  letter-spacing: -.045em;
  line-height: 1.08;
}

.feature-marketing-copy > p:not(.feature-hero-eyebrow) {
  max-width: 760px;
  margin: 0 auto;
  color: rgb(255 255 255 / 86%);
  font-size: clamp(1rem, 1.5vw, 1.13rem);
  line-height: 1.65;
}

.feature-hero-cta {
  margin-top: 26px;
}

.feature-marketing-visual {
  display: flex;
  width: min(100%, 900px);
  max-height: 410px;
  justify-content: center;
  overflow: hidden;
  margin-top: 54px;
  border: 5px solid rgb(255 255 255 / 82%);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: #fff;
  box-shadow: 0 -8px 44px rgb(4 15 45 / 22%);
}

.feature-marketing-visual img {
  width: 100%;
  height: auto;
  align-self: flex-start;
  object-fit: contain;
}

.feature-offerings-section {
  background: #fff;
}

.feature-offering-row {
  display: flex;
  min-height: calc(100vh - 68px);
  min-height: calc(100svh - 68px);
  align-items: center;
  padding-block: clamp(64px, 8vw, 104px);
  background: #fff;
}

.feature-offering-row:nth-child(even) {
  background: #faf9fb;
}

.feature-offering-layout {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(48px, 7vw, 104px);
}

.feature-offering-copy {
  max-width: 540px;
  justify-self: end;
}

.feature-offering-copy h2 {
  margin-bottom: 20px;
  font-size: clamp(2.35rem, 4vw, 3.5rem);
  letter-spacing: -.04em;
  line-height: 1.08;
}

.feature-offering-copy > p {
  color: var(--body);
  font-size: clamp(1rem, 1.25vw, 1.12rem);
  line-height: 1.75;
}

.feature-offering-copy ul {
  display: grid;
  gap: 15px;
  margin: 28px 0 0;
  padding: 0;
  color: #363340;
  font-size: clamp(.94rem, 1.1vw, 1.02rem);
  line-height: 1.55;
  list-style: none;
}

.feature-offering-copy li {
  position: relative;
  min-height: 26px;
  padding-left: 34px;
}

.feature-offering-copy li::before {
  position: absolute;
  top: 3px;
  left: 0;
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #315bea;
  content: "✓";
  font-size: .72rem;
  font-weight: 750;
}

.feature-offering-cta {
  margin-top: clamp(28px, 3vw, 42px);
}

.feature-offering-visual {
  display: grid;
  width: min(100%, 560px);
  min-height: clamp(340px, 52svh, 510px);
  place-items: center;
  overflow: hidden;
  padding: clamp(20px, 3vw, 34px);
  border-radius: 12px;
  background: #f0efff;
}

.feature-offering-visual img {
  width: 100%;
  max-height: 470px;
  object-fit: contain;
}

.feature-ai-section .section-heading {
  max-width: 780px;
}

.feature-ai-section .section-heading > p:last-child {
  margin-inline: auto;
}

@media (max-width: 760px) {
  .feature-detail-page .site-nav-brand {
    color: #fff;
  }

  .feature-detail-page .mobile-navigation {
    color: #041319;
    background: #fff;
  }

  .feature-marketing-hero {
    padding-top: 16px;
  }

  .feature-breadcrumb {
    gap: 7px;
    font-size: .59rem;
  }

  .feature-marketing-copy {
    padding-top: 46px;
  }

  .feature-marketing-copy h1 {
    font-size: clamp(2.35rem, 10vw, 3.3rem);
  }

  .feature-marketing-copy > p:not(.feature-hero-eyebrow) {
    font-size: .98rem;
  }

  .feature-marketing-visual {
    max-height: 250px;
    margin-top: 38px;
    border-width: 3px;
    border-radius: 14px 14px 0 0;
  }

  .feature-offering-row {
    min-height: calc(100vh - 60px);
    min-height: calc(100svh - 60px);
    padding-block: 56px;
  }

  .feature-offering-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .feature-offering-copy {
    max-width: 620px;
    justify-self: stretch;
  }

  .feature-offering-copy h2 {
    margin-bottom: 16px;
    font-size: clamp(2rem, 8vw, 2.8rem);
  }

  .feature-offering-copy > p {
    font-size: 1rem;
  }

  .feature-offering-copy ul {
    gap: 12px;
    margin-top: 22px;
    font-size: .95rem;
  }

  .feature-offering-visual {
    width: 100%;
    min-height: clamp(240px, 42svh, 360px);
    padding: 18px;
  }

  .feature-offering-visual img {
    max-height: 330px;
  }
}