:root {
  --tone: #69727e;
  --guide: rgba(24, 27, 31, .075);
  --night: #111418;
  --night-rule: #2a3037;
  --night-text: #c9cfd6;
  --night-tone: #8c96a3;
  --honey-on-night: #f2b56b;
  --ok: #1d6b45; --ok-tint: #e3f4ea; --won: #2f9e6a;
  --open: #34507a; --open-tint: #e8eef8;
  --ui-shadow: 0 50px 100px -24px rgba(30, 40, 60, .24), 0 30px 60px -32px rgba(0, 0, 0, .3);
  --ease: cubic-bezier(.2, .7, .2, 1);
}
body.home { color: var(--ink); }
html:has(body.home) { scroll-padding-top: 16px; }
body.home .site-header { position: absolute; left: 0; right: 0; top: 0; background: transparent; border-bottom-color: transparent; }
body.home .site-header.open { background: #fff; border-bottom-color: var(--rule); }
body.home .site-header:not(.open) .header-right .btn { background: var(--ink); border-color: var(--ink); color: #fff; }
body.home .site-header:not(.open) .lang { color: var(--ink); }
body.home .site-header:not(.open) .menu-toggle { background: rgba(255, 255, 255, .9); }
body.home section { padding-block: 84px; }
body.home section.story-sec { padding-block: 72px; }
.story-sec .h2x { margin-bottom: 32px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tone { color: var(--tone); }
@media (min-width: 1240px) {
  body.home main > section:not(.dark3) {
    background-image: linear-gradient(to bottom, var(--guide) 50%, transparent 50%), linear-gradient(to bottom, var(--guide) 50%, transparent 50%);
    background-size: 1px 10px; background-repeat: repeat-y;
    background-position: calc(50% - 590px) 0, calc(50% + 590px) 0;
  }
  body.home .dark3 {
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, .06) 50%, transparent 50%), linear-gradient(to bottom, rgba(255, 255, 255, .06) 50%, transparent 50%);
    background-size: 1px 10px; background-repeat: repeat-y;
    background-position: calc(50% - 590px) 0, calc(50% + 590px) 0;
  }
}
.h2x { font-size: clamp(1.9rem, 3.3vw, 2.75rem); font-weight: 560; letter-spacing: -0.035em; line-height: 1.12; max-width: 840px; margin-bottom: 40px; }
body.home section.hero3 { position: relative; overflow: hidden; display: flex; align-items: center; padding: 168px 0 96px; border-bottom: 1px solid var(--rule);
  min-height: clamp(660px, 100vh, 1040px); min-height: clamp(660px, 100svh, 1040px); }
.hero3-in { width: 100%; }
.accent { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; display: block; }
.hero3 .accent { -webkit-mask-image: linear-gradient(100deg, transparent 46%, rgba(0, 0, 0, .6) 62%, #000 80%); mask-image: linear-gradient(100deg, transparent 46%, rgba(0, 0, 0, .6) 62%, #000 80%); }
.hero3-in { position: relative; z-index: 1; }
body.home section.hero3 { background: #0c0f14; color: #f3f5f8; border-bottom: 0; }
.hero3 .hero-light { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; opacity: 0; transition: opacity .9s ease; }
.hero3 .hero-light.on { opacity: 1; }
.hero3 h1 { color: #f3f5f8; }
.hero3 .sub3 { color: #e5a35c; }
.hero3 .btn.ghost { background: transparent; border-color: rgba(243, 245, 248, .42); color: #f3f5f8; }
.hero3 .btn.ghost:hover { background: rgba(255, 255, 255, .08); border-color: #f3f5f8; color: #f3f5f8; }
body.home .site-header:not(.open) .nav > a,
body.home .site-header:not(.open) .nav-dd > a,
body.home .site-header:not(.open) .lang { color: #f3f5f8; }
body.home .site-header:not(.open) .nav > a:hover,
body.home .site-header:not(.open) .nav-dd > a:hover,
body.home .site-header:not(.open) .lang:hover { color: #e5a35c; }
body.home .site-header:not(.open) .header-right .btn { background: #f3f5f8; border-color: #f3f5f8; color: #10141a; }
body.home .site-header:not(.open) .menu-toggle { background: rgba(255, 255, 255, .06); border-color: rgba(243, 245, 248, .35); color: #f3f5f8; }
body.home .site-header.open { background: #10141a; border-bottom-color: #282d33; }
body.home .site-header.open .nav a, body.home .site-header.open .lang, body.home .site-header.open .menu-toggle { color: #f3f5f8; }
body.home .site-header.open .nav-dd .dd a { color: #aab3bf; }
body.home .site-header.open .nav, body.home .site-header.open .header-right { border-top-color: #282d33; }
body.home .site-header.open .menu-toggle { background: none; border-color: #3b4047; }
.kicker { font-size: 1rem; color: var(--muted); margin-bottom: 30px; }
.kicker b { color: var(--ink); font-weight: 600; }
.hero3 h1 { font-size: clamp(3rem, 7vw, 6.6rem); font-weight: 560; letter-spacing: -0.048em; line-height: 1; max-width: 10em; }
.lead3 { max-width: 34em; margin-top: 28px; font-size: clamp(1.1rem, 1.5vw, 1.32rem); line-height: 1.5; color: #4a4f56; }
.hero3 .actions { margin-top: 40px; gap: 12px; }
.hero3 .btn, .cta3 .btn { padding: 16px 26px; font-size: 1.05rem; }
@media (max-width: 960px) {
  body.home section.hero3 { align-items: flex-start; padding: 132px 0 56px; min-height: min(100svh, 820px); }
  .hero3 .accent { -webkit-mask-image: linear-gradient(180deg, transparent 52%, #000 100%); mask-image: linear-gradient(180deg, transparent 52%, #000 100%); }
}
body.home section.trust { padding-block: 0; border-block: 1px solid var(--rule); background: #fff; }
.trust-list { list-style: none; margin: 0 auto; display: grid; grid-template-columns: repeat(5, 1fr); }
.trust-list li { display: flex; align-items: center; gap: 12px; padding: 24px 18px; font-size: .95rem; font-weight: 600; line-height: 1.3; color: #2b2f34; }
.trust-list li + li { border-left: 1px solid var(--rule); }
.trust-list svg { flex-shrink: 0; color: var(--brand-edge); }
@media (max-width: 1000px) { .trust-list { grid-template-columns: 1fr 1fr; padding: 0; } .trust-list li { padding: 16px 20px; } .trust-list li + li { border-left: 0; } .trust-list li:nth-child(even) { border-left: 1px solid var(--rule); } .trust-list li:nth-child(n+3) { border-top: 1px solid var(--rule); } .trust-list li:last-child { grid-column: 1 / -1; border-left: 0; } }
.bdg { display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; border: 1.5px solid currentColor; border-radius: 5px; font: 650 .74rem/1.2 var(--font); white-space: nowrap; background: #fff; }
.bdg i { width: 7px; height: 7px; border-radius: 1px; background: currentColor; }
.bdg.contact { color: #3d4652; } .bdg.offer { color: #5b3fd6; } .bdg.nego { color: #c2620a; } .bdg.won { color: #9b1fb0; }
.bdg-s { display: inline-block; padding: 4px 8px; border-radius: 5px; font: 650 .74rem/1.15 var(--font); white-space: nowrap; transition: background .35s, color .35s; }
.bdg-s.ok, .bdg-s.paid { background: var(--ok-tint); color: var(--ok); }
.bdg-s.pending { background: #fdf3c4; color: #8a6a00; }
.bdg-s.accrued, .bdg-s.due { background: var(--brand-tint); color: var(--brand-text); }
.bars4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; flex: 1; }
.bars4 i { height: 4px; border-radius: 2px; background: #e3e7ec; transition: background .4s; }
.sg-1 .bars4 i:nth-child(-n+1), .sg-2 .bars4 i:nth-child(-n+2), .sg-3 .bars4 i:nth-child(-n+3), .sg-4 .bars4 i { background: var(--brand); }
.flow { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 28px; align-items: stretch; }
.flow .flow-stage { grid-column: 2; grid-row: 1 / span 2; }
.flow .scene { align-content: center; }
.flow-tabs { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; align-content: start; }
.flow-tabs button { display: flex; flex-direction: column; justify-content: flex-start; width: 100%; height: 100%; padding: 12px 16px 13px; border: 1px solid var(--rule); border-radius: 12px; background: #fff; text-align: left; font: inherit; color: inherit; cursor: pointer; transition: border-color .25s, box-shadow .25s; }
.flow-tabs button:hover { border-color: #b9bec4; }
.flow-tabs li.on button { border-color: var(--brand-edge); box-shadow: 0 0 0 3px var(--brand-tint); }
.flow-tabs .bar { display: block; height: 3px; margin-bottom: 10px; border-radius: 2px; background: #edf0f3; overflow: hidden; }
.flow-tabs .bar i { display: block; width: 0; height: 100%; background: var(--brand); }
.flow-tabs li.done .bar i { width: 100%; background: #d0d5db; }
.flow-tabs li.on .bar i { width: 100%; }
.flow.auto .flow-tabs li.on .bar i { width: 0; animation: fill var(--dur, 5s) linear forwards; }
@keyframes fill { to { width: 100%; } }
.flow-tabs small { display: flex; align-items: center; gap: 8px; font-size: .82rem; font-weight: 650; color: var(--brand-text); }
.flow-tabs .n { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--brand-tint); color: var(--brand-text); font-size: .76rem; }
.flow-tabs li.on .n { background: var(--brand); color: var(--ink); }
.flow-tabs b { display: block; margin: 6px 0 2px; font-size: 1.02rem; font-weight: 650; line-height: 1.25; letter-spacing: -0.01em; }
.flow-tabs .tl { display: block; font-size: .88rem; line-height: 1.45; color: var(--muted); max-height: 0; overflow: hidden; opacity: 0; transition: max-height .35s var(--ease), opacity .3s; }
.flow-tabs li.on .tl { max-height: 5em; opacity: 1; }
.flow-cap { display: none; }
.flow-stage { position: relative; display: grid; border-radius: 16px; border: 1px solid var(--rule); overflow: hidden; background: #f4f7fb url("img/akcent/sync.jpg") center / cover no-repeat; }
.flow-stage::before { content: ""; position: absolute; inset: 0; background: rgba(246, 249, 255, .5); pointer-events: none; }
.scene { position: relative; }
.scene { grid-area: 1 / 1; min-width: 0; display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 22px; align-items: start; align-content: start; padding: 24px 24px; opacity: 0; visibility: hidden; transition: opacity .15s, visibility 0s .15s; }
.scene.on { opacity: 1; visibility: visible; transition: opacity .35s .15s; }
.scene.snap * { transition: none !important; animation: none !important; }
.pane { position: relative; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-content: start; }
.pane-h { justify-self: start; display: flex; align-items: center; gap: 10px; padding: 8px 14px 8px 8px; border-radius: 10px;
  background: rgba(255, 255, 255, .94); border: 1px solid rgba(24, 27, 31, .08); box-shadow: 0 8px 20px -14px rgba(20, 30, 50, .45); }
.pane-h img { border-radius: 6px; }
.pane-h small { display: block; font-size: .72rem; font-weight: 650; color: var(--muted); }
.pane-h b { font-size: .95rem; }
.pane-h span { display: block; font-size: .76rem; color: var(--muted); }
.pane.act .pane-h small { color: var(--brand-text); }
.pane.act .pane-h small::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--brand); vertical-align: 1px; }
.scene .ui-card { padding: 18px 20px; font-size: .9rem; }
.scene h4 { margin: 0 0 12px; font-size: 1rem; font-weight: 650; }
.scene code { display: block; font: 500 .72rem/1.3 ui-monospace, Menlo, monospace; color: var(--muted); }
.toast { position: absolute; z-index: 3; left: 12px; right: 12px; top: 58px; display: flex; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 12px;
  background: rgba(255, 255, 255, .98); border: 1px solid rgba(24, 27, 31, .08); box-shadow: 0 18px 40px -12px rgba(20, 30, 50, .35);
  opacity: 0; transform: translateY(-14px) scale(.98); transition: opacity .35s, transform .5s var(--ease); }
.toast svg { flex-shrink: 0; color: var(--won); }
.toast b { display: block; font-size: .86rem; }
.toast small { display: block; font-size: .76rem; color: var(--muted); }
.scene.sent .toast, .scene.notif .toast, .scene.ptoast .toast { opacity: 1; transform: none; }
.toast.notif svg { color: var(--brand-edge); }
.fcard label { display: block; margin-bottom: 10px; font-size: .76rem; font-weight: 500; color: #2b2f34; }
.f-inp { display: flex; align-items: center; height: 36px; margin-top: 5px; padding: 0 11px; border: 1px solid #c9ced5; border-radius: 6px; background: #fff; font-size: .88rem; transition: border-color .2s, box-shadow .2s; }
.f-inp q { quotes: none; color: var(--ink); white-space: nowrap; overflow: hidden; }
.f-inp.typing { border-color: var(--brand-edge); box-shadow: 0 0 0 3px var(--brand-tint); }
.f-inp.typing q::after { content: ""; display: inline-block; width: 1px; height: 15px; margin-left: 1px; background: var(--ink); vertical-align: -2px; animation: caret 1s steps(1) infinite; }
@keyframes caret { 50% { opacity: 0; } }
.pv-box { display: flex; justify-content: space-between; align-items: baseline; margin: 6px 0 14px; padding: 10px 12px; border-radius: 8px; background: #eef3f9; }
.pv-box small { color: var(--ok); font-weight: 650; font-size: .78rem; }
.pv-box strong { color: var(--ok); font-size: 1.15rem; opacity: 0; transition: opacity .4s; }
.scene.pv .pv-box strong { opacity: 1; }
.f-submit { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 6px; background: var(--brand); border: 1px solid var(--brand-edge); font-weight: 650; font-size: .88rem; transition: transform .15s, background .15s; }
.scene.press .f-submit { transform: scale(.95); background: var(--brand-edge); }
.ln-tr, .pay-tr { display: grid; grid-template-columns: 1.5fr .9fr 1.1fr; gap: 10px; align-items: center; padding: 10px 6px; border-top: 1px solid #edf0f3; }
.ln-tr.th { padding-block: 6px; border-top: 0; border-radius: 6px; background: #f6f9ff; font-size: .72rem; font-weight: 650; color: var(--muted); }
.ln-tr b, .pay-tr b { display: block; font-size: .86rem; font-weight: 600; line-height: 1.25; }
.ln-tr small { display: block; font-size: .74rem; color: var(--muted); }
.ln-tr > span:nth-child(2), .pay-tr > span:nth-child(2) { white-space: nowrap; }
.ln-tr.new { max-height: 0; padding-block: 0; opacity: 0; overflow: hidden; border-top-width: 0; border-radius: 8px; background: #fff8ef;
  transition: max-height .55s var(--ease), padding .55s var(--ease), opacity .4s; }
.scene.sent .ln-tr.new { max-height: 70px; padding-block: 10px; opacity: 1; border-top-width: 1px; }
.lcard { display: grid; gap: 10px; }
.lc-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.lc-top b { display: block; font-size: .98rem; }
.lc-bot b { color: #1d7a46; }
.lc-stage { display: flex; align-items: center; gap: 10px; }
.lc-stage small { color: var(--muted); font-size: .76rem; white-space: nowrap; }
.toast.notif, .toast.low { top: auto; bottom: -76px; }
.dt-head b { display: block; font-size: 1rem; }
.dt-head small { color: var(--muted); font-size: .8rem; }
.dt-check { display: flex; align-items: center; gap: 8px; margin: 14px 0; padding: 10px 12px; border-radius: 8px; background: #f3f5f8; transition: background .3s; }
.spin { width: 14px; height: 14px; border: 2px solid #cfd5dc; border-top-color: var(--brand-edge); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.t-ok { display: none; align-items: center; gap: 6px; color: var(--ok); font-weight: 650; }
.scene.chk .spin, .scene.chk .t-wait { display: none; }
.scene.chk .t-ok { display: inline-flex; }
.scene.chk .dt-check { background: var(--ok-tint); }
.dt-actions { display: flex; justify-content: flex-end; gap: 8px; }
.dt-actions > span { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 6px; font-weight: 650; border: 1px solid var(--rule); transition: transform .15s, background .15s; }
.dt-actions .b-ok { background: var(--brand); border-color: var(--brand-edge); }
.scene.click .b-ok, .scene.click .pay-btn { transform: scale(.94); background: var(--brand-edge); }
.scene.ok .dt-actions { display: none; }
.dt-done { display: none; justify-content: flex-end; }
.scene.ok .dt-done { display: flex; animation: rise .4s var(--ease); }
@keyframes rise { from { opacity: 0; transform: translateY(6px); } }
.cur { position: absolute; z-index: 4; right: 6px; bottom: -10px; width: 22px; height: 22px; opacity: 0; transform: translate(60px, 50px); pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l16 9-7 1.7-3.6 6.8z' fill='%23181b1f' stroke='white' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat;
  transition: transform .8s var(--ease), opacity .3s; }
.scene.cur-on .cur { opacity: 1; transform: none; }
.pipe-cols { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; height: 150px; }
.pipe-col { padding: 8px; border-radius: 8px; background: #f6f9ff; border: 1px dashed #d0d5db; }
.pipe-col small { display: block; font-size: .72rem; font-weight: 650; color: var(--muted); overflow-wrap: anywhere; hyphens: auto; }
.token { position: absolute; top: 40px; left: 3px; width: calc(25% - 12px); min-width: 0; overflow: hidden; display: grid; gap: 2px; padding: 8px 8px; border-radius: 8px; background: #fff; border: 1px solid var(--brand-edge);
  box-shadow: 0 10px 22px -12px rgba(30, 40, 60, .4); transition: left .8s var(--ease); }
.token b { font-size: .76rem; line-height: 1.2; overflow-wrap: anywhere; }
.token small { font-size: .7rem; color: #1d7a46; font-weight: 600; overflow-wrap: anywhere; }
.sg-2 .token { left: calc(25% + 5px); } .sg-3 .token { left: calc(50% + 7px); } .sg-4 .token { left: calc(75% + 9px); }
.hub { display: flex; align-items: center; gap: 8px; margin-top: 14px; font-weight: 500; color: #3b4047; opacity: 0; transition: opacity .4s; }
.hub svg { color: var(--brand-edge); }
.scene.hubon .hub { opacity: 1; }
.c-row, .c-sum { display: flex; justify-content: space-between; padding: 9px 0; border-top: 1px solid #edf0f3; opacity: 0; transform: translateY(6px); transition: opacity .35s, transform .45s var(--ease); }
.c-row span { color: var(--muted); }
.scene.r1 .r1, .scene.r2 .r2, .scene.r3 .r3, .scene.sum .c-sum { opacity: 1; transform: none; }
.c-sum { border-top: 2px solid var(--ink); font-weight: 650; }
.c-sum b { font-size: 1.35rem; color: var(--brand-text); letter-spacing: -0.02em; }
.calc5 > .bdg-s { margin-top: 10px; opacity: 0; transition: opacity .35s; }
.scene.acc .calc5 > .bdg-s { opacity: 1; }
.mycomm { display: grid; gap: 6px; justify-items: start; }
.mycomm small { color: var(--muted); }
.mycomm strong { font-size: 2rem; font-weight: 650; letter-spacing: -0.03em; color: var(--brand-text); line-height: 1.1; }
.mycomm .bdg-s { opacity: 0; transition: opacity .35s; }
.scene.acc .mycomm .bdg-s { opacity: 1; }
.lc-sub { color: var(--muted); font-size: .82rem; }
.pay-tr { grid-template-columns: 1.3fr .9fr 1.3fr; }
.pay-tr > span:last-child { display: flex; justify-content: flex-end; }
.pay-tr.me { border-radius: 8px; background: #fff8ef; }
.pay-btn { position: relative; padding: 6px 14px; border-radius: 6px; background: var(--brand); border: 1px solid var(--brand-edge); font-weight: 650; font-size: .82rem; transition: transform .15s, background .15s; }
.pay-tr.me .bdg-s { display: none; }
.scene.paid .pay-tr.me .bdg-s { display: inline-block; animation: rise .4s var(--ease); }
.scene.paid .pay-btn { display: none; }
.wallet { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.wallet > div { padding: 12px; border-radius: 8px; background: #f6f9ff; }
.wallet small { display: block; color: var(--muted); font-size: .78rem; }
.wallet strong { display: block; margin-top: 4px; font-size: 1.45rem; font-weight: 650; letter-spacing: -0.02em; color: #1d7a46; }
.wallet strong.w2 { color: var(--brand-text); }
@media (max-width: 1100px) {
  .flow { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .flow .flow-stage { grid-column: 1; grid-row: auto; }
  .flow .scene { align-content: start; }
  .flow-tabs .tl, .flow-tabs li.on .tl { max-height: none; opacity: 1; }
  .flow-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; margin-inline: -24px; padding-inline: 24px; scrollbar-width: none; }
  .flow-tabs li { flex: 0 0 230px; scroll-snap-align: start; }
}
@media (max-width: 760px) {
  .scene { grid-template-columns: minmax(0, 1fr); padding: 20px 14px; gap: 22px; }
  .pane-h span { display: none; }
  .scene .toast { left: 10px; right: 10px; top: auto; bottom: 10px; }
  .scene .toast.notif, .scene .toast.low { top: calc(100% + 10px); bottom: auto; }
  .scene .pane { grid-area: 1 / 1; transition: opacity .3s .1s, visibility 0s; }
  .scene.v-p .pane.f, .scene.v-f .pane.p { opacity: 0; visibility: hidden; transition: opacity .2s, visibility 0s .2s; }
  .flow-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; overflow: visible; margin: 0; padding: 0; }
  .flow-tabs li { flex: none; }
  .flow-tabs button { align-items: center; padding: 10px 4px 9px; border-radius: 10px; }
  .flow-tabs .bar { align-self: stretch; margin: 0 4px 9px; }
  .flow-tabs small { font-size: 0; gap: 0; }
  .flow-tabs .n { width: 28px; height: 28px; font-size: .84rem; }
  .flow-tabs b, .flow-tabs .tl, .flow-tabs li.on .tl { display: none; }
  .flow-cap { display: block; min-height: 106px; }
  .flow-cap small { display: block; font-size: .82rem; font-weight: 650; color: var(--brand-text); }
  .flow-cap b { display: block; margin-top: 4px; font-size: 1.1rem; font-weight: 650; line-height: 1.3; letter-spacing: -0.01em; }
  .flow-cap span { display: block; margin-top: 3px; font-size: .92rem; line-height: 1.45; color: var(--muted); }
}
@media (max-width: 520px) {
  .pipe-cols { grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(4, 56px); gap: 6px; height: auto; }
  .pipe-col { padding: 6px 10px; }
  .pipe-col small { font-size: .68rem; }
  .token { top: 25px; left: 8px; width: auto; max-width: calc(100% - 16px); height: 26px; display: flex; align-items: center; gap: 10px; padding: 0 9px; border-radius: 6px; transition: top .8s var(--ease); }
  .token b { font-size: .72rem; white-space: nowrap; } .token small { font-size: .7rem; white-space: nowrap; }
  .sg-2 .token { left: 8px; top: 87px; } .sg-3 .token { left: 8px; top: 149px; } .sg-4 .token { left: 8px; top: 211px; }
}
body.home section.dark3 { position: relative; overflow: hidden; background-color: var(--night); color: #fff; }
.dark3 .accent { height: 640px; opacity: .85;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .5) 45%, transparent 92%), linear-gradient(90deg, transparent 18%, #000 75%);
  -webkit-mask-composite: source-in; mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .5) 45%, transparent 92%), linear-gradient(90deg, transparent 18%, #000 75%); mask-composite: intersect; }
.dark3 .wrap { position: relative; z-index: 1; }
.dark3 .h2x { color: #fff; margin-bottom: 0; }
.dark3 .tone { color: var(--night-tone); }
.stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--rule); }
.stats li { display: flex; flex-direction: column; padding: 28px 24px 4px 0; }
.stats li + li { padding-left: 24px; border-left: 1px solid var(--rule); }
.stats b { font-size: clamp(2.6rem, 4.4vw, 3.8rem); font-weight: 560; letter-spacing: -0.045em; line-height: 1; color: var(--brand-text); }
.stats .st-h { margin-top: 12px; font-size: 1.08rem; font-weight: 650; line-height: 1.3; }
.stats .st-p { margin-top: 8px; font-size: .95rem; line-height: 1.5; color: var(--muted); }
.stats small { margin-top: auto; padding-top: 16px; font-size: .78rem; color: #7a7f85; }
@media (max-width: 760px) { .stats { grid-template-columns: 1fr; } .stats li, .stats li + li { padding: 24px 0 4px; border-left: 0; } .stats li + li { border-top: 1px solid var(--rule); } }
.feats { display: grid; gap: 128px; }
.feat { display: grid; grid-template-columns: 1fr 1.15fr; gap: 80px; align-items: center; }
.feat.flip .feat-copy { order: 2; }
.eyebrow { margin-bottom: 14px; font-size: .95rem; font-weight: 600; color: var(--brand-text); }
.soon-tag { display: inline-block; margin-left: 8px; padding: 2px 9px; border-radius: 999px; background: var(--brand-tint); color: var(--brand-text); font-size: .75rem; font-weight: 600; vertical-align: 2px; }
.feat h3 { margin-bottom: 16px; font-size: clamp(1.6rem, 2.6vw, 2.2rem); font-weight: 560; letter-spacing: -0.032em; line-height: 1.14; }
.feat-p { max-width: 34em; margin-bottom: 26px; font-size: 1.1rem; color: #3b4047; }
.ticks { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.ticks li { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--rule); font-size: 1rem; }
.ticks svg { flex-shrink: 0; color: var(--brand-edge); }
.feat-visual { padding: 56px 48px; border-radius: 16px; border: 1px solid var(--rule); background: #f6f9ff center / cover no-repeat; }
@media (max-width: 900px) { .feat { grid-template-columns: minmax(0, 1fr); gap: 32px; } .feat.flip .feat-copy { order: 0; } .feats { gap: 80px; } .feat-visual { padding: 32px 20px; } }
.ui-card { padding: 22px; border-radius: 12px; background: #fff; border: 1px solid rgba(24, 27, 31, .08); box-shadow: var(--ui-shadow); font-size: .95rem; }
.ui-card small { display: block; color: var(--muted); font-size: .8rem; }
.crm-flow { display: grid; grid-template-columns: 1fr 56px 1fr; align-items: center; }
.crm-card { display: grid; gap: 4px; padding: 20px; }
.crm-card img { margin-bottom: 8px; border-radius: 7px; }
.crm-ico { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-bottom: 8px; border-radius: 7px; background: #eef3f9; color: #3b4047; }
.chat2-head .crm-ico { margin: 0; width: 26px; height: 26px; }
.crm-card b { font-size: 1.05rem; }
.crm-card > span { font-weight: 600; color: var(--brand-text); }
.crm-link i { display: block; height: 2px; background: repeating-linear-gradient(to right, var(--brand-edge) 0 5px, transparent 5px 10px); }
.chat2 { display: grid; gap: 14px; max-width: 460px; margin: 0 auto; }
.chat2-head { display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid var(--rule); font-weight: 650; }
.chat2-head img { border-radius: 6px; }
.chat2 .mcp { margin-left: auto; padding: 3px 10px; border: 1px solid var(--rule); border-radius: 999px; font-size: .78rem; font-weight: 600; color: var(--muted); }
.chat2 p { max-width: 88%; padding: 12px 15px; border-radius: 14px; font-size: 1rem; }
.chat2 .q { justify-self: end; background: #f3f5f8; border-bottom-right-radius: 4px; }
.chat2 .a { background: var(--brand-tint); color: var(--brand-deep); border-bottom-left-radius: 4px; }
.queue-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin-bottom: 16px; }
.queue-head small { color: var(--muted); }
.queue-select { width: 100%; margin-bottom: 16px; padding: 11px 14px; font: 500 1rem var(--font); color: var(--ink); background: #fff; border: 1px solid #b9bec4; border-radius: 8px; }
.queue-rows { list-style: none; margin: 0; padding: 0; }
.queue-rows li { display: grid; grid-template-columns: 1fr auto 110px; gap: 14px; align-items: center; padding: 11px 4px; border-top: 1px solid #edf0f3; transition: opacity .3s; }
.queue-rows .share { color: var(--muted); font-weight: 600; }
.queue-rows b { text-align: right; }
.queue-rows li.zero { opacity: .45; }
.queue-rows li:first-child b { color: var(--brand-text); }
@media (max-width: 520px) { .queue-rows li { grid-template-columns: 1fr auto 76px; gap: 10px; } .crm-flow { grid-template-columns: 1fr; gap: 0; } .crm-link { height: 36px; display: grid; place-items: center; } .crm-link i { width: 2px; height: 100%; background: repeating-linear-gradient(to bottom, var(--brand-edge) 0 5px, transparent 5px 10px); } }
.pcards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.pcard { display: flex; flex-direction: column; gap: 8px; padding: 28px 24px; border: 1px solid var(--rule); border-radius: 12px; background: #fff; }
.pcard.best { border-color: var(--brand-edge); }
.pcard h3 { font-size: 1.25rem; font-weight: 600; }
.pcard .size { color: var(--muted); font-size: 1rem; }
.pcard .price { margin: 8px 0 6px; font-size: 1.6rem; font-weight: 600; letter-spacing: -0.02em; }
.pcard.best .price { color: var(--brand-text); }
.pcard.soon .price { color: var(--muted); font-size: 1.3rem; }
.pcard ul { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; color: #2b2f34; }
.pcard li { display: flex; gap: 8px; align-items: flex-start; }
.pcard li svg { flex-shrink: 0; margin-top: 4px; color: var(--brand-edge); }
.pcard li.papps { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 2px 0 4px; }
.pcard .papp { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: #fff; border: 1px solid var(--rule); box-shadow: 0 10px 22px -16px rgba(30, 40, 60, .35); }
.pcard .papp img { width: 25px; height: 25px; object-fit: contain; display: block; }
.pcard li.papps .papp svg { margin-top: 0; width: 21px; height: 21px; color: var(--muted); }
.pcard .papp.txt { font-size: .7rem; font-weight: 700; color: var(--muted); letter-spacing: .02em; }
.pcard .btn { margin-top: auto; text-align: center; }
@media (max-width: 1000px) { .pcards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .pcards { grid-template-columns: 1fr; } }
.cta3 { position: relative; overflow: hidden; padding-block: 136px; background: var(--night); color: #fff; }
.cta3::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(12, 15, 19, .94) 0%, rgba(12, 15, 19, .72) 38%, rgba(12, 15, 19, 0) 72%); }
.cta3-in { position: relative; z-index: 2; }
.cta3 h2 { max-width: 13em; margin-bottom: 40px; font-size: clamp(2.1rem, 4.2vw, 3.4rem); font-weight: 560; letter-spacing: -0.04em; line-height: 1.06; }
.cta3-p { margin-bottom: 40px; font-size: 1.3rem; color: var(--night-tone); }
body.home .site-footer { border-top: 1px solid var(--night-rule); }
@media (max-width: 960px) { .cta3::before { background: rgba(12, 15, 19, .72); } }
@media (prefers-reduced-motion: reduce) {
  .stage *, .stage { transition: none !important; animation: none !important; }
}
@media (min-width: 1101px) {
  .story-sec .h2x { font-size: clamp(1.7rem, 2.6vw, 2.3rem); margin-bottom: 26px; }
  .scene { padding: 20px 22px; gap: 18px; }
  .pane { gap: 10px; }
  .pane-h { padding: 6px 12px 6px 6px; }
  .pane-h b { font-size: .88rem; }
  .pane-h span { display: inline; margin-left: 6px; }
  .scene .ui-card { padding: 14px 16px; }
  .scene h4 { margin-bottom: 8px; font-size: .95rem; }
  .fcard label { margin-bottom: 7px; font-size: .74rem; }
  .f-inp { height: 31px; margin-top: 4px; font-size: .84rem; }
  .pv-box { margin: 4px 0 10px; padding: 8px 10px; }
  .f-submit { padding: 7px 14px; font-size: .84rem; }
  .toast { top: 44px; }
}
@media (max-width: 760px) {
  body.home section { padding-block: 72px; }
  body.home section.story-sec { padding-block: 56px; }
  .h2x { margin-bottom: 36px; }
  .feats { gap: 64px; }
  .flow-tabs li { flex-basis: 248px; }
  .flow-tabs button { padding: 11px 14px 12px; }
  .scene { padding: 16px 12px; gap: 14px; }
  .pane { gap: 10px; }
  .pane-h { padding: 6px 12px 6px 6px; }
  .pane-h b { font-size: .88rem; }
  .scene .ui-card { padding: 14px 14px; }
  .scene h4 { margin-bottom: 8px; font-size: .95rem; }
  .fcard label { margin-bottom: 7px; font-size: .74rem; }
  .f-inp { height: 31px; margin-top: 4px; font-size: .84rem; }
  .pv-box { margin: 4px 0 10px; padding: 8px 10px; }
  .f-submit { padding: 7px 14px; font-size: .84rem; }
  .ln-tr, .pay-tr { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; padding: 8px 4px; }
  .ln-tr b, .pay-tr b { font-size: .82rem; }
  .scene[data-s="1"] .ln-tr:nth-child(n+5) { display: none; }
  .site-footer a, .site-footer button { display: inline-block; padding-block: 8px; }
}
@media (max-width: 760px) {
  body.home section { padding-block: 56px; }
  .h2x { font-size: 1.62rem; margin-bottom: 24px; }
  .stats li, .stats li + li { display: grid; grid-template-columns: 104px minmax(0, 1fr); column-gap: 14px; padding: 16px 0; }
  .stats b { grid-row: 1 / span 3; font-size: 1.8rem; }
  .stats .st-h { margin-top: 0; font-size: .98rem; }
  .stats .st-p { margin-top: 3px; font-size: .86rem; line-height: 1.45; }
  .stats small { padding-top: 6px; font-size: .7rem; }
  .feats { gap: 56px; }
  .feat { gap: 18px; }
  .eyebrow { margin-bottom: 8px; font-size: .85rem; }
  .feat h3 { margin-bottom: 8px; font-size: 1.35rem; }
  .feat-p { margin-bottom: 12px; font-size: .95rem; line-height: 1.5; }
  .ticks li { gap: 10px; padding: 8px 0; font-size: .9rem; }
  .feat-visual { padding: 18px 14px; border-radius: 14px; }
  .feat-visual .ui-card { padding: 14px; font-size: .88rem; }
  .queue-head { margin-bottom: 10px; }
  .queue-select { margin-bottom: 8px; padding: 8px 10px; font-size: .9rem; }
  .queue-rows li { grid-template-columns: 1fr auto 72px; gap: 10px; padding: 7px 2px; font-size: .86rem; }
  .crm-flow { grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr); gap: 0; }
  .crm-card { gap: 2px; padding: 12px; }
  .crm-card img, .crm-card .crm-ico { margin-bottom: 4px; }
  .crm-card small { font-size: .7rem; line-height: 1.3; }
  .crm-card b { font-size: .88rem; line-height: 1.25; }
  .crm-card > span { font-size: .8rem; }
  .crm-link { display: block; height: auto; }
  .crm-link i { width: 100%; height: 2px; background: repeating-linear-gradient(to right, var(--brand-edge) 0 5px, transparent 5px 10px); }
  .chat2 { gap: 10px; }
  .chat2-head { padding-bottom: 10px; }
  .chat2 p { padding: 9px 12px; font-size: .88rem; }
  .pcards { grid-template-columns: 1fr 1fr; gap: 10px; }
  .pcard { gap: 4px; padding: 14px 12px; border-radius: 10px; }
  .pcard h3 { font-size: 1rem; }
  .pcard .size { font-size: .78rem; line-height: 1.3; }
  .pcard .price { margin: 4px 0 2px; font-size: 1.05rem; }
  .pcard.soon .price { font-size: .95rem; }
  .pcard ul { gap: 4px; margin-bottom: 10px; font-size: .78rem; line-height: 1.35; }
  .pcard li { gap: 6px; }
  .pcard li svg { width: 13px; height: 13px; margin-top: 2px; }
  .pcard .papp { width: 30px; height: 30px; border-radius: 8px; } .pcard .papp img { width: 19px; height: 19px; } .pcard li.papps .papp svg { width: 16px; height: 16px; } .pcard .papp.txt { font-size: .58rem; }
  .pcard li.papps { max-width: 102px; margin-left: auto; margin-right: auto; }
  .pcard .btn { padding: 9px 6px; font-size: .78rem; line-height: 1.2; }
}
@media (max-width: 360px) { .crm-card { padding: 10px; } .crm-card b { font-size: .8rem; overflow-wrap: anywhere; } }
:root { --partner: #8c96a3; --partner-dark: #4f5864; --partner-tint: #eef1f4; }
.ag4 { position: relative; aspect-ratio: 1360 / 700; container-type: inline-size; }
.ring4 { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ring4 .rail { fill: none; stroke: var(--brand); stroke-width: 5; }
.ring4 .inner { fill: none; stroke: #d5dae0; stroke-width: 2; stroke-dasharray: 4 8; }
.ring4 .chev, .ring4 .la, .ring4 .lp { fill: none; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.ring4 .chev, .ring4 .lp { stroke: var(--brand); } .ring4 .la { stroke: var(--partner); }
.ag4-apps, .ag4-steps { list-style: none; margin: 0; padding: 0; }
.ag4 .app4, .ag4 .orb4, .ag4 .nb4, .ag4 .lb4, .ag4 .who4 { position: absolute; left: var(--x); top: var(--y); }
.ag4 .app4 { width: 4.3cqw; height: 4.3cqw; transform: translate(-50%, -50%); display: grid; place-items: center; border-radius: 1cqw; background: #fff; border: 1px solid var(--rule); box-shadow: 0 1cqw 2.2cqw -1.3cqw rgba(30, 40, 60, .35); }
.ag4 .app4 img { width: 2.35cqw; height: 2.35cqw; }
.ag4 .app4 svg { width: 2.1cqw; height: 2.1cqw; color: #3d4651; }
.ag4 .app4 .txt { font-size: 1.1cqw; font-weight: 700; color: #3d4651; }
.ag4 .orb4 { width: 15.6cqw; height: 15.6cqw; transform: translate(-50%, -50%); display: grid; place-items: center; text-align: center; border-radius: 50%; background: var(--brand); border: 1px solid var(--brand-edge);
  box-shadow: 0 0 0 1cqw rgba(218, 147, 72, .14), 0 3cqw 5cqw -1.8cqw rgba(142, 83, 3, .55); }
.ag4 .orb4 svg { display: block; width: 4.7cqw; height: 4.7cqw; margin: 0 auto .4cqw; color: var(--ink); stroke-width: 1.7; }
.ag4 .orb4 b { display: block; font-size: 2.4cqw; font-weight: 600; letter-spacing: -0.025em; line-height: 1.1; }
.ag4 .nb4 { width: 5cqw; height: 5cqw; transform: translate(-50%, -50%); display: grid; place-items: center; border-radius: 50%; background: #fff; border: .3cqw solid var(--brand); font-size: 2.2cqw; font-weight: 700; color: var(--brand-text); }
.ag4 .nb4 svg { width: 2.5cqw; height: 2.5cqw; stroke-width: 2.1; }
.ag4 .lb4 { font-size: 2.35cqw; font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; white-space: nowrap; }
.ag4 .lb4.ul { transform: translate(-100%, -100%); } .ag4 .lb4.tc { transform: translate(-50%, -100%); } .ag4 .lb4.ur { transform: translate(0, -100%); } .ag4 .lb4.ll { transform: translate(-100%, 0); }
.ag4 .who4 { display: flex; flex-direction: column; align-items: center; transform: translate(-50%, -5.37cqw); }
.ag4 .av4 { width: 10.7cqw; height: 10.7cqw; display: grid; place-items: center; border-radius: 50%; }
.ag4 .av4 svg { width: 4cqw; height: 4cqw; }
.ag4 .who4 b { margin-top: 1.2cqw; font-size: 2.35cqw; font-weight: 560; letter-spacing: -0.02em; }
.ag4 .who4.p .av4 { background: var(--partner-tint); color: var(--partner-dark); box-shadow: 0 0 0 .3cqw #fff, 0 0 0 .55cqw var(--partner); }
.ag4 .who4.f .av4 { background: var(--brand-tint); color: var(--brand-text); box-shadow: 0 0 0 .3cqw #fff, 0 0 0 .55cqw var(--brand); }
.ag4 .who4.p b { color: var(--partner-dark); } .ag4 .who4.f b { color: var(--brand-text); }
.ag4-note { margin-top: 20px; max-width: 62em; font-size: .8rem; line-height: 1.5; color: var(--muted); }
body.home section.hero4 { position: relative; padding: 72px 0 36px; border-bottom: 1px solid var(--rule); background: radial-gradient(1100px 520px at 50% 78%, #fff7ee 0%, rgba(255, 247, 238, 0) 70%); }
.hero4-top { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: end; gap: 20px 56px; }
.hero4 .lead3 { max-width: 30em; margin: 0; font-size: clamp(1.02rem, 1.25vw, 1.15rem); }
.hero4 .actions { margin-top: 22px; gap: 12px; }
.hero4 .btn { padding: 14px 24px; font-size: 1rem; }
.hero4 .ag4 { width: min(100%, max(680px, calc((100vh - 300px) * 1.943))); width: min(100%, max(680px, calc((100svh - 300px) * 1.943))); margin: 44px auto 0; }
.hero4 .ag4-note { margin: 6px auto 0; text-align: center; }
.ag4 .av4 { overflow: hidden; }
.ag4 .av4 img { width: 100%; height: 100%; object-fit: cover; }
.ag4 .who4 { width: 24cqw; }
.ag4 .who4 b { font-size: 2.6cqw; }
.ag4 .who4 small { margin-top: .2cqw; font-size: 1.35cqw; font-weight: 500; color: var(--muted); }
.ag4 .who4.p .av4 { box-shadow: 0 0 0 .35cqw #fff, 0 0 0 .7cqw var(--partner), 0 2cqw 3.4cqw -1.6cqw rgba(30, 40, 60, .5); }
.ag4 .who4.f .av4 { box-shadow: 0 0 0 .35cqw #fff, 0 0 0 .7cqw var(--brand), 0 2cqw 3.4cqw -1.6cqw rgba(142, 83, 3, .55); }
.ag4 .bub4 { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -100%); width: 21cqw; margin: 0; padding: .9cqw 1.2cqw 1cqw; border-radius: 1.2cqw; font-size: 1.32cqw; line-height: 1.35; box-shadow: 0 1.4cqw 2.6cqw -1.6cqw rgba(30, 40, 60, .4); }
.ag4 .bub4::after { content: ""; position: absolute; left: 50%; bottom: -.6cqw; width: 1.2cqw; height: 1.2cqw; margin-left: -.6cqw; transform: rotate(45deg); background: inherit; border: inherit; border-top: 0; border-left: 0; }
.ag4 .bub4 small { display: flex; align-items: center; gap: .5cqw; margin-bottom: .3cqw; font-size: 1.05cqw; font-weight: 600; color: var(--muted); }
.ag4 .bub4 small img { width: 1.25cqw; height: 1.25cqw; }
.ag4 .bub4 span { display: block; font-weight: 500; color: var(--ink); }
.ag4 .bub4.p { background: #fff; border: 1px solid #d4d9df; }
.ag4 .bub4.f { background: #fff7ee; border: 1px solid #f1d2ad; }
.ag4 .orb4 .soon4 { display: inline-block; margin-top: .5cqw; padding: .15cqw .8cqw; border-radius: 999px; background: rgba(255, 255, 255, .55); font-size: 1.05cqw; font-style: normal; font-weight: 600; color: var(--brand-deep); }
@media (max-width: 960px) {
  .hero4-top { grid-template-columns: minmax(0, 1fr); }
  .hero4 .ag4 { width: 100%; }
}
@media (max-width: 760px) {
  body.home section.hero4 { padding: 52px 0 32px; }
}
.fx4 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.fx { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--rule); border-radius: 16px; background: #fff; }
.fx-vis { display: grid; place-items: center; min-height: 250px; padding: 28px; border-bottom: 1px solid var(--rule); background: #f6f9ff center / cover no-repeat; }
.fx-vis > * { width: min(100%, 420px); }
@media (min-width: 901px) { .fx-vis { height: 310px; min-height: 0; } }
.fx-vis > .lgx { width: min(100%, 360px); }
.fx-copy { display: flex; flex-direction: column; padding: 26px 28px 22px; }
.fx h3 { margin-bottom: 10px; font-size: clamp(1.3rem, 1.9vw, 1.6rem); font-weight: 560; letter-spacing: -0.03em; line-height: 1.18; }
.fx-p { margin-bottom: 16px; font-size: 1rem; line-height: 1.55; color: var(--muted); }
.fx .ticks li { padding: 9px 0; font-size: .95rem; }
.fx .ticks li:last-child { border-bottom: 0; }
.chx { list-style: none; margin: 0; padding: 14px; display: grid; gap: 8px; }
.chx li { max-width: 86%; padding: 8px 11px 9px; border-radius: 10px; font-size: .86rem; line-height: 1.35; }
.chx li small { display: flex; align-items: center; gap: 6px; margin-bottom: 2px; font-size: .7rem; font-weight: 600; color: var(--muted); }
.chx li small img, .chx li small svg { width: 14px; height: 14px; }
.chx li.me { justify-self: end; background: #f1f3f6; border-bottom-right-radius: 3px; }
.chx li.ai { justify-self: start; background: var(--brand-tint); border-bottom-left-radius: 3px; }
.chx li.ai small { color: var(--brand-text); }
.plx { padding: 16px; }
.plx h4 { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-size: .95rem; color: var(--brand-text); }
.plx-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px solid var(--rule); border-radius: 10px; }
.plx-row + .plx-row { margin-top: 8px; }
.plx-row b { display: flex; align-items: center; gap: 6px; font-size: .9rem; }
.plx-row small { display: block; font-size: .76rem; color: var(--muted); }
.plx-row.add { border-style: dashed; background: #fafbfc; }
.plx-row.add b { color: var(--brand-text); }
.sw { flex: none; position: relative; width: 38px; height: 22px; border-radius: 999px; background: #d5dae0; }
.sw i { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); }
.sw.on { background: var(--won); } .sw.on i { left: 19px; }
.opx { padding: 16px; display: grid; gap: 10px; }
.opx-lic { display: inline-flex; align-items: center; gap: 7px; justify-self: start; padding: 4px 11px; border-radius: 999px; background: var(--ink); color: #fff; font-size: .8rem; font-weight: 600; }
.opx-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.opx-opts span { display: grid; gap: 2px; padding: 11px 12px; border: 1px solid var(--rule); border-radius: 10px; }
.opx-opts svg { color: var(--brand-edge); margin-bottom: 4px; }
.opx-opts b { font-size: .9rem; } .opx-opts small { font-size: .76rem; color: var(--muted); }
.opx-exp { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 10px; background: #f4f6f8; font-size: .84rem; }
.opx-exp b { margin-left: auto; font-weight: 600; } .opx-exp svg { color: var(--brand-edge); }
.lgx { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.lgx li { display: grid; place-items: center; aspect-ratio: 1; border-radius: 14px; background: #fff; border: 1px solid var(--rule); box-shadow: 0 14px 30px -20px rgba(30, 40, 60, .4); font-size: .7rem; font-weight: 600; }
.lgx img { width: 40%; height: 40%; }
@media (max-width: 900px) { .fx4 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  body.home section { padding-block: 52px; }
  .fx4 { gap: 14px; }
  .fx-vis { min-height: 0; padding: 18px 14px; }
  .fx-copy { padding: 18px 18px 12px; }
  .fx-p { margin-bottom: 10px; font-size: .92rem; }
  .fx .ticks li { padding: 7px 0; font-size: .88rem; }
  .lgx { gap: 8px; }
}
.fl-lbl { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; font-size: .85rem; font-weight: 650; color: var(--muted); }
.fl-lbl.la { color: var(--brand-text); }
.fl-lbl .soon-tag { margin-left: 4px; padding: 1px 8px; font-size: .7rem; vertical-align: 0; }
.flow-agent { position: relative; padding: 18px; border: 1px solid var(--rule); border-radius: 16px; background: linear-gradient(180deg, #fffaf4 0%, #fff 60%); }
.fa-chat { display: none; list-style: none; margin: 0; padding: 0; }
.fa-chat.on { display: grid; gap: 10px; align-content: start; }
.fa-chat li { max-width: 88%; padding: 9px 12px 10px; border-radius: 12px; font-size: .9rem; line-height: 1.4; animation: faIn .4s var(--ease) both; animation-delay: calc(var(--k) * .9s + .3s); }
.fa-chat li small { display: flex; align-items: center; gap: 6px; margin-bottom: 3px; font-size: .72rem; font-weight: 650; color: var(--partner-dark); }
.fa-chat li small img, .fa-chat li small svg { width: 14px; height: 14px; flex: none; }
.fa-chat li.p { justify-self: end; background: var(--partner-tint); border-bottom-right-radius: 4px; }
.fa-chat li.f { justify-self: end; background: var(--brand-tint); border-bottom-right-radius: 4px; }
.fa-chat li.f small { color: var(--brand-text); }
.fa-chat li.ai { justify-self: start; background: #fff; border: 1px solid var(--rule); border-bottom-left-radius: 4px; box-shadow: 0 12px 26px -20px rgba(30, 40, 60, .55); }
.fa-chat li.ai small { color: var(--brand-text); }
@keyframes faIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .fa-chat li { animation: none; } }
@media (min-width: 1101px) {
  .flow { grid-template-columns: minmax(0, 1fr) 330px; grid-template-areas: "tabs tabs" "ls la" "st ag"; gap: 0 20px; align-items: stretch; }
  .flow .flow-tabs { grid-area: tabs; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 22px; }
  .flow .flow-stage { grid-area: st; grid-column: auto; grid-row: auto; }
  .flow .fl-lbl.ls { grid-area: ls; } .flow .fl-lbl.la { grid-area: la; }
  .flow .flow-agent { grid-area: ag; }
  .flow-tabs button { padding: 11px 14px 12px; }
  .flow-tabs b { font-size: .98rem; }
}
@media (max-width: 1100px) {
  .fl-lbl { margin: 6px 0 0; }
  .flow-agent { padding: 14px; }
}
@media (max-width: 760px) {
  .fa-chat li { font-size: .84rem; }
  .flow-cap { min-height: 0; }
}
.sub3 { max-width: 22em; margin-top: 22px; font-size: clamp(1.35rem, 2.3vw, 2.05rem); font-weight: 500; letter-spacing: -0.025em; line-height: 1.2; color: #3b4048; }
.hero3 .sub3 + .actions { margin-top: 36px; }
.ag-h { font-size: clamp(2.2rem, 4.1vw, 3.6rem); font-weight: 560; letter-spacing: -0.045em; line-height: 1.04; text-align: center; }
body.home section.research { padding-top: 8px; }
.pnote { margin-top: 14px; font-size: .9rem; color: var(--muted); }
@media (max-width: 760px) {
  .sub3 { margin-top: 14px; }
  .hero3 .sub3 + .actions { margin-top: 26px; }
  .ag-h { text-align: left; }
}
.stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; border-top: 0; }
.stats li, .stats li + li { position: relative; display: flex; flex-direction: column; overflow: hidden; padding: 30px 26px 22px; border: 1px solid var(--rule); border-radius: 16px; background: #fff; box-shadow: 0 30px 60px -48px rgba(30, 40, 60, .4); }
.stats li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--brand); }
.stats b { font-size: clamp(2.8rem, 4.6vw, 3.9rem); font-weight: 560; letter-spacing: -0.045em; line-height: 1; color: var(--brand-edge); }
.stats .st-h { margin-top: 14px; font-size: 1.1rem; font-weight: 650; line-height: 1.3; color: var(--ink); }
.stats .st-p { margin-top: 10px; font-size: .95rem; line-height: 1.55; color: var(--muted); }
.stats small { margin-top: auto; padding-top: 18px; font-size: .78rem; color: #7a7f85; }
.ring4m { display: none; }
@media (max-width: 900px) { .stats { grid-template-columns: minmax(0, 1fr); gap: 12px; } }
@media (max-width: 760px) {
  .stats li, .stats li + li { display: flex; padding: 22px 18px 16px; border-top: 1px solid var(--rule); }
  .stats b { font-size: 2.6rem; }
  .stats .st-h { margin-top: 10px; font-size: 1rem; }
  .stats .st-p { margin-top: 6px; font-size: .88rem; line-height: 1.5; }
  .stats small { padding-top: 12px; font-size: .72rem; }
  .ag4 { display: block; aspect-ratio: 360 / 470; container-type: inline-size; width: 100%; max-width: 440px; margin-inline: auto; }
  .hero4 .ag4 { margin-top: 24px; }
  .ring4 { display: none; }
  .ring4m { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
  .ring4m .rail { fill: none; stroke: var(--brand); stroke-width: 3; }
  .ring4m .inner { fill: none; stroke: #d5dae0; stroke-width: 1.5; stroke-dasharray: 3 6; }
  .ring4m .chev { fill: none; stroke: var(--brand); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
  .ag4 .app4, .ag4 .orb4, .ag4 .nb4, .ag4 .lb4, .ag4 .who4, .ag4 .bub4 { position: absolute; left: var(--mx); top: var(--my); }
  .ag4 .app4 { width: 7.6cqw; height: 7.6cqw; border-radius: 2cqw; transform: translate(-50%, -50%); box-shadow: 0 2cqw 4cqw -2.6cqw rgba(30, 40, 60, .4); }
  .ag4 .app4 img { width: 4.3cqw; height: 4.3cqw; } .ag4 .app4 svg { width: 4cqw; height: 4cqw; } .ag4 .app4 .txt { font-size: 2.2cqw; }
  .ag4 .orb4 { width: 25.5cqw; height: 25.5cqw; transform: translate(-50%, -50%); box-shadow: 0 0 0 2.2cqw rgba(218, 147, 72, .14), 0 5cqw 8cqw -3cqw rgba(142, 83, 3, .5); }
  .ag4 .orb4 svg { width: 7.6cqw; height: 7.6cqw; margin-bottom: .6cqw; } .ag4 .orb4 b { font-size: 4.4cqw; }
  .ag4 .orb4 .soon4 { margin-top: .8cqw; padding: .3cqw 1.8cqw; font-size: 2.6cqw; }
  .ag4 .nb4 { width: 7.8cqw; height: 7.8cqw; transform: translate(-50%, -50%); border-width: .7cqw; font-size: 3.8cqw; }
  .ag4 .nb4 svg { width: 4.2cqw; height: 4.2cqw; }
  .ag4 .lb4 { max-width: 24cqw; font-size: 3.8cqw; line-height: 1.15; white-space: normal; }
  .ag4 .ag4-steps li:nth-child(1) .lb4, .ag4 .ag4-steps li:nth-child(5) .lb4 { transform: translate(-100%, -50%); text-align: right; }
  .ag4 .ag4-steps li:nth-child(2) .lb4 { max-width: none; transform: translate(-50%, -100%); text-align: center; white-space: nowrap; }
  .ag4 .ag4-steps li:nth-child(3) .lb4, .ag4 .ag4-steps li:nth-child(4) .lb4 { transform: translate(0, -50%); text-align: left; }
  .ag4 .ag4-steps li:nth-child(1) .lb4 { max-width: none; transform: translate(-100%, -100%); white-space: nowrap; }
  .ag4 .ag4-steps li:nth-child(3) .lb4 { max-width: none; transform: translate(0, -100%); white-space: nowrap; }
  .ag4 .who4 { width: 40cqw; transform: translate(-50%, -7.8cqw); }
  .ag4 .av4 { width: 15.6cqw; height: 15.6cqw; } .ag4 .av4 svg { width: 6cqw; height: 6cqw; }
  .ag4 .who4.p .av4 { box-shadow: 0 0 0 .8cqw #fff, 0 0 0 1.5cqw var(--partner); }
  .ag4 .who4.f .av4 { box-shadow: 0 0 0 .8cqw #fff, 0 0 0 1.5cqw var(--brand); }
  .ag4 .who4 b { margin-top: 2cqw; font-size: 4.6cqw; } .ag4 .who4 small { margin-top: .3cqw; font-size: 2.9cqw; text-align: center; white-space: nowrap; }
  .ag4 .bub4 { width: 47cqw; max-width: none; padding: 2.2cqw 2.8cqw 2.4cqw; border-radius: 3cqw; font-size: 3.35cqw; line-height: 1.3; transform: none; }
  .ag4 .bub4.f { transform: translateX(-100%); }
  .ag4 .bub4::after { display: none; }
  .ag4 .bub4 small { gap: 1.4cqw; margin-bottom: .6cqw; font-size: 2.7cqw; } .ag4 .bub4 small img { width: 3.4cqw; height: 3.4cqw; }
  .hero4 .ag4-note { margin-top: 10px; text-align: left; }
  .flow-stage { zoom: .74; }
  .fa-chat li { padding: 7px 10px 8px; font-size: .82rem; }
  .flow-agent { padding: 12px; }
}
.pcards.n3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1000px) { .pcards.n3 { grid-template-columns: 1fr 1fr; } .pcards.n3 .pcard:first-child { grid-column: 1 / -1; } }
.pcard a.plink { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; color: var(--brand-text); text-decoration: none; }
.pcard a.plink svg { flex-shrink: 0; transition: transform .2s ease; }
.pcard a.plink:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; }
.pcard a.plink:hover svg { transform: translateX(3px); }
.pcard a.plink:focus-visible { outline: 2px solid var(--brand-edge); outline-offset: 4px; border-radius: 4px; }
@media (max-width: 760px) { .pcard a.plink { gap: 5px; } .pcard a.plink svg { width: 15px; height: 15px; } }
@media (prefers-reduced-motion: reduce) { .pcard a.plink svg { transition: none; } }
.pcard .price { line-height: 1.2; }
body.home section.oss-sec, body.home section.mcp-sec { padding: 96px 0; border-bottom: 1px solid var(--rule); }
body.home section.mcp-sec { background: var(--sheet); }
@media (max-width: 760px) { body.home section.oss-sec, body.home section.mcp-sec { padding: 64px 0; } }
.pcard .btn.gh-plan { display: inline-flex; align-items: center; justify-content: center; gap: 9px; }
.cta3 .actions { display: flex; flex-wrap: wrap; gap: 12px; }
.cta3 .btn { display: inline-flex; align-items: center; gap: 9px; }
.cta3 .btn.ghost { background: transparent; border-color: rgba(243, 245, 248, .42); color: #f3f5f8; }
.cta3 .btn.ghost:hover { background: rgba(255, 255, 255, .08); border-color: #f3f5f8; color: #f3f5f8; }