:root{
    --paper:#f7f7f5; --ink:#0a0a0a; --accent:#002FA7; --accent-soft:#e8edf9;
    --grey-1:#eeeeea; --grey-2:#d9d9d4;
    --text-1:#0a0a0a; --text-2:#55554f; --text-3:#8a8a82;
    --sans:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,"PingFang SC","Microsoft YaHei UI","Noto Sans SC",sans-serif;
    --maxw:1120px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--sans);background:var(--paper);color:var(--text-1);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
  .meta{font-size:13px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--text-3)}
  .eyebrow{font-size:13px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
  section{padding:clamp(56px,9vw,120px) 0}
  h1,h2,h3{font-weight:200;letter-spacing:-.02em;line-height:1.04}
  h2{font-size:clamp(30px,5vw,52px);margin-bottom:18px}
  h3{font-size:clamp(22px,3vw,30px)}
  p{color:var(--text-2)}
  .lead{font-size:clamp(17px,2.1vw,21px);font-weight:400;color:var(--text-2)}

  /* reveal */
  .rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
  .rv.in{opacity:1;transform:none}
  @media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

  /* ── nav ── */
  header{position:sticky;top:0;z-index:50;background:rgba(247,247,245,.86);backdrop-filter:saturate(150%) blur(10px);border-bottom:1px solid var(--grey-2)}
  .nav{display:flex;align-items:center;justify-content:space-between;height:62px}
  .brand{display:flex;align-items:center;gap:10px;font-weight:600;font-size:16px;letter-spacing:-.01em}
  .brand .dot{width:22px;height:22px;background:var(--accent);border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:700}
  .nav-right{display:flex;align-items:center;gap:22px}
  .nav-links{display:flex;gap:26px;font-size:14px;font-weight:500;color:var(--text-2)}
  .nav-links a:hover{color:var(--accent)}
  .lang-toggle{border:1px solid var(--grey-2);background:var(--paper);color:var(--text-2);font:inherit;font-size:13px;font-weight:600;padding:6px 14px;border-radius:999px;cursor:pointer;transition:border-color .2s,color .2s}
  .lang-toggle:hover{border-color:var(--accent);color:var(--accent)}
  @media(max-width:720px){.nav-links{display:none}}

  /* ── hero ── */
  .hero{background:var(--accent);color:#fff;position:relative;overflow:hidden;padding:clamp(80px,13vw,160px) 0 clamp(64px,10vw,120px)}
  .hero .grid-bg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(circle at 70% 30%,#000,transparent 78%)}
  .hero .eyebrow{color:rgba(255,255,255,.8)}
  .hero h1{font-size:clamp(40px,8vw,86px);color:#fff;margin:18px 0 24px}
  .hero h1 em{font-style:italic;font-weight:300}
  .hero .lead{color:rgba(255,255,255,.9);max-width:60ch}
  .hero-foot{margin-top:40px;display:flex;flex-wrap:wrap;gap:12px}
  .chip{border:1px solid rgba(255,255,255,.35);color:#fff;font-size:14px;font-weight:500;padding:8px 16px;border-radius:999px}
  .hero-meta{margin-top:42px;border-top:1px solid rgba(255,255,255,.22);padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}

  /* ── problem ── */
  .duo{display:grid;grid-template-columns:1fr 1px 1fr;gap:clamp(24px,4vw,56px)}
  .duo .vr{background:var(--grey-2)}
  .duo ul{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:18px;font-size:16px}
  .duo li{padding-left:18px;position:relative;color:var(--text-2)}
  .duo li::before{content:"—";position:absolute;left:0;color:var(--text-3)}
  .duo .after li{color:var(--text-1);font-weight:500}
  .duo .after li::before{color:var(--accent)}
  @media(max-width:720px){.duo{grid-template-columns:1fr}.duo .vr{display:none}}

  /* ── stats ── */
  .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,4vw,48px);margin-top:48px}
  .stat .num{font-size:clamp(56px,11vw,116px);font-weight:200;line-height:.9;letter-spacing:-.04em}
  .stat:last-child .num{color:var(--accent)}
  .stat .cat{margin-top:8px}
  .stat h3{font-weight:600;font-size:20px;margin:8px 0 6px}
  .stat p{font-size:15px}
  @media(max-width:720px){.stats{grid-template-columns:1fr;gap:32px}}

  /* ── capability grid ── */
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--grey-2);border:1px solid var(--grey-2);margin-top:40px}
  .card{background:var(--paper);padding:30px 26px;display:flex;flex-direction:column;gap:10px}
  .card .ic{width:30px;height:30px;color:var(--accent)}
  .card h3{font-size:19px;font-weight:600}
  .card p{font-size:15px}
  .card .tag{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
  .card ul{list-style:none;display:flex;flex-direction:column;gap:9px;margin-top:6px}
  .card li{font-size:14px;color:var(--text-2);padding-left:16px;position:relative;line-height:1.5}
  .card li::before{content:"—";position:absolute;left:0;color:var(--accent)}
  .card li b{color:var(--text-1);font-weight:600}
  .card.lead-card{outline:1.5px solid var(--accent);outline-offset:-1px}

  /* ── buttons ── */
  .btn-light{display:inline-block;background:#fff;color:var(--accent);font-size:16px;font-weight:600;padding:14px 30px;border-radius:8px;transition:transform .15s ease,box-shadow .2s ease}
  .btn-light:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,0,0,.18)}
  .btn-primary{background:var(--accent);color:#fff;border:none;font:inherit;font-size:16px;font-weight:600;padding:14px 34px;border-radius:8px;cursor:pointer;transition:opacity .2s}
  .btn-primary:hover{opacity:.88}
  .btn-primary:disabled{opacity:.5;cursor:default}

  /* ── lead form (editorial) ── */
  .start-grid{margin-top:52px;display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(36px,6vw,88px);align-items:start}
  .start-intro h2{margin-top:14px}
  .start-intro .lead{margin-top:16px;max-width:36ch}
  .start-points{list-style:none;margin-top:34px;border-top:1px solid var(--grey-2);padding-top:24px;display:flex;flex-direction:column;gap:16px}
  .start-points li{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--text-2)}
  .start-points .k{flex:0 0 auto;color:var(--accent);font-weight:700;line-height:1.5}
  .lead-form{display:grid;grid-template-columns:1fr 1fr;gap:28px 30px}
  .field{display:flex;flex-direction:column}
  .field.full{grid-column:1/-1}
  .field label{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin-bottom:10px}
  .field label .req{color:var(--accent);margin-left:3px}
  .field input,.field select,.field textarea{font:inherit;font-size:16px;padding:8px 0;border:none;border-bottom:1px solid var(--grey-2);border-radius:0;background:transparent;color:var(--text-1);width:100%;transition:border-color .2s ease}
  .field input::placeholder,.field textarea::placeholder{color:var(--text-3)}
  .field input:hover,.field select:hover,.field textarea:hover{border-bottom-color:var(--text-3)}
  .field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--accent);border-bottom-width:1.5px}
  .field select{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:26px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%23002FA7' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 2px center}
  .field select:invalid{color:var(--text-3)}
  .field textarea{resize:vertical;min-height:60px;line-height:1.5}
  .form-submit{grid-column:1/-1;display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:10px}
  .form-note{font-size:13px;color:var(--text-3)}
  .form-ok{display:none;grid-column:1/-1;border-left:3px solid var(--accent);background:var(--accent-soft);color:var(--accent);padding:16px 18px;font-size:15px;font-weight:500}
  @media(max-width:820px){.start-grid{grid-template-columns:1fr;gap:40px}}
  @media(max-width:520px){.lead-form{grid-template-columns:1fr;gap:24px}}
  @media(max-width:880px){.cards{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:560px){.cards{grid-template-columns:1fr}}

  /* ── scenarios ── */
  .scn-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
  .scn-card{background:var(--paper);border:1px solid var(--grey-2);border-radius:14px;padding:28px 22px;display:flex;flex-direction:column;gap:11px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
  .scn-card:hover{transform:translateY(-3px);box-shadow:0 20px 44px -30px rgba(0,47,167,.55);border-color:var(--accent)}
  .scn-card .ic{width:34px;height:34px;color:var(--accent)}
  .scn-card h3{font-size:19px;font-weight:600}
  .scn-card p{font-size:14.5px;line-height:1.55}
  .scn-card .rt{margin-top:auto;padding-top:8px;font-size:12.5px;font-weight:600;color:var(--accent);letter-spacing:.02em;display:flex;align-items:center;gap:7px}
  .scn-card .rt .ar{font-weight:700}
  @media(max-width:900px){.scn-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:520px){.scn-grid{grid-template-columns:1fr}}

  /* ── feature (screenshot + text) ── */
  .alt{background:var(--grey-1)}
  .feature{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
  .feature.rev{grid-template-columns:1fr 1.25fr}
  .feature.rev .shot{order:2}
  .feature .shot img{width:100%;border-radius:4px}
  .feature .badge{display:inline-block;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:6px 12px;border-radius:6px;margin-bottom:16px}
  .feature ul{list-style:none;margin-top:20px;display:flex;flex-direction:column;gap:16px}
  .feature li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
  .feature li .k{width:32px;height:32px;flex:0 0 auto;border:1.5px solid var(--accent);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--accent)}
  .feature li b{font-size:16px;font-weight:600;display:block}
  .feature li span{font-size:15px;color:var(--text-2)}
  @media(max-width:820px){.feature,.feature.rev{grid-template-columns:1fr}.feature.rev .shot{order:0}}

  /* ── flow / data ── */
  .flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:16px;align-items:center;margin-top:44px}
  .flow .node{border:1px solid var(--grey-2);background:var(--paper);padding:26px 18px;text-align:center;border-radius:4px}
  .flow .node.mid{border-color:var(--accent);background:var(--accent-soft)}
  .flow .node b{display:block;font-size:17px;font-weight:600;margin-bottom:4px}
  .flow .node span{font-size:14px;color:var(--text-2)}
  .flow .arrow{color:var(--accent);font-size:22px;font-weight:700}
  @media(max-width:720px){.flow{grid-template-columns:1fr}.flow .arrow{transform:rotate(90deg);justify-self:center}}

  /* ── steps ── */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,4vw,40px);margin-top:48px;counter-reset:s}
  .step{border-top:3px solid var(--accent);padding-top:20px}
  .step .n{font-size:54px;font-weight:200;line-height:1;color:var(--accent);letter-spacing:-.04em}
  .step h3{font-size:20px;font-weight:600;margin:10px 0 6px}
  .step p{font-size:15px}
  @media(max-width:720px){.steps{grid-template-columns:1fr}}

  /* ── platforms ── */
  .plat{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
  .plat span{border:1px solid var(--grey-2);background:var(--paper);padding:10px 20px;border-radius:999px;font-weight:600;font-size:15px}

  /* ── closing CTA ── */
  .cta{background:var(--ink);color:#fff;border-radius:6px;padding:clamp(40px,7vw,80px);position:relative;overflow:hidden}
  .cta h2{color:#fff}
  .cta .ta{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
  .cta .ta .n{font-size:34px;font-weight:200;color:rgba(255,255,255,.5)}
  .cta .ta b{display:block;font-size:18px;font-weight:600;color:#fff;margin:6px 0 4px}
  .cta .ta p{font-size:15px;color:rgba(255,255,255,.7)}
  .cta .ta .last .n{color:#7ea0ff}
  @media(max-width:720px){.cta .ta{grid-template-columns:1fr;gap:22px}}

  footer{padding:40px 0 64px;border-top:1px solid var(--grey-2);color:var(--text-3);font-size:14px}
  .footrow{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

  /* ── nav active + secondary button ── */
  .brand{cursor:pointer}
  .nav-links a.active{color:var(--accent)}
  .btn-outline{display:inline-block;border:1.5px solid var(--accent);color:var(--accent);font-size:15px;font-weight:600;padding:12px 26px;border-radius:8px;transition:background .2s,color .2s}
  .btn-outline:hover{background:var(--accent);color:#fff}
  .btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}

  /* ── editions (home) ── */
  .editions{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}
  .edition{position:relative;background:var(--paper);border:1px solid var(--grey-2);border-radius:16px;padding:clamp(28px,3vw,40px);display:flex;flex-direction:column;gap:14px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
  .edition:hover{transform:translateY(-3px);box-shadow:0 24px 50px -34px rgba(0,47,167,.5);border-color:var(--accent)}
  .edition .tag{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
  .edition h3{font-size:clamp(22px,2.6vw,28px);font-weight:300}
  .edition .desc{font-size:15.5px;color:var(--text-2)}
  .edition ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin:6px 0 4px}
  .edition li{font-size:14.5px;color:var(--text-2);padding-left:18px;position:relative;line-height:1.5}
  .edition li::before{content:"—";position:absolute;left:0;color:var(--accent)}
  .edition .foot{margin-top:auto;padding-top:18px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
  .edition .price-note{font-size:13px;color:var(--text-3);font-weight:500}
  @media(max-width:780px){.editions{grid-template-columns:1fr}}

  /* ── comparison table ── */
  .cmp-wrap{margin-top:44px;overflow-x:auto;border:1px solid var(--grey-2);border-radius:12px}
  table.cmp{width:100%;border-collapse:collapse;font-size:14.5px;min-width:640px}
  table.cmp th,table.cmp td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--grey-2)}
  table.cmp thead th{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);background:var(--grey-1);white-space:nowrap}
  table.cmp thead th.us{color:var(--accent)}
  table.cmp tbody tr:last-child td{border-bottom:none}
  table.cmp td:first-child{font-weight:600;color:var(--text-1)}
  table.cmp td.us{color:var(--accent);font-weight:700}
  table.cmp .yes{color:var(--accent);font-weight:700}
  table.cmp .no{color:var(--text-3)}
  table.cmp tbody tr:hover{background:var(--accent-soft)}

  /* ── include / exclude split ── */
  .split{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--grey-2);border:1px solid var(--grey-2);border-radius:12px;overflow:hidden;margin-top:44px}
  .split .col{background:var(--paper);padding:clamp(26px,3vw,36px)}
  .split .col.out{background:var(--grey-1)}
  .split h3{font-size:20px;font-weight:600;margin-bottom:6px}
  .split .col.in h3{color:var(--accent)}
  .split ul{list-style:none;display:flex;flex-direction:column;gap:13px;margin-top:18px}
  .split li{font-size:15px;color:var(--text-2);padding-left:24px;position:relative;line-height:1.5}
  .split .col.in li::before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:700}
  .split .col.out li::before{content:"×";position:absolute;left:0;color:var(--text-3);font-weight:700}
  @media(max-width:720px){.split{grid-template-columns:1fr}}

  /* ── value-add options (no prices) ── */
  .opts{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--grey-2);border:1px solid var(--grey-2);margin-top:44px}
  .opt{background:var(--paper);padding:26px 26px;display:flex;flex-direction:column;gap:8px}
  .opt h3{font-size:18px;font-weight:600}
  .opt p{font-size:14.5px;line-height:1.55}
  .opt .ask{margin-top:6px;font-size:12.5px;font-weight:700;letter-spacing:.06em;color:var(--accent)}
  @media(max-width:640px){.opts{grid-template-columns:1fr}}

  /* ── inquiry banner ── */
  .ask-band{margin-top:40px;border-left:3px solid var(--accent);background:var(--accent-soft);padding:20px 22px;border-radius:0 8px 8px 0}
  .ask-band b{color:var(--accent);font-weight:700}
  .ask-band p{color:var(--text-2);font-size:15px;margin-top:4px}

  /* ── footer nav ── */
  .footrow nav{display:flex;gap:20px;flex-wrap:wrap}
  .footrow nav a:hover{color:var(--accent)}