/* VS/FMS public homepage. All visual assets are served locally. */
    :root { --ink:#111f31; --navy:#102136; --navy-deep:#0c192a; --blue:#165bdf; --blue-light:#a9c8ff; --paper:#fff; --wash:#f3f5f8; --muted:#586676; --line:#dce2ea; --green:#197454; --mono:Consolas,"Courier New",monospace; --sans:"Segoe UI",Arial,sans-serif; }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; scroll-padding-top:100px; }
    body { margin:0; color:var(--ink); background:var(--paper); font:15px/1.55 var(--sans); -webkit-font-smoothing:antialiased; }
    button,input,select { font:inherit; }
    button,a,select { -webkit-tap-highlight-color:transparent; }
    button,a { touch-action:manipulation; }
    button { cursor:pointer; }
    a { color:inherit; text-decoration:none; }
    button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible { outline:3px solid #f0ae43; outline-offset:4px; }
    h1,h2,h3,p { margin:0; }
    svg { display:block; }
    [hidden] { display:none!important; }
    .wrap { width:min(1280px,calc(100% - 96px)); margin-inline:auto; }
    .icon { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
    .arrow { font-size:21px; font-weight:400; line-height:1; }
    .eyebrow { font:11px/1.5 var(--mono); letter-spacing:1.7px; text-transform:uppercase; }
    .concept-bar { background:#edf2f9; color:#4c6079; font:10px/1.5 var(--mono); letter-spacing:1px; text-transform:uppercase; }
    .concept-bar .wrap { min-height:29px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
    .masthead { position:sticky; top:0; z-index:15; background:#fff; border-bottom:1px solid var(--line); }
    .nav { height:86px; display:flex; align-items:center; gap:40px; }
    .brand { display:flex; align-items:center; gap:16px; flex-shrink:0; }
    .brand-mark { width:35px; height:35px; display:grid; gap:4px; align-content:center; transform:skewY(-16deg); }
    .brand-mark i { height:5px; display:block; background:var(--blue); }
    .brand-mark i:nth-child(2) { width:28px; }
    .brand-mark i:nth-child(3) { width:21px; }
    .brand-word { font-size:27px; letter-spacing:-1.5px; font-weight:650; line-height:1.05; }
    .brand-word .slash { color:var(--blue); padding-inline:1px; }
    .brand-by { margin-top:5px; font:8px/1.2 var(--mono); letter-spacing:1.5px; }
    .nav-links { display:flex; gap:28px; margin-left:auto; align-items:center; }
    .nav-links a { font-size:13px; color:#394859; }
    .nav-links a:hover { color:var(--blue); }
    .button { border:1px solid transparent; display:inline-flex; min-height:46px; align-items:center; justify-content:center; gap:25px; padding:12px 20px; font-weight:600; font-size:13px; line-height:1.4; transition:background .15s,color .15s; }
    .button-blue { background:var(--blue); color:#fff; }
    .button-blue:hover { background:#104cbe; }
    .button-outline { border-color:#66758a; background:transparent; color:#fff; }
    .button-outline:hover { background:#203853; }
    .button-light { background:#fff; color:var(--ink); }
    .button-light:hover { background:#e6efff; }
    .menu-toggle { display:none; margin-left:auto; border:1px solid var(--line); background:white; padding:10px; color:var(--ink); }
    .hero { position:relative; overflow:hidden; background:var(--navy); color:#fff; }
    .hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(#ffffff03 1px,transparent 1px),linear-gradient(90deg,#ffffff03 1px,transparent 1px); background-size:64px 64px; pointer-events:none; }
    .hero-inner { position:relative; display:grid; grid-template-columns:.87fr 1.13fr; gap:52px; align-items:center; padding-top:76px; padding-bottom:78px; }
    .hero-kicker { color:#b4c8e1; display:flex; gap:10px; align-items:center; font-size:10px; letter-spacing:1.4px; }
    .hero-kicker::before { content:""; width:7px; height:7px; background:#7ca7ff; }
    h1 { font-weight:500; letter-spacing:-3.8px; font-size:clamp(46px,5.3vw,74px); line-height:1.07; margin-top:25px; }
    h1 span { color:var(--blue-light); display:block; }
    .hero-copy { color:#bfccdc; max-width:415px; font-size:16px; line-height:1.75; margin-top:25px; }
    .hero-actions { margin-top:31px; display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
    .hero-actions .button { min-height:49px; }
    .text-link { display:inline-flex; align-items:center; gap:10px; font-size:12px; padding:12px 0; color:#e0e9f7; }
    .text-link:hover { color:var(--blue-light); }
    .hero-footnote { margin-top:34px; display:flex; align-items:center; gap:11px; color:#98abc3; font:10px/1.5 var(--mono); letter-spacing:.5px; }
    .hero-footnote::before { content:""; display:block; width:24px; height:1px; background:#6b82a0; }
    .workspace-wrap { min-width:0; }
    .workspace-label { display:flex; justify-content:space-between; align-items:center; color:#a1b4ce; font:9px/1.5 var(--mono); letter-spacing:1.4px; margin-bottom:12px; gap:10px; }
    .workspace-label span:last-child { color:#bdd1ec; }
    .workspace { background:var(--wash); color:var(--ink); border:1px solid #5e6d82; box-shadow:0 20px 65px #0003; min-width:0; }
    .app-head { display:flex; justify-content:space-between; align-items:center; background:#fff; height:43px; padding:0 15px; border-bottom:1px solid var(--line); gap:12px; }
    .app-brand { font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:-.5px; }
    .app-crumb { color:#607086; font-size:10px; margin-left:12px; padding-left:12px; border-left:1px solid var(--line); }
    .app-avatar { background:#e7eef8; color:#3c5982; font:9px/24px var(--mono); text-align:center; width:25px; height:25px; }
    .app-body { display:grid; grid-template-columns:43px minmax(0,1fr); }
    .app-rail { border-right:1px solid var(--line); background:white; padding:12px 0; display:flex; flex-direction:column; align-items:center; gap:14px; color:#7a8797; }
    .app-rail .rail-active { background:#e6eeff; color:var(--blue); padding:7px; margin-top:-3px; }
    .app-rail .icon { width:16px; height:16px; }
    .app-main { padding:19px 19px 15px; min-width:0; }
    .app-title { display:flex; justify-content:space-between; align-items:center; gap:8px; }
    .app-title h2 { font-size:17px; font-weight:600; letter-spacing:-.4px; }
    .app-title p { font-size:9px; color:var(--muted); margin-top:2px; }
    .period-select { font:9px var(--mono); border:1px solid var(--line); padding:6px 4px; background:#fff; color:#4b596b; max-width:115px; }
    .metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:17px; }
    .metric { background:#fff; border:1px solid var(--line); padding:11px 10px 10px; min-width:0; }
    .metric-label { color:#5c6878; font-size:9px; }
    .metric-value { font-size:20px; font-weight:600; letter-spacing:-.7px; margin-top:4px; font-variant-numeric:tabular-nums; white-space:nowrap; }
    .metric-note { color:var(--green); font:8px/1.4 var(--mono); margin-top:5px; }
    .metric-note.neutral { color:#6a7788; }
    .chart-panel { background:#fff; border:1px solid var(--line); margin-top:10px; padding:13px 12px 8px; }
    .chart-top { display:flex; justify-content:space-between; gap:8px; align-items:center; }
    .chart-top h3 { font-size:10px; font-weight:600; }
    .chart-legend { font-size:8px; display:flex; gap:9px; color:#617085; }
    .chart-legend span { display:flex; align-items:center; gap:4px; }
    .key { width:6px; height:6px; background:var(--blue); }
    .key.cost { background:#a9bfdc; }
    .chart { display:grid; grid-template-columns:30px 1fr; margin-top:15px; height:110px; }
    .chart-axis { display:flex; flex-direction:column; justify-content:space-between; padding-bottom:20px; font:8px var(--mono); color:#748196; }
    .chart-bars { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; position:relative; background:repeating-linear-gradient(to top,transparent 0,transparent 28px,#eaf0f5 29px,#eaf0f5 30px); background-size:100% calc(100% - 20px); background-repeat:no-repeat; }
    .bar-group { display:flex; gap:4px; align-items:flex-end; justify-content:center; padding:0 5px 20px; position:relative; }
    .bar { width:12px; max-width:40%; background:var(--blue); height:var(--height); transition:height .25s; }
    .bar.cost { background:#a9bfdc; }
    .bar-month { position:absolute; bottom:0; left:0; right:0; text-align:center; font:8px var(--mono); color:#748196; }
    .app-bottom { display:flex; justify-content:space-between; gap:12px; font:8px var(--mono); color:#637187; padding-top:12px; }
    .app-bottom .balanced { color:var(--green); display:flex; align-items:center; gap:5px; }
    .balanced::before { content:""; width:5px; height:5px; border-radius:50%; background:#2a8a66; }
    .workspace-caption { display:flex; align-items:center; justify-content:space-between; margin-top:13px; gap:12px; color:#9cb1cd; font:9px var(--mono); }
    .workspace-caption a { color:#d1e0f6; border-bottom:1px solid #607798; padding-bottom:2px; }
    .platform-strip { background:#f1f4f8; border-bottom:1px solid var(--line); }
    .strip-inner { min-height:77px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
    .strip-title { font:10px/1.5 var(--mono); color:#718095; letter-spacing:1.4px; text-transform:uppercase; flex:1; }
    .strip-item { display:flex; gap:10px; align-items:center; font-size:12px; flex:1; color:#34465e; }
    .strip-item .icon { color:#697d98; }
    .section { padding-block:82px; }
    .section-top { display:flex; justify-content:space-between; gap:60px; align-items:flex-end; margin-bottom:38px; }
    .section-kicker { color:var(--blue); margin-bottom:14px; }
    .section h2 { font-weight:500; font-size:38px; line-height:1.2; letter-spacing:-1.3px; }
    .section-intro { max-width:380px; color:var(--muted); font-size:14px; line-height:1.8; }
    .module-layout { display:grid; grid-template-columns:285px minmax(0,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
    .module-nav { border-right:1px solid var(--line); padding:17px 24px 17px 0; }
    .module-tab { width:100%; border:0; background:transparent; display:flex; align-items:center; text-align:left; padding:16px 14px; gap:13px; color:#586779; font-size:14px; }
    .module-tab .tab-code { font:10px var(--mono); color:#8390a2; min-width:20px; }
    .module-tab .tab-arrow { margin-left:auto; }
    .module-tab[aria-selected="true"] { background:#eaf0fc; color:var(--blue); box-shadow:inset 3px 0 var(--blue); }
    .module-tab[aria-selected="true"] .tab-code { color:var(--blue); }
    .module-tab:hover { background:#f0f4fa; }
    .module-panel { display:grid; grid-template-columns:1fr 1.12fr; gap:38px; align-items:center; padding:34px 0 34px 36px; min-height:326px; }
    .module-tag { color:#728097; font:10px var(--mono); letter-spacing:1.2px; margin-bottom:13px; }
    .module-panel h3 { font-size:25px; font-weight:500; letter-spacing:-.65px; line-height:1.25; }
    .module-description { font-size:13px; color:var(--muted); line-height:1.8; margin-top:13px; }
    .checklist { list-style:none; padding:0; margin:20px 0 0; font-size:12px; color:#3c4d65; }
    .checklist li { margin-top:9px; display:flex; gap:9px; }
    .checklist li::before { content:"✓"; color:var(--blue); }
    .module-demo { padding:22px; background:var(--wash); border:1px solid #e7ebf1; min-width:0; }
    .demo-title { display:flex; justify-content:space-between; gap:10px; font-size:11px; font-weight:600; margin-bottom:16px; }
    .demo-title span { color:#768296; font:9px var(--mono); }
    .demo-table { width:100%; border-collapse:collapse; font-size:11px; }
    .demo-table th { color:#7b8798; font-size:9px; font-weight:400; text-align:left; padding-bottom:9px; border-bottom:1px solid #dce2ea; }
    .demo-table th:last-child,.demo-table td:last-child { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
    .demo-table td { padding:10px 0; border-bottom:1px solid #e1e6ed; }
    .demo-table td:first-child { padding-right:12px; }
    .demo-table tbody tr:last-child td { border:0; }
    .demo-footer { display:flex; justify-content:space-between; gap:10px; border-top:1px solid #dce2ea; padding-top:13px; margin-top:4px; font:9px var(--mono); color:#6c7a8b; }
    .demo-status { color:var(--green); }
    .scope-note { color:#718095; font-size:11px; margin-top:15px; }
    .approach { background:var(--wash); }
    .approach-layout { display:grid; grid-template-columns:1fr 1.3fr; gap:100px; align-items:start; }
    .approach h2 { max-width:390px; }
    .approach .section-intro { margin-top:22px; }
    .approach-note { display:flex; gap:14px; align-items:center; margin-top:34px; font:10px var(--mono); color:#4f647f; letter-spacing:.4px; }
    .approach-note::before { content:""; width:28px; height:2px; background:var(--blue); }
    .principle { display:grid; grid-template-columns:37px 1fr; gap:18px; border-bottom:1px solid #d7dee8; padding:25px 0; }
    .principle:first-child { padding-top:0; }
    .principle:last-child { border:0; padding-bottom:0; }
    .principle-number { color:#6f86a5; font:12px var(--mono); padding-top:5px; }
    .principle h3 { font-size:18px; font-weight:500; letter-spacing:-.2px; }
    .principle p { color:var(--muted); font-size:13px; margin-top:7px; max-width:470px; line-height:1.8; }
    .cta-section { padding:62px 0; background:var(--blue); color:#fff; }
    .cta-inner { display:flex; justify-content:space-between; gap:45px; align-items:center; }
    .cta-section .eyebrow { color:#b8d0ff; margin-bottom:12px; }
    .cta-section h2 { font-size:34px; font-weight:500; letter-spacing:-1px; line-height:1.25; }
    .cta-section p { color:#d6e3ff; margin-top:12px; font-size:14px; }
    .cta-section .button { flex-shrink:0; min-width:214px; }
    footer { background:var(--navy-deep); color:#fff; padding:43px 0 23px; }
    .footer-top { display:flex; justify-content:space-between; gap:35px; padding-bottom:35px; }
    .footer-product { font-size:25px; letter-spacing:-1px; font-weight:600; }
    .footer-desc { color:#94a8c2; font-size:11px; margin-top:5px; }
    .footer-links { display:flex; gap:28px; align-items:flex-start; font-size:12px; color:#bccbe0; padding-top:8px; }
    .footer-links a:hover { color:white; }
    .footer-bottom { display:flex; justify-content:space-between; gap:15px; border-top:1px solid #2b3a50; padding-top:21px; color:#8fa2bc; font:9px/1.7 var(--mono); }
    .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
    @media(min-width:1600px) { .hero-inner { padding-block:94px; } }
    @media(max-width:1150px) {
      .wrap { width:calc(100% - 64px); }
      .nav { gap:25px; }
      .nav-links { gap:20px; }
      .hero-inner { gap:32px; grid-template-columns:.85fr 1.15fr; }
      h1 { font-size:58px; letter-spacing:-3px; }
      .hero-copy { font-size:14px; }
      .hero-kicker { font-size:9px; letter-spacing:.8px; }
      .app-main { padding:15px 12px 12px; }
      .metric-value { font-size:18px; }
      .app-title h2 { font-size:15px; }
      .module-layout { grid-template-columns:245px minmax(0,1fr); }
      .module-panel { gap:24px; padding-left:26px; }
      .module-demo { padding:16px; }
      .approach-layout { gap:65px; }
    }
    @media(max-width:950px) {
      .hero-inner { gap:38px; grid-template-columns:1fr; padding-top:55px; padding-bottom:45px; }
      .hero-text { max-width:650px; }
      h1 { font-size:65px; }
      h1 span { display:inline; }
      .hero-copy { max-width:520px; }
      .hero-footnote { margin-top:22px; }
      .workspace-wrap { width:100%; max-width:700px; }
      .app-main { padding:19px; }
      .metric-value { font-size:25px; }
      .metric-label { font-size:11px; }
      .metric-note { font-size:10px; }
      .app-title h2 { font-size:20px; }
      .app-title p,.period-select { font-size:11px; }
      .chart-top h3 { font-size:12px; }
      .chart-legend { font-size:10px; }
      .chart { height:130px; }
      .bar { width:18px; }
      .app-bottom { font-size:10px; }
      .nav-links { gap:18px; }
      .nav > .button { gap:14px; padding-inline:14px; font-size:12px; }
      .strip-inner { gap:16px; flex-wrap:wrap; padding-block:21px; }
      .strip-title { flex-basis:100%; }
      .section { padding-block:60px; }
      .section-top { gap:30px; }
      .section h2 { font-size:32px; }
      .section-intro { max-width:300px; font-size:13px; }
      .module-layout { grid-template-columns:200px minmax(0,1fr); }
      .module-nav { padding-right:16px; }
      .module-tab { font-size:12px; gap:8px; padding:15px 10px; }
      .module-panel { grid-template-columns:1fr; gap:25px; }
      .module-panel h3 { font-size:25px; }
      .module-description { max-width:450px; }
      .module-demo { max-width:500px; }
      .demo-table { font-size:12px; }
      .approach-layout { gap:40px; grid-template-columns:1fr 1.2fr; }
      .cta-section h2 { font-size:30px; }
    }
    @media(max-width:700px) {
      html { scroll-padding-top:90px; }
      .wrap { width:calc(100% - 40px); }
      .concept-bar { font-size:8px; letter-spacing:.6px; }
      .nav { height:72px; gap:16px; }
      .brand-word { font-size:25px; }
      .brand { gap:11px; }
      .brand-mark { width:30px; }
      .nav > .button { display:none; }
      .menu-toggle { display:block; }
      .nav-links { display:none; position:absolute; top:72px; left:0; right:0; margin:0; padding:18px 20px; background:white; border-bottom:1px solid var(--line); box-shadow:0 12px 20px #15243a12; }
      .nav-links.is-open { display:flex; flex-direction:column; align-items:stretch; gap:0; }
      .nav-links a { padding:13px 0; }
      .hero-inner { padding-top:41px; gap:34px; }
      h1 { font-size:57px; letter-spacing:-2.8px; margin-top:22px; }
      h1 span { display:block; }
      .hero-copy { font-size:14px; margin-top:20px; }
      .hero-actions { margin-top:24px; gap:9px 18px; }
      .hero-actions .button { font-size:12px; }
      .hero-footnote { font-size:9px; }
      .workspace-label { font-size:8px; letter-spacing:.7px; }
      .app-rail { display:none; }
      .app-body { grid-template-columns:1fr; }
      .app-head { padding-inline:12px; }
      .app-main { padding:16px 12px 12px; }
      .app-title h2 { font-size:17px; }
      .app-title p { font-size:9px; }
      .period-select { font-size:9px; }
      .metric { padding:10px 8px; }
      .metric-label { font-size:9px; }
      .metric-value { font-size:21px; }
      .metric-note { font-size:8px; }
      .chart-top h3 { font-size:10px; }
      .chart-legend { font-size:8px; }
      .chart-bars { gap:4px; }
      .bar-group { padding-inline:2px; }
      .app-bottom { font-size:8px; }
      .workspace-caption { font-size:8px; }
      .strip-inner { gap:17px 15px; }
      .strip-item { flex-basis:calc(50% - 15px); font-size:11px; }
      .strip-item .icon { width:16px; }
      .section { padding-block:45px; }
      .section-top { flex-direction:column; align-items:flex-start; gap:20px; margin-bottom:25px; }
      .section h2 { font-size:31px; letter-spacing:-1px; }
      .section-intro { max-width:100%; }
      .section-kicker { font-size:10px; margin-bottom:11px; }
      .module-layout { display:block; }
      .module-nav { border-right:0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; padding:12px 0; gap:4px; }
      .module-tab { font-size:11px; padding:12px 8px; gap:6px; min-height:44px; }
      .module-tab .tab-code { min-width:17px; font-size:9px; }
      .module-panel { padding:25px 0; min-height:0; }
      .module-demo { max-width:none; padding:20px; }
      .scope-note { font-size:10px; }
      .approach-layout { grid-template-columns:1fr; gap:32px; }
      .approach h2 { max-width:100%; }
      .approach .section-intro { margin-top:17px; }
      .approach-note { margin-top:22px; }
      .principle { padding-block:20px; gap:12px; grid-template-columns:27px 1fr; }
      .cta-inner { flex-direction:column; align-items:flex-start; gap:27px; }
      .cta-section { padding-block:42px; }
      .cta-section h2 { font-size:30px; }
      .cta-section p { font-size:13px; }
      .footer-top { flex-direction:column; gap:20px; padding-bottom:26px; }
      .footer-links { gap:22px; flex-wrap:wrap; }
      .footer-bottom { flex-direction:column; gap:9px; }
    }
    @media(max-width:370px) {
      .wrap { width:calc(100% - 30px); }
      h1 { font-size:48px; }
      .hero-kicker { font-size:8px; letter-spacing:.5px; }
      .metric-value { font-size:17px; }
      .metric-label { font-size:8px; }
      .metrics { gap:5px; }
      .metric { padding-inline:6px; }
      .app-crumb { font-size:8px; padding-left:8px; margin-left:8px; }
      .app-title h2 { font-size:15px; }
      .period-select { max-width:95px; }
      .workspace-caption { flex-wrap:wrap; }
      .module-tab .tab-arrow { display:none; }
    }
    @media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }
  
/* Public contact and login actions. Keep login visible at every viewport size. */
.service-state { display:flex; align-items:center; gap:7px; text-transform:none; letter-spacing:.1px; font:11px/1.5 var(--sans); }
.service-state::before { content:""; width:6px; height:6px; border-radius:50%; background:#237957; flex-shrink:0; }
.button-login { background:#fff; color:var(--ink); border-color:#b7c3d2; gap:13px; }
.button-login:hover { background:#edf3fd; border-color:#7d92af; }
.nav { gap:24px; }
.nav-links { gap:24px; }
.contact-link { white-space:nowrap; }
.cta-actions { display:flex; flex-direction:column; gap:14px; align-items:stretch; flex-shrink:0; }
.cta-login { display:flex; align-items:center; justify-content:center; gap:10px; font-size:13px; color:white; padding:8px; border:1px solid #8cb4ff; }
.cta-login:hover { background:#104cbe; }
.visitor-privacy { margin-top:20px; color:#aabbd1; font-size:11px; max-width:780px; }
.visitor-privacy summary { cursor:pointer; width:fit-content; padding:6px 0; }
.visitor-privacy p { margin-top:8px; line-height:1.8; }
.visitor-privacy a { text-decoration:underline; text-underline-offset:3px; }
@media(max-width:1100px) { .nav > .button-call { display:none; } }
@media(max-width:700px) {
  .nav { gap:10px; }
  .nav > .button-login { display:inline-flex; margin-left:auto; padding:9px 12px; min-height:40px; font-size:12px; gap:8px; }
  .menu-toggle { margin-left:0; min-width:40px; min-height:40px; }
  .brand { gap:8px; }
  .brand-word { font-size:23px; }
  .brand-by { font-size:7px; letter-spacing:1.1px; }
  .brand-mark { width:27px; }
  .brand-mark i:nth-child(2) { width:23px; }
  .brand-mark i:nth-child(3) { width:18px; }
  .cta-actions { width:100%; max-width:320px; }
  .service-state { font-size:10px; }
}
@media(max-width:370px) { .brand-word { font-size:21px; } .brand-mark { width:24px; } .nav > .button-login { padding-inline:9px; } }
