
:root {
--brand-primary: #086b78;
--brand-dark: #071d2a;
--brand-blue: #246bfd;
--brand-accent: #19ad8c;
--brand-warm: #ff805d;
--brand-wash: #e9f8f4;
--ink: #0d202a;
--ink-soft: #526c78;
--line: #d7e5e8;
--surface: #ffffff;
--surface-soft: #f3f8f8;
--shadow-sm: 0 12px 30px rgba(10, 42, 55, .08);
--shadow-lg: 0 34px 90px rgba(4, 29, 42, .2);
--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box;}
html { scroll-behavior: smooth;}
body {
margin: 0;
color: var(--ink);
background: var(--surface);
font-family: var(--font);
line-height: 1.55;
-webkit-font-smoothing: antialiased;
}
a { color: var(--brand-primary);}
img, svg { display: block;}
.wrap { width: min(100% - 2.5rem, 1180px);margin-inline: auto;}
.site-head {
position: relative;
z-index: 20;
border-bottom: 1px solid rgba(215, 229, 232, .8);
background: rgba(255, 255, 255, .94);
backdrop-filter: blur(14px);
}
.site-head .wrap { display: flex;min-height: 78px;align-items: center;gap: 1.5rem;}
.logo { display: inline-flex;flex: 0 0 auto;align-items: center;text-decoration: none;}
.logo img { width: auto;height: 30px;}
.site-head nav { display: flex;align-items: center;gap: 1.7rem;margin-left: auto;}
.site-head nav > a:not(.btn) {
color: #24444f;
font-size: .9rem;
font-weight: 720;
text-decoration: none;
}
.site-head nav > a:not(.btn):hover { color: var(--brand-primary);}
.btn {
display: inline-flex;
min-height: 50px;
align-items: center;
justify-content: center;
gap: .55rem;
padding: .75rem 1.45rem;
border: 1px solid var(--line);
border-radius: 999px;
background: var(--surface);
color: var(--ink);
font: inherit;
font-size: .93rem;
font-weight: 780;
text-decoration: none;
cursor: pointer;
transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.btn:hover { transform: translateY(-2px);border-color: #b6cdd1;box-shadow: var(--shadow-sm);}
.btn.primary {
border-color: var(--brand-primary);
background: linear-gradient(115deg, var(--brand-primary), #087f8e);
color: #fff;
box-shadow: 0 10px 28px rgba(8, 107, 120, .2);
}
.btn.primary:hover { border-color: #075b66;background: linear-gradient(115deg, #075b66, #08727f);}
.btn.secondary { border-color: #c7d9dd;background: rgba(255, 255, 255, .78);}
.btn.light { border-color: #fff;background: #fff;color: var(--brand-dark);}
.btn.light:hover { background: #effaf7;}
.btn.block { width: 100%;}
.btn:focus-visible,
.site-head a:focus-visible,
.site-foot a:focus-visible,
.text-link:focus-visible,
.capability-rail:focus-visible {
outline: 3px solid rgba(36, 107, 253, .34);
outline-offset: 3px;
}
.nav-cta { min-height: 44px;padding: .62rem 1.15rem;}
.hero {
position: relative;
overflow: hidden;
padding: clamp(4.5rem, 8vw, 7.6rem) 0 clamp(5rem, 8vw, 7rem);
background:
  radial-gradient(circle at 83% 14%, rgba(36, 107, 253, .14), transparent 26rem),
  radial-gradient(circle at 96% 80%, rgba(25, 173, 140, .18), transparent 25rem),
  radial-gradient(circle at 7% 5%, rgba(255, 128, 93, .1), transparent 19rem),
  linear-gradient(145deg, #f9fcfb 0%, #edf8f6 48%, #f2f6ff 100%);
}
.hero::before {
position: absolute;
inset: 0;
background-image:
  linear-gradient(rgba(8, 107, 120, .045) 1px, transparent 1px),
  linear-gradient(90deg, rgba(8, 107, 120, .045) 1px, transparent 1px);
background-size: 54px 54px;
content: "";
mask-image: linear-gradient(to right, #000, transparent 56%);
}
.hero-grid {
position: relative;
display: grid;
grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
align-items: center;
gap: clamp(3rem, 6vw, 6.2rem);
}
.hero-copy { position: relative;z-index: 2;}
.eyebrow {
margin: 0 0 1.1rem;
color: var(--brand-primary);
font-size: .73rem;
font-weight: 850;
letter-spacing: .14em;
text-transform: uppercase;
}
.hero .eyebrow { display: flex;align-items: center;gap: .65rem;}
.hero .eyebrow span {
width: 9px;
height: 9px;
border-radius: 50%;
background: var(--brand-accent);
box-shadow: 0 0 0 6px rgba(25, 173, 140, .12);
}
.hero h1 {
max-width: 10ch;
margin: 0 0 1.4rem;
color: #0b2733;
font-size: clamp(3.35rem, 6.3vw, 5.7rem);
font-weight: 860;
letter-spacing: -.045em;
line-height: .94;
}
.hero p.lede { max-width: 47ch;margin: 0 0 1.8rem;color: var(--ink-soft);font-size: 1.12rem;line-height: 1.65;}
.hero-actions { display: flex;flex-wrap: wrap;gap: .75rem;}
.hero-actions .btn { min-width: 145px;}
.hero-note { display: flex;align-items: center;gap: .5rem;margin: 1.15rem 0 0;color: #58717a;font-size: .82rem;}
.hero-note span { display: grid;width: 19px;height: 19px;place-items: center;border-radius: 50%;background: #dff6ef;color: #087a61;font-size: .68rem;font-weight: 900;}
.product-preview { position: relative;min-width: 0;margin: 0;}
.overview-window { display: grid;grid-template-columns: 112px minmax(0, 1fr);overflow: hidden;border: 1px solid #d7e5e8;border-radius: 16px;background: #f4f7f9;box-shadow: var(--shadow-lg);}
.overview-sidebar { display: flex;flex-direction: column;gap: .4rem;padding: 1rem .5rem;background: #2e686d;color: #c0d9db;font-size: .65rem;}
.overview-sidebar > strong { display: flex;align-items: center;gap: .35rem;margin: 0 0 .8rem;color: white;font-size: .6rem;}
.overview-sidebar b { padding: .45rem;border-radius: 7px;background: #092d3c;color: #ffb654;}
.overview-sidebar > span { padding: .4rem .5rem;}
.overview-sidebar .active { border: 1px solid #70afc0;border-radius: 5px;background: #2c7f9d;color: white;}
.overview-main { min-width: 0;}
.overview-top { display: flex;align-items: center;justify-content: space-between;gap: .5rem;padding: .9rem;border-bottom: 1px solid var(--line);background: white;font-size: .8rem;}
.overview-top > span { color: #617d8a;font-size: .5rem;letter-spacing: .08em;}
.overview-body { display: grid;gap: .65rem;padding: .8rem;}
.overview-metrics { display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap: .5rem;}
.overview-metrics > div { padding: .65rem;border: 1px solid var(--line);border-radius: 8px;background: white;box-shadow: 0 2px 3px #132b3808;}
.overview-metrics .revenue { grid-column: span 2;border-color: #297a97;background: linear-gradient(120deg, #206480, #2a7e9b);color: white;}
.overview-metrics span { display: block;color: #577483;font-size: .5rem;letter-spacing: .055em;text-transform: uppercase;}
.overview-metrics strong { display: block;margin: .1rem 0;font-size: 1.25rem;line-height: 1.2;}
.overview-metrics small { display: block;color: #526c78;font-size: .54rem;}
.overview-metrics .revenue span, .overview-metrics .revenue small { color: #d5edf5;}
.overview-panel { overflow: hidden;border: 1px solid var(--line);border-radius: 8px;background: white;box-shadow: 0 2px 3px #132b3808;}
.overview-panel-head { padding: .65rem .75rem;border-bottom: 1px solid var(--line);}
.overview-panel-head strong { display: block;font-size: .72rem;}
.overview-panel-head small { display: block;color: var(--ink-soft);font-size: .5rem;}
.overview-chart { display: flex;height: 100px;align-items: end;gap: 3px;margin: .8rem .75rem 0;border-bottom: 1px solid #5c9cb5;background: repeating-linear-gradient(to top, transparent 0 24px, #e4edf1 24px 25px);}
.overview-chart i { flex: 1;min-width: 0;border-radius: 2px 2px 0 0;background: #40869f;}
.overview-chart i:last-child { background: #126b59;}
.overview-axis { display: flex;justify-content: space-between;padding: .3rem .75rem .65rem;color: #607b8a;font-size: .5rem;}
.overview-member { display: grid;grid-template-columns: 1.3fr .7fr .8fr 1fr;align-items: center;gap: .5rem;padding: .75rem;font-size: .55rem;}
.overview-member > strong { color: #216b87;font-size: .65rem;}
.overview-member small { display: block;color: var(--ink-soft);font-size: .5rem;font-weight: 400;}
.overview-member > span { color: var(--ink-soft);}
.overview-member b { display: block;color: var(--ink);font-weight: 600;}
.overview-low > div:last-child { display: flex;justify-content: space-between;padding: .65rem .75rem;font-size: .55rem;}
.overview-low b { font-weight: 500;}
.overview-mobile-nav { display: none;}
.product-preview figcaption { margin-top: .9rem;color: #58717a;font-size: .65rem;text-align: center;}
.inventory-story { padding: clamp(3.5rem, 7vw, 6rem) 0;}
.story-dark { background: radial-gradient(ellipse at 85% 50%, #143f49 0, transparent 60%), #081f2b;color: #f1f8fa;}
.story-light { background: #f1f8f6;}
.story-grid { display: grid;grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);align-items: center;gap: clamp(2rem, 6vw, 6rem);}
.story-reverse .story-copy { order: 2;}
.story-copy h2 { margin: 0 0 1.2rem;font-size: clamp(2rem, 3.7vw, 3.3rem);letter-spacing: -.05em;line-height: 1.06;}
.story-copy > p:not(.eyebrow) { max-width: 40ch;color: var(--ink-soft);font-size: 1rem;}
.story-dark .eyebrow { color: #79ddc4;}
.story-dark .story-copy > p:not(.eyebrow) { color: #b0c9d1;}
.story-tags { display: flex;flex-wrap: wrap;gap: .5rem;margin: 1.5rem 0 0;padding: 0;list-style: none;}
.story-tags li { padding: .4rem .65rem;border: 1px solid #bfd8d0;border-radius: 6px;color: #356052;font-size: .7rem;}
.story-dark .story-tags li { border-color: #31525d;color: #bde9de;}
.story-copy .text-link { display: inline-block;margin-top: 1.8rem;color: #9cebd6;}
.story-screen { --screen-bg: #fff;--screen-ink: #192f3a;--screen-muted: #59727e;--screen-line: #dce7eb;min-width: 0;margin: 0;overflow: hidden;border: 1px solid var(--screen-line);border-radius: 15px;background: var(--screen-bg);color: var(--screen-ink);box-shadow: 0 20px 50px #02101b18;}
.screen-dark { --screen-bg: #102b38;--screen-ink: #eef6f9;--screen-muted: #a1bdc7;--screen-line: #2a4856;}
.screen-heading { display: flex;justify-content: space-between;flex-wrap: wrap;gap: .3rem .8rem;padding: .85rem 1.2rem;border-bottom: 1px solid var(--screen-line);font-size: .72rem;font-weight: 600;}
.screen-label { color: var(--screen-muted);font-size: .65rem;font-weight: 400;}
.screen-body { padding: 1.5rem;}
.screen-title { display: flex;align-items: center;justify-content: space-between;gap: .8rem;}
.screen-title small { color: var(--screen-muted);font-size: .62rem;letter-spacing: .08em;}
.screen-title h3 { margin: .2rem 0 0;font-size: 1.15rem;}
.record-state { padding: .3rem .65rem;border-radius: 5px;background: #def5ec;color: #146249;font-size: .68rem;font-weight: 700;white-space: nowrap;}
.serial-focus { position: relative;display: flex;flex-direction: column;gap: .35rem;margin: 1.4rem 0;padding: 1rem;border: 1px solid #487b84;border-radius: 9px;background: #163844;}
.serial-focus > span:first-child { color: #9ac9ce;font-size: .6rem;letter-spacing: .1em;}
.serial-focus strong { font-family: ui-monospace, monospace;font-size: clamp(.85rem, 2vw, 1.2rem);letter-spacing: .04em;}
.serial-bars { width: 110px;height: 20px;margin-top: .3rem;background: repeating-linear-gradient(90deg, #93c7cf 0 2px, transparent 2px 4px, #93c7cf 4px 5px, transparent 5px 9px);opacity: .65;}
.record-fields { display: grid;grid-template-columns: 1fr 1fr;gap: 1rem;margin: 1.4rem 0;}
.record-fields dt { color: var(--screen-muted);font-size: .65rem;}
.record-fields dd { margin: .2rem 0 0;font-size: .82rem;font-weight: 600;}
.location-path { display: flex;align-items: center;justify-content: space-between;gap: .5rem;padding: .9rem;border: 1px solid var(--screen-line);border-radius: 8px;color: #b5e4da;font-size: .75rem;}
.location-path b { color: #69d9bd;}
.screen-note { margin: 1rem 0 0;color: var(--screen-muted);font-size: .7rem;line-height: 1.5;}
.handover-people { display: flex;justify-content: center;align-items: center;gap: 2rem;margin: 1.6rem 0;text-align: center;}
.handover-people div { display: grid;justify-items: center;}
.handover-people b { display: grid;width: 54px;height: 54px;margin-bottom: .5rem;place-items: center;border-radius: 50%;background: #e5f1f4;color: #28738a;font-size: 1.15rem;}
.handover-people div:last-child b { background: #dff3eb;color: #236a51;}
.handover-people strong { font-size: .85rem;}
.handover-people small { color: var(--screen-muted);font-size: .68rem;}
.handover-people > span { color: #468971;font-size: 1.5rem;}
.acceptance-note { display: flex;align-items: center;gap: .7rem;padding: .8rem 1rem;border: 1px solid #bcded1;border-radius: 8px;background: #edf8f3;color: #245c49;}
.acceptance-note > b { font-size: 1.2rem;}
.acceptance-note strong, .acceptance-note span { display: block;font-size: .75rem;}
.acceptance-note span { margin-top: .15rem;font-size: .65rem;}
.history-row { display: grid;grid-template-columns: 1.2fr 1fr 1fr;gap: .4rem;padding: .65rem 0;border-bottom: 1px solid var(--screen-line);font-size: .7rem;}
.history-row:first-of-type { color: var(--screen-muted);}
.receipt-item { display: grid;grid-template-columns: 1fr auto;gap: .3rem;margin-top: 1.5rem;padding-block: 1.2rem;border-block: 1px dashed #47606e;font-size: .85rem;}
.receipt-item > span { grid-row: 2;color: var(--screen-muted);font-size: .7rem;}
.receipt-item b { grid-column: 2;grid-row: 1 / span 2;align-self: center;font-size: 1.1rem;}
.record-trail { display: grid;grid-template-columns: repeat(4, 1fr);margin: 1.5rem 0 0;padding: 0;list-style: none;}
.record-trail li { padding: .65rem .1rem;border-top: 2px solid #56bf9f;color: #a0e2cc;font-size: .65rem;text-align: center;}
.record-trail li::before { display: block;margin: -.98rem auto .5rem;width: 9px;height: 9px;border: 3px solid #102b38;border-radius: 50%;background: #75dbb9;content: "";box-sizing: content-box;}
.feature-index { margin-top: 2.5rem;padding-top: 2rem;border-top: 1px solid var(--line);text-align: center;}
.feature-index p { margin: 0 0 1rem;font-size: 1.1rem;font-weight: 750;}
.feature-index ul { display: flex;justify-content: center;flex-wrap: wrap;gap: .6rem;margin: 0 0 1.4rem;padding: 0;list-style: none;}
.feature-index li { padding: .5rem .8rem;border: 1px solid var(--line);border-radius: 7px;color: var(--ink-soft);font-size: .78rem;}
.feature-index a { font-size: .85rem;font-weight: 700;}
.proof-strip { border-block: 1px solid var(--line);background: #fff;}
.proof-grid { display: grid;grid-template-columns: repeat(4, 1fr);}
.proof-grid > div { position: relative;min-width: 0;padding: 1.55rem 1.35rem 1.55rem 2.8rem;border-left: 1px solid var(--line);}
.proof-grid > div:last-child { border-right: 1px solid var(--line);}
.proof-grid > div > span { position: absolute;top: 1.58rem;left: 1rem;color: var(--brand-accent);font-size: .62rem;font-weight: 900;}
.proof-grid strong, .proof-grid small { display: block;}
.proof-grid strong { margin-bottom: .18rem;color: var(--brand-dark);font-size: .84rem;}
.proof-grid small { color: var(--ink-soft);font-size: .7rem;line-height: 1.45;}
.benefits { padding: clamp(5rem, 9vw, 7.5rem) 0;}
.section-heading { max-width: 720px;margin: 0 auto 3.4rem;text-align: center;}
.section-heading h2 { margin: 0;font-size: clamp(2.15rem, 4vw, 3.5rem);letter-spacing: -.048em;line-height: 1.02;}
.section-heading > p:last-child { max-width: 52ch;margin: 1rem auto 0;color: var(--ink-soft);font-size: 1.02rem;}
.benefit-scroll-cue { display: none;}
.capability-rail { display: grid;grid-template-columns: repeat(4, 1fr);gap: .85rem;}
.capability-card { position: relative;display: flex;min-height: 350px;flex-direction: column;overflow: hidden;padding: 1.45rem;border: 1px solid rgba(17, 68, 78, .09);border-radius: 22px;transition: transform .2s ease, box-shadow .2s ease;}
.capability-card:hover { transform: translateY(-4px);box-shadow: var(--shadow-sm);}
.custody-card { background: #eaf8f4;}
.sales-card { background: #edf2ff;}
.stock-card { background: #fff2ed;}
.offline-card { background: #f2f1ff;}
.feature-icon { display: grid;width: 44px;height: 44px;margin-bottom: 2.7rem;place-items: center;border-radius: 13px;background: rgba(255, 255, 255, .76);color: var(--brand-primary);box-shadow: 0 7px 22px rgba(13, 55, 67, .07);}
.sales-card .feature-icon { color: var(--brand-blue);}
.stock-card .feature-icon { color: #d55f3d;}
.offline-card .feature-icon { color: #6954d9;}
.feature-icon svg { width: 22px;height: 22px;fill: none;stroke: currentColor;stroke-width: 1.8;stroke-linecap: round;stroke-linejoin: round;}
.capability-number { position: absolute;top: 1.55rem;right: 1.5rem;color: rgba(13, 32, 42, .3);font-size: .68rem;font-weight: 900;letter-spacing: .08em;}
.capability-card h3 { max-width: 14ch;margin: 0 0 .55rem;font-size: 1.14rem;letter-spacing: -.02em;line-height: 1.2;}
.capability-card p { margin: 0;color: #506772;font-size: .86rem;line-height: 1.6;}
.mini-handover, .mini-count, .mini-offline, .mini-bars { margin-top: auto;}
.mini-handover { display: grid;grid-template-columns: auto auto auto;align-items: center;gap: .35rem;padding-top: 1.2rem;}
.mini-handover span { display: grid;width: 42px;height: 42px;place-items: center;border-radius: 50%;background: #fff;color: #23515b;font-size: .58rem;font-weight: 800;}
.mini-handover i { color: #58a696;font-style: normal;}
.mini-handover b { grid-column: 1 / -1;color: #168169;font-size: .63rem;}
.mini-bars { display: flex;height: 72px;align-items: end;gap: .38rem;padding-top: 1rem;}
.mini-bars i { width: 16%;border-radius: 5px 5px 2px 2px;background: rgba(36, 107, 253, .25);}
.mini-bars i:nth-child(1) { height: 32%;}
.mini-bars i:nth-child(2) { height: 52%;}
.mini-bars i:nth-child(3) { height: 68%;}
.mini-bars i:nth-child(4) { height: 94%;background: var(--brand-blue);}
.mini-bars span { align-self: flex-start;margin-left: auto;color: #315dc7;font-size: .68rem;font-weight: 850;}
.mini-count { display: grid;grid-template-columns: 1fr 1fr;gap: .45rem;padding-top: 1.2rem;}
.mini-count span { padding: .65rem;border-radius: 10px;background: rgba(255, 255, 255, .72);color: #8d5a4a;font-size: .56rem;}
.mini-count b { display: block;color: #913f28;font-size: 1rem;}
.mini-offline { padding-top: 1.2rem;}
.mini-offline span { display: flex;align-items: center;gap: .45rem;padding: .65rem;border-radius: 10px;background: rgba(255, 255, 255, .72);color: #55479f;font-size: .65rem;font-weight: 750;}
.mini-offline span i { width: 8px;height: 8px;border-radius: 50%;background: #ff805d;box-shadow: 0 0 0 4px rgba(255, 128, 93, .13);}
.mini-offline b { display: block;margin: .45rem 0 0 .65rem;color: #7569b8;font-size: .56rem;}
.closing-section { padding: 0 0 6rem;}
.closing-card {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 3rem;
overflow: hidden;
padding: 3.4rem;
border-radius: 28px;
background:
  radial-gradient(circle at 92% 24%, rgba(36, 107, 253, .36), transparent 17rem),
  radial-gradient(circle at 62% 140%, rgba(25, 173, 140, .26), transparent 22rem),
  var(--brand-dark);
color: #fff;
box-shadow: var(--shadow-lg);
}
.closing-card::after { position: absolute;right: -7rem;bottom: -11rem;width: 24rem;height: 24rem;border: 1px solid rgba(255,255,255,.13);border-radius: 50%;content: "";}
.closing-card > * { position: relative;z-index: 1;}
.closing-card .eyebrow { color: #70dec4;}
.closing-card h2 { max-width: 14ch;margin: 0;font-size: clamp(2rem, 4vw, 3rem);letter-spacing: -.045em;line-height: 1.03;}
.closing-card p:last-child { max-width: 48ch;margin: .85rem 0 0;color: #bcd0d7;}
.closing-actions { display: flex;align-items: center;gap: 1.2rem;}
.text-link { color: #fff;font-size: .88rem;font-weight: 750;text-underline-offset: 4px;}
.pricing-hero {
position: relative;
overflow: hidden;
padding: clamp(4.5rem, 8vw, 7rem) 0;
background:
  radial-gradient(circle at 84% 0%, rgba(36, 107, 253, .2), transparent 25rem),
  radial-gradient(circle at 7% 100%, rgba(25, 173, 140, .16), transparent 22rem),
  #f3f8f8;
}
.pricing-hero::after { position: absolute;top: -11rem;right: -8rem;width: 32rem;height: 32rem;border: 1px solid rgba(36, 107, 253, .14);border-radius: 50%;content: "";}
.pricing-hero-grid { position: relative;z-index: 1;display: grid;grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);align-items: center;gap: clamp(3rem, 8vw, 7rem);}
.pricing-hero h1 { max-width: 11ch;margin: 0;font-size: clamp(3rem, 6vw, 5.3rem);font-weight: 860;letter-spacing: -.065em;line-height: .95;}
.pricing-lede { max-width: 54ch;margin: 1.35rem 0 0;color: var(--ink-soft);font-size: 1.04rem;line-height: 1.7;}
.pricing-promise { display: grid;gap: .55rem;padding: 1rem;border: 1px solid rgba(8, 107, 120, .12);border-radius: 22px;background: rgba(255, 255, 255, .72);box-shadow: var(--shadow-sm);backdrop-filter: blur(12px);}
.pricing-promise span { display: grid;grid-template-columns: 2rem auto 1fr;align-items: center;gap: .55rem;padding: .8rem;border-radius: 13px;background: #fff;color: var(--ink-soft);font-size: .78rem;}
.pricing-promise i { display: grid;width: 2rem;height: 2rem;place-items: center;border-radius: 9px;background: var(--brand-wash);color: var(--brand-primary);font-size: .58rem;font-style: normal;font-weight: 900;}
.pricing-promise span:nth-child(2) i { background: #edf2ff;color: var(--brand-blue);}
.pricing-promise span:nth-child(3) i { background: #fff0eb;color: #cf5735;}
.pricing-promise b { color: var(--ink);}
.pricing-section { padding: clamp(4.5rem, 8vw, 7rem) 0;}
.pricing-controls { display: flex;align-items: end;justify-content: space-between;gap: 2rem;margin-bottom: 2.3rem;}
.pricing-controls h2 { max-width: 15ch;margin: 0;font-size: clamp(2rem, 4vw, 3rem);letter-spacing: -.045em;line-height: 1.05;}
.termbar { display: flex;flex-wrap: wrap;gap: .3rem;width: fit-content;max-width: 100%;margin: 0 0 .6rem;padding: .3rem;border: 1px solid var(--line);border-radius: 999px;background: var(--surface-soft);}
.termbar .term { display: inline-flex;min-height: 44px;align-items: center;justify-content: center;gap: .35rem;padding: .48rem .78rem;border-radius: 999px;color: var(--ink-soft);font-size: .78rem;text-decoration: none;white-space: nowrap;}
.term:focus-visible { outline: 3px solid var(--brand-blue);outline-offset: 2px;}
.pricing-status { min-height: 1.5em;margin: 0 0 .75rem;color: var(--ink-soft);font-size: .8rem;}
.pricing-grid { overflow-anchor: none;}
.termbar .term:hover { background: #fff;}
.termbar .term.on { background: var(--brand-dark);color: #fff;font-weight: 700;box-shadow: 0 6px 16px rgba(7, 29, 42, .16);}
.termbar .term .save { color: var(--brand-accent);font-size: .65rem;font-weight: 800;}
.termbar .term.on .save { color: #8ce6d0;}
.termnote { margin: 0;color: var(--ink-soft);font-size: .74rem;}
.pricing-grid { display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));align-items: stretch;gap: 1rem;}
.plan-card { position: relative;display: flex;min-width: 0;min-height: 590px;flex-direction: column;padding: 1.7rem;border: 1px solid var(--line);border-radius: 24px;background: #fff;box-shadow: 0 16px 42px rgba(13, 56, 69, .06);}
.plan-card.is-featured { border-color: rgba(36, 107, 253, .5);background: linear-gradient(180deg, #f2f6ff 0, #fff 42%);box-shadow: 0 24px 58px rgba(36, 107, 253, .15);}
.plan-scale { background: linear-gradient(180deg, #edfaf6 0, #fff 42%);}
.plan-badge { position: absolute;top: 1.35rem;right: 1.35rem;padding: .34rem .65rem;border-radius: 999px;background: var(--brand-blue);color: #fff;font-size: .62rem;font-weight: 850;}
.plan-index { display: block;margin-bottom: 2.25rem;color: var(--brand-accent);font-size: .65rem;font-weight: 900;letter-spacing: .09em;}
.is-featured .plan-index { color: var(--brand-blue);}
.plan-heading h3 { margin: 0;font-size: 1.45rem;letter-spacing: -.025em;}
.plan-heading p { min-height: 2.8rem;margin: .35rem 0 0;color: var(--ink-soft);font-size: .83rem;line-height: 1.55;}
.plan-price { margin: 1.25rem 0 .25rem;color: var(--ink);font-size: clamp(2rem, 3.2vw, 2.75rem);font-weight: 850;letter-spacing: -.045em;line-height: 1;}
.plan-price > span { font-size: .8rem;font-weight: 800;letter-spacing: .02em;}
.plan-price small { margin-left: .18rem;color: var(--ink-soft);font-size: .7rem;font-weight: 500;letter-spacing: 0;}
.plan-saving { min-height: 3.2rem;color: var(--ink-soft);font-size: .72rem;}
.plan-saving s { opacity: .72;}
.plan-saving b { margin-left: .35rem;padding: .18rem .38rem;border-radius: 999px;background: #dff7ee;color: #08745d;font-size: .62rem;}
.plan-saving small { display: block;margin-top: .28rem;}
.plan-card ul { margin: 0;padding: 0;color: var(--ink-soft);font-size: .82rem;list-style: none;}
.plan-card .plan-limits { margin: 1.1rem 0 1.25rem;padding: 1.1rem 0 0;border-top: 1px solid var(--line);}
.plan-card li { position: relative;padding: .3rem 0 .3rem 1.25rem;}
.plan-card li::before { position: absolute;left: 0;color: var(--brand-accent);font-weight: 900;content: "\2713";}
.plan-card li b { color: var(--ink);}
.plan-core { margin: 0 0 1rem;padding: 1rem;border: 1px solid rgba(8,107,120,.14);border-radius: 14px;background: #f4faf9;}
.plan-core-title { display: flex;align-items: center;gap: .5rem;margin: 0 0 .6rem;color: var(--ink);font-size: .76rem;font-weight: 800;}
.plan-core-title span { padding: .2rem .4rem;border-radius: 5px;background: #dff6ef;color: #08745d;font-size: .56rem;letter-spacing: .06em;text-transform: uppercase;}
.plan-core li { padding: .27rem 0 .27rem 1.15rem;font-size: .74rem;line-height: 1.4;}
.plan-card > .btn { margin-top: auto;}
.included { padding: clamp(4.5rem, 8vw, 7rem) 0;border-block: 1px solid var(--line);background: var(--surface-soft);}
.included-heading { display: grid;grid-template-columns: .72fr 1.1fr;gap: 0 4rem;margin-bottom: 2.5rem;}
.included-heading .eyebrow { grid-column: 1;}
.included-heading h2 { grid-column: 1;max-width: 11ch;margin: 0;font-size: clamp(2rem, 4vw, 3rem);letter-spacing: -.045em;line-height: 1.04;}
.included-heading > p:last-child { grid-column: 2;grid-row: 1 / span 2;align-self: end;max-width: 34ch;margin: 0;color: var(--ink-soft);font-size: 1rem;}
.included-grid { display: grid;grid-template-columns: repeat(3, 1fr);gap: .75rem;margin-bottom: 2rem;}
.included-grid article { position: relative;min-height: 180px;padding: 1.4rem;border: 1px solid var(--line);border-radius: 18px;background: #fff;}
.included-grid article > span { position: absolute;top: 1.4rem;right: 1.4rem;color: rgba(13, 32, 42, .28);font-size: .62rem;font-weight: 900;}
.included-grid h3 { max-width: 16ch;margin: 2rem 0 .4rem;font-size: .98rem;letter-spacing: -.01em;}
.included-grid p { margin: 0;color: var(--ink-soft);font-size: .8rem;line-height: 1.55;}
.everything { margin: 0 0 1rem;border: 1px solid var(--line);border-radius: 16px;background: #fff;}
.everything > summary { padding: 1rem 1.2rem;cursor: pointer;list-style: none;font-size: .88rem;font-weight: 750;}
.everything > summary::-webkit-details-marker { display: none;}
.everything > summary::after { float: right;color: var(--brand-primary);font-weight: 750;content: "Show all";}
.everything[open] > summary::after { content: "Hide";}
.everything > summary:focus-visible { outline: 3px solid rgba(36, 107, 253, .3);outline-offset: -3px;}
.everything-grid { display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 1.4rem 2rem;padding: 1.2rem;border-top: 1px solid var(--line);}
.everything-grid h4 { margin: 0 0 .5rem;color: var(--ink-soft);font-size: .72rem;letter-spacing: .08em;text-transform: uppercase;}
.everything-grid ul { margin: 0;padding: 0;list-style: none;}
.everything-grid li { position: relative;margin-bottom: .35rem;padding-left: 1.1rem;font-size: .8rem;line-height: 1.45;}
.everything-grid li::before { position: absolute;left: 0;color: var(--brand-accent);content: "\2713";}
.isolation { display: flex;align-items: flex-start;gap: 1rem;padding: 1.25rem 1.4rem;border: 1px solid rgba(25, 173, 140, .3);border-radius: 16px;background: #eaf8f4;}
.isolation-mark { display: grid;width: 2.3rem;height: 2.3rem;flex: 0 0 auto;place-items: center;border-radius: 11px;background: #fff;color: var(--brand-accent);font-weight: 900;}
.isolation h3 { margin: 0 0 .3rem;font-size: .98rem;}
.isolation p { max-width: 70ch;margin: 0;color: var(--ink-soft);font-size: .82rem;line-height: 1.55;}
.pricing-end { padding: 0 0 5rem;}
.pricing-end-grid { display: grid;grid-template-columns: minmax(0, 1fr) auto;align-items: center;gap: 2rem;padding: 2.7rem;border-radius: 24px;background: var(--brand-dark);color: #fff;}
.pricing-end .eyebrow { color: #70dec4;}
.pricing-end h2 { margin: 0;font-size: clamp(1.8rem, 3.4vw, 2.6rem);letter-spacing: -.04em;}
.pricing-end p { margin: .55rem 0 0;color: #b9cdd4;}
.pricing-notes { grid-column: 1 / -1;padding-top: 1rem;border-top: 1px solid rgba(255, 255, 255, .12);color: #b9cdd4;font-size: .78rem;}
.pricing-notes summary { color: #fff;cursor: pointer;font-weight: 750;}
.pricing-notes p { max-width: 80ch;}
.panel { max-width: 460px;margin: 3rem auto;padding: 2rem;border: 1px solid var(--line);border-radius: 12px;}
.panel.wide { max-width: 620px;}
.panel h1 { margin-bottom: .35rem;font-size: 1.5rem;}
.panel .lede { margin-bottom: 1.5rem;color: var(--ink-soft);font-size: .93rem;}
.field { margin-bottom: 1rem;}
.field label { display: block;margin-bottom: .3rem;color: var(--ink-soft);font-size: .8rem;font-weight: 600;}
.field input, .field select { width: 100%;padding: .6rem .7rem;border: 1px solid var(--line);border-radius: 7px;color: var(--ink);font: inherit;}
.field input:focus, .field select:focus { outline: none;border-color: var(--brand-accent);box-shadow: 0 0 0 3px rgba(44,125,160,.16);}
.field .help { margin-top: .25rem;color: var(--ink-soft);font-size: .78rem;}
.field .errors { margin-top: .25rem;color: #b3261e;font-size: .8rem;}
.field-row { display: grid;grid-template-columns: 1fr 1fr;gap: .75rem;}
.addr-preview { margin-top: .3rem;color: var(--ink-soft);font-size: .82rem;}
.addr-preview strong { color: var(--brand-primary);}
.addr-ok { color: #1e7a45;}
.addr-bad { color: #b3261e;}
.form-errors { margin-bottom: 1rem;padding: .7rem .9rem;border: 1px solid #f0c7c4;border-radius: 7px;background: #fbeceb;color: #7e1b15;font-size: .88rem;}
.flash { margin-bottom: 1rem;padding: .7rem .9rem;border: 1px solid;border-radius: 7px;font-size: .88rem;}
.flash.error, .flash.debug { border-color: #f0c7c4;background: #fbeceb;color: #7e1b15;}
.flash.success          { border-color: #bfe3cd;background: #eef8f2;color: #14603a;}
.flash.info             { border-color: #c7dcef;background: #eef4fb;color: #16496f;}
.flash.warning          { border-color: #efdcb4;background: #fdf5e7;color: #7a5200;}
.site-foot { padding: 2.8rem 0;border-top: 1px solid var(--line);background: #f8fbfb;color: var(--ink-soft);font-size: .82rem;}
.foot-inner {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
gap: 1.5rem 3rem;
}
.foot-inner strong { color: var(--ink);}
.foot-inner > p strong { display: block;margin-bottom: .25rem;font-size: .95rem;}
.foot-inner > p { max-width: 40ch;margin: 0;}
.notice { max-width: 520px;margin: 5rem auto;padding: 0 1.25rem;text-align: center;}
.notice h1 { font-size: 1.6rem;}
.notice p { color: var(--ink-soft);}
.password-field { position: relative;display: block;}
.password-field input { padding-right: 4.2rem;}
.password-toggle {
position: absolute;
top: 50%;
right: .35rem;
min-height: 32px;
padding: .35rem .5rem;
transform: translateY(-50%);
border: 0;
border-radius: 6px;
background: transparent;
color: var(--brand-primary);
font: inherit;
font-size: .78rem;
font-weight: 650;
cursor: pointer;
}
.password-toggle:hover { background: rgba(0, 0, 0, .05);}
@media (max-width: 860px) {
.hero { padding-top: 4.5rem;}
.hero-grid { grid-template-columns: 1fr;gap: 3.5rem;}
.hero-copy { max-width: 680px;}
.product-preview { width: min(100%, 680px);margin-inline: auto;}
.proof-grid { grid-template-columns: repeat(2, 1fr);}
.proof-grid > div { border-bottom: 1px solid var(--line);}
.proof-grid > div:nth-child(2n) { border-right: 1px solid var(--line);}
.proof-grid > div:nth-last-child(-n+2) { border-bottom: 0;}
.capability-rail { grid-template-columns: repeat(2, 1fr);}
.closing-card { grid-template-columns: 1fr;gap: 1.8rem;}
.pricing-hero-grid { grid-template-columns: 1fr;gap: 2.5rem;}
.pricing-promise { max-width: 620px;}
.pricing-controls { align-items: flex-start;flex-direction: column;}
.included-grid { grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 640px) {
.wrap { width: min(100% - 2rem, 1120px);}
.site-head .wrap { min-height: 72px;gap: .6rem;}
.logo img { height: 25px;}
.site-head nav { gap: .55rem;}
.site-head nav > a:not(.btn) { font-size: .75rem;}
.nav-pricing { display: none;}
.nav-sign-in { max-width: 5.6rem;text-align: center;line-height: 1.12;}
.nav-cta { min-height: 40px;padding: .55rem .78rem;font-size: .78rem;white-space: nowrap;}
.hero { padding: 3.4rem 0 3.9rem;}
.hero-grid { gap: 2.8rem;}
.hero h1 { max-width: 11ch;margin-bottom: 1.1rem;font-size: clamp(2.7rem, 13.2vw, 3.65rem);}
.hero p.lede { margin-bottom: 1.5rem;font-size: 1rem;line-height: 1.62;}
.hero-actions { display: grid;grid-template-columns: 1fr 1fr;}
.hero-actions .btn { min-width: 0;padding-inline: .85rem;}
.overview-window { grid-template-columns: 1fr;}
.overview-sidebar, .overview-top > span { display: none;}
.overview-top { background: #2e686d;color: white;}
.overview-metrics { grid-template-columns: 1fr 1fr;}
.overview-metrics .revenue { grid-column: auto;}
.overview-metrics span { font-size: .57rem;}
.overview-metrics small { font-size: .6rem;}
.overview-metrics strong { font-size: 1.3rem;}
.overview-panel-head strong { font-size: .8rem;}
.overview-panel-head small { font-size: .6rem;}
.overview-mobile-nav { display: flex;justify-content: space-around;padding: .8rem .4rem;border-top: 1px solid var(--line);background: white;color: #526c78;font-size: .6rem;}
.overview-mobile-nav b { color: #216b87;}
.overview-low { display: none;}
.story-grid { grid-template-columns: 1fr;}
.story-reverse .story-copy { order: 0;}
.story-copy h2 { font-size: 2.1rem;}
.screen-body { padding: 1.1rem;}
.screen-heading { padding: .8rem 1.1rem;}
.record-fields dd { font-size: .75rem;}
.receipt-item b { font-size: .95rem;}
.proof-grid > div { padding: 1.15rem .85rem 1.15rem 2.35rem;}
.proof-grid > div > span { top: 1.2rem;left: .8rem;}
.proof-grid strong { font-size: .75rem;}
.proof-grid small { font-size: .64rem;}
.benefits { padding: 4.5rem 0;}
.section-heading { margin-bottom: 2rem;text-align: left;}
.section-heading h2 { font-size: 2rem;}
.section-heading > p:last-child { margin-left: 0;}
.benefit-scroll-cue {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: -.55rem 0 .7rem;
  color: var(--brand-primary);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.benefit-scroll-cue span { font-size: 1rem;}
.capability-rail {
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: min(82vw, 320px);
  gap: .85rem;
  width: calc(100% + (100vw - 100%) / 2);
  overflow-x: auto;
  padding: .2rem 1rem 1rem 0;
  scroll-padding-inline-start: 0;
  scroll-snap-type: inline mandatory;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.capability-rail::-webkit-scrollbar { display: none;}
.capability-card { min-height: 330px;padding: 1.4rem;scroll-snap-align: start;}
.closing-section { padding-bottom: 4rem;}
.closing-card { padding: 2rem 1.4rem;border-radius: 18px;}
.closing-actions { flex-wrap: wrap;}
.closing-actions .btn { width: 100%;}
.pricing-hero { padding: 3.8rem 0;}
.pricing-hero h1 { font-size: clamp(2.75rem, 13vw, 3.7rem);}
.pricing-promise { padding: .7rem;border-radius: 17px;}
.pricing-promise span { grid-template-columns: 2rem auto 1fr;padding: .65rem;font-size: .7rem;}
.pricing-section { padding: 4rem 0;}
.pricing-controls { margin-bottom: 1.6rem;}
.pricing-controls h2 { font-size: 2rem;}
.billing-picker { width: 100%;}
.termbar { display: grid;grid-template-columns: 1fr 1fr;width: 100%;border-radius: 16px;}
.termbar .term { padding: .45rem .68rem;font-size: .72rem;}
.pricing-grid { grid-template-columns: 1fr;}
.plan-card { min-height: 0;padding: 1.45rem;border-radius: 20px;}
.plan-heading p { min-height: 0;}
.plan-card .plan-limits { margin-bottom: 1rem;}
.included { padding: 4rem 0;}
.included-heading { display: block;}
.included-heading h2 { max-width: 13ch;font-size: 2rem;}
.included-heading > p:last-child { margin-top: .8rem;}
.included-grid { grid-template-columns: 1fr;}
.included-grid article { min-height: 155px;}
.isolation { padding: 1.1rem;}
.pricing-end { padding-bottom: 4rem;}
.pricing-end-grid { grid-template-columns: 1fr;padding: 2rem 1.4rem;border-radius: 20px;}
.pricing-end-grid > .btn { width: 100%;}
.field-row { grid-template-columns: 1fr;}
.panel { margin: 2rem auto;padding: 1.3rem;}
}
@media (max-width: 360px) {
.wrap { width: min(100% - 1.5rem, 1120px);}
.site-head .wrap { gap: .45rem;}
.site-head nav { gap: .4rem;}
.nav-sign-in { max-width: 4.8rem;font-size: .69rem !important;}
.nav-cta { padding-inline: .65rem;}
.nav-cta span { display: none;}
.hero-actions { grid-template-columns: 1fr;}
}
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto;}
.btn, .capability-card { transition: none;}
}
.code-input {
width: 100%;
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
font-size: 1.6rem;
letter-spacing: .5em;
text-align: center;
text-indent: .5em;
padding: .7rem .5rem;
margin-bottom: 1rem;
}
.form-note {
margin-bottom: 1rem;padding: .6rem .8rem;
background: #E9F6EF;border: 1px solid #BFE3D0;border-radius: 8px;
color: #14522F;font-size: .88rem;
}
.verify-foot {
margin-top: 1.2rem;padding-top: 1rem;
border-top: 1px solid var(--line);
font-size: .88rem;color: var(--ink-soft);
}
.verify-foot .text-link {
color: var(--ink-soft);background: none;border: 0;padding: 0;
font: inherit;cursor: pointer;text-decoration: underline;
}
.verify-foot .text-link:hover { color: var(--ink);}
.verify-why { margin-top: 1rem;font-size: .82rem;}
.panel > .help { margin-top: .6rem;color: var(--ink-soft);font-size: .84rem;}
.notice-actions { margin: 1.4rem 0 .6rem;}
.notice-actions .btn { display: inline-block;}
.notice-support {
margin: 2rem auto 0;
max-width: 34rem;
padding-top: 1.2rem;
border-top: 1px solid var(--line);
font-size: .9rem;
color: var(--ink-soft);
}
.notice-support-head { font-weight: 650;color: var(--ink);margin-bottom: .3rem;}
.notice-support a { color: var(--ink);}
.notice-support-hours { margin-top: .3rem;font-size: .82rem;}
.support-block {
margin-top: 1.5rem;padding-top: 1rem;
border-top: 1px solid var(--line);
font-size: .88rem;color: var(--ink-soft);
}
.support-head { font-weight: 650;color: var(--ink);margin-bottom: .25rem;}
.support-lines a { color: var(--ink);}
.support-hours { margin-top: .25rem;font-size: .8rem;}
.site-foot .support-block {
margin-top: 0;
padding-top: 0;
border-top: 0;
}
@media (max-width: 640px) {
.foot-inner { gap: 1.1rem;}
.site-foot .support-block {
  width: 100%;
  padding-top: 1.1rem;
  border-top: 1px solid var(--line);
}
}
.definition {
  padding: 4rem 0;
  border-block: 1px solid var(--line);
  background: var(--surface-soft);
}
.definition-grid { display: grid;grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr);gap: clamp(2rem, 6vw, 6rem);}
.definition h2 { max-width: 10ch;margin: 0;font-size: clamp(2rem, 4vw, 3rem);letter-spacing: -.045em;line-height: 1.04;}
.definition .lede { max-width: 60ch;margin: 0 0 .8rem;color: var(--ink);font-size: 1.05rem;line-height: 1.6;}
.definition p { max-width: 68ch;margin: 0;color: var(--ink-soft);font-size: .95rem;line-height: 1.65;}
.faq {
  padding: 4.5rem 0 5rem;
}
.faq > .wrap > h2 {
  max-width: 14ch;
  margin: 0 0 2rem;
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  letter-spacing: -.04em;
  line-height: 1.05;
}
.faq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.6rem 2.5rem;
}
.faq-item h3 {
  margin: 0 0 .4rem;
  font-size: 1rem;
  letter-spacing: -.01em;
}
.faq-item p {
  max-width: 52ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: .92rem;
  line-height: 1.6;
}
@media (max-width: 640px) {
.definition { padding: 3rem 0;}
.definition-grid { grid-template-columns: 1fr;gap: 1.35rem;}
.definition h2 { max-width: none;}
.faq { padding: 3.5rem 0 4rem;}
.faq-grid { grid-template-columns: 1fr;gap: 1.5rem;}
}

.inventory-range { padding: 3.2rem 0;text-align: center;}
.inventory-range h2 { margin: 0 0 2rem;font-size: clamp(1.5rem, 2.5vw, 2.2rem);letter-spacing: -.035em;}
.range-grid { display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: 1rem;}
.range-grid > div { display: grid;justify-items: center;gap: .35rem;}
.range-grid svg { width: 48px;height: 48px;margin-bottom: .6rem;fill: none;stroke: #277883;stroke-width: 1.8;stroke-linecap: round;stroke-linejoin: round;}
.range-grid strong { font-size: .85rem;}
.range-grid span { color: var(--ink-soft);font-size: .72rem;}
.serial-focus small { color: #b5e4da;font-size: .68rem;}
@media (max-width: 640px) {
.range-grid { grid-template-columns: 1fr 1fr;gap: 1.8rem .8rem;}
.range-grid strong { font-size: .75rem;}
.overview-metrics strong { font-size: clamp(.95rem, 4vw, 1.25rem);}
.overview-metrics .revenue { grid-column: span 2;}
}
/* The trade pages, in the footer of every page. Internal linking is most of
   how a new page gets crawled at all: linked from one place it is visited
   once, linked from everywhere it is treated as part of the site. */
.foot-pages { display: flex;flex-wrap: wrap;gap: .35rem 1rem;flex-basis: 100%;order: 3;padding-top: 1rem;border-top: 1px solid var(--line);}
.foot-pages a { color: var(--ink-soft);font-size: .82rem;text-decoration: none;}
.foot-pages a:hover { color: var(--brand-primary);}
