:root{
    --bg:#ffffff;
    --bg-alt:#f5f8fc;
    --ink:#0f1729;
    --ink-2:#3a4456;
    --muted:#69748a;
    --line:#e5eaf2;
    --brand:#1d4ed8;
    --brand-2:#2563eb;
    --brand-soft:#eaf1ff;
    --green:#0f9d76;
    --green-soft:#e7f6f0;
    --shadow:0 1px 2px rgba(15,23,41,.04),0 8px 24px rgba(15,23,41,.06);
    --radius:16px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"PingFang SC","Microsoft YaHei","Hiragino Sans GB",sans-serif;
    color:var(--ink);
    background:var(--bg);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit;text-decoration:none}
  .wrap{max-width:1280px;margin:0 auto;padding:0 24px}
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    font-size:13px;font-weight:600;letter-spacing:.04em;
    color:var(--brand);background:var(--brand-soft);
    padding:6px 14px;border-radius:999px;
  }
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    font-size:15px;font-weight:600;border-radius:10px;
    padding:13px 24px;cursor:pointer;border:1px solid transparent;
    transition:transform .15s ease,box-shadow .15s ease,background .15s ease;
  }
  .btn-primary{background:var(--brand);color:#fff;box-shadow:0 6px 16px rgba(29,78,216,.25)}
  .btn-primary:hover{transform:translateY(-1px);background:var(--brand-2)}
  .btn-ghost{background:#fff;color:var(--ink);border-color:var(--line)}
  .btn-ghost:hover{border-color:var(--brand);color:var(--brand)}

  /* Header */
  header{
    position:sticky;top:0;z-index:50;
    background:rgba(255,255,255,.85);backdrop-filter:saturate(180%) blur(12px);
    border-bottom:1px solid var(--line);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;height:66px}
  .logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.01em}
  .logo .logo-mark{height:28px;width:auto;display:block}
  .nav-links{display:flex;align-items:center;gap:26px}
  .nav-links a{font-size:14.5px;font-weight:600;color:var(--ink-2);transition:color .15s ease}
  .nav-links a:hover{color:var(--brand)}
  .nav-cta{display:flex;align-items:center;gap:12px}
  .nav-cta .btn{border-radius:999px;padding-top:5px;padding-bottom:5px}
  .lang-btn{background:#fff;color:var(--ink-2);border:1px solid var(--line);border-radius:8px;padding:9px 14px;font-size:14px;font-weight:700;cursor:pointer;transition:.15s}
  .lang-btn:hover{border-color:var(--brand);color:var(--brand)}

  /* Hero */
  .hero{padding:72px 0 64px;background:radial-gradient(1200px 520px at 82% -150px,#eef4ff 0%,#ffffff 62%)}
  .hero-grid{display:grid;grid-template-columns:0.92fr 1.08fr;gap:56px;align-items:center}
  .hero-copy{text-align:left}
  .hero h1{font-size:clamp(32px,4.6vw,56px);line-height:1.14;font-weight:800;letter-spacing:-.02em;text-wrap:balance}
  .hero h1 .hl{color:var(--brand)}
  .hero p.lead{margin:20px 0 0;max-width:580px;font-size:18px;color:var(--ink-2)}
  .hero .cta-row{display:flex;gap:14px;justify-content:flex-start;margin-top:30px;flex-wrap:wrap}
  .hero-art{position:relative;display:flex;justify-content:center;align-items:center}
  .hero-illu{width:100%;max-width:640px;height:auto;display:block}

  /* Section base */
  section{padding:78px 0;scroll-margin-top:74px}
  .sec-head{max-width:760px;margin:0 auto 48px;text-align:center}
  .sec-head h2{font-size:clamp(26px,3.4vw,38px);font-weight:800;letter-spacing:-.01em;line-height:1.25}
  .sec-head p{margin-top:14px;font-size:17px;color:var(--muted)}
  .alt{background:var(--bg-alt)}

  /* Problem cards */
  .prob-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .prob{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    padding:24px;box-shadow:var(--shadow);
  }
  .prob-illu{
    aspect-ratio:2 / 1;border-radius:12px;overflow:hidden;margin-bottom:18px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,#f3f7ff,#ffffff);
    display:flex;align-items:center;justify-content:center;
  }
  .prob-illu img{width:100%;height:100%;object-fit:contain;display:block}
  .prob h3{font-size:19px;margin:0 0 8px;font-weight:700}
  .prob p{color:var(--muted);font-size:15px}

  .bridge{text-align:center;margin-top:48px}
  .bridge .line{font-size:clamp(20px,2.6vw,28px);font-weight:700}
  .bridge .line b{color:var(--brand)}

  /* Value rows */
  .values{display:flex;flex-direction:column;gap:24px}
  .vrow{
    display:grid;grid-template-columns:minmax(210px,288px) 1fr;gap:36px;align-items:center;
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    padding:34px;box-shadow:var(--shadow);transition:transform .18s ease,box-shadow .18s ease;
  }
  .vrow:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(15,23,41,.10)}
  .vrow-head h3{font-size:22px;font-weight:800;letter-spacing:-.01em;line-height:1.22}
  .vrow-head p{margin-top:10px;color:var(--muted);font-size:15px}
  .vfeatures{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  .vfeat .vicon{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin-bottom:12px}
  .vfeat .vicon.blue{background:var(--brand-soft);color:var(--brand)}
  .vfeat .vicon.green{background:var(--green-soft);color:var(--green)}
  .vfeat h4{font-size:15.5px;font-weight:700;margin-bottom:5px}
  .vfeat p{color:var(--muted);font-size:13.5px;line-height:1.6}

  /* Comparison table */
  .cmp{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
  .cmp th,.cmp td{padding:18px 22px;text-align:left;font-size:15px;border-bottom:1px solid var(--line)}
  .cmp thead th{background:var(--bg-alt);font-weight:700;font-size:14px;color:var(--ink-2)}
  .cmp thead th.brandcol{background:var(--brand);color:#fff}
  .cmp td:first-child{font-weight:600;color:var(--ink)}
  .cmp tr:last-child td{border-bottom:none}
  .cmp .x{color:#c0392b;font-weight:600}
  .cmp .ok{color:var(--green);font-weight:600}
  .cmp td.brandcol{background:#f4f8ff}

  /* Industries showcase */
  .showcase{
    position:relative;display:flex;align-items:center;justify-content:center;
    min-height:660px;padding:48px 40px;overflow:hidden;
  }
  .showcase::before{
    content:"";position:absolute;left:50%;top:50%;
    width:720px;height:460px;transform:translate(-50%,-50%);
    border:2px dashed rgba(29,78,216,.16);border-radius:999px;
  }
  .im-app{
    position:relative;z-index:2;width:380px;max-width:100%;
    background:#fff;border:1px solid var(--line);border-radius:16px;
    box-shadow:0 22px 48px rgba(15,23,41,.16);overflow:hidden;
  }
  .im-top{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid var(--line);background:#fbfcff}
  .im-top .im-title{font-size:12px;font-weight:700;color:var(--ink-2)}
  .im-top .im-lock{margin-left:auto;color:var(--brand)}
  .im-body{display:grid;grid-template-columns:118px 1fr;min-height:230px}
  .im-side{border-right:1px solid var(--line);background:#f7faff;padding:10px 9px}
  .im-conv{display:flex;align-items:center;gap:8px;padding:7px;border-radius:9px;margin-bottom:3px}
  .im-conv.active{background:#eaf1ff}
  .im-ava{width:24px;height:24px;border-radius:50%;flex:none}
  .im-lines{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
  .im-lines i{height:5px;border-radius:3px;background:#d7e0ee;display:block}
  .im-lines i:last-child{width:62%;background:#e6ecf5}
  .im-main{display:flex;flex-direction:column;padding:14px 14px 12px}
  .bubble{padding:9px 11px;border-radius:13px;margin-bottom:9px}
  .bubble i{display:block;height:6px;border-radius:3px;background:currentColor;opacity:.55}
  .bubble i + i{margin-top:5px}
  .bubble.in{background:#f0f3f8;color:#9aa7bd;border-bottom-left-radius:4px;align-self:flex-start}
  .bubble.out{background:var(--brand);color:#dbe6ff;border-bottom-right-radius:4px;align-self:flex-end}
  .im-input{margin-top:auto;display:flex;align-items:center;gap:8px;height:34px;padding:0 6px 0 14px;border:1px solid var(--line);border-radius:999px;background:#fff}
  .im-input span{height:6px;border-radius:3px;background:#dce4f0;flex:1}
  .im-input::after{content:"";width:24px;height:24px;border-radius:50%;background:var(--brand);flex:none}
  .ind-chips{position:absolute;inset:0;z-index:3;pointer-events:none}
  .ind-item{
    position:absolute;transform:translate(-50%,-50%);
    display:flex;flex-direction:column;align-items:center;gap:10px;
    width:104px;text-align:center;
  }
  .ind-ic{
    width:84px;height:84px;border-radius:50%;
    background:#fff;border:1px solid var(--line);
    box-shadow:0 10px 22px rgba(15,23,41,.10);
    display:flex;align-items:center;justify-content:center;
  }
  .ind-ic img{width:40px;height:40px;display:block}
  .ind-item b{font-size:12.5px;font-weight:600;color:var(--ink-2);line-height:1.3}
  .ind-item:nth-child(1){left:13%;top:16%}
  .ind-item:nth-child(2){left:50%;top:11%}
  .ind-item:nth-child(3){left:87%;top:16%}
  .ind-item:nth-child(4){left:94%;top:50%}
  .ind-item:nth-child(5){left:87%;top:84%}
  .ind-item:nth-child(6){left:50%;top:89%}
  .ind-item:nth-child(7){left:13%;top:84%}
  .ind-item:nth-child(8){left:6%;top:50%}

  /* Steps */
  .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  .step{position:relative;padding:28px 22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
  .step .n{width:34px;height:34px;border-radius:9px;background:var(--brand);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
  .step h4{font-size:17px;font-weight:700;margin-bottom:6px}
  .step p{color:var(--muted);font-size:14px}

  /* FAQ */
  .faq-list{max-width:840px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
  .faq-item{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
  .faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:20px 24px;font-size:17px;font-weight:700;color:var(--ink)}
  .faq-item summary::-webkit-details-marker{display:none}
  .faq-item summary::after{content:"";flex:none;width:10px;height:10px;margin-top:5px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .25s ease}
  .faq-item[open] summary{color:var(--brand)}
  .faq-item[open] summary::after{transform:rotate(-135deg);margin-top:9px}
  .faq-a{padding:2px 24px 20px;color:var(--muted);font-size:15px;line-height:1.7}
  .faq-a p{margin:0;max-width:none}
  @media (max-width:860px){
    .faq-item summary{font-size:16px;padding:17px 18px}
    .faq-a{padding:2px 18px 18px}
  }

  /* CTA */
  .final{background:linear-gradient(135deg,#142a6b,#1d4ed8);color:#fff;border-radius:24px;padding:52px 50px;box-shadow:0 24px 60px rgba(20,42,107,.30);overflow:hidden}
  .final-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:44px;align-items:stretch}
  .final-copy{align-self:center;min-width:0}
  .final-media{position:relative;margin:-52px -50px -52px 0;overflow:hidden}
  .final-media img{width:100%;height:100%;object-fit:cover;display:block}
  .final-media::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(18,38,99,.26),rgba(29,78,216,.40));mix-blend-mode:multiply;pointer-events:none}
  .final h2{font-size:clamp(26px,3.4vw,38px);font-weight:800}
  .final p{margin:14px auto 0;max-width:580px;color:#d6e0ff;font-size:17px}
  .final .cta-row{display:flex;gap:14px;justify-content:center;margin-top:30px;flex-wrap:wrap}
  .final .btn-primary{background:#fff;color:var(--brand)}
  .final .btn-primary:hover{background:#eef4ff}
  .final .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
  .final .btn-ghost:hover{border-color:#fff;color:#fff}

  /* Lead form */
  .lead-form{max-width:none;margin:24px 0 0;text-align:left}
  .lead-form .grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
  .field label{font-size:13px;font-weight:700;color:#cdd9f5;letter-spacing:.01em}
  .field input,.field select,.field textarea{
    width:100%;font:inherit;font-size:15px;line-height:1.4;color:var(--ink);background:#fff;
    border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:12px 14px;outline:none;
    transition:box-shadow .15s ease,border-color .15s ease;
  }
  .field select{
    -webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:40px;cursor:pointer;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2369748a' stroke-width='3' 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 14px center;
  }
  .field textarea{min-height:108px;resize:vertical;line-height:1.6}
  .field input::placeholder,.field textarea::placeholder{color:#9aa7bd}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.3)}
  .platforms{display:flex;flex-wrap:wrap;gap:12px 22px;padding-top:2px}
  .platforms label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:#eaf1ff;font-size:14px;font-weight:600}
  .platforms input{width:16px;height:16px;accent-color:var(--brand);margin:0;flex:none;padding:0;border:0;border-radius:0;background:none;box-shadow:none;transition:none}
  .platforms input:focus{box-shadow:none;outline:2px solid rgba(255,255,255,.5);outline-offset:1px}
  .lead-form .submit-row{margin-top:6px}
  .lead-form button[type=submit]{font-size:16px;padding:13px 30px}
  .lead-form .form-hint{margin:16px 0 0;max-width:none;font-size:13.5px;line-height:1.6;color:#b6c2e0;text-align:left}
  .lead-form .form-hint a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:2px}
  .lead-form .form-note{margin:10px 0 0;max-width:none;font-size:14px;color:#cfe0ff;text-align:left}

  /* Footer */
  footer{border-top:1px solid var(--line);padding:40px 0;color:var(--muted);font-size:14px}
  .foot{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
  /* Hero eyebrow spacing */
  .hero-copy h1{margin-top:16px}

  /* Shared icon colors */
  .vicon.blue{background:var(--brand-soft);color:var(--brand)}
  .vicon.green{background:var(--green-soft);color:var(--green)}
  .vicon.purple{background:#f3e9fe;color:#9333ea}

  /* Why TalkBiz: differentiators */
  .value-lead{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:22px}
  .vl{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px 26px;box-shadow:var(--shadow);transition:transform .18s ease,box-shadow .18s ease}
  .vl:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(15,23,41,.10)}
  .vl .vicon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none}
  .vl h3{font-size:18px;font-weight:800;letter-spacing:-.01em;margin-bottom:7px}
  .vl p{color:var(--muted);font-size:14.5px;line-height:1.6}

  /* Feature wall */
  .fw-label{margin:38px 0 16px;font-size:14px;font-weight:700;color:var(--ink-2)}
  .scn-label{text-align:center;margin:30px 0 18px;font-size:14px;font-weight:700;color:var(--ink-2)}
  .ind-scenarios{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .scn{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;box-shadow:var(--shadow)}
  .scn-tag{display:inline-block;font-size:12px;font-weight:700;color:var(--brand);background:var(--brand-soft);padding:3px 11px;border-radius:999px;margin-bottom:10px}
  .scn p{color:var(--muted);font-size:14px;line-height:1.55}
  .feat-wall{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
  .fw{display:flex;align-items:center;gap:12px;padding:13px 16px;background:var(--bg-alt);border:1px solid var(--line);border-radius:14px}
  .fw .fw-ic{width:36px;height:36px;border-radius:9px;background:#fff;color:var(--brand);display:flex;align-items:center;justify-content:center;flex:none;border:1px solid var(--line)}
  .fw b{font-weight:600;font-size:14px;color:var(--ink)}

  /* Final lead line */
  .final .final-lead{margin:12px 0 0;max-width:520px;color:#cdd9f5;font-size:16px}

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

  @media (max-width:860px){
    .final{padding:34px 22px}
    .final-grid{grid-template-columns:1fr;gap:26px}
    .final-media{margin:0 -22px -34px;min-height:230px}
    .prob-grid,.vfeatures,.steps{grid-template-columns:1fr}
    .feat-wall{grid-template-columns:repeat(2,1fr)}
    .vrow{grid-template-columns:1fr;gap:22px}
    .grid2{grid-template-columns:1fr}
    .nav-links{display:none}
    section{padding:56px 0}
    .hero{padding:48px 0 44px}
    .hero-grid{grid-template-columns:1fr;gap:30px}
    .hero-copy{text-align:center}
    .hero p.lead{margin-left:auto;margin-right:auto}
    .hero .cta-row{justify-content:center}
    .hero-illu{max-width:440px}
    .cmp{display:block;overflow-x:auto;white-space:nowrap}
  }

  @media (max-width:980px){
    .showcase{flex-direction:column;min-height:0;padding:30px 18px;gap:24px}
    .showcase::before{display:none}
    .im-app{width:100%;max-width:360px}
    .ind-chips{position:static;display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));justify-items:center;gap:24px 6px;margin-top:8px}
    .ind-item{position:static;transform:none!important;left:auto;top:auto;width:96px}
    .ind-scenarios{grid-template-columns:1fr}
  }