:root{
    --blue:#3B82F6;
    --purple:#8B5CF6;
    --pink:#EC4899;
    --ink:#141418;
    --ink-soft:#4a4a55;
    --ink-faint:#8b8b96;
    --line:#ececf1;
    --bg:#ffffff;
    --bg-soft:#fafafb;
    --radius-lg:24px;
    --radius-md:16px;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{-webkit-text-size-adjust:100%;}
  body{
    font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
    color:var(--ink);
    background:var(--bg);
    letter-spacing:-0.03em;
    line-height:1.7;
    font-size:15px;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  .ci7zkq{
    width:100%;
    max-width:1120px;
    margin:0 auto;
    padding:0 24px;
  }

  /* ---------- header ---------- */
  .ketzy9{
    padding:28px 0;
  }
  .mtfhw5{
    display:inline-flex;
    align-items:center;
    gap:10px;
  }
  .mtfhw5 img{
    height:34px;
    width:auto;
    border-radius:9px;
    object-fit:contain;
  }
  .a5rnod{
    font-size:17px;
    font-weight:600;
    letter-spacing:-0.02em;
  }

  /* ---------- hero ---------- */
  .kvxkyz{
    padding:72px 0 96px;
  }
  .dgopgr{
    display:grid;
    grid-template-columns:1fr;
    gap:56px;
    align-items:center;
  }
  .kp9wtt{
    font-size:13px;
    color:var(--ink-faint);
    letter-spacing:0.02em;
    margin-bottom:22px;
  }
  .kvxkyz h1{
    font-size:38px;
    line-height:1.22;
    font-weight:700;
    letter-spacing:-0.04em;
    margin-bottom:26px;
    max-width:15em;
  }
  .kvxkyz h1 .s88lwo{
    background:linear-gradient(100deg,var(--blue),var(--purple) 55%,var(--pink));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .x7ss2r{
    font-size:16px;
    color:var(--ink-soft);
    max-width:30em;
    margin-bottom:16px;
  }
  .tep6fe{
    font-size:14px;
    color:var(--ink-faint);
    max-width:30em;
    margin-bottom:38px;
  }
  .y9vtf0{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:linear-gradient(100deg,var(--blue),var(--purple) 55%,var(--pink));
    color:#fff;
    font-size:15px;
    font-weight:600;
    letter-spacing:-0.01em;
    padding:15px 32px;
    border-radius:999px;
    box-shadow:0 10px 28px rgba(139,92,246,.26);
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .y9vtf0:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 34px rgba(139,92,246,.34);
  }
  .y9vtf0 .fh3s38{
    font-size:15px;
    transition:transform .25s ease;
  }
  .y9vtf0:hover .fh3s38{transform:translateX(3px);}
  .smvszu{
    border-radius:var(--radius-lg);
    overflow:hidden;
    background:var(--bg-soft);
  }
  .smvszu img{
    width:100%;
    height:auto;
    border-radius:var(--radius-lg);
  }

  /* ---------- section base ---------- */
  section{position:relative;}
  .l7yla8{
    max-width:34em;
    margin-bottom:56px;
  }
  .ol36j5{
    font-size:12px;
    letter-spacing:0.12em;
    color:var(--ink-faint);
    text-transform:uppercase;
    margin-bottom:18px;
  }
  .l7yla8 h2{
    font-size:28px;
    line-height:1.3;
    font-weight:700;
    letter-spacing:-0.035em;
    margin-bottom:18px;
  }
  .l7yla8 p{
    font-size:15px;
    color:var(--ink-soft);
  }

  /* ---------- feeling (使用感受) ---------- */
  .a4b9oi{
    padding:96px 0;
    background:var(--bg-soft);
  }
  .hkua9v{
    display:grid;
    grid-template-columns:1fr;
    gap:44px;
  }
  .xnvuvk p{
    font-size:15px;
    color:var(--ink-soft);
    margin-bottom:20px;
    max-width:32em;
  }
  .xnvuvk p:last-child{margin-bottom:0;}
  .hf9n1x{
    list-style:none;
    margin-top:36px;
    display:grid;
    gap:22px;
  }
  .hf9n1x li{
    display:grid;
    grid-template-columns:1fr;
    gap:6px;
    padding-left:18px;
    border-left:2px solid var(--line);
  }
  .hf9n1x .txe5fv{
    font-size:13px;
    color:var(--ink-faint);
  }
  .hf9n1x .qyffnd{
    font-size:15px;
    color:var(--ink);
    font-weight:500;
  }
  .a7zin9 img{
    width:100%;
    border-radius:var(--radius-lg);
  }

  /* ---------- features ---------- */
  .s42uns{
    padding:104px 0;
  }
  .uwcli4{
    display:grid;
    grid-template-columns:1fr;
    gap:24px;
  }
  .vs7y5k{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    padding:34px 30px;
    transition:border-color .3s ease, transform .3s ease;
  }
  .vs7y5k:hover{
    border-color:#dcdce6;
    transform:translateY(-3px);
  }
  .o22c83{
    font-size:13px;
    font-weight:600;
    letter-spacing:0.06em;
    background:linear-gradient(100deg,var(--blue),var(--purple) 55%,var(--pink));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    margin-bottom:16px;
  }
  .vs7y5k h3{
    font-size:18px;
    font-weight:650;
    letter-spacing:-0.03em;
    margin-bottom:12px;
  }
  .vs7y5k p{
    font-size:14px;
    color:var(--ink-soft);
    line-height:1.75;
  }
  .v26xxw{
    display:grid;
    grid-template-columns:1fr;
    gap:20px;
    margin-top:56px;
  }
  .v26xxw figure{
    border-radius:var(--radius-md);
    overflow:hidden;
    background:var(--bg-soft);
  }
  .v26xxw img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:var(--radius-md);
  }
  .v26xxw figcaption{
    font-size:12px;
    color:var(--ink-faint);
    padding:12px 4px 0;
  }

  /* ---------- download ---------- */
  .xzdt7r{
    padding:24px 0 104px;
  }
  .fw5qqr{
    border-radius:32px;
    background:linear-gradient(115deg,var(--blue),var(--purple) 52%,var(--pink));
    color:#fff;
    padding:64px 30px;
    text-align:left;
  }
  .fw5qqr h2{
    font-size:28px;
    font-weight:700;
    letter-spacing:-0.04em;
    line-height:1.3;
    margin-bottom:18px;
    color:#fff;
  }
  .fw5qqr p{
    font-size:15px;
    color:rgba(255,255,255,.86);
    max-width:30em;
    margin-bottom:14px;
  }
  .o9dilc{
    list-style:none;
    margin:36px 0 40px;
    display:grid;
    gap:20px;
    max-width:36em;
  }
  .o9dilc li{
    display:flex;
    gap:16px;
    align-items:flex-start;
  }
  .o9dilc .urhpqy{
    flex:0 0 auto;
    width:28px;
    height:28px;
    border-radius:50%;
    background:rgba(255,255,255,.2);
    font-size:13px;
    font-weight:600;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:1px;
  }
  .o9dilc .qjvd0h strong{
    display:block;
    font-size:15px;
    font-weight:600;
    margin-bottom:2px;
  }
  .o9dilc .qjvd0h span{
    font-size:13px;
    color:rgba(255,255,255,.8);
  }
  .agv5ex{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:#fff;
    color:#3b2c6b;
    font-size:15px;
    font-weight:600;
    padding:15px 32px;
    border-radius:999px;
    transition:transform .25s ease;
  }
  .agv5ex:hover{transform:translateY(-2px);}
  .s6970f{
    font-size:12px;
    color:rgba(255,255,255,.7);
    margin-top:22px;
    margin-bottom:0;
  }

  /* ---------- footer ---------- */
  .isn7q6{
    padding:48px 0 56px;
    border-top:1px solid var(--line);
  }
  .d6h09o{
    display:flex;
    flex-wrap:wrap;
    gap:14px 28px;
    align-items:baseline;
    justify-content:space-between;
  }
  .tm2174{
    font-size:12px;
    color:var(--ink-faint);
    line-height:1.9;
  }
  .tm2174 .urteb9{
    display:block;
  }
  .euh61f{
    font-size:12px;
    color:var(--ink-faint);
  }
  .euh61f a{
    color:var(--ink-faint);
    border-bottom:1px solid transparent;
    transition:color .2s ease, border-color .2s ease;
  }
  .euh61f a:hover{
    color:var(--ink-soft);
    border-color:#d5d5dd;
  }
  .euh61f .h52gbo{margin:0 8px;opacity:.5;}

  /* ---------- responsive ---------- */
  @media (min-width:768px){
    body{font-size:16px;}
    .kvxkyz{padding:88px 0 112px;}
    .kvxkyz h1{font-size:52px;}
    .x7ss2r{font-size:17px;}
    .l7yla8 h2{font-size:34px;}
    .a4b9oi{padding:112px 0;}
    .hkua9v{
      grid-template-columns:1.05fr .95fr;
      gap:64px;
      align-items:center;
    }
    .hf9n1x li{
      grid-template-columns:11em 1fr;
      gap:14px;
      align-items:baseline;
    }
    .hf9n1x .txe5fv{text-align:left;}
    .uwcli4{
      grid-template-columns:repeat(2,1fr);
      gap:28px;
    }
    .v26xxw{
      grid-template-columns:repeat(2,1fr);
      gap:24px;
    }
    .fw5qqr{padding:76px 56px;}
    .fw5qqr h2{font-size:34px;}
    .d6h09o{flex-wrap:nowrap;}
  }

  @media (min-width:1024px){
    .ci7zkq{padding:0 40px;}
    .kvxkyz{padding:104px 0 136px;}
    .dgopgr{
      grid-template-columns:1.05fr .95fr;
      gap:80px;
    }
    .kvxkyz h1{font-size:60px;}
    .smvszu{
      box-shadow:0 30px 70px rgba(20,20,30,.07);
    }
    .s42uns{padding:128px 0;}
    .uwcli4{
      grid-template-columns:repeat(3,1fr);
      gap:32px;
    }
    .v26xxw{
      grid-template-columns:repeat(3,1fr);
    }
    .v26xxw .u3wq9k{grid-column:span 2;}
    .xzdt7r{padding:32px 0 128px;}
    .fw5qqr{
      padding:88px 80px;
      display:flex;
      gap:64px;
      align-items:center;
      justify-content:space-between;
    }
    .xc6num{max-width:36em;}
    .bm6mvl{flex:0 0 auto;}
    .l7yla8 h2{font-size:38px;}
  }