:root{
    --bg:#ffffff; --bg-soft:#faf8f4; --bg-warm:#fff7ec;
    --ink:#1f2430; --ink-soft:#5b6472; --ink-faint:#98a1b0;
    --line:#ece7df; --line-strong:#e0d9cd;
    --accent:#f5a623; --accent-deep:#e8890b; --accent-ink:#7a4a05;
    --teal:#01696f; --ok:#437a22;
    --card:#ffffff; --shadow:0 10px 40px rgba(31,36,48,.06);
    --shadow-lift:0 18px 50px rgba(232,137,11,.16);
    --r:18px;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1120px;margin:0 auto;padding:0 22px;}
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto;}}

  /* header */
  header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.85);backdrop-filter:blur(10px);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:-.4px;}
  .logo .dot{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--accent),var(--accent-deep));display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(232,137,11,.35);}
  .logo .dot svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
  .nav-links{display:flex;gap:28px;align-items:center;}
  .nav-links a{color:var(--ink-soft);font-size:15px;font-weight:500;transition:color .15s;}
  .nav-links a:hover{color:var(--ink);}
  .btn{display:inline-block;font-weight:700;border-radius:12px;transition:transform .15s,box-shadow .15s;cursor:pointer;border:none;}
  .btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-deep));color:#fff;padding:13px 26px;font-size:15px;box-shadow:0 8px 22px rgba(232,137,11,.28);}
  .btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);}
  .btn-ghost{background:var(--bg-warm);color:var(--accent-ink);padding:11px 20px;font-size:15px;border:1px solid var(--line-strong);}
  .btn-ghost:hover{background:#ffefd6;}
  @media(max-width:760px){.nav-links{display:none;}}

  /* hero */
  .hero{padding:70px 0 40px;background:radial-gradient(900px 420px at 78% -8%,var(--bg-warm),transparent);}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;}
  .badge{display:inline-flex;align-items:center;gap:8px;background:var(--bg-warm);color:var(--accent-ink);border:1px solid var(--line-strong);padding:7px 15px;border-radius:999px;font-size:13px;font-weight:600;}
  .badge b{color:var(--ok);}
  h1{font-size:clamp(34px,5vw,52px);font-weight:800;letter-spacing:-1.4px;line-height:1.08;margin:20px 0 0;}
  h1 .hl{background:linear-gradient(135deg,var(--accent-deep),var(--accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
  .hero-sub{color:var(--ink-soft);font-size:clamp(16px,2vw,19px);margin-top:20px;max-width:520px;}
  .hero-cta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:30px;}
  .cta-note{color:var(--ink-faint);font-size:13.5px;margin-top:14px;}
  .cta-note b{color:var(--ok);}
  .trust{display:flex;gap:26px;margin-top:34px;flex-wrap:wrap;}
  .trust .ti{display:flex;flex-direction:column;}
  .trust .ti b{font-size:24px;font-weight:800;letter-spacing:-.5px;}
  .trust .ti span{font-size:13px;color:var(--ink-faint);}
  @media(max-width:860px){.hero-grid{grid-template-columns:1fr;gap:36px;}.hero{padding:46px 0 30px;}}

  /* phone mockup */
  .phone-stage{display:flex;justify-content:center;position:relative;}
  .phone-stage:before{content:"";position:absolute;width:300px;height:300px;background:radial-gradient(circle,rgba(245,166,35,.20),transparent 68%);top:50%;left:50%;transform:translate(-50%,-50%);z-index:0;}
  .phone{position:relative;z-index:1;width:290px;background:#0f1218;border-radius:38px;padding:11px;box-shadow:0 30px 70px rgba(31,36,48,.22);border:1px solid #23272f;animation:float 5s ease-in-out infinite;}
  @keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-12px);}}
  .screen{background:#f6f7f9;border-radius:29px;overflow:hidden;height:560px;display:flex;flex-direction:column;}
  .tg-top{background:#517da3;color:#fff;padding:14px 16px 12px;display:flex;align-items:center;gap:10px;}
  .tg-top .av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-deep));display:flex;align-items:center;justify-content:center;font-size:15px;}
  .tg-top .nm{font-weight:700;font-size:14.5px;line-height:1.2;}
  .tg-top .st{font-size:11px;opacity:.8;}
  .chat{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:9px;overflow:hidden;background:#e7ebf0;}
  .msg{max-width:82%;padding:9px 12px;border-radius:14px;font-size:12.5px;line-height:1.45;box-shadow:0 1px 2px rgba(0,0,0,.06);}
  .msg.bot{background:#fff;border-bottom-left-radius:5px;color:#1f2430;}
  .msg.usr{background:#d3f0c8;align-self:flex-end;border-bottom-right-radius:5px;color:#183a0e;}
  .msg .ttl{font-weight:700;color:var(--accent-deep);font-size:12px;margin-bottom:3px;}
  .kbd{display:flex;flex-wrap:wrap;gap:6px;margin-top:3px;}
  .kbd span{background:#fff;border:1px solid #d6dbe2;color:#2c3746;font-size:11px;font-weight:600;padding:6px 10px;border-radius:9px;}
  .kbd span.acc{background:var(--accent);border-color:var(--accent-deep);color:#fff;}

  /* sections */
  section{padding:64px 0;}
  .sec-head{text-align:center;max-width:640px;margin:0 auto 46px;}
  .eyebrow{color:var(--accent-deep);font-weight:700;font-size:13px;letter-spacing:1.4px;text-transform:uppercase;}
  .sec-title{font-size:clamp(26px,3.6vw,38px);font-weight:800;letter-spacing:-.7px;margin-top:10px;line-height:1.15;}
  .sec-sub{color:var(--ink-soft);font-size:17px;margin-top:14px;}

  /* features */
  .feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1040px;margin:0 auto;}
  @media(max-width:900px){.feat-grid{grid-template-columns:repeat(2,1fr);}}
  @media(max-width:600px){.feat-grid{grid-template-columns:1fr;}}
  .feat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:28px;transition:transform .16s,box-shadow .16s,border-color .16s;}
  .feat:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--line-strong);}
  .feat .ic{width:48px;height:48px;border-radius:13px;background:var(--bg-warm);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
  .feat .ic svg{width:24px;height:24px;stroke:var(--accent-deep);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
  .feat h3{font-size:18px;font-weight:700;margin-bottom:8px;letter-spacing:-.3px;}
  .feat p{color:var(--ink-soft);font-size:14.5px;}

  /* audience */
  .aud{background:var(--bg-soft);}
  .aud-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;}
  .aud-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px 20px;text-align:center;transition:transform .16s,box-shadow .16s;}
  .aud-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
  .aud-card .em{font-size:30px;}
  .aud-card b{display:block;margin-top:10px;font-size:15.5px;}
  .aud-card span{color:var(--ink-faint);font-size:13px;}

  /* how */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:st;}
  .step{position:relative;padding:28px 24px 24px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);}
  .step .n{counter-increment:st;width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--accent),var(--accent-deep));color:#fff;font-weight:800;font-size:17px;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 14px rgba(232,137,11,.3);}
  .step .n:after{content:counter(st);}
  .step h4{font-size:17px;font-weight:700;margin:16px 0 7px;}
  .step p{color:var(--ink-soft);font-size:14.5px;}
  @media(max-width:760px){.steps{grid-template-columns:1fr;}}

  /* pricing */
  .price{background:var(--bg-soft);}
  .price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;align-items:stretch;}
  .plan{background:#fff;border:1px solid var(--line);border-radius:22px;padding:32px 28px;display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s;}
  .plan:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
  .plan.pop{border:2px solid var(--accent);box-shadow:var(--shadow-lift);position:relative;}
  .plan .tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--accent),var(--accent-deep));color:#fff;font-size:12px;font-weight:700;padding:6px 16px;border-radius:999px;white-space:nowrap;box-shadow:0 6px 16px rgba(232,137,11,.35);}
  .plan h3{font-size:20px;font-weight:800;}
  .plan .who{color:var(--ink-faint);font-size:13.5px;margin:6px 0 20px;min-height:20px;}
  .plan .amt{font-size:40px;font-weight:800;letter-spacing:-1.5px;line-height:1;}
  .plan .amt small{font-size:16px;color:var(--ink-faint);font-weight:600;letter-spacing:0;}
  .plan .amt .free{font-size:22px;color:var(--ok);}
  .plan ul{list-style:none;margin:24px 0;display:flex;flex-direction:column;gap:12px;flex:1;}
  .plan li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--ink-soft);}
  .plan li svg{width:18px;height:18px;stroke:var(--ok);fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;margin-top:2px;}
  .plan .btn{text-align:center;width:100%;}
  .plan .btn-ghost{background:var(--bg-warm);}
  .price-note{text-align:center;color:var(--ink-faint);font-size:14px;margin-top:28px;}
  .plan-custom{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
    margin-top:22px;padding:20px 24px;border:1px dashed var(--line);border-radius:14px;background:var(--bg);}
  .plan-custom-text{font-size:15px;line-height:1.55;color:var(--ink-soft);max-width:640px;}
  .plan-custom-text b{color:var(--ink);}
  .plan-custom .btn{white-space:nowrap;flex-shrink:0;}
  @media(max-width:640px){.plan-custom{flex-direction:column;align-items:flex-start;}}

  /* demo */
  .demo{background:var(--bg-warm);}
  .demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:stretch;}
  .demo-col{background:#fff;border:1px solid var(--line-strong);border-radius:26px;padding:32px 28px;box-shadow:var(--shadow);display:flex;flex-direction:column;}
  .demo-col .dic{width:46px;height:46px;border-radius:12px;background:var(--bg-warm);display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
  .demo-col .dic svg{width:23px;height:23px;stroke:var(--accent-deep);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
  .demo-col h4{font-size:19px;font-weight:700;letter-spacing:-.3px;}
  .demo-col p{color:var(--ink-soft);font-size:14px;margin:8px 0 20px;}
  .demo-shot{background:#e7ebf0;border-radius:20px;padding:16px 14px;border:1px solid var(--line);flex:1;}
  .demo-shot .adm-hd{display:flex;align-items:center;gap:9px;background:#517da3;color:#fff;border-radius:12px;padding:11px 13px;margin:-2px -2px 12px;}
  .demo-shot .adm-hd .av{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,var(--accent),var(--accent-deep));display:flex;align-items:center;justify-content:center;font-size:14px;}
  .demo-shot .adm-hd b{font-size:13.5px;line-height:1.2;}
  .demo-shot .adm-hd span{font-size:10.5px;opacity:.82;}
  .adm-msg{background:#fff;border-radius:12px;border-bottom-left-radius:4px;padding:9px 12px;font-size:12.5px;color:#1f2430;box-shadow:0 1px 2px rgba(0,0,0,.06);margin-bottom:10px;}
  .adm-msg b{color:var(--accent-deep);}
  .adm-kb{display:flex;flex-wrap:wrap;gap:6px;}
  .adm-kb button{background:#fff;border:1px solid #cfd6df;color:#243244;font-size:11px;font-weight:600;padding:8px 10px;border-radius:9px;flex:1 1 auto;text-align:center;cursor:default;}
  .adm-kb button.wide{flex-basis:100%;}
  .adm-kb button.on{background:#eafbe4;border-color:#95cf7e;color:#2e6d1a;}
  .adm-kb button.acc{background:var(--accent);border-color:var(--accent-deep);color:#fff;}
  .demo-note-in{color:var(--ink-faint);font-size:12.5px;margin-top:14px;}
  .demo-hint{text-align:center;color:var(--ink-faint);font-size:13.5px;margin-top:26px;}
  @media(max-width:720px){.demo-grid{grid-template-columns:1fr;}}
  /* live screenshots gallery */
  .shots-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;max-width:900px;margin:0 auto;}
  .shot{margin:0;display:flex;flex-direction:column;}
  .shot img{width:100%;height:auto;display:block;filter:drop-shadow(0 18px 40px rgba(20,25,35,.18));transition:transform .25s ease;}
  .shot:hover img{transform:translateY(-6px);}
  .shot figcaption{margin-top:12px;text-align:center;}
  .shot figcaption b{display:block;font-size:15px;font-weight:700;letter-spacing:-.2px;color:var(--ink);}
  .shot figcaption span{display:block;font-size:12.5px;color:var(--ink-soft);margin-top:3px;line-height:1.4;}
  @media(max-width:820px){.shots-grid{grid-template-columns:repeat(2,1fr);gap:30px;max-width:560px;}}
  @media(max-width:480px){.shots-grid{grid-template-columns:1fr;max-width:320px;}}

  /* final cta */
  .final{text-align:center;}
  .final-box{background:linear-gradient(135deg,#fff7ec,#ffefd6);border:1px solid var(--line-strong);border-radius:28px;padding:56px 28px;}
  .final-box h2{font-size:clamp(26px,3.6vw,40px);font-weight:800;letter-spacing:-.8px;}
  .final-box p{color:var(--ink-soft);font-size:18px;margin:16px auto 30px;max-width:520px;}

  /* footer */
  footer{border-top:1px solid var(--line);padding:40px 0;color:var(--ink-faint);font-size:14px;}
  footer .foot a{color:var(--ink-soft);}
  footer .foot a:hover{color:var(--ink);}
  .foot-legal{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;line-height:1.7;color:var(--ink-faint);}
  .foot{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;}
  .foot a{color:var(--ink-soft);}
  .foot a:hover{color:var(--ink);}