/* Twice the original two-row screen; the final quarter is half the added height. */
.hero-window { height:calc(var(--order-base-height,374px)*2); display:grid; grid-template-rows:auto minmax(0,1fr); overflow:hidden; position:relative; -webkit-mask-image:linear-gradient(#000 0 75%,transparent 100%); mask-image:linear-gradient(#000 0 75%,transparent 100%); }
.motion-ready .hero-window { opacity:1!important; filter:none!important; transform:none!important; }
.hero-window .window-body { min-height:0; }
.hero-window .window-main { min-height:0; overflow:hidden; position:relative; }
.hero-window .table-wrap { overflow:hidden; }
.hero-window:after { content:''; position:absolute; z-index:3; inset:75% 0 0; pointer-events:none; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); background:linear-gradient(transparent,#fff9); -webkit-mask-image:linear-gradient(transparent,#000 65%); mask-image:linear-gradient(transparent,#000 65%); }
.motion-ready .hero-window tbody tr { animation:none; }
.order-demo-ready .hero-window tbody tr { opacity:0; transform:translateY(-9px); transition:opacity .25s ease,transform .38s cubic-bezier(.2,.75,.25,1); }
.order-demo-ready .hero-window tbody tr.is-arrived { opacity:1; transform:translateY(0); }
.order-demo-ready .hero-window tbody tr.order-update td { animation:order-update .48s ease-out; }
.hero-window .hero-tracking { display:block; height:13px; margin-top:3px; font-size:9px; line-height:13px; color:#8a9ab0; white-space:nowrap; font-variant-numeric:tabular-nums; }
.hero-window .status { transition:color .2s,background .2s; }
.hero-window .status.is-received { color:#d87b23; background:#fff4e9; }
.hero-window .status.is-paid { color:#4965dc; background:#edf1ff; }
.hero-window .status.is-waybill { color:#248c99; background:#eaf7f8; }
.hero-window .status.is-delivered { color:#198863; background:#eaf8f1; }
@keyframes order-update { from { background:#eaf2ff; } to { background:transparent; } }
.motion-paused .hero-window tbody tr { opacity:1!important; animation:none!important; transform:none!important; transition:none; }
.motion-paused .hero-window td { animation:none!important; }
.order-success { position:absolute; z-index:5; left:50%; top:50%; width:280px; max-width:calc(100% - 28px); display:flex; align-items:center; justify-content:center; gap:15px; padding:21px 24px; border:1px solid #dceee5; border-radius:18px; background:#fffffff5; box-shadow:0 16px 50px #173e2b1c,0 3px 12px #173e2b0a; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); pointer-events:none; opacity:0; visibility:hidden; transform:translate(-50%,-50%); }
.order-success.is-showing { visibility:visible; animation:order-success-show 1.6s both; }
.order-success-mark { position:relative; display:grid; place-items:center; flex-shrink:0; width:48px; height:48px; border-radius:50%; color:#19a46f; background:#e7f8ef; }
.order-success-mark:after { content:''; position:absolute; inset:0; border:1px solid #44bc8c; border-radius:50%; opacity:0; }
.order-success-mark svg { width:27px; height:27px; overflow:visible; }
.order-success-mark path { stroke-dasharray:30; stroke-dashoffset:0; }
.order-success.is-showing .order-success-mark:after { animation:order-success-ring .65s ease-out; }
.order-success.is-showing .order-success-mark path { animation:order-success-check .34s .05s both; }
.order-success-copy { min-width:0; text-align:left; }
.order-success-copy strong { display:block; font-size:17px; line-height:1.5; font-weight:600; letter-spacing:-.4px; color:#183a2d; white-space:nowrap; }
.order-success-copy small { display:block; margin-top:3px; font-size:11px; color:#81928a; }
@keyframes order-success-show { 0% { opacity:0; transform:translate(-50%,calc(-50% + 12px)) scale(.95); } 15%,85% { opacity:1; transform:translate(-50%,-50%) scale(1); } 100% { opacity:0; transform:translate(-50%,calc(-50% - 5px)) scale(.98); } }
@keyframes order-success-check { from { stroke-dashoffset:30; } to { stroke-dashoffset:0; } }
@keyframes order-success-ring { from { opacity:.6; transform:scale(.95); } to { opacity:0; transform:scale(1.45); } }
.motion-paused .order-success { display:none; }
@media(max-width:600px) { .hero-window { --order-base-height:318px; } .hero-window .hero-tracking { font-size:7px; height:11px; line-height:11px; margin-top:2px; } }
@media(max-width:600px) { .order-success { width:240px; gap:11px; padding:17px 14px; border-radius:15px; } .order-success-mark { width:40px; height:40px; } .order-success-copy strong { font-size:15px; } .order-success-copy small { font-size:10px; } }
@media(prefers-reduced-motion:reduce) {
  html:not([data-motion-opt-in]) .order-demo-ready .hero-window tbody tr { opacity:1; animation:none!important; transform:none; transition:none; }
  html:not([data-motion-opt-in]) .hero-window td { animation:none!important; }
  html:not([data-motion-opt-in]) .hero-window .status { transition:none; }
  html:not([data-motion-opt-in]) .order-success { display:none; }
}
