/* Expressive layer: decorative motion never changes the live application's data. */
.hero { position:relative; isolation:isolate; gap:53px; padding-top:80px; }
.hero-copy { position:relative; z-index:2; }
.hero-title-line { display:block; white-space:nowrap; }
.hero-word { display:inline-block; position:relative; }
.hero-word::after { content:''; position:absolute; left:0; right:-5px; height:8px; bottom:-7px; border-top:2px solid #75dfc0; border-radius:50%; transform:rotate(-2deg); opacity:.8; }
.hero h1 { line-height:1.1; }
.hero-atmosphere { position:absolute; inset:-30px -40px 0; overflow:hidden; z-index:-1; pointer-events:none; }
.hero-atmosphere > span { position:absolute; width:550px; height:550px; border-radius:50%; background:radial-gradient(circle,#d8f5de9c,transparent 67%); right:-70px; top:15px; }
.hero-atmosphere > span:nth-child(2) { width:420px; height:420px; left:-100px; top:85px; background:radial-gradient(circle,#e5f1d78a,transparent 68%); }
.hero-atmosphere > i { position:absolute; width:400px; height:400px; border:1px solid #c5dfce54; border-radius:50%; top:30px; right:50px; }
.hero-visual { min-width:0; position:relative; transform:perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform .25s ease-out; }
.hero-visual .flow-console { background:radial-gradient(ellipse at 80% 5%,#31685865,transparent 60%),linear-gradient(145deg,#173f3c,#0d2929); box-shadow:0 35px 65px -35px #0c292878,0 0 0 7px #eff5ed; border-color:#3c6c5b; }
.visual-orbit { position:absolute; inset:-30px; overflow:hidden; pointer-events:none; z-index:-1; }
.visual-orbit > span { position:absolute; inset:0; border:1px solid #a1ceb360; border-radius:50%; rotate:-24deg; }.visual-orbit > span:nth-child(2) { inset:32px -23px; rotate:29deg; border-style:dashed; opacity:.45; }
.visual-orbit > i { position:absolute; left:6%; top:5%; width:10px; height:10px; border-radius:50%; background:#75dfc0; box-shadow:0 0 0 6px #75dfc026; }
.floating-note { display:flex; align-items:center; gap:10px; position:absolute; z-index:5; border:1px solid #d3e4d8; border-radius:11px; background:#fffffff5; padding:11px 15px; box-shadow:0 10px 28px #123e3a17; color:var(--ink); pointer-events:none; }
.floating-note > .icon { color:#398766; width:20px; height:20px; }.floating-note > span { font-size:10px; font-weight:600; line-height:1.5; }.floating-note small { display:block; font-size:8px; color:#617d6c; font-weight:400; }.floating-note > i { width:5px; height:5px; border-radius:50%; background:#47ac86; margin-left:8px; }
.note-top { right:-15px; top:-22px; transform:rotate(3deg); }.note-bottom { right:28px; bottom:-29px; padding:10px 14px; transform:rotate(-2deg); }.note-bottom > .icon { width:15px; height:15px; margin-left:12px; }.note-symbol { display:grid; place-items:center; width:31px; height:31px; background:#e0f4e7; border-radius:8px; }.note-symbol .icon { width:17px; height:17px; color:#2c8262; }
.document-echo { position:absolute; left:50%; top:16%; width:31%; max-width:164px; height:176px; border-radius:11px; background:#dcebdd; border:1px solid #d3e4d8; z-index:1; pointer-events:none; }
.echo-one { transform:translate(-55%,5px) rotate(-9deg); opacity:.24; }.echo-two { transform:translate(-44%,5px) rotate(7deg); opacity:.15; }
.document-preview { overflow:visible; }
.document-stamp { position:absolute; right:-9px; top:57px; border:1.5px solid #328b65; background:#f5fff5eb; color:#24704f; border-radius:4px; padding:4px 8px; font:700 8px var(--display); letter-spacing:.06em; transform:rotate(-12deg); opacity:1; }
.circuit-route { fill:none; stroke:#75dfc054; stroke-width:1.25; }
.continuous-flow .document-preview { box-shadow:0 0 0 1px #75dfc048,0 13px 25px #041f1b45; }
.flow-waypoints { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:18px 2px 10px; font-size:8px; letter-spacing:.025em; color:#b0d4c3; }
.flow-waypoints .icon { width:13px; height:13px; color:#75dfc091; }
.continuous-flow .sifen-orbit { border-color:#75dfc06b; box-shadow:0 0 22px #75dfc015; }
.motion-ready .continuous-flow.is-in-view .document-preview { animation:receipt-drift 5.6s ease-in-out infinite; }
@keyframes receipt-drift { 0%,100% { translate:0 0; }50% { translate:0 -4px; } }
.flow-console[data-stage="5"] .document-stamp { opacity:1; transform:rotate(-12deg) scale(1); }.flow-console[data-stage="5"][data-outcome="observed"] .document-stamp { color:#98601a; border-color:#b78535; background:#fff9ed; }
.packet-trail { fill:#75dfc0; opacity:0; pointer-events:none; }
.flow-console .flow-status-icon { transition:background .15s,border-color .15s; }.flow-console[data-stage="5"] .flow-status-icon { background:#75dfc02e; border-color:#75dfc073; }
.page-motion-toggle { display:none; border:1px solid var(--line); color:#4d7564; width:32px; height:32px; }.has-experience .page-motion-toggle { display:grid; }.page-motion-toggle[aria-pressed="true"] { background:#e1f4e8; border-color:#b1d8c2; }.page-motion-toggle:disabled { opacity:.6; }
.customer-strip { margin-top:15px; }
.motion-band { overflow:hidden; height:96px; margin-top:35px; background:linear-gradient(110deg,#d3f1da,#e5f4d8 65%,#b7eed8); border-block:1px solid #c6e3cc; display:flex; align-items:center; }
.motion-band-track { display:flex; width:max-content; flex-shrink:0; transform:translateX(0); }
.motion-band-group { display:flex; align-items:center; justify-content:space-around; gap:38px; min-width:max(100vw,1100px); padding:0 22px; }
.motion-band-group > span { font:650 42px/1 var(--display); letter-spacing:-.055em; white-space:nowrap; }.motion-band-group > .icon { width:28px; height:28px; color:#3d9270; }.motion-band .outlined-word { color:transparent; -webkit-text-stroke:1px #42795d; }
.process-card { border-radius:17px; border-color:#d3e2d5; background:radial-gradient(250px circle at var(--glow-x,30%) var(--glow-y,20%),#ffffffd9,transparent 80%),#eff5ef; transition:background .2s,border-color .2s,translate .2s,box-shadow .2s; }
.process-card:hover { background:radial-gradient(240px circle at var(--glow-x,50%) var(--glow-y,50%),#fff,transparent 80%),#e4f3e8; border-color:#9ecdb3; translate:0 -6px; box-shadow:0 15px 35px -23px #194b35b0; }
.step-number { font:650 30px/1 var(--display); color:#abc5b5; letter-spacing:-.065em; }.process-illustration { margin-bottom:12px; margin-top:-6px; }
.signature-stroke { clip-path:inset(0); }.exchange-line { overflow:hidden; height:2px; }.exchange-line::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,#328867,transparent); transform:translateX(-100%); }.response-illustration > span { box-shadow:0 5px 18px #3c9d5f0a; }
.product-atmosphere { position:absolute; inset:0; pointer-events:none; overflow:hidden; }.product-atmosphere > span:first-child { position:absolute; width:1000px; height:1000px; border:1px solid #75dfc01a; border-radius:50%; right:-340px; top:-620px; }.product-atmosphere > span:last-child { position:absolute; width:700px; height:700px; left:-370px; bottom:-370px; border-radius:50%; background:radial-gradient(circle,#75dfc014,transparent 65%); }
.product-section > .container { position:relative; }
.product-tour-controls { display:flex; justify-content:space-between; align-items:center; padding:9px 1px 0 18px; margin-top:2px; color:#b4dbbf; }.product-tour-controls > span { display:flex; align-items:center; gap:7px; font-size:8px; }.product-tour-controls i { width:5px; height:5px; border-radius:50%; background:#75dfc0; }.product-tour-controls .icon { width:13px; height:13px; }
html:not(.has-experience) .product-tour-controls { display:none; }
.workspace-preview { transform:perspective(1200px) rotateY(-3deg) rotateX(1deg); border-color:#76c3a624; box-shadow:24px 38px 80px -36px #041b1aa0; }
.product-tabs button { position:relative; overflow:hidden; }.product-tabs button[aria-selected="true"] { background:linear-gradient(105deg,#75dfc023,#75dfc00c); box-shadow:inset 3px 0 #75dfc0; }.product-tabs button:hover { border-color:#75dfc076; }
.preview-metrics > div { transition:background .2s; }.preview-metrics > div:hover { background:#e8f4e6; }
.feature-row .icon { box-sizing:content-box; padding:9px; border:1px solid #75dfc030; border-radius:11px; background:#75dfc011; transition:transform .25s,background .25s; }.feature-row > div:hover > .icon { transform:translateY(-4px) rotate(-7deg); background:#75dfc024; }
.business-panel { position:relative; isolation:isolate; overflow:hidden; background:linear-gradient(135deg,#e4f1e2,#f0f6e9); border-color:#cfe1ca; }.business-panel > div:not(.business-orbits),.business-index { z-index:1; }.business-orbits { position:absolute; z-index:-1; width:220px; height:220px; right:-85px; bottom:-110px; opacity:.6; }.business-orbits > span { position:absolute; inset:0; border-radius:50%; border:1px solid #a6cbb05c; }.business-orbits > span:nth-child(2) { inset:29px; border-style:dashed; }.business-orbits > .icon { position:absolute; width:24px; height:24px; left:30px; top:8px; color:#76a585; background:#e5f0e3; border-radius:6px; padding:3px; }
.pricing-section { background:radial-gradient(ellipse at 80% 85%,#dcecd5a6,transparent 55%),#f0f4ed; }
.price-card { position:relative; transition:translate .25s,box-shadow .25s,border-color .25s; }.price-card:hover { translate:0 -6px; box-shadow:0 18px 45px -30px #154d36a0; border-color:#a8d2b5; }.price-card.featured { border-top:3px solid #75dfc0; box-shadow:0 20px 45px -25px #164d3673; }
.contact-card { background:radial-gradient(ellipse at 70% 20%,#abefc8a0,transparent 65%),#75dfc0; box-shadow:0 20px 50px -35px #206e4b78; }.contact-orbit > span { border-style:dashed; }.contact-orbit > span:nth-child(2) { border-style:solid; }
html.has-motion .reveal { transform:translateY(17px); transition-duration:.42s; transition-delay:var(--reveal-delay,0ms); }
html.has-motion .reveal.is-visible { transform:none; }
/* Ambient loops run only in visible zones and respect device motion preferences. */
.motion-ready [data-motion-zone].is-in-view .floating-note { animation:note-hover 4.2s ease-in-out infinite; }.motion-ready [data-motion-zone].is-in-view .note-bottom { animation-delay:-2.1s; }
.motion-ready [data-motion-zone].is-in-view .document-echo { animation:paper-hover 3.5s ease-in-out infinite; }.motion-ready [data-motion-zone].is-in-view .echo-two { animation-delay:-1.75s; }
.motion-ready [data-motion-zone].is-in-view .visual-orbit > i { animation:orbit-dot 8s ease-in-out infinite; }
.motion-ready .motion-band.is-in-view .motion-band-track { animation:brand-marquee 22s linear infinite; }
.motion-ready .process-card.is-in-view .signature-stroke { animation:signature-write 3s ease-in-out infinite; }.motion-ready .process-card.is-in-view .exchange-line::before { animation:exchange-packet 1.5s linear infinite; }.motion-ready .process-card.is-in-view .mini-seal { animation:seal-pop 3s ease-in-out infinite; }.motion-ready .process-card.is-in-view .response-illustration > span { animation:status-breathe 2.8s ease-in-out infinite; }
.motion-ready .business-panel.is-in-view .business-orbits > span:nth-child(2),.motion-ready .contact-card.is-in-view .contact-orbit > span:first-child { animation:brand-orbit 28s linear infinite; }
html[data-page-motion="paused"] *,html[data-page-motion="paused"] *::before,html[data-page-motion="paused"] *::after,
html.page-hidden *,html.page-hidden *::before,html.page-hidden *::after { animation-play-state:paused !important; }
html[data-page-motion="paused"] *,html[data-page-motion="paused"] *::before,html[data-page-motion="paused"] *::after { transition:none !important; }
html[data-page-motion="paused"] .reveal { transition:none !important; opacity:1 !important; transform:none !important; }
@keyframes note-hover { 0%,100% { translate:0 0; }50% { translate:0 -8px; } }
@keyframes paper-hover { 0%,100% { translate:0 0; }50% { translate:2px -5px; } }
@keyframes orbit-dot { 0%,100% { translate:0 0; }50% { translate:28px 9px; } }
@keyframes brand-marquee { to { transform:translateX(-50%); } }
@keyframes signature-write { 0%,12% { clip-path:inset(0 100% 0 0); }40%,100% { clip-path:inset(0); } }
@keyframes exchange-packet { to { transform:translateX(100%); } }
@keyframes seal-pop { 0%,25%,100% { transform:scale(1); }40% { transform:scale(1.16) rotate(8deg); }55% { transform:scale(1); } }
@keyframes status-breathe { 0%,100% { box-shadow:0 0 0 0 #57a56d00; }50% { box-shadow:0 0 0 7px #57a56d0e; } }
@keyframes brand-orbit { to { rotate:360deg; } }
@media(max-width:1150px) { .hero { gap:36px; }.note-top { right:-10px; font-size:9px; }.floating-note { padding:9px 11px; }.note-bottom { right:20px; bottom:-27px; }.hero-atmosphere { inset:-25px -28px 0; }.hero-visual .flow-console { box-shadow:0 30px 60px -30px #0c292870,0 0 0 5px #eff5ed; } }
@media(max-width:900px) { .hero { padding-top:48px; gap:56px; }.nav-actions { gap:16px; }.nav-demo { display:none; }.hero-atmosphere { inset:0 -28px; }.visual-orbit { inset:-20px; }.note-top { right:10px; top:-20px; }.note-bottom { right:25px; bottom:-24px; }.customer-strip { margin-top:20px; }.motion-band { height:83px; margin-top:25px; }.motion-band-group > span { font-size:36px; }.product-tour-controls { padding-left:0; }.workspace-preview { transform:none; }.hero-title-line { min-height:1.1em; } }
@media(max-width:600px) {
    .hero { padding-top:37px; gap:49px; padding-bottom:45px; }.hero-atmosphere { inset:0 -20px; }.hero-atmosphere > span:nth-child(2) { width:300px; left:-130px; top:0; }.hero-atmosphere > i { width:300px; height:300px; right:-150px; top:20px; }
    .hero h1 { font-size:clamp(41px,11.2vw,64px); line-height:1.14; }.hero-word::after { bottom:-6px; height:6px; }.hero-description { margin-top:24px; }.nav-actions { gap:9px; }.page-motion-toggle { width:29px; height:31px; }.page-motion-toggle .icon { width:13px; height:13px; }.nav-shell { gap:8px; }.nav-shell .brand { width:112px; }.login-link { font-size:10px; gap:4px; }.login-link .icon { width:11px; height:11px; }
    .floating-note { gap:8px; border-radius:8px; padding:8px 10px; }.floating-note > .icon { width:15px; height:15px; }.floating-note > span { font-size:8px; }.floating-note small { font-size:6px; }.floating-note > i { margin-left:4px; width:4px; height:4px; }.note-top { top:-19px; right:10px; }.note-bottom { display:none; }.visual-orbit { inset:-16px -6px; }.visual-orbit > span { border-color:#a1ceb342; }.visual-orbit > span:nth-child(2) { inset:20px 0; }.visual-orbit > i { width:6px; height:6px; left:8%; top:0; }.hero-visual .flow-console { box-shadow:0 25px 40px -25px #0c292870,0 0 0 4px #eff5ed; }
    .document-echo { top:18%; width:32%; height:144px; border-radius:8px; }.document-stamp { font-size:5px; top:49px; right:-5px; padding:3px 5px; }.motion-band { height:72px; margin-top:23px; }.motion-band-group { min-width:900px; gap:32px; }.motion-band-group > span { font-size:32px; }.motion-band-group > .icon { width:22px; height:22px; }
    .step-number { font-size:27px; }.process-card { padding:23px 20px; }.process-illustration { margin-top:0; margin-bottom:0; }.product-tour-controls { padding-top:8px; }.product-tour-controls > span { font-size:7px; }.product-tour-controls .icon-button { width:29px; height:29px; }.feature-row > div { grid-template-columns:38px 1fr; }.feature-row .icon { width:19px; height:19px; padding:8px; }.price-card:hover { translate:0 -3px; }.hero-visual { transform:none !important; }
}
@media(max-width:359px) { .nav-shell .brand { width:100px; }.nav-actions { gap:7px; }.nav-shell .login-link { font-size:9px; }.hero h1 { font-size:clamp(38px,11.7vw,42px); }.hero-atmosphere { inset:0 -16px; }.process-card { padding:22px 18px; }.document-echo { height:133px; }.note-top { padding:7px 9px; }.hero-visual .flow-console { box-shadow:0 20px 35px -23px #0c292870; } }
@media(prefers-reduced-motion:reduce) { .hero-visual,.workspace-preview { transform:none !important; }.motion-ready [data-motion-zone] * { animation:none !important; }.document-stamp { transition:none; }.motion-band-track { transform:none; }.hero-word::after { transform:none; } }
@media print { .hero-atmosphere,.visual-orbit,.floating-note,.motion-band,.page-motion-toggle,.product-tour-controls,.product-atmosphere,.business-orbits { display:none !important; }.workspace-preview { transform:none; } }