:root {
    color-scheme: only light;
    --paper:#fff; --surface:#f9f8f8; --ink:#1e1f21; --ink-2:#6d6e6f; --hairline:#edeae9;
    --gold:#f06a6a; --gold-100:#fce9e8; --gold-600:#d8605f;
    --positive:#408c6d; --session:#a069c9; --link:#4573d2;
    --rail:#1e1f21; --rail-2:#2f3033; --rail-text:#f5f4f3; --rail-muted:#a2a0a2;
    --r-md:10px; --r-lg:16px;
    --logo-navy:#0f172a; --logo-coral:#f43f5e; --logo-blue:#38bdf8; --logo-blue-600:#0ea5e9; --logo-blue-100:#e0f2fe;
  }
  * { box-sizing:border-box; }
  html,body { margin:0; background:var(--paper); color:var(--ink); }
  body { font:400 16px/1.55 Inter,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
  a { color:inherit; text-decoration:none; }
  h1,h2,h3,h4,p,ul { margin:0; }
  .wrap { max-width:1120px; margin:0 auto; padding:0 40px; }
  .btn { display:inline-flex; align-items:center; height:48px; padding:0 24px; border-radius:var(--r-md); background:var(--logo-coral); color:#fff; font-weight:600; font-size:15.5px; white-space:nowrap; box-shadow:0 1px 2px rgba(15,23,42,.08); transition:background .15s, transform .2s, box-shadow .2s; }
  .btn:hover { background:#e11d48; transform:translateY(-1px); box-shadow:0 8px 20px -8px rgba(244,63,94,.6); }
  .btn[href^="mailto:"] { background:var(--logo-blue); color:var(--logo-navy); }
  .btn[href^="mailto:"]:hover { background:var(--logo-blue-600); box-shadow:0 8px 20px -8px rgba(14,165,233,.6); }
  .quiet { color:var(--ink-2); font-weight:500; font-size:15px; }
  .quiet:hover { color:var(--ink); }
  nav .btn { display:none; }
  nav .signin { color:var(--ink); font-weight:600; border:1px solid #d9d6d4; border-radius:8px; padding:8px 14px; margin-left:8px; transition:border-color .15s, background .15s; }
  nav .signin:hover { border-color:var(--ink); background:var(--surface); }
  .eyebrow { font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--logo-blue-600); }
  h2 { font-size:44px; line-height:1.08; letter-spacing:-.03em; font-weight:600; }

  nav { position:sticky; top:0; z-index:30; background:rgba(255,255,255,.85); backdrop-filter:saturate(1.4) blur(10px); -webkit-backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid transparent; transition:border-color .3s; }
  nav.scrolled { border-bottom-color:var(--hairline); }
  nav .wrap { height:72px; display:flex; align-items:center; justify-content:space-between; transition:height .3s; }
  nav.scrolled .wrap { height:60px; }
  .mark { display:flex; align-items:center; gap:12px; font-weight:700; font-size:15px; letter-spacing:.22em; }
  .mark img { width:26px; height:26px; border-radius:6px; }
  nav .right { display:flex; align-items:center; gap:24px; white-space:nowrap; }
  .burger { display:none; width:40px; height:40px; margin-left:-10px; border:0; background:none; padding:9px; cursor:pointer; flex-direction:column; justify-content:space-between; }
  .burger span { display:block; height:2px; background:var(--ink); border-radius:2px; transition:transform .2s,opacity .2s; }
  nav.open .burger span:nth-child(1) { transform:translateY(10px) rotate(45deg); }
  nav.open .burger span:nth-child(2) { opacity:0; }
  nav.open .burger span:nth-child(3) { transform:translateY(-10px) rotate(-45deg); }

  .hero { padding:80px 0 0; text-align:center; }
  .hero h1 { font-size:72px; line-height:1.02; letter-spacing:-.04em; font-weight:600; max-width:900px; margin:0 auto; min-height:2.04em; }
  .hero h1 .live { white-space:pre-wrap; }
  .hero h1 .caret { display:inline-block; width:.05em; height:.9em; margin-left:.06em; background:var(--logo-blue); vertical-align:-.08em; animation:blink 1s steps(1) infinite; }
  @keyframes blink { 50% { opacity:0; } }
  .hero p { font-size:19px; color:var(--ink-2); max-width:640px; margin:24px auto 0; }
  .hero .cta { margin-top:36px; display:flex; justify-content:center; align-items:center; gap:22px; }

  .tour { margin-top:64px; position:relative; }
  .frame { position:relative; aspect-ratio:1280/578; overflow:hidden; border:1px solid var(--hairline); border-radius:var(--r-lg); box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 1px 2px rgba(15,23,42,.06), 0 50px 120px -40px rgba(15,23,42,.45); background:var(--surface); }
  .tour { perspective:1400px; }
  .tour .frame { transform:rotateX(6deg) scale(.97); transform-origin:50% 100%; transition:transform 1.1s cubic-bezier(.2,.8,.2,1); }
  .tour.in .frame { transform:none; }
  .frame video { position:absolute; inset:0; width:100%; height:100%; display:block; }
  .steps { position:relative; display:flex; justify-content:center; gap:28px; margin-top:22px; font-size:13.5px; color:var(--ink-2); }
  .steps .ink { position:absolute; bottom:0; height:2px; background:var(--logo-blue); transition:left .35s cubic-bezier(.2,.8,.2,1), width .35s cubic-bezier(.2,.8,.2,1); }
  .steps button { font:inherit; color:inherit; background:none; border:0; padding:0 0 6px; border-bottom:2px solid transparent; transition:.3s; cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
  .steps button:hover { color:var(--ink); }
  .steps button.on { color:var(--ink); }

  [data-reveal] { opacity:0; transform:translateY(22px); transition:opacity .6s cubic-bezier(.2,.8,.2,1), transform .6s cubic-bezier(.2,.8,.2,1); transition-delay:var(--d,0s); }
  [data-reveal].in { opacity:1; transform:none; }
  .pricing { padding-top:140px; }
  .pricing .grid { margin-top:40px; display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--hairline); }
  .pricing .plan { padding:40px 56px 40px 0; }
  .pricing .plan + .plan { border-left:1px solid var(--hairline); padding-left:56px; padding-right:0; }
  .pricing h3 { font-size:15px; font-weight:600; color:var(--ink-2); }
  .pricing .big { font-size:34px; line-height:1; letter-spacing:-.03em; font-weight:600; margin:10px 0 6px; }
  .pricing .sub { font-size:14px; color:var(--ink-2); margin-bottom:22px; }
  .pricing ul { list-style:none; padding:0; color:var(--ink-2); font-size:15px; }
  .pricing li { padding:5px 0; }

  .close { padding-top:160px; text-align:center; }
  .close h2 { font-size:48px; letter-spacing:-.03em; }
  .close p { margin:18px auto 0; max-width:520px; color:var(--ink-2); font-size:18px; }
  .close .btn { margin-top:34px; }
  .close .quiet { display:block; margin-top:18px; }

  footer { margin-top:160px; background:var(--rail); color:var(--rail-muted); font-size:13px; position:relative; }
  footer::before { content:""; position:absolute; left:0; top:0; height:1px; width:100%; background:linear-gradient(90deg,var(--logo-blue),var(--logo-coral)); transform:scaleX(0); transform-origin:left; transition:transform 1.2s cubic-bezier(.2,.8,.2,1); }
  footer.in::before { transform:scaleX(1); }
  footer .wrap { padding:44px 40px; display:flex; align-items:flex-start; justify-content:space-between; gap:40px; }
  footer .fcol p { margin-top:14px; line-height:1.7; }
  footer .links { display:flex; flex-direction:column; gap:8px; text-align:right; }
  footer .mark { color:var(--rail-text); font-size:12px; }
  footer a:hover { color:var(--rail-text); }

  @media (prefers-reduced-motion:reduce) { [data-reveal], .tour .frame, footer::before { transition:none; opacity:1; transform:none; } .hero h1 .caret { animation:none; } }
  @media (max-width:1023px) {
    .hero h1 { font-size:56px; }
    .pricing .grid { grid-template-columns:1fr; }
    .pricing .plan, .pricing .plan + .plan { padding:32px 0; border-left:0; border-top:1px solid var(--hairline); }
    .pricing .plan:first-child { border-top:0; }
  }
  @media (max-width:1023px) {
    .burger { display:flex; order:2; margin-left:0; margin-right:-10px; }
    nav .right { display:flex; position:absolute; left:0; right:0; top:100%; background:var(--paper); border-bottom:1px solid var(--hairline); flex-direction:column; align-items:stretch; gap:0; padding:8px 0 12px; z-index:20; transform:translateY(-8px); opacity:0; visibility:hidden; transition:transform .25s, opacity .25s, visibility 0s .25s; }
    nav.open .right { transform:none; opacity:1; visibility:visible; transition:transform .25s, opacity .25s; }
    nav .right a { padding:14px 40px; font-size:17px; }
    nav .right .signin { display:block; border:0; border-top:1px solid var(--hairline); border-radius:0; margin:8px 0 0; padding-top:18px; background:none; }
  }
  @media (max-width:767px) {
    .wrap { padding:0 20px; }
    nav .wrap { height:64px; }
    nav .right a { padding:14px 20px; }
    .hero { padding-top:48px; }
    .hero h1 { font-size:40px; letter-spacing:-.03em; min-height:3.06em; }
    .hero p { font-size:17px; }
    .hero .cta { flex-direction:column; gap:16px; }
    .steps { gap:14px; font-size:12.5px; flex-wrap:wrap; }
    .pricing { padding-top:96px; }
    h2, .close h2 { font-size:32px; }
    .close { padding-top:110px; }
    footer { margin-top:96px; }
    footer .wrap { padding:32px 20px; flex-direction:column; align-items:flex-start; gap:24px; }
    footer .links { text-align:left; }
  }

  .hero .fine { margin-top:16px; font-size:14px; color:var(--ink-2); }
  .hero p + p { margin-top:12px; }
  .sec { padding-top:150px; }
  .band { padding-bottom:150px; background:#f6f5f3; box-shadow:0 0 0 100vmax #f6f5f3; clip-path:inset(0 -100vmax); }
  .sec:has(+ .band), .pricing:has(+ .band) { padding-bottom:150px; }
  section[id] { scroll-margin-top:80px; }
  .sec h2 { max-width:760px; margin-top:14px; }
  .prose { max-width:680px; margin-top:28px; color:var(--ink-2); font-size:18px; }
  .prose p + p { margin-top:16px; }
  .prose .lead { color:var(--ink); font-weight:500; }
  .lines { margin-top:28px; font-size:22px; line-height:1.4; letter-spacing:-.01em; font-weight:600; max-width:720px; }
  .cols2 { margin-top:56px; display:grid; grid-template-columns:1fr 1fr; gap:56px 64px; }
  .cols3 { margin-top:56px; display:grid; grid-template-columns:repeat(3,1fr); gap:48px 40px; }
  .cols2 h3, .cols3 h3 { font-size:20px; font-weight:600; letter-spacing:-.015em; margin-bottom:10px; }
  .cols2 h3 em, .cols3 h3 em { font-style:normal; color:var(--ink-2); font-weight:500; }
  .cols2 p, .cols3 p { color:var(--ink-2); font-size:15.5px; }
  .cols2 p + p, .cols3 p + p { margin-top:10px; }
  .k { width:10px; height:10px; border-radius:3px; margin-bottom:16px; }
  .chips { display:flex; flex-wrap:wrap; gap:6px; margin:14px 0 4px; }
  .chips i { font-style:normal; color:var(--ink-2); align-self:center; }
  .chips span { font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); background:var(--surface); border:1px solid var(--hairline); border-radius:6px; padding:5px 9px; }
  .steps5 { margin-top:48px; display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
  .steps5 div { position:relative; border-top:3px solid var(--hairline); padding-top:16px; }
  .steps5 div::before { content:""; position:absolute; left:0; right:0; top:-3px; height:3px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .6s cubic-bezier(.2,.8,.2,1); transition-delay:var(--d,0s); }
  .steps5.in div::before { transform:scaleX(1); }
  .steps5 .n { font-size:11px; font-weight:600; letter-spacing:.14em; color:var(--logo-blue-600); margin-bottom:8px; }
  .steps5 h3 { font-size:16px; font-weight:600; margin-bottom:6px; }
  .steps5 p { font-size:14px; color:var(--ink-2); }
  .fine { margin-top:28px; font-size:15px; color:var(--ink-2); }
  .value { margin-top:48px; display:grid; grid-template-columns:1fr 1fr; gap:22px 64px; list-style:none; padding:0; }
  .value li { padding:18px 0; border-top:1px solid var(--hairline); font-size:16px; color:var(--ink-2); }
  .value li b { color:var(--ink); font-weight:600; display:block; margin-bottom:4px; }
  .center { text-align:center; }
  .center h2, .center .prose { margin-left:auto; margin-right:auto; }
  .remote .lines { margin:36px auto 0; }
  .faq { margin-top:40px; border-top:1px solid var(--hairline); max-width:820px; }
  .faq details { border-bottom:1px solid var(--hairline); }
  .faq summary { cursor:pointer; list-style:none; padding:20px 44px 20px 0; font-size:17px; font-weight:600; letter-spacing:-.01em; position:relative; }
  .faq summary::-webkit-details-marker { display:none; }
  .faq summary::after { content:"+"; position:absolute; right:4px; top:16px; font-size:24px; font-weight:400; color:var(--ink-2); transition:transform .25s; }
  .faq details[open] summary::after { transform:rotate(45deg); }
  .faq details p { padding:0 44px 22px 0; color:var(--ink-2); font-size:15.5px; max-width:720px; }
  .pricing .plan .btn { margin-top:22px; }
  @media (max-width:1023px) { .cols2 { gap:40px; } }
  @media (max-width:767px) {
    .sec { padding-top:96px; }
    .band, .sec:has(+ .band), .pricing:has(+ .band) { padding-bottom:96px; }
    .cols2, .cols3, .steps5, .value { grid-template-columns:1fr; }
    .lines { font-size:19px; }
    .prose { font-size:17px; }
  }