.doc-page{--doc-line:rgba(108,134,255,.28)}
.doc-hero{padding:clamp(64px,8vw,108px) 0 82px}.doc-hero-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(460px,1.08fr);gap:clamp(40px,7vw,86px);align-items:center}.doc-hero-copy h1{font-size:clamp(2.65rem,5.7vw,4.8rem);line-height:1.03;letter-spacing:-.055em;margin:18px 0 22px}.doc-lead{max-width:690px;color:var(--text-dim);font-size:1.08rem;line-height:1.72}.doc-hero-copy .hero-actions{justify-content:flex-start}.doc-trust{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;list-style:none;margin-top:30px;color:var(--text-dim);font-size:.8rem}.doc-trust li::before{content:"✓";color:var(--green);font-weight:900;margin-right:7px}
.doc-hero-demo{position:relative;padding:1px;border-radius:23px;background:linear-gradient(145deg,rgba(108,134,255,.5),rgba(52,245,197,.18),var(--border));box-shadow:0 30px 80px rgba(28,42,110,.18)}.doc-mini-flow{padding:22px;background:var(--surface);border-radius:0 0 22px 22px}.doc-window-bar{height:42px;display:flex;align-items:center;gap:7px;padding:0 15px;border-radius:22px 22px 0 0;background:var(--bg-soft);border-bottom:1px solid var(--border)}.doc-window-bar span{width:7px;height:7px;border-radius:50%;background:var(--border-strong)}.doc-window-bar b{margin-left:auto;color:var(--text-faint);font-size:.58rem;letter-spacing:1.3px}.doc-mail,.doc-ai-stage{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--field)}.doc-mail-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:rgba(108,134,255,.11);color:var(--accent)}.doc-mail div:last-child,.doc-ai-stage div:last-child{display:grid;gap:2px}.doc-mail small,.doc-ai-stage small,.doc-human-gate small,.doc-output-head small,.doc-actions small{color:var(--text-faint);font-size:.57rem;letter-spacing:1.1px}.doc-mail strong,.doc-ai-stage strong{font-size:.82rem}.doc-mail span,.doc-ai-stage span{color:var(--text-dim);font-size:.7rem}.doc-flow-arrow{text-align:center;color:var(--accent);line-height:22px}.doc-ai-stage{border-color:rgba(108,134,255,.35)}.doc-ai-pulse{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 7px rgba(108,134,255,.11),0 0 22px var(--accent);animation:docPulse 2.5s ease-in-out infinite}.doc-data-preview{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--bg-soft)}.doc-data-preview div{padding:8px;border-radius:7px;background:var(--field)}.doc-data-preview dt{color:var(--text-faint);font-size:.6rem}.doc-data-preview dd{margin-top:2px;font-size:.76rem;font-weight:700}.doc-ready{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;border:1px solid var(--border);border-radius:10px;font-size:.7rem}.doc-ready span{color:var(--accent);font-weight:800}.doc-approval-preview{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px;border:1px solid rgba(52,245,197,.35);border-radius:11px;background:rgba(52,245,197,.06);color:var(--text);pointer-events:none}.doc-approval-preview>span:first-child{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:rgba(52,245,197,.15);color:var(--green)}.doc-approval-preview>span:last-child{display:grid;text-align:left}.doc-approval-preview small{color:var(--green);font-size:.54rem;letter-spacing:1px}.doc-approval-preview b{font-size:.77rem}.doc-sample-note{position:absolute;left:22px;right:22px;bottom:-30px;text-align:center;color:var(--text-faint);font-size:.65rem}
.doc-problem-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.doc-source-cloud,.doc-manual-card{min-height:300px;border:1px solid var(--border);border-radius:20px;background:var(--surface);padding:28px}.doc-source-cloud{display:flex;align-content:center;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;background:radial-gradient(circle at center,rgba(108,134,255,.1),transparent 64%),var(--surface)}.doc-source-cloud span{padding:11px 14px;border:1px solid var(--border);border-radius:10px;background:var(--field);color:var(--text-dim);font-size:.82rem}.doc-source-cloud span:nth-child(2n){transform:translateY(-8px)}.doc-manual-card h3{font-size:1.08rem;margin-bottom:18px}.doc-manual-card ol{display:grid;gap:10px;list-style:none;counter-reset:manual}.doc-manual-card li{counter-increment:manual;padding:10px 12px;border-bottom:1px solid var(--border);color:var(--text-dim);font-size:.85rem}.doc-manual-card li::before{content:counter(manual,decimal-leading-zero);color:var(--accent);font-size:.65rem;font-weight:800;margin-right:13px}.doc-emphasis{margin-top:22px;padding:18px 22px;border-left:3px solid var(--accent);border-radius:0 12px 12px 0;background:var(--field);font-weight:700}
.doc-compare{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center}.doc-flow-panel{padding:27px;border:1px solid var(--border);border-radius:20px;background:var(--surface)}.doc-flow-panel.automated{border-color:rgba(108,134,255,.36);box-shadow:inset 0 0 45px rgba(108,134,255,.04)}.doc-panel-label{margin-bottom:17px;color:var(--text-faint);font-size:.65rem;font-weight:900;letter-spacing:1.4px}.automated .doc-panel-label{color:var(--accent)}.doc-flow-panel ol{display:grid;gap:19px;list-style:none}.doc-flow-panel li{position:relative;padding:12px 14px;border:1px solid var(--border);border-radius:9px;background:var(--field);font-size:.82rem}.doc-flow-panel li:not(:last-child)::after{content:"↓";position:absolute;left:50%;bottom:-19px;color:var(--text-faint)}.doc-flow-panel li.human{display:flex;align-items:center;justify-content:space-between;border-color:rgba(52,245,197,.38);background:rgba(52,245,197,.06)}.doc-flow-panel li.human span{color:var(--green);font-size:.62rem;font-weight:800;letter-spacing:.6px}.doc-versus{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--border-strong);border-radius:50%;background:var(--surface);color:var(--text-faint);font-size:.64rem;font-weight:900}
.doc-demo-shell{display:grid;grid-template-columns:.8fr 1.2fr;border:1px solid var(--border-strong);border-radius:22px;overflow:hidden;background:var(--surface);box-shadow:0 28px 80px rgba(0,0,0,.13)}.doc-demo-input{padding:27px;border-right:1px solid var(--border);background:var(--bg-soft)}.doc-demo-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:18px}.doc-demo-tabs button{min-height:42px;padding:8px;border:1px solid var(--border);border-radius:8px;background:var(--field);color:var(--text-dim);cursor:pointer;font-size:.75rem}.doc-demo-tabs button[aria-selected="true"]{border-color:var(--accent);background:rgba(108,134,255,.1);color:var(--text)}.doc-inbox-card{padding:18px;border:1px solid var(--border);border-radius:13px;background:var(--surface)}.doc-inbox-head{display:flex;align-items:flex-start;gap:10px}.doc-inbox-head>span:first-child{color:var(--accent)}.doc-inbox-head div{display:grid;gap:2px;min-width:0}.doc-inbox-head strong{font-size:.79rem}.doc-inbox-head small{color:var(--text-faint);font-size:.65rem}.doc-sample-badge{margin-left:auto;padding:4px 6px;border-radius:5px;background:rgba(108,134,255,.1);color:var(--accent);font-size:.54rem;font-weight:800}.doc-inbox-card p{margin:18px 0;color:var(--text-dim);font-size:.78rem;line-height:1.65}.doc-attachment{padding:9px;border:1px solid var(--border);border-radius:7px;background:var(--field);color:var(--text-dim);font-size:.68rem}.doc-process-btn{width:100%;margin-top:16px}.doc-demo-status{min-height:20px;margin-top:9px;color:var(--text-faint);font-size:.69rem;text-align:center}.doc-demo-process{padding:27px}.doc-progress{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;list-style:none;margin-bottom:24px}.doc-progress li{position:relative;display:grid;justify-items:center;gap:7px;color:var(--text-faint);text-align:center}.doc-progress li:not(:last-child)::after{content:"";position:absolute;top:13px;left:calc(50% + 14px);right:calc(-50% + 14px);height:1px;background:var(--border)}.doc-progress li span{position:relative;z-index:1;width:27px;height:27px;display:grid;place-items:center;border:1px solid var(--border);border-radius:50%;background:var(--surface);font-size:.6rem}.doc-progress li b{font-size:.55rem;line-height:1.2}.doc-progress li.active span{border-color:var(--accent);color:var(--accent);box-shadow:0 0 0 5px rgba(108,134,255,.08)}.doc-progress li.complete span{border-color:var(--green);background:rgba(52,245,197,.1);color:var(--green)}.doc-progress li.complete:not(:last-child)::after{background:var(--green)}.doc-output{border:1px solid var(--border);border-radius:14px;overflow:hidden}.doc-output-head{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--border);background:var(--field)}.doc-output-head>div{display:grid}.doc-output-head strong{font-size:.78rem}.doc-status-dot{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}.doc-validation{margin-left:auto;padding:5px 7px;border-radius:5px;background:rgba(255,180,84,.1);color:#c77a16;font-size:.58rem;font-weight:800}.doc-output dl{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border)}.doc-output dl div{display:flex;justify-content:space-between;gap:8px;padding:10px 12px;background:var(--surface)}.doc-output dt{color:var(--text-faint);font-size:.65rem}.doc-output dd{text-align:right;font-size:.68rem;font-weight:700}.doc-actions{display:grid;gap:4px;padding:13px 15px;border-top:1px solid var(--border);background:rgba(108,134,255,.05)}.doc-actions strong{font-size:.78rem}.doc-actions span{color:var(--text-dim);font-size:.68rem}.doc-human-gate{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 15px;border-top:1px solid rgba(52,245,197,.24);background:rgba(52,245,197,.05)}.doc-human-gate>div:first-child{display:grid}.doc-human-gate small{color:var(--green)}.doc-human-gate strong{font-size:.72rem}.doc-human-gate>div:last-child{display:flex;gap:7px}.doc-human-gate .btn{min-height:36px;padding:7px 11px;font-size:.7rem}.doc-no-write{padding:8px 14px;color:var(--text-faint);font-size:.58rem;text-align:center;border-top:1px solid var(--border)}
.doc-architecture{display:grid;grid-template-columns:1fr auto 1.25fr auto 1.1fr auto .8fr;gap:12px;align-items:stretch}.doc-arch-column{padding:20px;border:1px solid var(--border);border-radius:16px;background:var(--surface)}.doc-arch-column.core{border-color:rgba(108,134,255,.42);background:linear-gradient(150deg,rgba(108,134,255,.1),var(--surface))}.doc-arch-column.control{border-color:rgba(52,245,197,.3)}.doc-arch-label{display:block;margin-bottom:15px;color:var(--accent);font-size:.62rem;font-weight:900;letter-spacing:1.1px}.doc-arch-items{display:flex;gap:7px;flex-wrap:wrap}.doc-arch-items span{padding:7px 9px;border:1px solid var(--border);border-radius:7px;background:var(--field);color:var(--text-dim);font-size:.66rem}.doc-arch-arrow{align-self:center;color:var(--accent);font-weight:900}.doc-use-grid .card{min-height:190px}.doc-use-grid .card p{margin-top:9px}
.doc-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.doc-levels article{position:relative;padding:28px;border:1px solid var(--border);border-radius:17px;background:var(--surface);overflow:hidden}.doc-levels article::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--purple),var(--accent))}.doc-levels article:nth-child(3)::after{background:linear-gradient(90deg,var(--accent),var(--green))}.doc-levels span{color:var(--accent);font-size:.64rem;font-weight:900;letter-spacing:1.2px}.doc-levels h3{margin:17px 0 8px;font-size:1.03rem}.doc-levels p{color:var(--text-dim);font-size:.82rem}
.doc-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.doc-kpis article{padding:20px;border:1px solid var(--border);border-radius:13px;background:var(--surface)}.doc-kpis article>span{color:var(--accent);font-size:1.1rem}.doc-kpis h3{margin:16px 0 5px;font-size:.88rem}.doc-kpis p{color:var(--text-faint);font-size:.68rem}.doc-implementation{display:grid;grid-template-columns:repeat(5,1fr);list-style:none}.doc-implementation li{position:relative;padding:24px 20px;border-block:1px solid var(--border);background:var(--surface)}.doc-implementation li:first-child{border-left:1px solid var(--border);border-radius:16px 0 0 16px}.doc-implementation li:last-child{border-right:1px solid var(--border);border-radius:0 16px 16px 0}.doc-implementation li:not(:last-child)::after{content:"→";position:absolute;z-index:2;right:-9px;top:26px;color:var(--accent);font-weight:900}.doc-implementation li>span{color:var(--accent);font-size:.66rem;font-weight:900}.doc-implementation h3{margin:15px 0 7px;font-size:.92rem}.doc-implementation strong{display:block;margin-bottom:8px;color:var(--green);font-size:.68rem}.doc-implementation p{color:var(--text-dim);font-size:.73rem;line-height:1.55}
.doc-final-cta{padding-top:0}.doc-cta-box{display:grid;grid-template-columns:1.2fr .8fr;gap:45px;align-items:center;padding:clamp(32px,6vw,64px);border:1px solid rgba(108,134,255,.34);border-radius:25px;background:radial-gradient(circle at 80% 0,rgba(108,134,255,.13),transparent 45%),var(--surface)}.doc-cta-box h2{margin:14px 0;font-size:clamp(2rem,4vw,3.2rem)}.doc-cta-box p{max-width:690px;color:var(--text-dim);line-height:1.7}.doc-cta-action{display:grid;justify-items:center;gap:11px}.doc-cta-action .btn{width:100%}.doc-cta-action span{color:var(--text-faint);font-size:.7rem}
@keyframes docPulse{50%{box-shadow:0 0 0 10px rgba(108,134,255,.04),0 0 28px var(--accent)}}
@media(max-width:1100px){.doc-hero-grid{grid-template-columns:1fr}.doc-hero-copy{text-align:center}.doc-hero-copy .hero-actions{justify-content:center}.doc-trust{max-width:650px;margin-inline:auto}.doc-hero-demo{width:min(100%,680px);margin-inline:auto}.doc-architecture{grid-template-columns:1fr}.doc-arch-arrow{transform:rotate(90deg);justify-self:center}.doc-kpis{grid-template-columns:repeat(3,1fr)}.doc-implementation{grid-template-columns:1fr}.doc-implementation li,.doc-implementation li:first-child,.doc-implementation li:last-child{border:1px solid var(--border);border-radius:0}.doc-implementation li:first-child{border-radius:14px 14px 0 0}.doc-implementation li:last-child{border-radius:0 0 14px 14px}.doc-implementation li:not(:last-child)::after{content:"↓";right:22px;top:auto;bottom:-13px}}
@media(max-width:760px){.doc-hero{padding-top:56px}.doc-hero-copy h1{font-size:clamp(2.35rem,12vw,3.4rem)}.doc-trust{grid-template-columns:1fr}.doc-problem-grid,.doc-compare,.doc-demo-shell,.doc-levels,.doc-cta-box{grid-template-columns:1fr}.doc-versus{margin:auto}.doc-demo-input{border-right:0;border-bottom:1px solid var(--border)}.doc-progress{grid-template-columns:1fr;gap:8px}.doc-progress li{grid-template-columns:28px 1fr;justify-items:start;align-items:center;text-align:left}.doc-progress li:not(:last-child)::after{top:27px;bottom:-9px;left:13px;right:auto;width:1px;height:auto}.doc-output dl{grid-template-columns:1fr}.doc-human-gate{align-items:flex-start;flex-direction:column}.doc-human-gate>div:last-child{width:100%}.doc-human-gate .btn{flex:1}.doc-kpis{grid-template-columns:repeat(2,1fr)}.doc-cta-action{justify-items:stretch}.doc-cta-action span{text-align:center}.doc-source-cloud span:nth-child(2n){transform:none}}
@media(max-width:460px){.doc-mini-flow,.doc-demo-input,.doc-demo-process{padding:16px}.doc-data-preview,.doc-demo-tabs,.doc-kpis{grid-template-columns:1fr}.doc-ready{align-items:flex-start;flex-direction:column;gap:4px}.doc-hero-demo{border-radius:18px}.doc-window-bar{border-radius:18px 18px 0 0}.doc-mini-flow{border-radius:0 0 18px 18px}}
@media(prefers-reduced-motion:reduce){.doc-ai-pulse{animation:none}.doc-page *{scroll-behavior:auto}}
/* Hero card: animated document flow cycling through sample documents (document-automation.js, heroFlow) */
.doc-window-bar .doc-hf-live{display:inline-flex;align-items:center;gap:5px;margin-left:10px;color:var(--green);font-size:.55rem;font-style:normal;font-weight:800;letter-spacing:1.2px}
.doc-hf-live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:hfBlink 1.6s ease-in-out infinite}
.doc-hf-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.doc-hf-tabs button{position:relative;overflow:hidden;padding:5px 11px;border:1px solid var(--border);border-radius:999px;background:var(--field);color:var(--text-dim);font-size:.68rem;font-weight:700;cursor:pointer;transition:color .2s,border-color .2s}
.doc-hf-tabs button:hover,.doc-hf-tabs button:focus-visible{color:var(--text)}
.doc-hf-tabs button[aria-selected="true"]{color:var(--text);border-color:rgba(108,134,255,.5)}
.doc-hf-tabs button[aria-selected="true"]::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--accent);transform-origin:left;transform:scaleX(0);animation:hfTimer var(--hf-duration,7s) linear forwards}
[data-hero-flow].is-paused .doc-hf-tabs button::after{animation-play-state:paused}
[data-hero-flow].is-static .doc-hf-tabs button::after{animation:none;transform:scaleX(1)}
[data-hero-flow] .doc-mail.hf-arrive{animation:hfArrive .55s cubic-bezier(.16,1,.3,1) both}
[data-hero-flow] .doc-ai-stage{position:relative;overflow:hidden;transition:border-color .3s,box-shadow .3s}
[data-hero-flow] .doc-ai-stage.hf-reading{border-color:var(--accent);box-shadow:0 0 0 3px rgba(108,134,255,.12)}
[data-hero-flow] .doc-ai-stage.hf-reading::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(108,134,255,.16),transparent);animation:hfScan 1s linear infinite}
[data-hero-flow] .doc-data-preview div{transition:opacity .35s,transform .35s,box-shadow .35s}
[data-hero-flow] .doc-data-preview div.hf-pending{opacity:.28;transform:translateY(3px)}
[data-hero-flow] .doc-data-preview div.hf-pending dd{color:transparent;background:linear-gradient(90deg,var(--border),var(--border-strong),var(--border));background-size:200% 100%;border-radius:4px;animation:hfShimmer 1.2s linear infinite}
[data-hero-flow] .doc-data-preview div.hf-filled{box-shadow:inset 0 0 0 1px rgba(108,134,255,.45)}
[data-hero-flow] .doc-ready{position:relative;overflow:hidden;transition:border-color .3s}
[data-hero-flow] .doc-ready.hf-sending{border-color:rgba(108,134,255,.45)}
.doc-hf-bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:transparent}
.doc-hf-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--green));transition:width .9s ease}
.doc-ready.hf-sending .doc-hf-bar i,.doc-ready.hf-done .doc-hf-bar i{width:100%}
[data-hero-flow] .doc-approval-preview{transition:opacity .3s,box-shadow .3s}
[data-hero-flow] .doc-approval-preview.hf-idle{opacity:.45}
[data-hero-flow] .doc-approval-preview.hf-waiting{animation:hfWait 1.6s ease-in-out infinite}
@keyframes hfTimer{to{transform:scaleX(1)}}
@keyframes hfArrive{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes hfScan{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@keyframes hfShimmer{to{background-position:-200% 0}}
@keyframes hfWait{50%{box-shadow:0 0 0 5px rgba(52,245,197,.14)}}
@keyframes hfBlink{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.doc-hf-live::before,[data-hero-flow] .doc-approval-preview.hf-waiting,[data-hero-flow] .doc-ai-stage.hf-reading::after{animation:none}}

