.hero{grid-template-columns:.95fr 1.05fr;gap:45px;min-height:820px;padding-top:50px}.hero-copy{padding-bottom:35px}.hero h1{font-size:clamp(45px,5.1vw,80px)}.hero .hero-bottom{margin-top:0}.hero .actions{gap:18px;flex-wrap:wrap}.processing-demo{--demo-bg:#10130f;--demo-card:#1a2016;--demo-sub:#a1b293;--demo-border:#3d4d2e;--demo-accent:#cbff59;--demo-muted:#779066;position:relative;isolation:isolate;background:var(--demo-bg);border:1px solid var(--demo-border);border-radius:18px;box-shadow:0 30px 90px #0007,0 0 100px #b2e05112;color:var(--ink);margin-bottom:30px;overflow:visible;min-width:0}
.processing-demo:before{content:'';position:absolute;inset:-50px;z-index:-1;background:radial-gradient(ellipse at 50% 45%,#93c64115,transparent 67%);pointer-events:none}.demo-top{display:flex;align-items:center;gap:15px;padding:18px 20px;border-bottom:1px solid var(--demo-border)}.demo-brand{font-weight:700;font-size:19px;letter-spacing:-1px;display:flex;align-items:center}.demo-brand>span{color:var(--demo-accent)}.demo-brand img{width:27px;height:auto;margin-right:8px}.demo-example{margin-left:auto;font-size:10px;letter-spacing:1px;color:var(--demo-muted)}#demo-pause{width:32px;height:32px;border-radius:50%;border:1px solid var(--demo-border);background:transparent;color:var(--demo-sub);font-size:16px;flex-shrink:0;display:grid;place-items:center}.demo-steps{display:grid;grid-template-columns:repeat(4,1fr);padding:20px 17px 15px;gap:8px}.demo-steps button{border:0;background:none;color:var(--demo-muted);padding:0;text-align:left;font-size:12px;line-height:1.5}.demo-steps button span{display:block;font:12px monospace;margin-bottom:4px;opacity:.7}.demo-steps button[aria-pressed=true]{color:var(--demo-accent)}.demo-track{height:2px;background:var(--demo-border);margin:0 20px;overflow:hidden}.demo-track>span{display:block;background:var(--demo-accent);height:100%;transform:scaleX(.25);transform-origin:left;transition:transform 400ms var(--ease-out)}
.demo-viewport{height:355px;position:relative;padding:22px 22px 10px;overflow:hidden}.demo-panel[hidden]{display:none!important}.demo-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:1px;color:var(--demo-muted)}.demo-chip{font-size:10px;letter-spacing:0;background:#98d14212;color:var(--demo-accent);border:1px solid #9bbd6250;border-radius:20px;padding:4px 8px;white-space:nowrap}.demo-panel h3{font-size:24px;letter-spacing:-1px;margin:16px 0 5px;line-height:1.2}.demo-intro{font-size:13px;color:var(--demo-sub);margin:0 0 20px}.demo-sources{display:flex;gap:8px;justify-content:center;margin-top:30px}.demo-sources>span{padding:8px 12px;border:1px solid var(--demo-border);background:var(--demo-card);border-radius:6px;color:var(--demo-sub);font-size:12px}.demo-flow{display:flex;align-items:center;justify-content:center;gap:12px;height:46px;color:var(--demo-accent)}.demo-flow i{height:1px;width:60px;background:var(--demo-border)}.demo-invoice{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:12px;padding:17px;background:var(--demo-card);border:1px solid var(--demo-border);border-radius:10px;position:relative}.invoice-icon{color:var(--demo-accent);font-size:25px}.demo-invoice strong,.demo-invoice>b{font-size:15px}.demo-invoice small{display:block;font-size:12px;color:var(--demo-sub)}.invoice-arrival{position:absolute;top:-9px;right:12px;background:var(--demo-accent);color:#203112;padding:1px 8px;border-radius:8px;font-size:10px}.demo-footline{font-size:12px;color:var(--demo-sub);display:flex;align-items:center;gap:12px;margin-top:18px}.demo-footline>span{font:12px monospace;color:var(--demo-accent)}.extraction-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;border:1px solid var(--demo-border);border-radius:8px;background:var(--demo-border);overflow:hidden;position:relative}.extraction-grid>div{background:var(--demo-card);padding:12px 15px}.extraction-grid span{display:block;font-size:12px;color:var(--demo-sub)}.extraction-grid strong{display:block;font-size:15px;margin-top:3px}.extraction-grid .extraction-wide{grid-column:1/-1}.extraction-wide strong{display:flex;justify-content:space-between}.extraction-wide b{font-size:12px;color:var(--demo-accent);font-weight:400}.demo-scan{position:absolute;left:0;right:0;top:0;height:2px;background:var(--demo-accent);box-shadow:0 0 15px #b4ff5c88;pointer-events:none}.demo-bookings{border:1px solid var(--demo-border);border-radius:8px;overflow:hidden}.booking-labels,.booking-row{display:grid;grid-template-columns:1fr 65px 36px;gap:9px;align-items:center;padding:9px 11px;font-size:11px}.booking-labels{color:var(--demo-muted);background:var(--demo-bg)}.booking-row{background:var(--demo-card);border-top:1px solid var(--demo-border)}.booking-row small{display:block;font-size:10px;color:var(--demo-sub);margin-top:3px}.booking-row strong{font-size:12px;white-space:nowrap}.booking-row>span{border:1px solid #d2bd6b44;background:#dfbf4414;color:#dbcd7d;border-radius:20px;text-align:center;font-size:11px}.review-note{font-size:12px;color:var(--demo-sub);margin-top:16px}.demo-chip.review{color:#dccc82;border-color:#8f844a}.demo-dashboard{max-height:245px;border:1px solid var(--demo-border)}.demo-dashboard img{width:100%;height:auto}.demo-dashboard>span{font-size:12px;padding:8px 14px;bottom:14px}.demo-bottom{display:flex;align-items:center;gap:15px;padding:16px 20px;border-top:1px solid var(--demo-border);background:var(--demo-card);border-radius:0 0 17px 17px;min-height:78px}.demo-bottom p{font-size:12px;line-height:1.5;color:var(--demo-sub);margin:0;max-width:340px}#demo-next{margin-left:auto;white-space:nowrap;background:transparent;color:var(--demo-accent);border:0;font-size:12px;padding:8px 0 8px 12px;display:flex;gap:12px}.demo-accessible{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0}
[data-theme=light] .processing-demo{--demo-bg:#fff;--demo-card:#f0f5e9;--demo-sub:#566a43;--demo-border:#c7d7b7;--demo-accent:#547d22;--demo-muted:#748763;box-shadow:0 30px 90px #2c461b20,0 0 80px #b4d68018}[data-theme=light] .invoice-arrival{background:#cbf489;color:#2c451b}[data-theme=light] .booking-row>span,[data-theme=light] .demo-chip.review{color:#846510}
@media(max-width:1100px){.hero{gap:25px}.demo-top{gap:8px;padding:15px}.demo-example{font-size:9px;letter-spacing:0}.demo-panel h3{font-size:21px}.demo-viewport{padding:20px 15px 10px}.demo-sources{gap:5px}.demo-sources>span{font-size:11px;padding:7px 8px}.booking-labels,.booking-row{grid-template-columns:1fr 55px 28px;gap:5px;padding:8px}.booking-row{font-size:10px}}
@media(max-width:850px){.hero{display:block;padding-top:40px}.hero h1{font-size:clamp(50px,9vw,85px)}.hero-copy{max-width:650px}.processing-demo{max-width:650px;margin:20px auto 40px}.demo-viewport{height:360px;padding:22px}.demo-panel h3{font-size:26px}.demo-example{font-size:10px}.booking-labels,.booking-row{font-size:12px;grid-template-columns:1fr 70px 40px;gap:12px;padding:10px}.demo-top{padding:18px}.hero .hero-bottom{display:flex}.demo-sources>span{font-size:12px;padding:8px 11px}}
@media(max-width:390px){.demo-example{max-width:95px}.demo-viewport{padding:18px 12px;height:355px}.demo-panel h3{font-size:22px}.demo-panel-heading{font-size:9px}.booking-labels,.booking-row{font-size:10px;grid-template-columns:1fr 56px 26px;gap:6px;padding:9px 7px}.demo-steps{gap:5px;padding-inline:12px}.demo-steps button{font-size:11px}.demo-sources>span{font-size:10px;padding:8px}.demo-top{padding:12px}.demo-bottom{padding:14px}.demo-invoice{padding:14px;gap:8px}}
@media(prefers-reduced-motion:reduce){.demo-track>span{transition:none}.demo-scan{display:none}}
.demo-viewport{height:400px}.demo-example,.demo-panel-heading,.demo-chip,.invoice-arrival,.booking-labels,.booking-row,.booking-row small,.booking-row>span{font-size:12px}.demo-panel-heading{letter-spacing:.4px}.demo-example{letter-spacing:0}.demo-steps button{min-height:40px}.demo-top{gap:10px}.demo-example{max-width:145px;line-height:1.35}@media(max-width:1100px){.demo-example{max-width:110px}.demo-viewport{height:420px}.demo-panel h3{font-size:23px}}@media(max-width:760px){.demo-viewport{height:400px}.demo-example{max-width:none}.demo-sources>span,.demo-steps button{font-size:12px}}@media(max-width:390px){.demo-example{max-width:95px}.demo-viewport{height:430px}.demo-top{gap:7px}.demo-brand{font-size:17px}}
.scene-stage .scene-window{--angle:0deg!important}
.hero .processing-demo{transform:perspective(1400px) rotateY(-7deg) rotateX(2deg);transform-origin:center;box-shadow:16px 28px 36px -20px #0009,32px 50px 90px -30px #0009,inset -2px 0 0 #c9dfb115;backface-visibility:hidden}
.hero .processing-demo:after{content:'';position:absolute;z-index:-2;left:9%;right:3%;bottom:-36px;height:30px;background:#0005;border-radius:50%;filter:blur(20px);pointer-events:none;transform:rotate(-3deg)}
[data-theme=light] .hero .processing-demo{box-shadow:16px 28px 36px -20px #23391a35,32px 50px 90px -30px #23391a45,inset -2px 0 0 #66844920}
[data-theme=light] .hero .processing-demo:after{background:#314e2928}
@media(max-width:850px){.hero .processing-demo{transform:perspective(1400px) rotateY(-3deg) rotateX(1deg);box-shadow:10px 24px 50px -20px #0007}}
@media(max-width:480px){.hero .processing-demo{transform:none}.hero .processing-demo:after{bottom:-24px;height:20px}}

/* A quiet engine pulse: the window lifts, gently expands and settles again. */
@media(prefers-reduced-motion:no-preference){
 .hero .processing-demo{--demo-tilt-y:-7deg;--demo-tilt-x:2deg;--demo-lift:-3px;--demo-sway:.7px;--demo-yaw:.5deg;--demo-pitch:-.2deg;--demo-breathe:1.003;animation:demo-window-pulse 8s var(--ease-in-out,cubic-bezier(.77,0,.175,1)) infinite;animation-play-state:paused}
 .hero .processing-demo:before,.hero .processing-demo:after{animation:demo-engine-glow 8s var(--ease-in-out,cubic-bezier(.77,0,.175,1)) infinite;animation-play-state:paused}
 .hero .processing-demo:after{animation-name:demo-engine-shadow}
 .hero .processing-demo.is-window-active,.hero .processing-demo.is-window-active:before,.hero .processing-demo.is-window-active:after{animation-play-state:running}
 .hero .processing-demo.is-window-active{will-change:transform}
 .hero .processing-demo:has(:focus-visible),.hero .processing-demo:has(:focus-visible):before,.hero .processing-demo:has(:focus-visible):after{animation-play-state:paused}
 @keyframes demo-window-pulse{
  0%,100%{transform:perspective(1400px) translate3d(0,0,0) rotateY(var(--demo-tilt-y)) rotateX(var(--demo-tilt-x)) scale(1)}
  50%{transform:perspective(1400px) translate3d(var(--demo-sway),var(--demo-lift),0) rotateY(calc(var(--demo-tilt-y) + var(--demo-yaw))) rotateX(calc(var(--demo-tilt-x) + var(--demo-pitch))) scale(var(--demo-breathe))}
 }
 @keyframes demo-engine-glow{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:.75;transform:scale(1.015)}}
 @keyframes demo-engine-shadow{0%,100%{opacity:.75;transform:rotate(-3deg) scaleX(1)}50%{opacity:.65;transform:rotate(-3deg) scaleX(.98)}}
}
@media(min-width:481px) and (max-width:850px){.hero .processing-demo{--demo-tilt-y:-3deg;--demo-tilt-x:1deg;--demo-lift:-2px;--demo-yaw:.35deg;--demo-breathe:1.002}}
@media(max-width:480px){.hero .processing-demo{--demo-tilt-y:0deg;--demo-tilt-x:0deg;--demo-lift:-1px;--demo-sway:.2px;--demo-yaw:.12deg;--demo-pitch:-.08deg;--demo-breathe:1.001}}
@media(prefers-reduced-motion:reduce){.hero .processing-demo,.hero .processing-demo:before,.hero .processing-demo:after{animation:none;will-change:auto}}
