:root {
  --ink: #040c2d;
  --ink-soft: #0a1538;
  --paper: #f4f2ec;
  --paper-bright: #fbfaf7;
  --white: #ffffff;
  --text: #111a33;
  --muted: #667085;
  --line: #d5d8df;
  --sky: #4682b4;
  --teal: #008080;
  --amber: #e8a11b;
  --coral: #c75050;
  --max: 1320px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: clip;
  color: var(--text);
  background: var(--paper);
  font-family: "Manrope", sans-serif;
}
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
.grain {
  position: fixed;
  inset: 0;
  z-index: 50;
  opacity: .035;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.site-header {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 20;
  width: min(calc(100% - 40px), var(--max));
  height: 82px;
  transform: translateX(-50%);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 28px;
  color: var(--white);
  border-bottom: 1px solid rgba(255, 255, 255, .18);
}
.brand { display: inline-flex; align-items: center; gap: 11px; width: max-content; }
.brand-symbol { position: relative; width: 35px; height: 35px; display: block; }
.brand-symbol i { position: absolute; border: 2px solid currentColor; }
.brand-symbol i:nth-child(1) { left: 2px; top: 3px; width: 17px; height: 29px; border-radius: 11px 3px 3px 11px; }
.brand-symbol i:nth-child(2) { right: 1px; top: 3px; width: 17px; height: 29px; border-radius: 3px 11px 11px 3px; }
.brand-symbol i:nth-child(3) { left: 14px; top: 14px; width: 7px; height: 7px; border: 0; border-radius: 50%; background: currentColor; }
.brand-word { font: 700 1.18rem "Space Grotesk", sans-serif; letter-spacing: -.045em; }
.brand-word > span { color: #79a8ce; }
.main-nav { display: flex; gap: 32px; color: #c8d1e2; font-size: .78rem; font-weight: 600; }
.main-nav a { transition: color 180ms ease; }.main-nav a:hover { color: var(--white); }
.header-cta { justify-self: end; display: flex; align-items: center; gap: 15px; padding: 11px 14px; border: 1px solid rgba(255,255,255,.3); font-size: .76rem; font-weight: 700; transition: background 180ms ease, color 180ms ease; }
.header-cta:hover { color: var(--ink); background: var(--white); }

main, footer { width: min(calc(100% - 40px), var(--max)); margin-inline: auto; }
.hero {
  position: relative;
  width: 100vw;
  min-height: 900px;
  margin-left: calc(50% - 50vw);
  padding: 160px max(20px, calc((100vw - var(--max)) / 2)) 95px;
  display: grid;
  grid-template-columns: minmax(390px, .76fr) minmax(640px, 1.24fr);
  gap: 42px;
  align-items: center;
  color: var(--white);
  background: var(--ink);
  overflow: hidden;
}
.hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to right, black, transparent 75%); }
.hero-copy { position: relative; z-index: 3; align-self: center; }
.maker-pill { width: max-content; padding: 6px 10px 6px 6px; display: flex; align-items: center; gap: 9px; border: 1px solid rgba(255,255,255,.2); color: #bdc7da; font: 500 .61rem "DM Mono", monospace; }
.af-mark { width: 27px; height: 27px; display: grid; place-items: center; color: var(--ink); background: var(--white); font: 700 .6rem "Space Grotesk", sans-serif; }
.hero h1 { margin: 35px 0 0; font: 600 clamp(4rem, 6.3vw, 7rem)/.91 "Space Grotesk", sans-serif; letter-spacing: -.065em; }
.hero h1 span { color: transparent; -webkit-text-stroke: 1.5px #7fa9cc; }
.hero-lead { max-width: 590px; margin: 30px 0 0; color: #aeb9ce; font-size: 1.02rem; line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.button { min-height: 55px; padding: 0 19px; display: inline-flex; align-items: center; justify-content: space-between; gap: 25px; border: 1px solid transparent; font-size: .8rem; font-weight: 800; transition: transform 180ms ease, box-shadow 180ms ease; }
.button:hover { transform: translateY(-3px); }
.button-light { color: var(--ink); background: var(--white); }.button-light:hover { box-shadow: 0 7px 0 rgba(70,130,180,.8); }
.button-line { border-color: rgba(255,255,255,.24); color: var(--white); background: transparent; }.button-line:hover { border-color: var(--white); }
.play { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; font-size: .42rem; font-style: normal; }
.hero-capabilities { margin-top: 38px; display: flex; flex-wrap: wrap; gap: 8px; }
.hero-capabilities span { padding: 6px 9px; color: #8493ae; border: 1px solid rgba(255,255,255,.13); font: .55rem "DM Mono", monospace; }

.hero-product { position: relative; z-index: 2; min-height: 660px; perspective: 1300px; }
.pos-device { position: absolute; top: 30px; left: 4%; width: 94%; transform: rotateY(-4deg) rotateX(1.5deg); transform-style: preserve-3d; transition: transform 160ms ease-out; }
.pos-screen { overflow: hidden; border: 7px solid #11192f; border-radius: 17px; background: #eef1f6; box-shadow: 0 40px 90px rgba(0,0,0,.46); }
.pos-camera { position: absolute; z-index: 3; top: 4px; left: 50%; width: 35px; height: 6px; transform: translateX(-50%); border-radius: 5px; background: #273149; }
.pos-topbar { height: 45px; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; color: #dce5f3; background: #0a1437; font-size: .47rem; }
.mini-brand { display: flex; align-items: center; gap: 7px; font: 700 .66rem "Space Grotesk", sans-serif; }.mini-brand b { width: 13px; height: 13px; border: 2px solid #78a7cd; border-radius: 50%; }
.cashier { padding: 6px 8px; border: 1px solid #263454; border-radius: 4px; }.cashier i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #57bcae; }
.clock { font-family: "DM Mono", monospace; }
.pos-body { min-height: 448px; display: grid; grid-template-columns: 70px 1fr 215px; color: #16203a; }
.category-rail { padding: 13px 7px; display: flex; flex-direction: column; gap: 7px; background: #e4e9f1; border-right: 1px solid #d4dae5; }
.category-rail button { min-height: 45px; padding: 6px 4px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: #718097; font-size: .43rem; line-height: 1.25; }.category-rail button.active { color: var(--white); background: #162143; }
.product-area { padding: 14px; min-width: 0; }
.product-search { height: 33px; padding: 0 11px; display: flex; align-items: center; gap: 7px; border: 1px solid #d8dde6; border-radius: 5px; background: var(--white); color: #9aa5b6; font-size: .48rem; }.product-search span { font-size: .85rem; }
.product-grid { margin-top: 12px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.product-grid article { overflow: hidden; min-width: 0; padding-bottom: 8px; border: 1px solid #d9dee7; border-radius: 5px; background: var(--white); }
.product-pic { height: 72px; display: grid; place-items: center; color: rgba(255,255,255,.92); font: 700 .5rem "Space Grotesk", sans-serif; letter-spacing: .08em; }
.product-pic span { padding: 7px 5px; border: 1px solid currentColor; }.pic-red { background: #b64545; }.pic-blue { background: #4a78a1; }.pic-gold { background: #c99534; }.pic-teal { background: #3b837c; }.pic-black { background: #262b36; }.pic-coral { background: #c86b5f; }
.product-grid b, .product-grid small { display: block; padding-inline: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.product-grid b { margin-top: 7px; font-size: .49rem; }.product-grid small { margin-top: 4px; color: #517fa8; font-size: .48rem; font-weight: 800; }
.basket { padding: 15px 14px; border-left: 1px solid #d5dbe4; background: var(--white); }
.basket-head { display: flex; align-items: center; justify-content: space-between; }.basket-head small, .basket-head strong { display: block; }.basket-head small { color: #748196; font: .43rem "DM Mono", monospace; }.basket-head strong { margin-top: 4px; font-size: .82rem; }.basket-head > span { padding: 4px 6px; border-radius: 3px; color: #496f91; background: #edf3f8; font-size: .44rem; }
.basket-item { padding: 12px 0; display: grid; grid-template-columns: 9px 1fr auto; align-items: center; gap: 7px; border-bottom: 1px solid #e5e8ed; }.basket-item .dot { width: 7px; height: 7px; border-radius: 50%; }.dot.red { background: var(--coral); }.dot.gold { background: var(--amber); }.dot.blue { background: var(--sky); }.basket-item b, .basket-item small { display: block; }.basket-item b { font-size: .47rem; }.basket-item small { margin-top: 3px; color: #8b96a7; font-size: .41rem; }.basket-item > strong { font-size: .46rem; }
.discount-line { margin-top: 38px; padding: 8px; display: flex; justify-content: space-between; color: #29756e; background: #edf7f5; font-size: .42rem; }
.basket-total { margin-top: 12px; display: flex; align-items: end; justify-content: space-between; }.basket-total span { color: #778397; font: .44rem "DM Mono", monospace; }.basket-total strong { font-size: 1rem; }
.payment-button { width: 100%; height: 38px; margin-top: 12px; padding: 0 11px; display: flex; align-items: center; justify-content: space-between; border: 0; border-radius: 4px; color: var(--white); background: #467ca8; font-size: .49rem; font-weight: 700; }
.pos-stand { position: relative; width: 220px; height: 65px; margin: 0 auto; background: linear-gradient(100deg, #11192e, #26314a 52%, #10182c); clip-path: polygon(34% 0, 66% 0, 78% 80%, 100% 92%, 100% 100%, 0 100%, 0 92%, 22% 80%); }.pos-stand i { position: absolute; inset: auto 0 0; height: 8px; background: #0b1020; }
.floating-receipt { position: absolute; z-index: 4; right: -2%; bottom: -5px; width: 152px; padding: 16px 13px 13px; color: #1d2639; background: #fffefa; box-shadow: 0 20px 50px rgba(0,0,0,.3); transform: rotate(4deg); animation: receiptFloat 6s ease-in-out infinite; }
.floating-receipt::after { content: ""; position: absolute; left: 0; right: 0; bottom: -7px; height: 8px; background: linear-gradient(135deg, #fffefa 5px, transparent 0) 0 0/10px 10px repeat-x; }
.receipt-brand { text-align: center; font: 800 .75rem "Space Grotesk", sans-serif; }.floating-receipt > span { display: block; margin: 5px 0 12px; color: #758091; text-align: center; font: .42rem "DM Mono", monospace; }.floating-receipt p { margin: 6px 0; display: flex; justify-content: space-between; font-size: .42rem; }.floating-receipt hr { border: 0; border-top: 1px dashed #9ba2ad; }.floating-receipt > strong { display: flex; justify-content: space-between; font-size: .47rem; }.barcode { height: 25px; margin-top: 12px; background: repeating-linear-gradient(90deg, #1a1a1a 0 1px, transparent 1px 3px, #1a1a1a 3px 5px, transparent 5px 6px, #1a1a1a 6px 7px, transparent 7px 10px); }
.sale-toast { position: absolute; z-index: 5; left: -2%; top: 6px; padding: 11px 13px; display: flex; align-items: center; gap: 10px; color: #18233c; background: var(--white); box-shadow: 0 14px 45px rgba(0,0,0,.28); animation: toastFloat 5s 1s ease-in-out infinite; }.sale-toast > span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; color: var(--white); background: var(--teal); font-size: .65rem; }.sale-toast strong, .sale-toast small { display: block; }.sale-toast strong { font-size: .58rem; }.sale-toast small { margin-top: 3px; color: #8993a3; font-size: .44rem; }
.scan-beam { position: absolute; z-index: 6; top: 96px; left: 10%; right: 6%; height: 1px; background: rgba(103,183,226,.85); box-shadow: 0 0 13px #6aa9ce; animation: scanHero 5s ease-in-out infinite; }

.trust-strip { width: 100vw; margin-left: calc(50% - 50vw); padding: 20px max(20px, calc((100vw - var(--max))/2)); display: flex; align-items: center; justify-content: space-between; gap: 20px; overflow: hidden; border-bottom: 1px solid #cbd0d8; background: #e8e9e7; color: #4c5668; font: 500 .57rem "DM Mono", monospace; letter-spacing: .05em; white-space: nowrap; }.trust-strip i { width: 5px; height: 5px; flex: 0 0 auto; border-radius: 50%; background: var(--sky); }

.section { padding-top: 135px; }
.section-heading { display: grid; grid-template-columns: 1.12fr .88fr; gap: 80px; align-items: end; }
.eyebrow { color: var(--sky); font: 500 .65rem "DM Mono", monospace; letter-spacing: .12em; }
.section-heading h2, .story-copy h2, .report-copy h2 { margin: 20px 0 0; font: 600 clamp(3.1rem, 5.8vw, 6rem)/.94 "Space Grotesk", sans-serif; letter-spacing: -.06em; }.section-heading h2 em, .report-copy h2 em { color: var(--sky); font-style: normal; }
.section-heading > p { max-width: 510px; margin: 0 0 7px; color: var(--muted); line-height: 1.8; }

.ecosystem { position: relative; min-height: 670px; margin-top: 60px; overflow: hidden; border: 1px solid #cbd0d8; background-color: #eeece6; background-image: linear-gradient(#d9d9d5 1px, transparent 1px), linear-gradient(90deg, #d9d9d5 1px, transparent 1px); background-size: 42px 42px; }
.ecosystem::before { content: "PITPOS / CONNECTED RETAIL"; position: absolute; left: 20px; top: 18px; color: #777e88; font: .56rem "DM Mono", monospace; }
.store-map { position: absolute; z-index: 3; left: 50%; top: 50%; width: 320px; height: 245px; transform: translate(-50%, -45%); }
.store-roof { position: absolute; left: 25px; right: 25px; top: 0; height: 70px; display: flex; align-items: center; justify-content: center; gap: 7px; color: var(--white); background: var(--ink); clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%); font: 600 1.35rem "Space Grotesk", sans-serif; letter-spacing: -.04em; }.store-roof b { color: #78a6cc; }
.store-window, .store-door { position: absolute; top: 80px; bottom: 22px; border: 3px solid var(--ink); background: #cadbe7; }
.store-window { display: flex; align-items: end; gap: 7px; padding: 11px; }.store-window i { flex: 1; height: 58%; border: 2px solid var(--ink); background: #f3f1eb; }.window-a { left: 0; width: 105px; }.window-b { right: 0; width: 105px; }
.store-door { left: 115px; width: 90px; }.store-door i { position: absolute; right: 9px; top: 48%; width: 7px; height: 7px; border-radius: 50%; background: var(--ink); }
.store-base { position: absolute; left: -16px; right: -16px; bottom: 10px; height: 14px; background: var(--ink); }
.orbit-line { position: absolute; z-index: 1; height: 2px; background: var(--sky); transform-origin: left center; }
.line-pos { width: 26%; left: 16%; top: 27%; transform: rotate(25deg); }.line-manage { width: 26%; right: 15%; top: 27%; transform-origin: right; transform: rotate(-25deg); }.line-mobile { width: 27%; left: 15%; bottom: 25%; transform: rotate(-24deg); }.line-cloud { width: 27%; right: 15%; bottom: 25%; transform-origin: right; transform: rotate(24deg); }
.orbit-line::after { content: ""; position: absolute; right: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--sky); }
.system-chip { position: absolute; z-index: 4; width: 210px; min-height: 80px; padding: 13px; display: flex; align-items: center; gap: 12px; border: 2px solid var(--ink); background: var(--paper-bright); box-shadow: 6px 6px 0 var(--ink); }.system-chip > span { width: 38px; height: 38px; display: grid; place-items: center; color: var(--white); background: var(--ink); font: .62rem "DM Mono", monospace; }.system-chip strong, .system-chip small { display: block; }.system-chip strong { font-size: .84rem; }.system-chip small { margin-top: 4px; color: var(--muted); font-size: .58rem; }.chip-pos { left: 5%; top: 13%; transform: rotate(-2deg); }.chip-manage { right: 5%; top: 13%; transform: rotate(2deg); }.chip-mobile { left: 5%; bottom: 10%; transform: rotate(1deg); }.chip-cloud { right: 5%; bottom: 10%; transform: rotate(-1.5deg); }
.data-packet { position: absolute; z-index: 2; padding: 5px 7px; color: var(--white); background: var(--sky); font: .46rem "DM Mono", monospace; }.packet-a { left: 28%; top: 31%; animation: packetA 5s ease-in-out infinite; }.packet-b { right: 28%; top: 38%; animation: packetB 6s 1s ease-in-out infinite; }.packet-c { left: 30%; bottom: 32%; animation: packetC 5.5s .5s ease-in-out infinite; }

.products { display: grid; gap: 150px; }
.product-story { display: grid; grid-template-columns: .72fr 1.28fr; gap: 75px; align-items: center; }
.story-management { grid-template-columns: 1.28fr .72fr; }.story-management .story-copy { grid-column: 2; grid-row: 1; }.story-management .story-visual { grid-column: 1; grid-row: 1; }
.story-index { color: var(--sky); font: 500 .63rem "DM Mono", monospace; letter-spacing: .1em; }
.story-copy h2 { font-size: clamp(2.7rem, 4.6vw, 4.75rem); }
.story-copy > p { margin: 25px 0 0; color: var(--muted); line-height: 1.8; }
.story-copy ul { margin: 28px 0 0; padding: 0; list-style: none; display: grid; gap: 11px; }.story-copy li { display: flex; gap: 10px; color: #354057; font-size: .82rem; }.story-copy li span { color: var(--teal); font-weight: 800; }
.story-visual { position: relative; min-width: 0; }
.visual-payment { min-height: 590px; display: grid; place-items: center; background: #dfe3e8; border: 1px solid #cbd0d8; }
.payment-screen { width: 68%; padding: 26px; background: #f9fafc; box-shadow: 0 25px 60px rgba(24,35,62,.16); }
.payment-head { display: flex; justify-content: space-between; align-items: end; padding-bottom: 21px; border-bottom: 1px solid #d9dee6; }.payment-head span { color: var(--muted); font: .58rem "DM Mono", monospace; }.payment-head b { font: 600 1.9rem "Space Grotesk", sans-serif; }
.payment-methods { margin-top: 17px; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.payment-methods button { min-height: 92px; padding: 10px; border: 1px solid #d8dde5; background: var(--white); text-align: left; }.payment-methods button.selected { color: var(--white); background: var(--ink); border-color: var(--ink); }.payment-methods i, .payment-methods span, .payment-methods small { display: block; }.payment-methods i { margin-bottom: 12px; font-style: normal; }.payment-methods span { font-size: .62rem; font-weight: 700; }.payment-methods small { margin-top: 4px; color: #8a96a9; font-size: .48rem; }
.device-status { margin-top: 12px; padding: 12px; display: flex; align-items: center; gap: 10px; border: 1px solid #d9dee6; background: var(--white); }.device-status > i { width: 28px; height: 37px; border: 2px solid #3f4b62; border-radius: 5px; }.device-status div { flex: 1; }.device-status strong, .device-status small { display: block; }.device-status strong { font-size: .58rem; }.device-status small { margin-top: 3px; color: var(--muted); font-size: .48rem; }.device-status > span { color: var(--teal); }
.complete-payment { width: 100%; height: 45px; margin-top: 12px; padding: 0 15px; display: flex; justify-content: space-between; align-items: center; border: 0; color: var(--white); background: var(--sky); font-size: .63rem; font-weight: 700; }
.approval-card { position: absolute; right: 4%; bottom: 35px; width: 185px; padding: 16px; border: 2px solid var(--ink); background: var(--paper-bright); box-shadow: 6px 6px 0 var(--ink); transform: rotate(3deg); }.approval-card > span { color: var(--coral); font: .5rem "DM Mono", monospace; }.approval-card strong, .approval-card p { display: block; }.approval-card strong { margin-top: 12px; font-size: .75rem; }.approval-card p { margin: 5px 0 12px; color: var(--muted); font-size: .52rem; }.approval-card button { width: 100%; padding: 8px; border: 0; color: var(--white); background: var(--teal); font-size: .5rem; }

.visual-dashboard { padding: 30px; min-height: 590px; display: grid; place-items: center; color: #16203a; background: var(--ink); }
.dashboard-window { width: 100%; min-height: 485px; display: grid; grid-template-columns: 120px 1fr; background: #eef1f5; box-shadow: 0 28px 70px rgba(0,0,0,.3); }
.dash-side { padding: 17px 11px; display: flex; flex-direction: column; gap: 7px; color: #8f9bb0; background: #0a1437; }.dash-logo { margin: 0 7px 17px; display: flex; gap: 7px; align-items: center; color: var(--white); font: 700 .68rem "Space Grotesk", sans-serif; }.dash-logo b { width: 13px; height: 13px; border: 2px solid #6c9bc2; border-radius: 50%; }.dash-side > span { padding: 9px 8px; border-radius: 4px; font-size: .48rem; }.dash-side > span i { display: inline-block; width: 16px; font-style: normal; }.dash-side > span.active { color: var(--white); background: #202d51; }
.dash-main { padding: 20px; min-width: 0; }.dash-title { display: flex; justify-content: space-between; align-items: center; }.dash-title small, .dash-title strong { display: block; }.dash-title small { color: #78869b; font: .48rem "DM Mono", monospace; }.dash-title strong { margin-top: 4px; font-size: .95rem; }.dash-title > span { padding: 5px 7px; color: #28786f; background: #e5f4f0; font-size: .47rem; }.dash-title > span i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: var(--teal); }
.dash-metrics { margin-top: 16px; display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }.dash-metrics article { padding: 10px; border: 1px solid #d8dde6; background: var(--white); }.dash-metrics span, .dash-metrics strong, .dash-metrics small { display: block; }.dash-metrics span { color: #7f8b9e; font-size: .45rem; }.dash-metrics strong { margin: 7px 0 5px; font: 600 .77rem "Space Grotesk", sans-serif; }.dash-metrics small { color: #278076; font-size: .4rem; }.dash-metrics small.warn { color: #b57915; }
.dash-lower { margin-top: 8px; display: grid; grid-template-columns: 1.4fr .6fr; gap: 8px; }.sales-chart, .register-list { min-width: 0; padding: 12px; border: 1px solid #d8dde6; background: var(--white); }.chart-title { display: flex; justify-content: space-between; font-size: .54rem; }.chart-title span { color: var(--sky); font-weight: 700; }.sales-chart svg { width: 100%; height: 155px; margin-top: 8px; overflow: visible; }.chart-grid { fill: none; stroke: #e9ebef; stroke-width: 1; }.chart-area { fill: rgba(70,130,180,.12); }.chart-stroke { fill: none; stroke: var(--sky); stroke-width: 3; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1; }.is-visible .chart-stroke { animation: chartDraw 2.3s .4s ease forwards; }
.register-list > strong { display: block; margin-bottom: 8px; font-size: .54rem; }.register-list > div { padding: 9px 0; display: grid; grid-template-columns: 7px 1fr auto; gap: 6px; align-items: center; border-top: 1px solid #eceef2; }.register-list i { width: 6px; height: 6px; border-radius: 50%; background: var(--teal); }.register-list span, .register-list small { display: block; font-size: .43rem; }.register-list small { margin-top: 2px; color: #98a1af; font-size: .36rem; }.register-list b { font-size: .42rem; }

.visual-terminal { min-height: 630px; display: grid; place-items: center; background: #d9d5cd; border: 1px solid #cac5bd; }
.handheld { position: relative; width: 270px; height: 575px; padding: 15px 13px 24px; border: 4px solid #172139; border-radius: 26px 26px 38px 38px; background: #26324a; box-shadow: 0 28px 65px rgba(20,29,49,.28); transform: rotate(-3deg); }
.handheld::after { content: ""; position: absolute; left: 65px; right: 65px; bottom: -50px; height: 70px; border-radius: 0 0 40px 40px; background: #1b263d; z-index: -1; }
.handheld-speaker { width: 45px; height: 5px; margin: 0 auto 8px; border-radius: 4px; background: #111a2c; }
.handheld-screen { height: 478px; overflow: hidden; border-radius: 8px; background: #f3f5f8; color: #17213b; }.mobile-bar { height: 35px; padding: 0 9px; display: flex; align-items: center; gap: 7px; color: var(--white); background: var(--ink); font-size: .48rem; }.mobile-bar b { width: 10px; height: 10px; border: 2px solid #75a6cb; border-radius: 50%; }.mobile-bar span { flex: 1; }.mobile-bar i { color: #6dc1b3; font-style: normal; font-size: .44rem; }
.mobile-title { margin: 10px 10px 8px; padding: 12px; border-radius: 6px; background: #040c2d; }.mobile-title small { color: #b8c2d6; font: .39rem "DM Mono", monospace; }.mobile-title strong { display: block; margin-top: 5px; color: #fff; font-size: .78rem; }.mobile-title p { margin: 5px 0 0; color: #b8c2d6; font-size: .41rem; line-height: 1.45; }
.scanner-box { position: relative; min-height: 88px; margin: 0 10px 8px; padding: 10px; border: 1px solid #e4e7ec; border-radius: 6px; background: #fff; overflow: hidden; }.terminal-section-head strong, .terminal-section-head small { display: block; }.terminal-section-head strong { font-size: .48rem; }.terminal-section-head small { margin-top: 3px; color: #64748b; font-size: .37rem; }.terminal-barcode-field { height: 31px; margin-top: 8px; padding-left: 8px; display: flex; align-items: center; justify-content: space-between; border: 1px solid #d0d5dd; border-radius: 4px; color: #334155; font: .39rem "DM Mono", monospace; }.terminal-barcode-field b { height: 100%; padding: 0 9px; display: grid; place-items: center; border-radius: 0 3px 3px 0; color: #fff; background: #4682b4; font: 700 .36rem "Manrope", sans-serif; }
.found-product { margin: 0 10px; padding: 9px; display: grid; grid-template-columns: 38px 1fr; gap: 8px; align-items: center; border: 1px solid #e4e7ec; border-radius: 6px; background: var(--white); }.found-pic { width: 38px; height: 45px; display: grid; place-items: center; border-radius: 5px; color: var(--white); background: var(--sky); font: 700 .5rem "Space Grotesk", sans-serif; }.found-product small, .found-product strong, .found-product span { display: block; }.found-product small { color: #8c97a6; font: .35rem "DM Mono", monospace; }.found-product strong { margin: 3px 0; font-size: .48rem; }.found-product span { color: #008080; font-size: .41rem; }
.count-field { margin: 8px 10px; padding: 8px 10px; display: grid; grid-template-columns: 1fr auto; align-items: end; border: 1px solid #e4e7ec; border-radius: 6px; background: var(--white); }.count-field span { color: #64748b; font-size: .41rem; }.count-field strong { font: 600 1rem "Space Grotesk", sans-serif; }.count-field i { grid-column: 1 / -1; margin-top: 3px; color: var(--teal); font-size: .4rem; font-style: normal; }.handheld-screen > button { width: calc(100% - 20px); height: 32px; margin: 0 10px; border: 0; border-radius: 5px; color: var(--white); background: var(--sky); font-size: .47rem; font-weight: 700; }
.handheld-keys { height: 48px; display: flex; justify-content: center; align-items: center; gap: 18px; }.handheld-keys i { width: 9px; height: 9px; border: 1px solid #8692a7; border-radius: 50%; }.handheld-keys i:nth-child(2) { width: 25px; height: 25px; }
.label-preview { position: absolute; right: 7%; bottom: 43px; width: 175px; padding: 15px; border: 2px solid var(--ink); background: #fffdf6; box-shadow: 6px 6px 0 var(--ink); transform: rotate(5deg); }.label-preview span, .label-preview strong, .label-preview small, .label-preview b { display: block; }.label-preview span { color: var(--sky); font: .46rem "DM Mono", monospace; }.label-preview strong { margin: 11px 0 5px; font-size: .68rem; }.label-preview small { color: #7b8390; font: .4rem "DM Mono", monospace; }.label-preview > b { margin-top: 12px; font: 700 1.8rem "Space Grotesk", sans-serif; }.barcode.small { height: 18px; margin-top: 8px; }

.compact { grid-template-columns: 1.2fr .8fr; }
.feature-grid { margin-top: 55px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.feature-card { position: relative; overflow: hidden; min-height: 390px; padding: 25px; border: 1px solid #cbd0d8; background: var(--paper-bright); }.feature-wide { grid-column: span 2; }.feature-dark { color: var(--white); background: var(--ink); border-color: var(--ink); }
.feature-copy { position: relative; z-index: 2; max-width: 450px; }.feature-copy > span { color: var(--sky); font: .55rem "DM Mono", monospace; }.feature-copy h3 { margin: 15px 0 10px; font: 600 1.55rem "Space Grotesk", sans-serif; letter-spacing: -.035em; }.feature-copy p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.7; }.feature-dark .feature-copy p { color: #9aa8bd; }
.catalog-visual { position: absolute; left: 25px; right: 25px; bottom: 20px; border: 1px solid #d7dce4; background: var(--white); }.catalog-row { min-height: 45px; padding: 0 12px; display: grid; grid-template-columns: 1.5fr .45fr .6fr .6fr; gap: 8px; align-items: center; border-top: 1px solid #e4e7ec; font-size: .54rem; }.catalog-row.head { min-height: 30px; color: #8792a1; background: #f1f3f6; border-top: 0; font: .43rem "DM Mono", monospace; }.catalog-row > span { display: flex; align-items: center; gap: 7px; }.catalog-row em { width: max-content; padding: 4px 6px; color: #28776e; background: #e8f5f2; font-size: .43rem; font-style: normal; }.catalog-row em.pending { color: #9c6a17; background: #fff3dc; }.mini-product { width: 22px; height: 25px; display: block; }.mini-product.blue { background: var(--sky); }.mini-product.red { background: var(--coral); }.mini-product.gold { background: var(--amber); }
.campaign-ticket { position: absolute; left: 50%; bottom: 31px; width: 220px; min-height: 135px; padding: 20px; transform: translateX(-50%) rotate(-3deg); border: 2px solid var(--ink); background: #f4d06f; box-shadow: 6px 6px 0 var(--ink); }.campaign-ticket small, .campaign-ticket strong, .campaign-ticket span { display: block; }.campaign-ticket small { font: .48rem "DM Mono", monospace; }.campaign-ticket strong { margin-top: 13px; font: 700 1.35rem "Space Grotesk", sans-serif; }.campaign-ticket span { margin-top: 5px; font-size: .55rem; }.campaign-ticket i { position: absolute; right: 13px; top: 12px; padding: 4px 6px; color: var(--white); background: var(--teal); font: normal .42rem "DM Mono", monospace; }
.invoice-paper { position: absolute; left: 50%; bottom: 22px; width: 230px; padding: 17px; transform: translateX(-50%) rotate(2deg); background: var(--white); box-shadow: 0 15px 35px rgba(24,35,62,.13); }.invoice-paper > div { display: flex; justify-content: space-between; font-size: .48rem; }.invoice-paper p { margin: 14px 0; font-size: .58rem; }.invoice-paper hr { border: 0; border-top: 1px dashed #b9bec7; }.invoice-paper small, .invoice-paper > strong { padding: 4px 0; display: flex; justify-content: space-between; font-size: .48rem; }.invoice-paper > strong { margin-top: 5px; padding-top: 9px; border-top: 1px solid #333; }
.shelf-stack { position: absolute; left: 50%; bottom: 24px; width: 240px; transform: translateX(-50%); }.shelf-stack > div { height: 58px; margin-top: -6px; padding: 0 14px; display: flex; justify-content: space-between; align-items: center; border: 2px solid var(--ink); background: #fffdf8; box-shadow: 4px 4px 0 var(--ink); transform: rotate(-2deg); font-size: .57rem; }.shelf-stack > div:nth-child(2) { transform: rotate(2deg); }.shelf-stack > div:nth-child(3) { transform: rotate(-1deg); }.shelf-stack b { font: 700 .9rem "Space Grotesk", sans-serif; }
.market-flow { position: absolute; left: 25px; right: 25px; bottom: 31px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; }.market-flow > span { height: 62px; display: grid; place-items: center; border: 2px solid var(--ink); font: 700 .8rem "Space Grotesk", sans-serif; }.market-flow > span:last-of-type { color: var(--white); background: var(--ink); }.market-flow > i { font-style: normal; }.market-flow > div { grid-column: 1 / -1; display: flex; justify-content: center; gap: 6px; }.market-flow b { padding: 5px 7px; color: var(--sky); background: #e9f0f6; font: 500 .42rem "DM Mono", monospace; }
.device-row { position: absolute; left: 25px; right: 25px; bottom: 25px; display: grid; gap: 7px; }.device-row > div { padding: 10px; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 9px; border: 1px solid #2e3a5b; }.device-row i { width: 22px; height: 29px; border: 2px solid #7182a0; border-radius: 4px; }.device-row span { font-size: .58rem; }.device-row small { color: #71c5b7; font: .43rem "DM Mono", monospace; }

.reports { display: grid; grid-template-columns: .68fr 1.32fr; gap: 70px; align-items: center; }
.report-copy > p { margin: 27px 0 0; color: var(--muted); line-height: 1.8; }.report-tags { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 7px; }.report-tags span { padding: 7px 9px; border: 1px solid #c9ced7; font-size: .57rem; }
.profit-board { padding: 28px; border: 1px solid #c7ccd5; background: var(--white); box-shadow: 10px 10px 0 var(--ink); }.profit-head { display: flex; justify-content: space-between; align-items: start; }.profit-head small, .profit-head strong { display: block; }.profit-head small { color: var(--sky); font: .53rem "DM Mono", monospace; }.profit-head strong { margin-top: 6px; font-size: .9rem; }.profit-head button { padding: 8px 10px; border: 1px solid #cdd2da; background: transparent; font-size: .5rem; }
.profit-total { margin-top: 30px; padding: 23px; color: var(--white); background: var(--ink); }.profit-total span, .profit-total strong, .profit-total small { display: block; }.profit-total span { color: #94a2b8; font-size: .55rem; }.profit-total strong { margin: 9px 0; font: 600 2.3rem "Space Grotesk", sans-serif; }.profit-total small { color: #a6b1c2; font-size: .52rem; }.profit-total small b { color: #7ec7bb; }
.profit-bars { margin-top: 23px; display: grid; gap: 15px; }.profit-bars > div { display: grid; grid-template-columns: 95px 1fr 80px; gap: 10px; align-items: center; font-size: .58rem; }.profit-bars i { height: 10px; background: #e9ecf0; }.profit-bars i b { display: block; width: var(--w); height: 100%; background: var(--sky); transform-origin: left; transform: scaleX(0); }.is-visible .profit-bars i b { animation: barGrow 1.3s .4s ease forwards; }.profit-bars strong { text-align: right; }
.profit-footer { margin-top: 25px; padding-top: 17px; display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid #dde1e7; }.profit-footer span { color: var(--muted); font-size: .5rem; }.profit-footer b { display: block; margin-top: 4px; color: var(--text); font-size: .7rem; }

.security-strip { margin-top: 130px; padding: 28px 32px; display: grid; grid-template-columns: .7fr 1.2fr 1fr; gap: 35px; align-items: center; border: 2px solid var(--ink); background: #d7e5ee; }.security-strip > div:first-child { display: flex; align-items: center; gap: 12px; }.shield { width: 37px; height: 42px; display: grid; place-items: center; color: var(--white); background: var(--ink); clip-path: polygon(50% 0, 94% 15%, 87% 75%, 50% 100%, 13% 75%, 6% 15%); }.security-strip p { margin: 0; color: #546176; font-size: .76rem; line-height: 1.65; }.approval-flow { display: flex; justify-content: flex-end; align-items: center; gap: 7px; font: .45rem "DM Mono", monospace; }.approval-flow span, .approval-flow b { padding: 7px 8px; border: 1px solid #8b9aac; }.approval-flow b { color: var(--white); background: var(--teal); border-color: var(--teal); }

.closing { position: relative; width: 100vw; min-height: 670px; margin: 130px 0 0 calc(50% - 50vw); padding: 90px max(20px, calc((100vw - var(--max))/2)); display: flex; align-items: center; overflow: hidden; color: var(--white); background: var(--ink); }
.closing::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 56px 56px; }
.closing-copy { position: relative; z-index: 2; max-width: 880px; }.eyebrow.light { color: #84afd1; }.closing h2 { margin: 23px 0 0; font: 600 clamp(3.7rem, 7.3vw, 7.6rem)/.9 "Space Grotesk", sans-serif; letter-spacing: -.07em; }.closing p { max-width: 570px; margin: 28px 0 0; color: #a9b5c9; line-height: 1.75; }.button.large { margin-top: 33px; min-width: 250px; }
.closing-mark { position: absolute; right: -2vw; top: 50%; transform: translateY(-50%) rotate(-90deg); transform-origin: center; display: flex; align-items: start; gap: 5px; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.16); font: 700 clamp(8rem, 17vw, 18rem) "Space Grotesk", sans-serif; letter-spacing: -.1em; white-space: nowrap; }.closing-mark strong { color: rgba(70,130,180,.12); -webkit-text-stroke: 1px rgba(115,169,211,.2); }.closing-mark i { font-size: 1.5rem; letter-spacing: 0; }

footer { padding: 60px 0 30px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 50px; color: #3c4659; }.footer-brand p { margin: 13px 0 0; color: var(--muted); font-size: .68rem; }.footer-brand .brand-word > span { color: var(--sky); }.footer-links { display: grid; grid-template-columns: repeat(2, auto); gap: 12px 30px; font-size: .7rem; }.footer-maker { justify-self: end; display: flex; flex-direction: column; align-items: flex-end; color: var(--muted); font-size: .58rem; }.footer-maker strong { margin: 4px 0; color: var(--text); font: 700 1rem "Space Grotesk", sans-serif; }.footer-bottom { grid-column: 1 / -1; margin-top: 40px; padding-top: 18px; display: flex; justify-content: space-between; border-top: 1px solid #cbd0d8; color: #7b8390; font: .52rem "DM Mono", monospace; }

/* Product mockups mirror the actual PitPOS application shells. */
.pos-screen { background: #0f172a; }
.pos-topbar { height: 46px; padding: 0 13px; color: #cbd5e1; background: #1e293b; border-bottom: 1px solid #334155; }
.pos-connections { display: flex; align-items: center; gap: 13px; font-size: .43rem; }
.pos-connections span { white-space: nowrap; }
.pos-connections i { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: #22c55e; }
.pos-connections .fiscal i { background: #f59e0b; }
.cashier { margin-left: auto; padding: 0 12px; border: 0; font-size: .44rem; }
.cashier b { color: #f8fafc; }
.lock-button { height: 28px; padding: 0 10px; border: 0; color: #fff; background: #e11d48; font-size: .42rem; font-weight: 700; }
.pos-body { min-height: 475px; padding: 9px; grid-template-columns: 40% 60%; gap: 9px; color: #e2e8f0; background: #0f172a; }
.actual-cart, .actual-plu { overflow: hidden; border: 1px solid #334155; border-radius: 10px; background: #1e293b; }
.actual-cart { display: flex; flex-direction: column; }
.cart-customer { min-height: 70px; padding: 11px; display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 8px; border-bottom: 1px solid #334155; background: #162235; }
.customer-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #bfdbfe; background: #1e3a8a; font-size: .7rem; }
.cart-customer strong, .cart-customer small { display: block; }.cart-customer strong { color: #e2e8f0; font-size: .5rem; }.cart-customer small { margin-top: 3px; color: #94a3b8; font-size: .4rem; }
.quantity { text-align: right; }.quantity b { color: #60a5fa; font-size: .8rem; }
.quantity-row { padding: 6px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 3px; background: #162235; }.quantity-row span { padding: 6px 2px; border: 1px solid #334155; color: #cbd5e1; background: #1e293b; text-align: center; font-size: .38rem; }.quantity-row span.active { border-color: #3b82f6; color: #fff; background: #213654; }
.barcode-input { height: 34px; margin: 8px; padding: 0 9px; display: flex; align-items: center; justify-content: space-between; border: 1px solid #475569; color: #f8fafc; background: #0f172a; font: .44rem "DM Mono", monospace; }.barcode-input b { padding-left: 9px; color: #cbd5e1; border-left: 1px solid #475569; }
.actual-cart-lines { padding: 0 8px; display: grid; gap: 5px; }.actual-cart-lines article { min-height: 52px; padding: 7px; display: grid; grid-template-columns: 24px 1fr auto; gap: 7px; align-items: center; border: 1px solid #334155; border-radius: 5px; background: #17243a; }.actual-cart-lines article > span { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 4px; color: #93c5fd; background: #1e3a5f; font-size: .42rem; }.actual-cart-lines strong, .actual-cart-lines small { display: block; }.actual-cart-lines strong { color: #f1f5f9; font-size: .45rem; }.actual-cart-lines small { margin-top: 3px; color: #94a3b8; font-size: .35rem; }.actual-cart-lines article > b { color: #e2e8f0; font-size: .42rem; }
.actual-total { margin-top: auto; min-height: 66px; padding: 11px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #334155; background: #020617; }.actual-total small, .actual-total span { display: block; }.actual-total small { color: #fca5a5; font-size: .37rem; }.actual-total span { margin-top: 4px; color: #cbd5e1; font-size: .45rem; }.actual-total > strong { color: #34d399; font-size: 1.02rem; }
.actual-plu { display: grid; grid-template-rows: 40px 1fr auto; }
.plu-tabs { padding: 4px; display: flex; align-items: center; gap: 4px; overflow: hidden; background: #162235; }.plu-tabs span, .plu-tabs button { height: 28px; padding: 0 8px; display: grid; place-items: center; border: 1px solid #334155; color: #cbd5e1; background: #0f172a; font-size: .38rem; white-space: nowrap; }.plu-tabs span.active { color: #fff; background: #334155; }.plu-tabs button { min-width: 27px; padding: 0; }.plu-tabs button:nth-last-child(2) { color: #fff; background: #059669; border-color: #059669; }
.actual-product-grid { padding: 7px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }.actual-product-grid article { min-height: 78px; padding: 8px; display: flex; flex-direction: column; border: 1px solid #334155; border-radius: 5px; color: #f8fafc; }.actual-product-grid small { color: rgba(255,255,255,.65); font-size: .33rem; }.actual-product-grid strong { margin-top: auto; font-size: .46rem; }.actual-product-grid b { margin-top: 4px; font-size: .46rem; }.plu-teal { background: #0f766e; }.plu-blue { background: #2563eb; }.plu-violet { background: #7c3aed; }.plu-amber { background: #b45309; }.plu-rose { background: #be123c; }.plu-cyan { background: #0891b2; }
.actual-actions { padding: 5px; display: grid; grid-template-columns: repeat(5,1fr); gap: 4px; background: #0f172a; }.actual-actions button { min-height: 30px; padding: 3px; border: 1px solid #334155; border-radius: 3px; color: #cbd5e1; background: #1e293b; font-size: .32rem; font-weight: 700; }.actual-actions button.danger { color: #fda4af; background: #3f1d2b; border-color: #7f1d1d; }.actual-actions .wide { grid-column: span 2; }.actual-actions .wide-two { grid-column: span 2; }.actual-actions .wide-three { grid-column: span 3; }.actual-actions .cash { min-height: 34px; color: #fff; background: #10b981; border: 0; }.actual-actions .card { min-height: 34px; color: #fff; background: #2563eb; border: 0; }.actual-actions .pay-all { grid-column: 1 / -1; min-height: 41px; padding: 0 10px; display: flex; align-items: center; justify-content: space-between; color: #fff; background: #059669; border: 0; text-align: left; }.pay-all small, .pay-all b { display: block; }.pay-all small { color: #a7f3d0; font-size: .3rem; }.pay-all b { margin-top: 2px; font-size: .44rem; }.pay-all > strong { color: #bbf7d0; font-size: .8rem; }

.visual-payment { background: #dfe3e8; }
.payment-screen { width: 73%; color: #e2e8f0; background: #0f172a; border: 1px solid #334155; box-shadow: 0 25px 60px rgba(24,35,62,.2); }
.payment-head { border-color: #334155; }.payment-head > div span, .payment-head > div small { display: block; }.payment-head > div span { color: #f8fafc; font-size: .68rem; font-weight: 800; }.payment-head > div small { margin-top: 3px; color: #94a3b8; font-size: .47rem; }.payment-head b { color: #34d399; }
.payment-summary { margin-top: 16px; padding: 13px; border: 1px solid #334155; background: #020617; }.payment-summary span, .payment-summary strong, .payment-summary small { display: block; }.payment-summary span { color: #94a3b8; font: .43rem "DM Mono", monospace; }.payment-summary strong { margin-top: 6px; color: #fff; font: 700 1.35rem "Space Grotesk", sans-serif; }.payment-summary small { margin-top: 4px; color: #60a5fa; font-size: .45rem; }
.payment-methods button { color: #cbd5e1; background: #17243a; border-color: #334155; }.payment-methods button.selected { background: #1d4ed8; border-color: #3b82f6; }.payment-methods small { color: #94a3b8; }.payment-methods .selected small { color: #bfdbfe; }
.device-status { color: #cbd5e1; background: #17243a; border-color: #334155; }.device-status small { color: #94a3b8; }.device-status > i { border-color: #64748b; }
.payment-controls { margin-top: 12px; display: grid; grid-template-columns: .55fr 1fr; gap: 8px; }.payment-controls > button { min-height: 43px; border: 1px solid #475569; color: #cbd5e1; background: #334155; font-size: .55rem; font-weight: 700; }.payment-controls .complete-payment { height: auto; margin: 0; border: 0; background: #059669; }

.visual-dashboard { background: #07111f; }
.dashboard-window { min-height: 485px; display: block; overflow: hidden; color: #fff; background: #07111f; }
.management-top { height: 43px; padding: 0 14px; display: flex; align-items: center; gap: 18px; color: #cbd5e1; background: #0b1625; font-size: .42rem; }.management-top strong { margin-right: auto; color: #fff; font-size: .62rem; }.management-top i { color: #16a34a; font-style: normal; font-weight: 700; }.management-top b { padding: 6px 8px; border: 1px solid #22334d; border-radius: 4px; color: #8fa4bc; background: #101d2e; font-weight: 400; }
.management-ribbon { height: 67px; padding: 0 14px; display: flex; align-items: stretch; gap: 2px; border-bottom: 3px solid #2563eb; background: #111827; }.management-ribbon span { min-width: 72px; padding: 8px 7px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; color: #8fa4bc; font-size: .4rem; }.management-ribbon span i { color: #60a5fa; font-size: .72rem; font-style: normal; }.management-ribbon span.active { color: #fff; background: #1e293b; }
.dashboard-window .dash-main { padding: 16px 18px 18px; }.dashboard-window .dash-title strong { color: #fff; font-size: 1.03rem; }.dashboard-window .dash-title small { max-width: 420px; margin-top: 4px; color: #9cafc5; font-size: .43rem; }.dashboard-window .dash-title > span { color: #34d399; background: #0f2a22; border: 1px solid #166534; }
.dashboard-window .dash-metrics article { border-color: #22334d; background: #101d2e; }.dashboard-window .dash-metrics span { color: #8fa4bc; }.dashboard-window .dash-metrics strong { color: #f8fafc; }.dashboard-window .dash-metrics small { color: #34d399; }.dashboard-window .dash-metrics small.warn { color: #fbbf24; }.dashboard-window .dash-metrics .danger-text { color: #fb7185; }
.dashboard-window .sales-chart, .dashboard-window .register-list { border-color: #22334d; background: #101d2e; }.dashboard-window .chart-title span { color: #38bdf8; }.dashboard-window .chart-grid { stroke: #22334d; }.dashboard-window .chart-area { fill: rgba(56,189,248,.1); }.dashboard-window .chart-stroke { stroke: #38bdf8; }.dashboard-window .register-list > div { border-color: #22334d; }.dashboard-window .register-list span { color: #f8fafc; }.dashboard-window .register-list small { color: #34d399; }.dashboard-window .register-list b { color: #cbd5e1; }

[hidden] { display: none !important; }
.tour-tabs { margin-top: 50px; display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid #bcc3ce; }
.tour-tabs button { min-height: 66px; padding: 0 18px; display: flex; align-items: center; gap: 13px; border: 0; border-right: 1px solid #bcc3ce; color: #5b6576; background: transparent; font-weight: 800; cursor: pointer; }.tour-tabs button:last-child { border-right: 0; }.tour-tabs button span { color: #8490a1; font: .55rem "DM Mono", monospace; }.tour-tabs button.active { color: #fff; background: var(--ink); }.tour-tabs button.active span { color: #60a5fa; }
.tour-shell { min-height: 640px; border: 1px solid #bcc3ce; border-top: 0; background: #dfe3e8; }
.tour-panel { min-height: 640px; }
.demo-toolbar { height: 48px; padding: 0 18px; display: flex; align-items: center; gap: 22px; color: #cbd5e1; background: #1e293b; font-size: .68rem; }.demo-toolbar div i { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: #22c55e; }.demo-toolbar i.amber { background: #f59e0b; }.demo-toolbar > span { margin-left: auto; }
.demo-pos-body { min-height: 535px; padding: 12px; display: grid; grid-template-columns: 40% 60%; gap: 12px; background: #0f172a; }
.demo-cart-area, .demo-plu-area { overflow: hidden; display: flex; flex-direction: column; border: 1px solid #334155; border-radius: 10px; background: #1e293b; }
.demo-customer { padding: 15px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 10px; border-bottom: 1px solid #334155; background: #162235; }.demo-customer > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: #bfdbfe; background: #1e3a8a; }.demo-customer strong,.demo-customer small { display: block; }.demo-customer strong { color: #f1f5f9; font-size: .78rem; }.demo-customer small { margin-top: 3px; color: #94a3b8; font-size: .62rem; }.demo-customer b { color: #60a5fa; }
.demo-barcode { height: 42px; margin: 12px; padding: 0 13px; display: flex; align-items: center; justify-content: space-between; border: 1px solid #475569; color: #7f8ba0; background: #0f172a; font-size: .68rem; }.demo-barcode span { color: #cbd5e1; }
.demo-cart-empty { margin: auto; text-align: center; }.demo-cart-empty strong,.demo-cart-empty small { display: block; }.demo-cart-empty strong { color: #e2e8f0; }.demo-cart-empty small { margin-top: 6px; color: #718096; font-size: .68rem; }
.demo-cart-lines { padding: 0 12px; display: grid; gap: 7px; }.demo-cart-line { min-height: 54px; padding: 9px; display: grid; grid-template-columns: 30px 1fr auto auto; align-items: center; gap: 9px; border: 1px solid #334155; border-radius: 5px; color: #e2e8f0; background: #17243a; }.demo-cart-line > span { width: 27px; height: 27px; display: grid; place-items: center; color: #93c5fd; background: #1e3a5f; font-size: .68rem; }.demo-cart-line strong,.demo-cart-line small { display: block; }.demo-cart-line strong { font-size: .7rem; }.demo-cart-line small { margin-top: 3px; color: #94a3b8; font-size: .56rem; }.demo-cart-line > b { font-size: .68rem; }.demo-cart-line button { width: 24px; height: 24px; border: 1px solid #7f1d1d; color: #fda4af; background: #3f1d2b; cursor: pointer; }
.demo-total { margin-top: auto; padding: 19px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #334155; color: #cbd5e1; background: #020617; }.demo-total span { font-size: .72rem; }.demo-total strong { color: #34d399; font-size: 1.55rem; }
.demo-plu-tabs { height: 48px; padding: 7px; display: flex; gap: 6px; background: #162235; }.demo-plu-tabs span { padding: 0 15px; display: grid; place-items: center; border: 1px solid #334155; color: #94a3b8; background: #0f172a; font-size: .65rem; }.demo-plu-tabs span.active { color: #fff; background: #334155; }
.demo-products { padding: 11px; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.demo-product { min-height: 108px; padding: 12px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid rgba(255,255,255,.13); border-radius: 6px; color: #fff; text-align: left; cursor: pointer; transition: transform 150ms ease, filter 150ms ease; }.demo-product:hover { transform: translateY(-3px); filter: brightness(1.08); }.demo-product small { color: rgba(255,255,255,.65); font: .5rem "DM Mono", monospace; }.demo-product strong { margin-top: auto; font-size: .76rem; }.demo-product b { margin-top: 6px; font-size: .72rem; }.demo-product.teal { background:#0f766e; }.demo-product.blue { background:#2563eb; }.demo-product.violet { background:#7c3aed; }.demo-product.orange { background:#b45309; }.demo-product.rose { background:#be123c; }.demo-product.cyan { background:#0891b2; }
.demo-actions { margin-top: auto; padding: 8px; display: grid; grid-template-columns: .8fr 1fr 1.2fr 1.3fr; gap: 7px; background: #0f172a; }.demo-actions button { min-height: 49px; border: 1px solid #475569; color: #cbd5e1; background: #3f1d2b; font-size: .67rem; font-weight: 800; cursor: pointer; }.demo-actions button.cash { color:#fff; background:#10b981; border:0; }.demo-actions button.card { color:#fff; background:#2563eb; border:0; }.demo-actions button.pay { display:flex; align-items:center; justify-content:space-between; padding:0 13px; color:#fff; background:#059669; border:0; }
.demo-notice { min-height: 48px; padding: 0 17px; display: flex; align-items: center; gap: 9px; color: #cbd5e1; background: #111827; font-size: .7rem; }.demo-notice > span { width: 22px; height: 22px; display:grid; place-items:center; border-radius:50%; color:#07111f; background:#60a5fa; font-weight:800; }.demo-notice.success > span { background:#34d399; }
.management-demo-top { height: 50px; padding:0 18px; display:flex; align-items:center; gap:25px; color:#cbd5e1; background:#0b1625; font-size:.68rem; }.management-demo-top strong { margin-right:auto; color:#fff; font-size:.9rem; }.management-demo-top i { color:#16a34a; font-style:normal; font-weight:700; }
.management-demo-nav { height:82px; padding:0 20px; display:flex; gap:4px; border-bottom:3px solid #2563eb; background:#111827; }.management-demo-nav button { min-width:140px; border:0; color:#8fa4bc; background:transparent; font-size:1rem; cursor:pointer; }.management-demo-nav button span { display:block; margin-top:5px; font-size:.65rem; }.management-demo-nav button.active { color:#fff; background:#1e293b; }
.management-demo-content { min-height:508px; padding:25px; color:#fff; background:#07111f; }.manage-view-head { display:flex; justify-content:space-between; align-items:start; gap:20px; }.manage-view-head h3 { margin:0; font-size:1.8rem; }.manage-view-head p { margin:6px 0 0; color:#9cafc5; font-size:.78rem; }.manage-view-head > span,.manage-view-head > button { padding:8px 10px; border:1px solid #22334d; color:#34d399; background:#0f2a22; font-size:.6rem; }.manage-view-head > button { color:#fff; background:#2563eb; cursor:pointer; }
.manage-demo-metrics { margin-top:25px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }.manage-demo-metrics > div { padding:16px; border:1px solid #22334d; border-radius:8px; background:#101d2e; }.manage-demo-metrics small,.manage-demo-metrics strong,.manage-demo-metrics span { display:block; }.manage-demo-metrics small { color:#8fa4bc; font-size:.65rem; }.manage-demo-metrics strong { margin:10px 0 6px; font-size:1.25rem; }.manage-demo-metrics span { color:#34d399; font-size:.58rem; }.manage-demo-metrics span.red { color:#fb7185; }.manage-demo-metrics span.yellow { color:#fbbf24; }
.manage-demo-chart { height:225px; margin-top:13px; padding:17px; border:1px solid #22334d; background:#101d2e; }.manage-demo-chart > strong { font-size:.75rem; }.manage-demo-chart .bars { height:160px; margin-top:17px; display:flex; align-items:end; gap:16px; border-bottom:1px solid #334155; }.manage-demo-chart .bars i { flex:1; height:var(--h); background:#38bdf8; opacity:.8; transform-origin:bottom; animation:barGrow 900ms ease both; }
.manage-table { margin-top:25px; border:1px solid #22334d; }.manage-table > div { min-height:55px; padding:0 14px; display:grid; grid-template-columns:.8fr 1.4fr 1.2fr .5fr .7fr; gap:12px; align-items:center; border-top:1px solid #22334d; color:#cbd5e1; font-size:.68rem; }.manage-table > div.head { min-height:36px; border-top:0; color:#8fa4bc; background:#101d2e; font:.52rem "DM Mono",monospace; }.manage-table em { color:#34d399; font-style:normal; }.manage-table em.warn { color:#fbbf24; }.manage-table strong { text-align:right; }
.dispatch-flow { margin-top:70px; display:flex; align-items:center; justify-content:center; gap:12px; }.dispatch-flow > div { min-width:170px; padding:20px; border:1px solid #22334d; background:#101d2e; }.dispatch-flow strong,.dispatch-flow small { display:block; }.dispatch-flow small { margin-top:7px; color:#8fa4bc; font-size:.6rem; }.dispatch-flow .green { color:#34d399; }.dispatch-flow > i { color:#60a5fa; font-style:normal; }.dispatch-flow > div:first-child { color:#fff; background:#1d4ed8; }
.report-demo-list { margin-top:40px; display:grid; gap:23px; }.report-demo-list > div { display:grid; grid-template-columns:120px 1fr 110px; gap:15px; align-items:center; font-size:.72rem; }.report-demo-list i { height:13px; background:#101d2e; }.report-demo-list i b { display:block; width:var(--w); height:100%; background:#38bdf8; }.report-demo-list strong { text-align:right; }
.tour-panel[data-panel="terminal"] { padding:35px; display:grid; grid-template-columns:340px 1fr; gap:60px; align-items:center; justify-content:center; background:#e8ebef; }.terminal-demo-device { width:310px; min-height:555px; padding-bottom:18px; overflow:hidden; border:6px solid #1e293b; border-radius:24px; background:#f4f6fa; box-shadow:0 24px 50px rgba(15,23,42,.2); }.terminal-demo-bar { height:43px; padding:0 14px; display:flex; align-items:center; justify-content:space-between; color:#fff; background:#040c2d; font-size:.68rem; }.terminal-demo-bar span { color:#66c5b7; font-size:.55rem; }.terminal-demo-hero { margin:13px; padding:16px; border-radius:8px; color:#fff; background:#040c2d; }.terminal-demo-hero small { color:#b8c2d6; font:.53rem "DM Mono",monospace; }.terminal-demo-hero h3 { margin:6px 0; font-size:1.3rem; }.terminal-demo-hero p { margin:0; color:#b8c2d6; font-size:.64rem; line-height:1.5; }
.terminal-demo-card,.terminal-result,.terminal-counter { margin:10px 13px; padding:13px; border:1px solid #e4e7ec; border-radius:8px; background:#fff; }.terminal-demo-card strong,.terminal-demo-card small { display:block; }.terminal-demo-card strong { font-size:.8rem; }.terminal-demo-card small { margin-top:4px; color:#64748b; font-size:.6rem; }.terminal-demo-input { height:39px; margin-top:10px; display:flex; border:1px solid #d0d5dd; border-radius:6px; overflow:hidden; }.terminal-demo-input input { min-width:0; flex:1; padding:0 10px; border:0; outline:0; font:.65rem "DM Mono",monospace; }.terminal-demo-input button { width:58px; border:0; color:#fff; background:#4682b4; font-size:.6rem; font-weight:800; cursor:pointer; }
.terminal-result { display:grid; grid-template-columns:43px 1fr auto; gap:9px; align-items:center; }.terminal-result-pic { width:43px; height:50px; display:grid; place-items:center; border-radius:6px; color:#fff; background:#4682b4; font-weight:800; }.terminal-result small,.terminal-result strong,.terminal-result span { display:block; }.terminal-result small { color:#8c97a6; font:.45rem "DM Mono",monospace; }.terminal-result strong { margin:3px 0; font-size:.7rem; }.terminal-result span { color:#008080; font-size:.58rem; }.terminal-result > b { color:#008080; font-size:.65rem; }.terminal-counter { display:grid; grid-template-columns:1fr auto; align-items:center; }.terminal-counter > span { color:#64748b; font-size:.65rem; }.terminal-counter > div { display:flex; align-items:center; gap:9px; }.terminal-counter button { width:28px; height:28px; border:1px solid #d0d5dd; border-radius:5px; background:#f8fafc; cursor:pointer; }.terminal-counter small { grid-column:1 / -1; margin-top:5px; color:#008080; font-size:.55rem; }.terminal-save { width:calc(100% - 26px); height:41px; margin:0 13px; border:0; border-radius:6px; color:#fff; background:#4682b4; font-size:.68rem; font-weight:800; cursor:pointer; }
.terminal-demo-guide { display:grid; grid-template-columns:38px 1fr; gap:12px 14px; align-items:center; }.terminal-demo-guide span { width:38px; height:38px; display:grid; place-items:center; color:#fff; background:#040c2d; font:.65rem "DM Mono",monospace; }.terminal-demo-guide p { margin:0; font:700 1.35rem "Space Grotesk",sans-serif; }.terminal-demo-guide i { grid-column:1; color:#4682b4; text-align:center; font-style:normal; transform:rotate(90deg); }

.gallery-grid { margin-top:50px; display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }.gallery-item { min-width:0; padding:17px; border:1px solid #c8cdd5; color:var(--text); background:#fbfaf7; text-align:left; cursor:pointer; transition:transform 180ms ease,box-shadow 180ms ease; }.gallery-item:hover { transform:translateY(-5px); box-shadow:6px 6px 0 var(--ink); }.gallery-label { display:block; color:var(--sky); font:.52rem "DM Mono",monospace; }.gallery-item > strong,.gallery-item > small { display:block; }.gallery-item > strong { margin-top:15px; font-size:1rem; }.gallery-item > small { margin-top:4px; color:var(--muted); font-size:.65rem; }.gallery-canvas { height:220px; margin-top:13px; position:relative; overflow:hidden; border:1px solid #bac1cc; background:#dfe3e8; }
.gallery-winpos { padding:10px; display:grid; grid-template-columns:40% 60%; gap:7px; background:#0f172a; }.gallery-winpos .g-top { position:absolute; left:0; right:0; top:0; height:20px; background:#1e293b; }.gallery-winpos .g-left,.gallery-winpos .g-right { margin-top:17px; padding:7px; display:grid; gap:5px; border:1px solid #334155; background:#1e293b; }.gallery-winpos .g-left i { height:27px; background:#17243a; }.gallery-winpos .g-left b { height:32px; margin-top:auto; background:#020617; }.gallery-winpos .g-right { grid-template-columns:repeat(3,1fr); }.gallery-winpos .g-right i { min-height:45px; background:#0f766e; }.gallery-winpos .g-right i:nth-child(2) { background:#2563eb; }.gallery-winpos .g-right i:nth-child(3) { background:#7c3aed; }.gallery-winpos .g-right i:nth-child(4) { background:#b45309; }.gallery-winpos .g-right i:nth-child(5) { background:#be123c; }.gallery-winpos .g-right i:nth-child(6) { background:#0891b2; }.gallery-winpos .g-right b { grid-column:1/-1; background:#059669; }
.gallery-management,.gallery-table,.gallery-report { padding:10px; background:#07111f; }.gallery-management .g-top,.gallery-table .g-top { height:20px; background:#0b1625; }.gallery-management .g-ribbon,.gallery-table .g-ribbon { height:34px; border-bottom:2px solid #2563eb; background:#111827; }.g-metrics { margin-top:9px; display:grid; grid-template-columns:repeat(4,1fr); gap:5px; }.g-metrics i { height:41px; border:1px solid #22334d; background:#101d2e; }.g-chart { height:90px; margin-top:6px; padding:10px; border:1px solid #22334d; background:#101d2e; }.g-chart b { display:block; height:100%; background:linear-gradient(155deg,transparent 48%,#38bdf8 49% 51%,transparent 52%); }.g-rows { margin-top:9px; display:grid; gap:5px; }.g-rows i { height:22px; border:1px solid #22334d; background:#101d2e; }
.gallery-terminal { display:grid; place-items:center; }.g-phone { width:105px; height:195px; padding:7px; border:4px solid #1e293b; border-radius:14px; background:#f4f6fa; }.g-phone div { height:23px; background:#040c2d; }.g-phone span { display:block; height:50px; margin-top:6px; border-radius:4px; background:#040c2d; }.g-phone i { display:block; height:31px; margin-top:5px; border:1px solid #e4e7ec; background:#fff; }.g-phone b { display:block; height:23px; margin-top:5px; background:#4682b4; }.gallery-labels { padding:25px; display:flex; align-items:center; justify-content:center; gap:10px; }.gallery-labels > div { width:130px; padding:13px; border:2px solid #040c2d; background:#fffdf6; transform:rotate(-3deg); }.gallery-labels > div:nth-child(2) { transform:rotate(3deg); }.gallery-labels small,.gallery-labels strong { display:block; }.gallery-labels strong { margin-top:12px; font-size:1.5rem; }.gallery-labels i { display:block; height:17px; margin-top:9px; background:repeating-linear-gradient(90deg,#111 0 2px,transparent 2px 4px); }.gallery-report .g-report-head { height:45px; background:#101d2e; }.g-report-bars { margin-top:20px; display:grid; gap:14px; }.g-report-bars i { display:block; width:var(--w); height:14px; background:#38bdf8; }
.gallery-modal { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:25px; }.gallery-modal-backdrop { position:absolute; inset:0; background:rgba(2,6,23,.84); }.gallery-modal-card { position:relative; z-index:2; width:min(1000px,100%); max-height:90vh; overflow:auto; padding:25px; color:#fff; background:#07111f; border:1px solid #334155; }.gallery-close { position:absolute; right:15px; top:15px; z-index:3; width:38px; height:38px; border:1px solid #475569; color:#fff; background:#1e293b; font-size:1.25rem; cursor:pointer; }.gallery-modal-visual .gallery-canvas { height:min(55vh,560px); margin:0; }.gallery-modal-copy { padding:25px 5px 5px; }.gallery-modal-copy span { color:#60a5fa; font:.55rem "DM Mono",monospace; }.gallery-modal-copy h3 { margin:10px 0 7px; font-size:1.8rem; }.gallery-modal-copy p { margin:0; color:#9cafc5; line-height:1.7; }

.compare-wrap { margin-top:50px; overflow-x:auto; border:1px solid #c7ccd5; }.compare-wrap table { width:100%; min-width:760px; border-collapse:collapse; background:#fbfaf7; }.compare-wrap th,.compare-wrap td { padding:18px; border-right:1px solid #d7dbe1; border-bottom:1px solid #d7dbe1; text-align:center; font-size:.75rem; }.compare-wrap th:first-child,.compare-wrap td:first-child { width:34%; text-align:left; font-weight:700; }.compare-wrap th { color:#fff; background:#040c2d; }.compare-wrap th span { display:block; margin-bottom:5px; color:#60a5fa; font:.5rem "DM Mono",monospace; }.compare-wrap .yes { color:#008080; font-size:1rem; }.compare-wrap tbody tr:hover { background:#eef3f7; }
.scenario-grid { margin-top:50px; display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }.scenario-card { min-height:340px; padding:28px; display:flex; flex-direction:column; border:1px solid #c7ccd5; background:#fbfaf7; }.scenario-card > span { color:#4682b4; font:.55rem "DM Mono",monospace; }.scenario-card h3 { margin:24px 0 12px; font:600 2rem "Space Grotesk",sans-serif; letter-spacing:-.04em; }.scenario-card p { margin:0; color:#667085; line-height:1.75; }.scenario-card > div { margin-top:auto; padding-top:30px; display:flex; flex-wrap:wrap; gap:6px; }.scenario-card b { padding:6px 8px; color:#536176; border:1px solid #cbd0d8; font-size:.55rem; }.scenario-card.featured { color:#fff; background:#040c2d; border-color:#040c2d; }.scenario-card.featured p { color:#aab5c8; }.scenario-card.featured b { color:#cbd5e1; border-color:#334155; }

/* Pricing proposal */
.pricing { padding-top:145px; }.pricing-layout { margin-top:52px; display:grid; grid-template-columns:1.25fr .75fr; gap:18px; align-items:stretch; }.pricing-console { overflow:hidden; border:1px solid #1f334e; color:#e2e8f0; background:#07111f; box-shadow:12px 12px 0 #d5d8df; }.pricing-window-top { min-height:70px; padding:0 18px; display:flex; align-items:center; gap:20px; border-bottom:1px solid #263b56; background:#101e31; }.pricing-window-top > div { display:flex; align-items:center; gap:10px; }.pricing-window-top > div > span { width:34px; height:34px; display:grid; place-items:center; border-radius:8px; color:#07111f; background:#60a5fa; font-weight:900; }.pricing-window-top strong,.pricing-window-top small { display:block; }.pricing-window-top strong { min-width:130px; font-size:.72rem; }.pricing-window-top small { margin-top:3px; color:#8295ad; font-size:.44rem; }.pricing-window-top nav { display:flex; gap:19px; margin-left:auto; color:#8295ad; font-size:.52rem; }.pricing-window-top nav b { color:#fff; }.pricing-window-top > i { width:42px; height:31px; display:grid; place-items:center; border:1px solid #34506f; color:#7dd3c7; font:.5rem "DM Mono",monospace; font-style:normal; }
.pricing-controls { padding:18px; display:grid; grid-template-columns:1fr 1fr .9fr; gap:10px; border-bottom:1px solid #263b56; background:#0b1625; }.pricing-controls label,.pricing-controls > div { min-height:68px; padding:11px 12px; display:flex; flex-direction:column; justify-content:center; border:1px solid #263b56; background:#101d2e; }.pricing-controls span { color:#8fa4bc; font:.48rem "DM Mono",monospace; }.pricing-controls input { width:100%; height:30px; margin-top:7px; border:0; outline:0; color:#fff; background:transparent; font:700 1.15rem "Space Grotesk",sans-serif; }.pricing-controls strong { margin-top:7px; color:#fff; font-size:1.05rem; }
.pricing-presets { padding:18px; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; border-bottom:1px solid #263b56; background:#07111f; }.pricing-presets button { min-height:94px; padding:13px; border:1px solid #263b56; color:#aebbd0; background:#0b1625; text-align:left; cursor:pointer; transition:transform 180ms ease,border-color 180ms ease,background 180ms ease; }.pricing-presets button:hover,.pricing-presets button.active { transform:translateY(-3px); border-color:#60a5fa; background:#10233f; }.pricing-presets span,.pricing-presets strong,.pricing-presets small { display:block; }.pricing-presets span { color:#60a5fa; font:.42rem "DM Mono",monospace; }.pricing-presets strong { margin:8px 0 4px; color:#fff; font-size:.76rem; }.pricing-presets small { color:#8fa4bc; font-size:.5rem; line-height:1.45; }
.pricing-rate-note { margin:0 18px 3px; padding:12px 14px; display:grid; grid-template-columns:92px 1fr; gap:12px; align-items:center; border:1px solid #273f5c; background:#101d2e; }.pricing-rate-note span { color:#7dd3c7; font:.43rem "DM Mono",monospace; }.pricing-rate-note strong { color:#b8c5d6; font-size:.58rem; line-height:1.5; font-weight:700; }
.pricing-table { padding:16px 18px 20px; display:grid; gap:7px; }.pricing-table-head,.pricing-row { display:grid; grid-template-columns:1.5fr 118px 64px 98px 125px 86px; gap:10px; align-items:center; }.pricing-table-head { min-height:34px; padding:0 12px; color:#72869e; border:1px solid #1f334e; background:#0b1625; font:.43rem "DM Mono",monospace; }.pricing-row { min-height:68px; padding:10px 12px; border:1px solid #243852; background:#101d2e; transition:transform 180ms ease,border-color 180ms ease,background 180ms ease,opacity 180ms ease; }.pricing-row:hover { transform:translateX(4px); border-color:#365a7f; }.pricing-row:not(.active) { opacity:.62; background:#0b1625; }.pricing-row label { display:grid; grid-template-columns:18px 1fr; gap:9px; align-items:center; cursor:pointer; }.pricing-row label input { width:15px; height:15px; accent-color:#60a5fa; }.pricing-row label span,.pricing-row label small { grid-column:2; display:block; }.pricing-row label span { color:#fff; font-weight:800; }.pricing-row label small { margin-top:3px; color:#8fa4bc; font-size:.52rem; }.pricing-period { width:max-content; max-width:112px; padding:6px 7px; color:#93c5fd; border:1px solid #2c4a6d; background:#10233f; font:.4rem "DM Mono",monospace; line-height:1.3; }.pricing-row.free-month .pricing-period { color:#7dd3c7; border-color:#14534b; background:#0f2a22; }.pricing-row > input { width:100%; height:35px; border:1px solid #334960; color:#fff; background:#0b1625; text-align:center; font:700 .72rem "DM Mono",monospace; }.pricing-row strong,.pricing-row b { font:.63rem "DM Mono",monospace; }.pricing-row strong { color:#cbd5e1; }.pricing-row b { color:#7dd3c7; }.pricing-row em { width:max-content; padding:6px 7px; color:#34d399; background:#0f2a22; font:.4rem "DM Mono",monospace; font-style:normal; }.pricing-row:not(.active) em { color:#fbbf24; background:#2b2510; }.pricing-row.included em { color:#93c5fd; background:#10233f; }
.pricing-summary { position:relative; overflow:hidden; padding:32px; display:flex; flex-direction:column; border:1px solid #040c2d; color:#fff; background:radial-gradient(circle at 100% 0,#173e5e 0,transparent 42%),#040c2d; box-shadow:12px 12px 0 #cbd2da; }.pricing-summary::after { content:""; position:absolute; right:-65px; top:-65px; width:210px; height:210px; border:1px solid rgba(125,211,199,.25); border-radius:50%; box-shadow:0 0 0 42px rgba(96,165,250,.04); }.pricing-live { width:max-content; padding:7px 9px; border:1px solid #34506f; color:#9fc4df; font:.47rem "DM Mono",monospace; }.pricing-live i { display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:#34d399; box-shadow:0 0 0 4px rgba(52,211,153,.12); }.pricing-summary h3 { position:relative; z-index:1; margin:25px 0 9px; font:600 2.25rem "Space Grotesk",sans-serif; letter-spacing:-.05em; }.pricing-summary p { position:relative; z-index:1; margin:0; color:#9fb0ca; font-size:.72rem; line-height:1.75; }.pricing-total { position:relative; z-index:1; margin-top:28px; padding:22px; border:1px solid #2c4462; background:#0b1625; }.pricing-total small,.pricing-total strong,.pricing-total span { display:block; }.pricing-total small { color:#84afd1; font:.48rem "DM Mono",monospace; }.pricing-total strong { margin:9px 0 3px; color:#fff; font:700 clamp(1.8rem,3vw,2.7rem) "Space Grotesk",sans-serif; letter-spacing:-.05em; }.pricing-total span { color:#7dd3c7; font:.66rem "DM Mono",monospace; }.pricing-mini-stats { position:relative; z-index:1; margin-top:10px; display:grid; grid-template-columns:1fr 1fr; gap:10px; }.pricing-mini-stats div { padding:14px; border:1px solid #2c4462; background:#101d2e; }.pricing-mini-stats span,.pricing-mini-stats b { display:block; }.pricing-mini-stats span { color:#8fa4bc; font-size:.5rem; }.pricing-mini-stats b { margin-top:6px; color:#fff; font-size:.72rem; }.pricing-free-note { position:relative; z-index:1; margin-top:10px; padding:11px 12px; color:#7dd3c7; border:1px solid #14534b; background:#0f2a22; font:.52rem "DM Mono",monospace; line-height:1.55; }.pricing-quote-button { position:relative; z-index:1; min-height:54px; margin-top:18px; padding:0 14px; display:flex; align-items:center; justify-content:space-between; border:0; color:#07111f; background:#fff; font-weight:900; cursor:pointer; transition:transform 180ms ease,box-shadow 180ms ease; }.pricing-quote-button:hover { transform:translateY(-3px); box-shadow:0 12px 28px rgba(0,0,0,.22); }.pricing-disclaimer { position:relative; z-index:1; margin-top:auto; padding-top:20px; color:#7f91a8; font-size:.55rem; line-height:1.6; }
.pricing-campaigns { position:relative; z-index:1; margin-top:12px; display:flex; flex-wrap:wrap; gap:6px; }.pricing-campaigns span { padding:7px 8px; border:1px solid #2c4462; color:#8fa4bc; background:#101d2e; font:.43rem "DM Mono",monospace; }.pricing-campaigns span.active { color:#07111f; border-color:#7dd3c7; background:#7dd3c7; }
.pricing-year-compare { position:relative; z-index:1; margin-top:10px; display:grid; grid-template-columns:1fr 22px 1fr; gap:10px; align-items:center; }.pricing-year-compare div { min-height:112px; padding:16px; border:1px solid #2c4462; background:#101d2e; }.pricing-year-compare span,.pricing-year-compare strong,.pricing-year-compare small { display:block; }.pricing-year-compare span { color:#84afd1; font:.45rem "DM Mono",monospace; }.pricing-year-compare strong { margin:8px 0 4px; font-size:1rem; }.pricing-year-compare small { color:#8fa4bc; font-size:.5rem; line-height:1.45; }.pricing-year-compare i { width:22px; height:1px; background:#7dd3c7; box-shadow:0 0 0 4px rgba(125,211,199,.08); }
.is-visible .pricing-row { animation:pricingRowIn 520ms cubic-bezier(.22,1,.36,1) both; }.is-visible .pricing-row:nth-child(2) { animation-delay:60ms; }.is-visible .pricing-row:nth-child(3) { animation-delay:120ms; }.is-visible .pricing-row:nth-child(4) { animation-delay:180ms; }.is-visible .pricing-row:nth-child(5) { animation-delay:240ms; }.is-visible .pricing-row:nth-child(6) { animation-delay:300ms; }.is-visible .pricing-row:nth-child(7) { animation-delay:360ms; }.is-visible .pricing-row:nth-child(8) { animation-delay:420ms; }.is-visible .pricing-total strong { animation:totalGlow 1.8s .5s ease-in-out both; }

.closing { display:block; }.closing-layout { position:relative; z-index:2; display:grid; grid-template-columns:1fr .78fr; gap:70px; align-items:start; }.contact-options { margin-top:30px; display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }.contact-options a { min-height:70px; padding:12px; display:flex; align-items:center; gap:12px; border:1px solid #334155; background:#101d2e; }.contact-options a > span { width:39px; height:39px; display:grid; place-items:center; color:#07111f; background:#60a5fa; }.contact-options small,.contact-options strong { display:block; }.contact-options small { color:#8fa4bc; font:.48rem "DM Mono",monospace; }.contact-options strong { margin-top:4px; font-size:.68rem; }.af-product-sign { margin-top:25px; padding-top:20px; display:flex; align-items:center; gap:13px; border-top:1px solid #334155; }.af-product-sign > span { width:48px; height:48px; display:grid; place-items:center; color:#040c2d; background:#fff; font-weight:800; }.af-product-sign p { margin:0; color:#8fa4bc; font-size:.65rem; }.af-product-sign small,.af-product-sign strong { display:block; }.af-product-sign small { font:.45rem "DM Mono",monospace; }.af-product-sign strong { margin:3px 0; color:#fff; font-size:.9rem; }
.demo-form { padding:28px; border:1px solid #334155; background:#101d2e; }.form-heading > span { color:#60a5fa; font:.55rem "DM Mono",monospace; }.form-heading > strong { display:block; margin-top:10px; font-size:1.35rem; }.form-heading > p { margin:6px 0 0; color:#8fa4bc; font-size:.68rem; line-height:1.5; }.form-grid { margin-top:24px; display:grid; grid-template-columns:repeat(2,1fr); gap:13px; }.form-grid label > span { display:block; margin:0 0 6px 2px; color:#a8b4c7; font-size:.6rem; font-weight:700; }.form-grid input,.form-grid select,.form-grid textarea { width:100%; border:1px solid #334155; border-radius:0; outline:0; color:#fff; background:#0b1625; font:inherit; font-size:.72rem; }.form-grid input,.form-grid select { height:44px; padding:0 11px; }.form-grid textarea { padding:11px; resize:vertical; }.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus { border-color:#60a5fa; }.form-grid .full { grid-column:1/-1; }.consent { margin-top:14px; display:flex; gap:8px; align-items:flex-start; color:#8fa4bc; font-size:.58rem; line-height:1.5; }.consent input { margin-top:2px; accent-color:#4682b4; }.form-submit { width:100%; height:52px; margin-top:17px; padding:0 15px; display:flex; align-items:center; justify-content:space-between; border:0; color:#07111f; background:#fff; font-weight:800; cursor:pointer; }.form-status { min-height:20px; margin-top:10px; color:#7dd3c7; font-size:.62rem; }

/* 42-second product film */
.product-film { padding-top:140px; }
.film-player { margin-top:52px; border:1px solid #9ea6b3; background:#0a1220; box-shadow:12px 12px 0 #d5d8df; }
.film-stage { position:relative; height:clamp(480px,56vw,720px); overflow:hidden; color:#fff; background:#07111f; }
.film-stage::before { content:""; position:absolute; z-index:15; inset:0; pointer-events:none; box-shadow:inset 0 16px 28px rgba(0,0,0,.22),inset 0 -16px 28px rgba(0,0,0,.22); }
.film-stage::after { content:""; position:absolute; inset:0; z-index:9; pointer-events:none; background:linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px); background-size:48px 48px; }
.film-scene { position:absolute; inset:0; padding:80px 6% 5%; overflow:hidden; opacity:0; transform:scale(1.025); transition:opacity 500ms ease,transform 700ms cubic-bezier(.22,1,.36,1); }
.film-scene[hidden] { display:none !important; }
.film-scene.active { opacity:1; transform:scale(1); }
.film-caption { position:absolute; z-index:12; top:27px; left:4%; right:4%; display:flex; align-items:center; justify-content:space-between; gap:20px; }.film-caption span { color:#60a5fa; font:.58rem "DM Mono",monospace; letter-spacing:.08em; }.film-caption strong { max-width:540px; font-size:.82rem; text-align:right; }.film-scene.active .film-caption { animation:filmCaptionIn 650ms cubic-bezier(.22,1,.36,1) both; }
.film-pos { background:radial-gradient(circle at 72% 40%,#183254 0,transparent 42%),#0f172a; }.film-pos-shell { position:relative; width:86%; height:82%; margin:auto; border:7px solid #26364e; border-radius:9px; overflow:hidden; box-shadow:0 28px 60px rgba(0,0,0,.4); transform:perspective(1200px) rotateX(2deg); }.film-pos-shell::after { content:""; position:absolute; z-index:8; left:0; right:0; top:-8px; height:3px; opacity:0; background:#5eead4; box-shadow:0 0 12px #2dd4bf,0 0 32px rgba(45,212,191,.7); }.film-pos.active .film-pos-shell { animation:filmScreenIn 900ms cubic-bezier(.22,1,.36,1) both,filmCameraDrift 8s 1s ease-in-out both; }.film-pos.active .film-pos-shell::after { animation:filmScan 2.2s 1s ease-in-out both; }.film-appbar { height:10%; min-height:42px; padding:0 18px; display:flex; align-items:center; gap:18px; color:#cbd5e1; background:#1e293b; font-size:.62rem; }.film-appbar i { width:7px; height:7px; border-radius:50%; background:#22c55e; }.film-pos.active .film-appbar i { animation:statusBlink 1.2s ease-in-out infinite; }.film-appbar b { margin-left:auto; color:#fff; }.film-pos-grid { height:90%; padding:10px; display:grid; grid-template-columns:40% 60%; gap:10px; background:#0f172a; }.film-basket,.film-plu { border:1px solid #334155; background:#1e293b; }.film-basket { padding:18px; display:flex; flex-direction:column; gap:9px; }.film-basket > small { color:#94a3b8; font:.5rem "DM Mono",monospace; }.film-scan-code { padding:11px; border:1px solid #475569; color:#64748b; background:#0f172a; font:.6rem "DM Mono",monospace; }.film-pos.active .film-scan-code { animation:barcodeRead 1s 1.25s ease both; }.film-basket p { margin:0; padding:10px; display:grid; grid-template-columns:25px 1fr auto; gap:8px; align-items:center; color:#e2e8f0; background:#17243a; font-size:.63rem; }.film-pos.active .film-basket p { animation:cartLineIn 520ms cubic-bezier(.22,1,.36,1) both; }.film-pos.active .film-basket p:nth-of-type(1) { animation-delay:2.1s; }.film-pos.active .film-basket p:nth-of-type(2) { animation-delay:3.1s; }.film-basket p span { width:24px; height:24px; display:grid; place-items:center; color:#93c5fd; background:#1e3a5f; }.film-basket > strong { margin-top:auto; padding-top:15px; display:flex; justify-content:space-between; border-top:1px solid #475569; font-size:.66rem; }.film-pos.active .film-basket > strong { animation:totalReveal 500ms 4s ease both; }.film-basket > strong b { color:#34d399; font-size:1.25rem; }.film-plu { padding:13px; display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }.film-plu div { min-height:75px; padding:13px; display:flex; flex-direction:column; justify-content:flex-end; background:#0f766e; }.film-plu div:nth-child(2) { background:#2563eb; }.film-plu div:nth-child(3) { background:#7c3aed; }.film-plu div:nth-child(4) { background:#b45309; }.film-pos.active .film-plu div:nth-child(1) { animation:pluTap 500ms 1.8s ease both; }.film-pos.active .film-plu div:nth-child(3) { animation:pluTap 500ms 2.8s ease both; }.film-plu span,.film-plu b { font-size:.68rem; }.film-plu b { margin-top:5px; }.film-plu button { border:0; color:#fff; background:#10b981; font-size:.66rem; font-weight:800; }.film-plu button:last-child { background:#2563eb; }.film-pos.active .film-plu button:last-child { animation:paymentPulse 900ms 4.5s ease both; }.film-event { position:absolute; z-index:14; right:3%; bottom:5%; min-width:210px; padding:13px; display:flex; align-items:center; gap:11px; border:1px solid #166534; background:#052e22; box-shadow:0 12px 35px rgba(0,0,0,.35); }.film-pos.active .film-event { animation:eventSlide 650ms 5.3s cubic-bezier(.22,1,.36,1) both; }.film-event > span { width:34px; height:34px; display:grid; place-items:center; color:#052e22; border-radius:50%; background:#34d399; font-weight:900; }.film-event small,.film-event strong { display:block; }.film-event small { color:#6ee7b7; font:.45rem "DM Mono",monospace; }.film-event strong { margin-top:3px; font-size:.72rem; }
.film-management { background:radial-gradient(circle at 50% 100%,#16304a,transparent 55%),#07111f; }.film-manage-shell { width:90%; height:84%; margin:auto; padding-bottom:22px; border:1px solid #263b56; background:#0a1625; box-shadow:0 28px 70px rgba(0,0,0,.35); }.film-management.active .film-manage-shell { animation:manageFlyIn 850ms cubic-bezier(.22,1,.36,1) both,manageDrift 8s 1s ease-in-out both; }.film-manage-bar { height:65px; padding:0 22px; display:flex; align-items:center; gap:5%; border-bottom:3px solid #2563eb; color:#8fa4bc; background:#111827; font-size:.65rem; }.film-manage-bar b { margin-right:auto; color:#fff; font-size:.9rem; }.film-manage-head { padding:22px 25px 10px; display:flex; align-items:center; justify-content:space-between; }.film-manage-head small,.film-manage-head strong { display:block; }.film-manage-head small { color:#60a5fa; font:.48rem "DM Mono",monospace; }.film-manage-head strong { margin-top:4px; font-size:1.5rem; }.film-manage-head em { padding:7px 10px; color:#34d399; background:#0f2a22; font:.5rem "DM Mono",monospace; font-style:normal; }.film-management.active .film-manage-head em { animation:statusBlink 1.4s ease-in-out infinite; }.film-metrics { padding:0 25px; display:grid; grid-template-columns:repeat(3,1fr); gap:11px; }.film-metrics div { padding:15px; border:1px solid #22334d; background:#101d2e; }.film-management.active .film-metrics div { animation:metricRise 550ms cubic-bezier(.22,1,.36,1) both; }.film-management.active .film-metrics div:nth-child(1) { animation-delay:.7s; }.film-management.active .film-metrics div:nth-child(2) { animation-delay:.9s; }.film-management.active .film-metrics div:nth-child(3) { animation-delay:1.1s; }.film-metrics small,.film-metrics b,.film-metrics i { display:block; }.film-metrics small { color:#8fa4bc; font:.48rem "DM Mono",monospace; }.film-metrics b { margin:8px 0 4px; font-size:1.2rem; }.film-metrics i { color:#34d399; font-size:.52rem; font-style:normal; }.film-metrics i.warn { color:#fbbf24; }.film-chart { height:190px; margin:12px 25px 0; padding:15px; display:flex; align-items:end; gap:3%; border:1px solid #22334d; background:#101d2e; }.film-chart span { flex:1; height:var(--h); background:linear-gradient(#60a5fa,#2563eb); transform-origin:bottom; }.film-scene.active .film-chart span { animation:filmBars 900ms 1.35s cubic-bezier(.22,1,.36,1) both; }.film-scene.active .film-chart span:nth-child(2) { animation-delay:1.45s; }.film-scene.active .film-chart span:nth-child(3) { animation-delay:1.55s; }.film-scene.active .film-chart span:nth-child(4) { animation-delay:1.65s; }.film-scene.active .film-chart span:nth-child(5) { animation-delay:1.75s; }.film-scene.active .film-chart span:nth-child(6) { animation-delay:1.85s; }.film-scene.active .film-chart span:nth-child(7) { animation-delay:1.95s; }
.film-terminal { display:grid; place-items:center; background:radial-gradient(circle at 50% 50%,#dbe5ef,transparent 55%),#b7c2cc; }.film-phone { width:280px; min-height:490px; padding-bottom:14px; overflow:hidden; border:7px solid #1e293b; border-radius:25px; color:#111a33; background:#f4f6fa; box-shadow:0 30px 65px rgba(15,23,42,.35); transform:rotate(-2deg); }.film-phone-bar { height:42px; padding:0 13px; display:flex; align-items:center; justify-content:space-between; color:#fff; background:#040c2d; font-size:.62rem; }.film-phone-bar span { color:#66c5b7; font-size:.5rem; }.film-phone-hero { margin:12px; padding:15px; color:#fff; border-radius:7px; background:#040c2d; }.film-phone-hero small,.film-phone-hero strong { display:block; }.film-phone-hero small { color:#9fb0ca; font:.45rem "DM Mono",monospace; }.film-phone-hero strong { margin-top:5px; font-size:1.1rem; }.film-phone-card,.film-phone-product { margin:9px 12px; padding:12px; border:1px solid #d8dde5; border-radius:7px; background:#fff; }.film-phone-card small,.film-phone-card b { display:block; }.film-phone-card small { color:#64748b; font:.45rem "DM Mono",monospace; }.film-phone-card b { margin-top:6px; font:.62rem "DM Mono",monospace; }.film-phone-card i { display:block; height:2px; margin-top:9px; background:#008080; box-shadow:0 0 8px #008080; }.film-phone-product { display:grid; grid-template-columns:42px 1fr; gap:9px; align-items:center; }.film-phone-product > span { width:42px; height:42px; display:grid; place-items:center; color:#fff; border-radius:6px; background:#4682b4; font-size:.6rem; font-weight:800; }.film-phone-product small,.film-phone-product strong { display:block; }.film-phone-product small { font-size:.58rem; }.film-phone-product strong { margin-top:3px; font-size:.7rem; }.film-phone-product > b { grid-column:1/-1; padding:7px; color:#008080; background:#e9f7f5; text-align:center; font-size:.58rem; }.film-phone button { width:calc(100% - 24px); height:42px; margin:5px 12px; border:0; border-radius:6px; color:#fff; background:#008080; font-size:.65rem; font-weight:800; }.film-label { position:absolute; right:13%; bottom:12%; width:230px; padding:17px; border:1px solid #c4c9d0; color:#111a33; background:#fff; box-shadow:12px 12px 0 rgba(4,12,45,.15); transform:rotate(4deg); }.film-label small,.film-label strong,.film-label b,.film-label span { display:block; }.film-label small,.film-label span { font:.45rem "DM Mono",monospace; }.film-label strong { margin:10px 0; }.film-label b { font-size:2rem; }.film-label b i { font-size:.65rem; font-style:normal; }
.film-partner { background:radial-gradient(circle at 75% 30%,#173e5e,transparent 42%),#07111f; }.film-partner-shell { width:90%; height:82%; margin:auto; overflow:hidden; border:1px solid #29405c; border-radius:13px; background:#0c1828; box-shadow:0 30px 70px rgba(0,0,0,.4); }.film-partner-nav { height:68px; padding:0 20px; display:flex; align-items:center; gap:3.5%; border-bottom:1px solid #29405c; color:#9babc0; background:#101e31; font-size:.58rem; }.film-partner-nav b { margin-right:auto; display:flex; align-items:center; gap:8px; color:#fff; font-size:.8rem; }.film-partner-nav b i { width:29px; height:29px; display:grid; place-items:center; color:#07111f; border-radius:7px; background:#60a5fa; font-style:normal; }.film-partner-body { padding:28px 4%; }.film-partner-body > small { color:#60a5fa; font:.48rem "DM Mono",monospace; }.film-partner-body h3 { margin:5px 0 18px; font-size:1.55rem; }.film-partner-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.film-partner-metrics div { padding:17px; border:1px solid #2b415c; background:#102035; }.film-partner-metrics span,.film-partner-metrics b { display:block; }.film-partner-metrics span { color:#8fa4bc; font:.45rem "DM Mono",monospace; }.film-partner-metrics b { margin-top:8px; font-size:1.45rem; }.film-license { margin-top:14px; padding:17px; display:grid; grid-template-columns:1fr 1fr auto; align-items:center; border:1px solid #2b415c; background:#102035; font-size:.65rem; }.film-license i { padding:7px 9px; color:#34d399; background:#0f2a22; font:.48rem "DM Mono",monospace; font-style:normal; }
.film-finale { display:grid; place-items:center; background:radial-gradient(circle,#132e52 0,#040c2d 58%); }.film-final-mark { position:relative; z-index:3; display:grid; justify-items:center; }.film-final-mark .brand-symbol { width:70px; height:70px; color:#fff; transform:scale(1.8); }.film-final-mark > strong { margin-top:36px; font:700 clamp(3.6rem,8vw,7rem) "Space Grotesk",sans-serif; letter-spacing:-.07em; }.film-final-mark > strong span { color:#79a8ce; }.film-final-mark > small { color:#9fb0ca; font:.58rem "DM Mono",monospace; letter-spacing:.18em; }.film-finale > a { position:absolute; z-index:4; bottom:9%; padding:12px 15px; border:1px solid #6685a7; font-size:.7rem; font-weight:800; }.film-finale > a span { margin-left:35px; }.film-orbit { position:absolute; z-index:2; padding:8px 10px; border:1px solid #36516f; color:#9fb0ca; background:#0a1830; font:.48rem "DM Mono",monospace; }.orbit-one { top:20%; left:13%; }.orbit-two { top:28%; right:10%; }.orbit-three { bottom:19%; left:15%; }.orbit-four { bottom:23%; right:14%; }
.film-controls { height:66px; padding:0 18px; display:grid; grid-template-columns:42px 1fr auto; gap:15px; align-items:center; border-top:1px solid #25364d; color:#cbd5e1; background:#0c1626; }.film-play { width:40px; height:40px; display:grid; place-items:center; border:1px solid #48617e; border-radius:50%; color:#fff; background:#15263b; cursor:pointer; }.film-play span { margin-left:2px; }.film-play.playing span { margin-left:0; }.film-track { position:relative; width:100%; height:4px; padding:0; overflow:hidden; border:0; background:#30435a; cursor:pointer; }.film-track i { position:absolute; inset:0 auto 0 0; width:0; background:#60a5fa; }.film-controls output { min-width:90px; font:.55rem "DM Mono",monospace; text-align:right; }.film-chapters { display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid #25364d; }.film-chapters button { min-height:58px; border:0; border-right:1px solid #25364d; color:#7e91aa; background:#0c1626; font-size:.62rem; cursor:pointer; }.film-chapters button:last-child { border-right:0; }.film-chapters button span { margin-right:7px; font:.48rem "DM Mono",monospace; }.film-chapters button.active { color:#fff; background:#15263b; box-shadow:inset 0 3px #60a5fa; }

/* Film choreography */
.film-player:not(.is-playing) .film-scene.active * { animation-play-state:paused !important; }
.film-terminal.active .film-phone { animation:phoneEnter 850ms cubic-bezier(.22,1,.36,1) both,phoneFloat 4s 1s ease-in-out infinite; }
.film-terminal.active .film-phone-bar span { animation:statusBlink 1.2s ease-in-out infinite; }
.film-terminal.active .film-phone-card i { animation:terminalScanner 1.6s .8s ease-in-out 2; }
.film-terminal.active .film-phone-product { animation:productReveal 580ms 2.1s cubic-bezier(.22,1,.36,1) both; }
.film-terminal.active .film-phone button { animation:saveConfirm 850ms 3s ease both; }
.film-terminal.active .film-label { animation:labelPrint 750ms 3.7s cubic-bezier(.22,1,.36,1) both,labelHover 3s 4.5s ease-in-out infinite; }
.film-partner.active .film-partner-shell { animation:partnerConsoleIn 850ms cubic-bezier(.22,1,.36,1) both,partnerCamera 8s 1s ease-in-out both; }
.film-partner.active .film-partner-nav b i { animation:partnerMark 700ms .5s cubic-bezier(.22,1,.36,1) both; }
.film-partner.active .film-partner-metrics div { animation:metricRise 550ms cubic-bezier(.22,1,.36,1) both; }
.film-partner.active .film-partner-metrics div:nth-child(1) { animation-delay:.8s; }
.film-partner.active .film-partner-metrics div:nth-child(2) { animation-delay:1s; }
.film-partner.active .film-partner-metrics div:nth-child(3) { animation-delay:1.2s; }
.film-partner.active .film-license { animation:licenseFlow 650ms 1.8s cubic-bezier(.22,1,.36,1) both; }
.film-partner.active .film-license i { animation:approvedPulse 1.3s 2.5s ease-in-out infinite; }
.film-finale.active .film-final-mark { animation:finaleMark 900ms cubic-bezier(.22,1,.36,1) both,finaleBreathe 3s 1s ease-in-out infinite; }
.film-finale.active > a { animation:ctaReveal 650ms 1.1s cubic-bezier(.22,1,.36,1) both; }
.film-finale.active .film-orbit { animation:orbitFloat 3.4s ease-in-out infinite; }
.film-finale.active .orbit-two { animation-delay:-.8s; }.film-finale.active .orbit-three { animation-delay:-1.6s; }.film-finale.active .orbit-four { animation-delay:-2.4s; }
.film-track { overflow:visible; }.film-track i::after { content:""; position:absolute; right:-5px; top:-3px; width:10px; height:10px; border-radius:50%; background:#fff; box-shadow:0 0 0 4px rgba(96,165,250,.18); }
.film-play.playing { animation:playPulse 1.8s ease-in-out infinite; }

/* Hardware compatibility */
.hardware { padding-top:145px; }.hardware-grid { margin-top:52px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.hardware-card { position:relative; min-height:350px; padding:24px; display:flex; flex-direction:column; border:1px solid #c2c7d0; background:#fbfaf7; transition:transform 180ms ease,box-shadow 180ms ease; }.hardware-card:hover { transform:translateY(-5px); box-shadow:7px 7px 0 #d0d4da; }.hardware-card.primary { color:#fff; border-color:#040c2d; background:#040c2d; }.hardware-state { width:max-content; margin-top:22px; padding:6px 8px; border:1px solid currentColor; font:.46rem "DM Mono",monospace; }.hardware-state.ready { color:#008080; }.hardware-card.primary .hardware-state { color:#7dd3c7; }.hardware-state.live { color:#2563eb; }.hardware-state.verify { color:#9a6500; }.hardware-card h3 { margin:18px 0 8px; font-size:1.25rem; }.hardware-card p { margin:0; color:var(--muted); font-size:.72rem; line-height:1.65; }.hardware-card.primary p { color:#9fb0ca; }.hardware-card > small { margin-top:auto; padding-top:28px; color:#7d8796; font:.46rem "DM Mono",monospace; letter-spacing:.05em; }.hardware-icon { position:relative; width:74px; height:74px; display:grid; place-items:center; border:1px solid #b9c1cc; background:#e9edf1; }.hardware-card.primary .hardware-icon { border-color:#2a405d; background:#101e31; }.printer-icon i { width:38px; height:27px; border:3px solid currentColor; border-radius:3px; }.printer-icon span { position:absolute; top:13px; width:31px; height:24px; border:2px solid currentColor; background:inherit; }.scanner-icon i { width:28px; height:39px; border:3px solid currentColor; border-radius:5px 5px 11px 11px; transform:rotate(-12deg); }.scanner-icon span { position:absolute; top:14px; width:37px; height:2px; background:#008080; box-shadow:0 0 8px #008080; }.fiscal-icon i { width:38px; height:43px; display:grid; place-items:center; border:3px solid currentColor; border-radius:4px; font-style:normal; font-weight:900; }.fiscal-icon span { position:absolute; bottom:12px; width:27px; height:3px; background:#008080; }.drawer-icon i { width:45px; height:35px; border:3px solid currentColor; }.drawer-icon i::after { content:""; position:absolute; left:31px; top:33px; width:12px; height:3px; background:currentColor; }.scale-icon i { padding:9px 7px; border:3px solid currentColor; font:.55rem "DM Mono",monospace; font-style:normal; }.scale-icon span { position:absolute; bottom:13px; width:47px; height:6px; border:2px solid currentColor; }.mobile-icon i { width:31px; height:48px; border:3px solid currentColor; border-radius:7px; }.mobile-icon span { position:absolute; bottom:17px; width:7px; height:7px; border-radius:50%; background:#008080; }.hardware-note { margin-top:12px; padding:18px 22px; display:grid; grid-template-columns:38px 1fr auto; gap:14px; align-items:center; border:1px solid #c2c7d0; background:#e8ecef; }.hardware-note > span { width:34px; height:34px; display:grid; place-items:center; color:#fff; background:#4682b4; font-weight:900; }.hardware-note p { margin:0; color:#596579; font-size:.68rem; }.hardware-note p strong { color:#111a33; }.hardware-note a { color:#111a33; font-size:.65rem; font-weight:800; }

/* Partner operations */
.partner-system { width:100vw; margin-left:calc(50% - 50vw); margin-top:145px; padding:125px max(20px,calc((100vw - var(--max))/2)); display:grid; grid-template-columns:.72fr 1.28fr; gap:70px; color:#fff; background:#07111f; }.partner-intro h2 { margin:15px 0 20px; font:600 clamp(3.6rem,6vw,6.6rem)/.88 "Space Grotesk",sans-serif; letter-spacing:-.075em; }.partner-intro h2 em { color:#79a8ce; font-style:normal; }.partner-intro > p { max-width:580px; color:#9fb0ca; font-size:.82rem; line-height:1.75; }.partner-points { margin:28px 0; display:grid; gap:10px; color:#cbd5e1; font-size:.68rem; }.partner-points span::first-letter { color:#34d399; }.partner-link { width:max-content; padding:13px 15px; display:flex; gap:40px; border:1px solid #506783; font-size:.7rem; font-weight:800; }.partner-link:hover { color:#07111f; background:#fff; }.partner-console { align-self:center; border:1px solid #2d425d; border-radius:13px; overflow:hidden; background:#0b1727; box-shadow:18px 18px 0 rgba(0,0,0,.18); }.partner-console-top { min-height:68px; padding:0 16px; display:flex; align-items:center; gap:20px; border-bottom:1px solid #2d425d; background:#101e31; }.partner-console-top > div { display:flex; align-items:center; gap:9px; }.partner-console-top > div > span { width:32px; height:32px; display:grid; place-items:center; color:#07111f; border-radius:7px; background:#60a5fa; font-weight:900; }.partner-console-top strong,.partner-console-top small { display:block; }.partner-console-top strong { min-width:112px; font-size:.68rem; }.partner-console-top small { margin-top:2px; color:#7f91a8; font-size:.43rem; }.partner-console-top nav { display:flex; justify-content:center; gap:18px; color:#7f91a8; font-size:.49rem; }.partner-console-top nav b { color:#fff; }.partner-console-top > i { width:31px; height:31px; margin-left:auto; display:grid; place-items:center; border-radius:50%; color:#07111f; background:#d8e4ef; font-size:.53rem; font-style:normal; font-weight:800; }.partner-console-body { padding:25px; }.partner-console-head { display:flex; justify-content:space-between; gap:18px; align-items:start; }.partner-console-head small { color:#60a5fa; font:.45rem "DM Mono",monospace; }.partner-console-head h3 { margin:5px 0 3px; font-size:1.35rem; }.partner-console-head p { margin:0; color:#7f91a8; font-size:.58rem; }.partner-console-head button { padding:9px 11px; border:0; color:#fff; background:#2563eb; font-size:.53rem; }.partner-console-metrics { margin-top:20px; display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.partner-console-metrics article { padding:14px; border:1px solid #293f5b; background:#102035; }.partner-console-metrics span,.partner-console-metrics strong,.partner-console-metrics small { display:block; }.partner-console-metrics span { color:#8396ad; font:.42rem "DM Mono",monospace; }.partner-console-metrics strong { margin:7px 0 3px; font-size:1.3rem; }.partner-console-metrics small { color:#34d399; font-size:.48rem; }.partner-console-table { margin-top:10px; border:1px solid #293f5b; }.partner-console-table > div { min-height:42px; padding:0 11px; display:grid; grid-template-columns:1.1fr 1.6fr .8fr .8fr; gap:8px; align-items:center; border-bottom:1px solid #253a54; color:#b5c0cf; font-size:.48rem; }.partner-console-table > div:last-child { border-bottom:0; }.partner-console-table .head { min-height:32px; color:#72869e; background:#0d1a2b; font:.39rem "DM Mono",monospace; }.partner-console-table b { color:#fff; }.partner-console-table i { width:max-content; padding:5px 6px; color:#34d399; background:#0f2a22; font:.38rem "DM Mono",monospace; font-style:normal; }.partner-console-table i.pending { color:#fbbf24; background:#2b2510; }.partner-workflows { grid-column:1/-1; margin-top:15px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #2d425d; border-bottom:1px solid #2d425d; }.partner-workflows article { min-height:180px; padding:30px 25px; display:grid; grid-template-columns:36px 1fr; gap:17px; border-right:1px solid #2d425d; }.partner-workflows article:last-child { border-right:0; }.partner-workflows article > span { width:34px; height:34px; display:grid; place-items:center; color:#07111f; background:#60a5fa; font:.5rem "DM Mono",monospace; }.partner-workflows small { color:#60a5fa; font:.44rem "DM Mono",monospace; }.partner-workflows h3 { margin:7px 0; font-size:1rem; }.partner-workflows p { margin:0; color:#8fa0b5; font-size:.63rem; line-height:1.6; }

.floating-demo-cta { position:fixed; z-index:40; right:22px; bottom:20px; min-width:210px; padding:11px 13px; display:grid; grid-template-columns:1fr auto; gap:2px 18px; color:#fff; border:1px solid #426181; background:#07111f; box-shadow:0 12px 35px rgba(4,12,45,.3); transition:transform 180ms ease,background 180ms ease; }.floating-demo-cta:hover { transform:translateY(-4px); background:#10233b; }.floating-demo-cta > span { grid-column:1/-1; color:#80a8c9; font:.42rem "DM Mono",monospace; }.floating-demo-cta > span i { display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:50%; background:#34d399; box-shadow:0 0 0 4px rgba(52,211,153,.12); }.floating-demo-cta strong { font-size:.72rem; }.floating-demo-cta b { color:#60a5fa; }

.reveal { opacity: 0; transform: translateY(26px); transition: opacity 750ms cubic-bezier(.22,1,.36,1), transform 750ms cubic-bezier(.22,1,.36,1); }.reveal.is-visible { opacity: 1; transform: translateY(0); }
@keyframes receiptFloat { 50% { transform: rotate(2deg) translateY(-9px); } }
@keyframes toastFloat { 50% { transform: translateY(-7px) rotate(-1deg); } }
@keyframes scanHero { 0%,100% { transform: translateY(0); opacity: 0; } 15% { opacity: 1; } 70% { opacity: .7; } 85% { transform: translateY(390px); opacity: 0; } }
@keyframes packetA { 50% { transform: translate(120px, 85px); } }
@keyframes packetB { 50% { transform: translate(-115px, 70px); } }
@keyframes packetC { 50% { transform: translate(115px, -55px); } }
@keyframes chartDraw { to { stroke-dashoffset: 0; } }
@keyframes mobileScan { 50% { transform: translateY(65px); } }
@keyframes barGrow { to { transform: scaleX(1); } }
@keyframes filmBars { from { transform:scaleY(.05); opacity:.3; } to { transform:scaleY(1); opacity:1; } }
@keyframes filmCaptionIn { from { opacity:0; transform:translateY(-14px); } to { opacity:1; transform:translateY(0); } }
@keyframes filmScreenIn { from { opacity:0; transform:perspective(1200px) rotateX(8deg) scale(.88) translateY(45px); } to { opacity:1; transform:perspective(1200px) rotateX(2deg) scale(1) translateY(0); } }
@keyframes filmCameraDrift { from { transform:perspective(1200px) rotateX(2deg) scale(1); } to { transform:perspective(1200px) rotateX(1deg) scale(1.035) translateY(-5px); } }
@keyframes filmScan { 0% { top:-8px; opacity:0; } 12% { opacity:1; } 85% { opacity:.9; } 100% { top:92%; opacity:0; } }
@keyframes statusBlink { 50% { opacity:.45; filter:brightness(1.5); } }
@keyframes barcodeRead { 0% { color:#64748b; border-color:#475569; } 45% { color:#fff; border-color:#2dd4bf; box-shadow:0 0 0 2px rgba(45,212,191,.15); } 100% { color:#94a3b8; border-color:#475569; } }
@keyframes cartLineIn { from { opacity:0; transform:translateX(-35px); } to { opacity:1; transform:translateX(0); } }
@keyframes totalReveal { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@keyframes pluTap { 40% { transform:scale(.92); filter:brightness(1.35); box-shadow:0 0 0 3px rgba(255,255,255,.35); } }
@keyframes paymentPulse { 40% { transform:scale(.96); filter:brightness(1.3); box-shadow:0 0 0 4px rgba(96,165,250,.25); } }
@keyframes eventSlide { from { opacity:0; transform:translateX(60px) rotate(2deg); } to { opacity:1; transform:translateX(0) rotate(0); } }
@keyframes manageFlyIn { from { opacity:0; transform:translateY(45px) scale(.9); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes manageDrift { from { transform:scale(1); } to { transform:scale(1.025) translateY(-4px); } }
@keyframes metricRise { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes phoneEnter { from { opacity:0; transform:translateY(70px) rotate(6deg) scale(.82); } to { opacity:1; transform:translateY(0) rotate(-2deg) scale(1); } }
@keyframes phoneFloat { 50% { transform:translateY(-8px) rotate(-1deg); } }
@keyframes terminalScanner { 0%,100% { transform:translateY(0); opacity:.4; } 50% { transform:translateY(43px); opacity:1; } }
@keyframes productReveal { from { opacity:0; transform:translateY(18px) scale(.96); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes saveConfirm { 45% { background:#006f6f; transform:scale(.96); box-shadow:0 0 0 4px rgba(0,128,128,.16); } }
@keyframes labelPrint { from { opacity:0; transform:translateY(-75px) rotate(-3deg) scale(.82); clip-path:inset(0 0 100% 0); } to { opacity:1; transform:translateY(0) rotate(4deg) scale(1); clip-path:inset(0); } }
@keyframes labelHover { 50% { transform:translateY(-7px) rotate(2deg); } }
@keyframes partnerConsoleIn { from { opacity:0; transform:translateX(55px) scale(.9); } to { opacity:1; transform:translateX(0) scale(1); } }
@keyframes partnerCamera { from { transform:scale(1); } to { transform:scale(1.025) translateX(-5px); } }
@keyframes partnerMark { from { opacity:0; transform:rotate(-35deg) scale(.5); } to { opacity:1; transform:rotate(0) scale(1); } }
@keyframes licenseFlow { from { opacity:0; transform:translateX(-45px); } to { opacity:1; transform:translateX(0); } }
@keyframes approvedPulse { 50% { color:#a7f3d0; box-shadow:0 0 0 5px rgba(52,211,153,.1); } }
@keyframes finaleMark { from { opacity:0; transform:scale(.65); filter:blur(8px); } to { opacity:1; transform:scale(1); filter:blur(0); } }
@keyframes finaleBreathe { 50% { transform:scale(1.025); } }
@keyframes ctaReveal { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:translateY(0); } }
@keyframes orbitFloat { 50% { transform:translateY(-12px) rotate(1deg); border-color:#60a5fa; color:#fff; } }
@keyframes playPulse { 50% { border-color:#60a5fa; box-shadow:0 0 0 6px rgba(96,165,250,.1); } }
@keyframes pricingRowIn { from { opacity:0; transform:translateX(-22px); } to { opacity:1; transform:translateX(0); } }
@keyframes totalGlow { 50% { color:#7dd3c7; text-shadow:0 0 22px rgba(125,211,199,.22); } }

@media (max-width: 1140px) {
  .hero { min-height: auto; grid-template-columns: 1fr; padding-top: 140px; }
  .hero-copy { max-width: 800px; }.hero h1 { font-size: clamp(5rem, 10vw, 8rem); }.hero-product { width: min(900px, 100%); margin-inline: auto; }
  .product-story, .story-management { grid-template-columns: 1fr; gap: 45px; }.story-management .story-copy, .story-management .story-visual { grid-column: 1; grid-row: auto; }.story-visual { width: min(900px,100%); margin-inline: auto; }
  .feature-grid { grid-template-columns: repeat(2,1fr); }.feature-wide { grid-column: span 2; }
  .pricing-layout { grid-template-columns:1fr; }.pricing-summary { width:min(760px,100%); }
  .reports { grid-template-columns: 1fr; }.profit-board { width: min(850px,100%); }
  .gallery-grid { grid-template-columns:repeat(2,1fr); }
  .hardware-grid { grid-template-columns:repeat(2,1fr); }
  .partner-system { grid-template-columns:1fr; }.partner-intro { max-width:800px; }.partner-console { width:min(900px,100%); }
  .closing-layout { grid-template-columns:1fr; }.demo-form { width:min(760px,100%); }
}

@media (max-width: 760px) {
  .site-header, main, footer { width: min(calc(100% - 28px), var(--max)); }
  .site-header { height: 70px; grid-template-columns: 1fr auto; }.main-nav { display: none; }.header-cta { padding: 9px 10px; font-size: .66rem; }.brand-symbol { width: 31px; height: 31px; }.brand-word { font-size: 1rem; }
  .hero { width: 100vw; min-height: auto; padding: 115px 14px 60px; gap: 55px; grid-template-columns: minmax(0,1fr); }.hero h1 { font-size: clamp(3.55rem, 16vw, 5.2rem); }.hero-lead { font-size: .94rem; }.hero-actions { flex-direction: column; }.hero-actions .button { width: 100%; }
  .hero-product { min-height: 475px; width: 100%; }.pos-device { top: 20px; left: -21%; width: 141%; transform: scale(.84) rotateY(-3deg); transform-origin: top center; }.pos-body { grid-template-columns: 40% 60%; }.actual-product-grid article { min-height: 72px; }.actual-actions button { min-height: 28px; }.floating-receipt { right: -5px; bottom: -1px; transform: scale(.82) rotate(4deg); transform-origin: bottom right; }.sale-toast { left: -6px; transform: scale(.85); transform-origin: left top; }.scan-beam { display: none; }
  .trust-strip { justify-content: flex-start; overflow: hidden; }.trust-strip span:nth-of-type(n+4), .trust-strip i:nth-of-type(n+4) { display: none; }
  .product-film { padding-top:95px; }.film-player { margin-top:35px; box-shadow:6px 6px 0 #d5d8df; }.film-stage { height:560px; }.film-scene { padding:78px 13px 20px; }.film-caption { align-items:flex-start; }.film-caption strong { max-width:62%; font-size:.64rem; }.film-pos-shell { width:140%; height:72%; margin-left:-20%; transform:scale(.78); transform-origin:center top; }.film-event { right:10px; bottom:45px; transform:scale(.85); transform-origin:right bottom; }.film-manage-shell { width:150%; height:75%; margin-left:-25%; transform:scale(.7); transform-origin:center top; }.film-manage-bar { gap:18px; }.film-terminal { padding-top:80px; }.film-phone { transform:scale(.82) rotate(-2deg); }.film-label { right:-18px; bottom:55px; transform:scale(.7) rotate(4deg); }.film-partner-shell { width:155%; height:70%; margin-left:-27%; transform:scale(.66); transform-origin:center top; }.film-partner-nav { gap:17px; }.film-chapters { grid-template-columns:repeat(5,1fr); }.film-chapters button { min-width:0; font-size:0; }.film-chapters button span { margin:0; font-size:.5rem; }.film-controls { padding:0 12px; grid-template-columns:38px 1fr auto; gap:10px; }.film-controls output { min-width:76px; font-size:.47rem; }.orbit-one { left:3%; }.orbit-two { right:3%; }.orbit-three { left:4%; }.orbit-four { right:4%; }.film-final-mark > small { font-size:.45rem; }
  .section { padding-top: 95px; }.section-heading, .compact { grid-template-columns: 1fr; gap: 28px; }.section-heading h2 { font-size: clamp(3rem, 13vw, 4.5rem); }
  .ecosystem { min-height: 720px; margin-top: 40px; }.store-map { width: 240px; height: 190px; top: 49%; }.store-roof { left: 18px; right: 18px; height: 55px; font-size: 1rem; }.store-window,.store-door { top: 63px; bottom: 22px; }.window-a,.window-b { width: 80px; }.store-door { left: 85px; width: 70px; }.system-chip { width: 150px; min-height: 65px; padding: 9px; }.system-chip > span { width: 29px; height: 29px; }.system-chip strong { font-size: .66rem; }.system-chip small { font-size: .48rem; }.chip-pos { left: 4%; top: 10%; }.chip-manage { right: 4%; top: 23%; }.chip-mobile { left: 4%; bottom: 18%; }.chip-cloud { right: 4%; bottom: 6%; }.line-pos,.line-manage,.line-mobile,.line-cloud { display: none; }.data-packet { display: none; }
  .products { gap: 100px; }.story-copy h2 { font-size: clamp(2.8rem, 12vw, 4rem); }.visual-payment,.visual-dashboard,.visual-terminal { min-height: 500px; }.payment-screen { width: 91%; padding: 17px; }.payment-methods { grid-template-columns: 1fr; }.payment-methods button { min-height: 57px; display: grid; grid-template-columns: 30px 1fr auto; align-items: center; }.payment-methods i { margin: 0; }.payment-methods small { text-align: right; }.approval-card { right: 1%; bottom: 15px; transform: scale(.83) rotate(3deg); transform-origin: bottom right; }
  .visual-dashboard { padding: 13px; min-height: 450px; overflow: hidden; }.dashboard-window { width: 155%; transform: scale(.64); transform-origin: center; }.dash-main { min-width: 510px; }
  .visual-terminal { min-height: 650px; }.handheld { transform: rotate(-2deg) scale(.92); }.label-preview { right: -3%; bottom: 32px; transform: scale(.78) rotate(5deg); transform-origin: bottom right; }
  .feature-grid { grid-template-columns: 1fr; }.feature-wide { grid-column: auto; }.feature-card { min-height: 390px; }.feature-wide { min-height: 440px; }.catalog-row { grid-template-columns: 1.4fr .35fr .55fr; }.catalog-row > :last-child { display: none; }
  .profit-board { padding: 18px; box-shadow: 6px 6px 0 var(--ink); }.profit-bars > div { grid-template-columns: 78px 1fr 68px; }.profit-footer { grid-template-columns: 1fr; gap: 12px; }.profit-footer b { display: inline; margin-left: 6px; }
  .security-strip { margin-top: 95px; padding: 23px 18px; grid-template-columns: 1fr; }.approval-flow { justify-content: flex-start; flex-wrap: wrap; }
  .tour-tabs { grid-template-columns:1fr; }.tour-tabs button { min-height:52px; border-right:0; border-bottom:1px solid #bcc3ce; }.tour-tabs button:last-child { border-bottom:0; }
  .tour-shell,.tour-panel { min-height:auto; }.demo-toolbar { gap:10px; font-size:.55rem; }.demo-toolbar div:nth-child(2),.demo-toolbar div:nth-child(3) { display:none; }.demo-pos-body { grid-template-columns:1fr; }.demo-cart-area { min-height:420px; }.demo-plu-area { min-height:500px; }.demo-products { grid-template-columns:repeat(2,1fr); }.demo-actions { grid-template-columns:repeat(2,1fr); }.demo-actions button.pay { grid-column:1/-1; }.management-demo-top span { display:none; }.management-demo-nav { height:67px; padding:0 5px; overflow-x:auto; }.management-demo-nav button { min-width:85px; }.management-demo-content { padding:16px; }.manage-demo-metrics { grid-template-columns:repeat(2,1fr); }.manage-demo-chart { height:190px; }.manage-table > div { grid-template-columns:1fr 1.4fr .7fr; }.manage-table > div > :nth-child(3),.manage-table > div > :nth-child(4) { display:none; }.dispatch-flow { margin-top:30px; flex-direction:column; }.dispatch-flow > i { transform:rotate(90deg); }.report-demo-list > div { grid-template-columns:82px 1fr 75px; }.tour-panel[data-panel="terminal"] { padding:25px 12px; grid-template-columns:1fr; gap:35px; }.terminal-demo-device { width:min(310px,100%); margin:auto; }.terminal-demo-guide { max-width:310px; margin:auto; }
  .gallery-grid { grid-template-columns:1fr; }.gallery-canvas { height:210px; }.gallery-modal { padding:10px; }.gallery-modal-card { padding:12px; }.gallery-modal-visual .gallery-canvas { height:330px; }.scenario-grid { grid-template-columns:1fr; }.scenario-card { min-height:300px; }
  .pricing { padding-top:95px; }.pricing-layout { margin-top:35px; }.pricing-console { overflow-x:auto; box-shadow:6px 6px 0 #d5d8df; }.pricing-window-top nav { display:none; }.pricing-controls { grid-template-columns:1fr; }.pricing-table { min-width:900px; }.pricing-summary { padding:24px; box-shadow:6px 6px 0 #cbd2da; }.pricing-mini-stats { grid-template-columns:1fr; }
  .hardware { padding-top:95px; }.hardware-grid { margin-top:35px; grid-template-columns:1fr; }.hardware-card { min-height:315px; }.hardware-note { grid-template-columns:34px 1fr; }.hardware-note a { grid-column:2; }
  .partner-system { margin-top:95px; padding:85px 14px; gap:45px; }.partner-intro h2 { font-size:clamp(3.4rem,15vw,5.2rem); }.partner-console { overflow:hidden; }.partner-console-top nav { display:none; }.partner-console-body { padding:16px; }.partner-console-metrics { grid-template-columns:1fr 1fr; }.partner-console-metrics article:last-child { grid-column:1/-1; }.partner-console-table { overflow-x:auto; }.partner-console-table > div { min-width:550px; }.partner-workflows { grid-template-columns:1fr; }.partner-workflows article { border-right:0; border-bottom:1px solid #2d425d; }.partner-workflows article:last-child { border-bottom:0; }.floating-demo-cta { right:10px; bottom:10px; min-width:178px; padding:9px 11px; }.floating-demo-cta strong { font-size:.66rem; }
  .closing { min-height: 620px; margin-top: 95px; padding: 70px 14px; }.closing h2 { font-size: clamp(3.5rem, 15vw, 5rem); }.closing-mark { display: none; }.closing-layout { gap:45px; }.contact-options { grid-template-columns:1fr; }.demo-form { padding:20px 15px; }.form-grid { grid-template-columns:1fr; }.form-grid .full { grid-column:auto; }
  footer { grid-template-columns: 1fr 1fr; }.footer-links { display: none; }.footer-maker { grid-column: 2; }.footer-bottom { margin-top: 20px; }.footer-bottom span:nth-child(2) { display: none; }
}

@media (max-width: 760px) {
  .pricing-presets { grid-template-columns:1fr; }
  .pricing-rate-note { grid-template-columns:1fr; margin-inline:18px; }
  .pricing-year-compare { grid-template-columns:1fr; }
  .pricing-year-compare i { margin:auto; transform:rotate(90deg); }
}

/* Refinements requested for the product demo and proposal flow */
.tour-shell { margin-top:50px; display:grid; gap:28px; min-height:auto; border:0; background:transparent; }
.tour-panel { min-height:auto; overflow:hidden; border:1px solid #b9c0cb; background:#dfe3e8; box-shadow:10px 10px 0 #d5d8df; }
.tour-panel::before { grid-column:1/-1; display:block; padding:12px 18px; color:#dbeafe; background:#07111f; font:.58rem "DM Mono",monospace; letter-spacing:.08em; }
.tour-panel[data-panel="winpos"]::before { content:"01 / WINPOS KASA - GERCEK KASA AKISI"; }
.tour-panel[data-panel="management"]::before { content:"02 / WINMANAGEMENT - MERKEZ YONETIM"; }
.tour-panel[data-panel="terminal"]::before { content:"03 / ANDROID TERMINAL - MOBIL OPERASYON"; }
.demo-plu-tabs button { padding:0 15px; display:grid; place-items:center; border:1px solid #334155; color:#94a3b8; background:#0f172a; font-size:.65rem; font-weight:800; cursor:pointer; }
.demo-plu-tabs button.active { color:#fff; background:#334155; box-shadow:inset 0 -2px 0 #60a5fa; }
.demo-speed-options { padding:0 11px 9px; display:flex; flex-wrap:wrap; gap:6px; background:#1e293b; }
.demo-speed-options span { padding:6px 8px; color:#bfdbfe; border:1px solid #334155; border-radius:999px; background:#0f172a; font:.52rem "DM Mono",monospace; }
.demo-actions { grid-template-columns:repeat(6,minmax(0,1fr)); }
.demo-actions button { border-radius:4px; background:#162235; }
.demo-actions button:hover { filter:brightness(1.12); }
.demo-actions button.danger { color:#fecdd3; border-color:#7f1d1d; background:#3f1d2b; }
.demo-actions button.wide { grid-column:span 2; }
.demo-actions button.cash,.demo-actions button.card,.demo-actions button.meal { min-height:58px; color:#fff; border:0; font-size:.75rem; }
.demo-actions button.meal { color:#251602; background:#f59e0b; }
.manage-demo-chart { position:relative; }
.manage-demo-chart .bars i { cursor:crosshair; transition:opacity 160ms ease, transform 160ms ease; }
.manage-demo-chart .bars i:hover { opacity:1; transform:scaleY(1.04); }
.chart-hover-card { position:absolute; z-index:3; left:50%; top:50%; min-width:155px; padding:10px 12px; border:1px solid #2f4969; color:#f8fafc; background:#07111f; box-shadow:0 16px 35px rgba(0,0,0,.28); transform:translate(-50%,-115%); pointer-events:none; }
.chart-hover-card strong,.chart-hover-card small { display:block; }
.chart-hover-card strong { font-size:.72rem; }
.chart-hover-card small { margin-top:4px; color:#93c5fd; font-size:.52rem; }
.terminal-home,.terminal-detail { animation:terminalScreenIn 260ms ease both; }
.terminal-dashboard-metrics { margin:0 13px 10px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.terminal-dashboard-metrics article { padding:10px 8px; border:1px solid #e4e7ec; border-radius:8px; background:#fff; }
.terminal-dashboard-metrics span,.terminal-dashboard-metrics strong { display:block; }
.terminal-dashboard-metrics span { color:#64748b; font-size:.48rem; }
.terminal-dashboard-metrics strong { margin-top:4px; color:#0f172a; font-size:.72rem; }
.terminal-menu-grid { margin:10px 13px; display:grid; gap:8px; }
.terminal-menu-grid button { padding:12px; display:grid; grid-template-columns:32px 1fr; gap:4px 9px; align-items:center; border:1px solid #d7dce5; border-radius:9px; color:#17213b; background:#fff; text-align:left; cursor:pointer; }
.terminal-menu-grid button:hover { border-color:#4682b4; box-shadow:0 8px 18px rgba(70,130,180,.14); }
.terminal-menu-grid span { grid-row:1/3; width:30px; height:30px; display:grid; place-items:center; border-radius:8px; color:#fff; background:#4682b4; font:.52rem "DM Mono",monospace; }
.terminal-menu-grid strong,.terminal-menu-grid small { display:block; }
.terminal-menu-grid strong { font-size:.72rem; }
.terminal-menu-grid small { color:#64748b; font-size:.55rem; }
.terminal-back { margin:13px 13px 0; padding:8px 10px; border:1px solid #d7dce5; border-radius:999px; color:#17213b; background:#fff; font-size:.58rem; font-weight:800; cursor:pointer; }
.terminal-summary-list { margin:10px 13px; display:grid; gap:8px; }
.terminal-summary-list div { padding:11px 12px; display:flex; justify-content:space-between; gap:12px; border:1px solid #e4e7ec; border-radius:8px; background:#fff; font-size:.62rem; }
.terminal-summary-list span { color:#64748b; }
.terminal-summary-list b { color:#17213b; }
.terminal-label-preview { margin:13px; padding:14px; border:2px solid #17213b; border-radius:4px; color:#17213b; background:#fffdf6; box-shadow:5px 5px 0 #dfe3e8; }
.terminal-label-preview small,.terminal-label-preview strong,.terminal-label-preview b,.terminal-label-preview span { display:block; }
.terminal-label-preview small,.terminal-label-preview span { font:.48rem "DM Mono",monospace; }
.terminal-label-preview strong { margin:10px 0 4px; font-size:.78rem; }
.terminal-label-preview b { font-size:1.8rem; }
.terminal-label-preview i { display:block; height:22px; margin-top:9px; background:repeating-linear-gradient(90deg,#111 0 2px,transparent 2px 4px,#111 4px 7px,transparent 7px 10px); }
.mobile-summary-cards { margin:0 10px 8px; display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.mobile-summary-cards article { padding:9px; border:1px solid #e4e7ec; border-radius:6px; background:#fff; }
.mobile-summary-cards article:first-child { grid-column:1/-1; color:#fff; background:#040c2d; }
.mobile-summary-cards span,.mobile-summary-cards strong,.mobile-summary-cards small { display:block; }
.mobile-summary-cards span { color:#748196; font-size:.36rem; }
.mobile-summary-cards article:first-child span { color:#b8c2d6; }
.mobile-summary-cards strong { margin:5px 0 3px; font-size:.62rem; }
.mobile-summary-cards small { color:#008080; font-size:.35rem; }
.mobile-payment-mix { margin:0 10px 8px; padding:10px; display:grid; gap:6px; border:1px solid #e4e7ec; border-radius:6px; background:#fff; }
.mobile-payment-mix div { display:grid; grid-template-columns:48px 1fr 58px; align-items:center; gap:6px; font-size:.36rem; }
.mobile-payment-mix i { height:7px; border-radius:999px; background:linear-gradient(90deg,#4682b4 var(--w),#e4e7ec var(--w)); }
.mobile-payment-mix b { text-align:right; }
.mobile-alert-card { margin:0 10px 8px; padding:10px; border:1px solid #f2c66d; border-radius:6px; background:#fff7df; }
.mobile-alert-card strong,.mobile-alert-card small { display:block; }
.mobile-alert-card strong { color:#7c4a03; font-size:.5rem; }
.mobile-alert-card small { margin-top:4px; color:#806326; font-size:.36rem; line-height:1.4; }
.gallery-labels { padding:18px; align-items:flex-start; background:linear-gradient(135deg,#ece8dd,#f8f5ea); }
.gallery-labels > div { width:150px; min-height:142px; padding:12px; border:2px solid #111827; background:#fffdf6; box-shadow:4px 4px 0 rgba(17,24,39,.16); }
.gallery-labels small,.gallery-labels strong,.gallery-labels b,.gallery-labels span { display:block; }
.gallery-labels small,.gallery-labels span { color:#475569; font:.42rem "DM Mono",monospace; }
.gallery-labels strong { margin:8px 0 5px; min-height:28px; font-size:.67rem; line-height:1.1; }
.gallery-labels b { font-size:1.45rem; letter-spacing:-.06em; }
.gallery-labels i { height:20px; }
.pricing-layout { grid-template-columns:1fr; align-items:start; }
.pricing-console { width:100%; }
.pricing-summary { width:100%; max-width:none; padding:30px; box-shadow:10px 10px 0 #cbd2da; }
.pricing-window-top nav { gap:24px; }
.pricing-controls { grid-template-columns:minmax(220px,300px) 1fr; }
.pricing-rate-note { font-size:.68rem; }
.pricing-table { overflow-x:auto; }
.pricing-table-head,.pricing-row { grid-template-columns:minmax(230px,1.4fr) 155px 145px 115px 155px 110px; }
.pricing-row { min-height:74px; font-size:.74rem; }
.pricing-row label span { font-size:.9rem; }
.pricing-row label small { font-size:.6rem; }
.pricing-period { font-size:.66rem; }
.pricing-qty { width:max-content; display:grid; grid-template-columns:34px 58px 34px; align-items:center; border:1px solid #314862; border-radius:8px; overflow:hidden; background:#0d1a2b; }
.pricing-qty button { height:36px; border:0; color:#dbeafe; background:#14243a; font-size:1rem; font-weight:900; cursor:pointer; }
.pricing-qty button:hover { color:#07111f; background:#7dd3c7; }
.pricing-qty input { width:58px; height:36px; border:0; color:#fff; background:#07111f; text-align:center; font:700 .72rem "DM Mono",monospace; }
.pricing-row.free-year em { color:#07111f; background:#facc15; }
.pricing-row.free-year b { color:#fde68a; }
.pricing-mini-stats { grid-template-columns:repeat(4,1fr); }
.pricing-free-note { border-color:#2dd4bf; color:#cffafe; background:#0f2a2a; }
.floating-demo-cta { border-radius:0; font-family:inherit; text-align:left; cursor:pointer; }
.app-modal { position:fixed; inset:0; z-index:150; display:grid; place-items:center; padding:24px; }
.app-modal-backdrop { position:absolute; inset:0; background:rgba(2,6,23,.78); backdrop-filter:blur(7px); }
.app-modal-card { position:relative; z-index:2; width:min(920px,100%); max-height:92vh; overflow:auto; color:#17213b; background:#fbfaf7; border:1px solid #1f2a44; box-shadow:18px 18px 0 rgba(2,6,23,.28); }
.app-modal-close { position:absolute; right:14px; top:14px; z-index:4; width:38px; height:38px; border:1px solid #334155; color:#fff; background:#07111f; font-size:1.25rem; cursor:pointer; }
.demo-request-card { width:min(1040px,100%); padding:22px; display:grid; grid-template-columns:.75fr 1.25fr; gap:18px; background:#07111f; }
.demo-modal-copy { padding:30px; color:#fff; background:radial-gradient(circle at 80% 20%,rgba(70,130,180,.34),transparent 38%),#101e31; }
.demo-modal-copy span { color:#7dd3c7; font:.54rem "DM Mono",monospace; }
.demo-modal-copy h3 { margin:14px 0 10px; font-size:2rem; line-height:1; letter-spacing:-.05em; }
.demo-modal-copy p { margin:0; color:#aab8cb; line-height:1.65; }
.demo-modal-form-slot .demo-form { width:100%; opacity:1; transform:none; box-shadow:none; }
.receipt-modal-card { width:min(420px,100%); padding:18px; background:#17213b; }
.receipt-paper { position:relative; padding:24px 20px 20px; color:#17213b; background:#fffefa; box-shadow:0 18px 40px rgba(0,0,0,.22); }
.receipt-paper::after { content:""; position:absolute; left:0; right:0; bottom:-8px; height:9px; background:linear-gradient(135deg,#fffefa 6px,transparent 0) 0 0/12px 12px repeat-x; }
.receipt-paper > strong,.receipt-paper > small { display:block; text-align:center; }
.receipt-paper > strong { font-size:1.25rem; }
.receipt-paper > small { margin-top:5px; color:#64748b; font:.52rem "DM Mono",monospace; }
.receipt-lines { margin:18px 0; display:grid; gap:8px; border-top:1px dashed #94a3b8; border-bottom:1px dashed #94a3b8; padding:14px 0; }
.receipt-lines div,.receipt-payment,.receipt-total { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.receipt-lines div { font-size:.72rem; }
.receipt-lines small { color:#64748b; }
.receipt-payment { color:#475569; font-size:.74rem; }
.receipt-total { margin-top:12px; }
.receipt-total strong { font-size:1.5rem; }
.receipt-barcode { height:36px; margin-top:18px; background:repeating-linear-gradient(90deg,#111 0 2px,transparent 2px 4px,#111 4px 7px,transparent 7px 10px); }
.receipt-return { width:100%; height:42px; margin-top:16px; border:0; color:#fff; background:#07111f; font-weight:800; cursor:pointer; }
.stock-card { width:min(860px,100%); padding:26px; background:#07111f; color:#fff; }
.stock-card-head span { color:#60a5fa; font:.54rem "DM Mono",monospace; }
.stock-card-head h3 { margin:8px 0 6px; font-size:2rem; }
.stock-card-head p { margin:0; color:#9cafc5; }
.stock-card-grid { margin-top:22px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.stock-card-grid label { display:grid; gap:6px; }
.stock-card-grid span { color:#8fa4bc; font-size:.58rem; }
.stock-card-grid input { min-width:0; height:42px; padding:0 11px; border:1px solid #263b56; color:#fff; background:#101e31; }
.stock-card-preview { margin-top:18px; display:grid; grid-template-columns:1fr auto; gap:18px; align-items:end; }
.stock-card-preview > div { width:min(310px,100%); padding:17px; border:2px solid #111827; color:#17213b; background:#fffdf6; box-shadow:6px 6px 0 rgba(255,255,255,.12); }
.stock-card-preview small,.stock-card-preview strong,.stock-card-preview b,.stock-card-preview span { display:block; }
.stock-card-preview small,.stock-card-preview span { font:.52rem "DM Mono",monospace; }
.stock-card-preview strong { margin:10px 0 5px; }
.stock-card-preview b { font-size:2.2rem; }
.stock-card-preview i { display:block; height:25px; margin-top:10px; background:repeating-linear-gradient(90deg,#111 0 2px,transparent 2px 4px,#111 4px 7px,transparent 7px 10px); }
.stock-card-preview button { height:46px; padding:0 20px; border:0; color:#07111f; background:#7dd3c7; font-weight:900; cursor:pointer; }
@keyframes terminalScreenIn { from { opacity:0; transform:translateX(14px); } to { opacity:1; transform:translateX(0); } }
@media (max-width: 980px) {
  .demo-request-card { grid-template-columns:1fr; }
  .stock-card-grid { grid-template-columns:repeat(2,1fr); }
  .pricing-mini-stats { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 760px) {
  .tour-panel { box-shadow:6px 6px 0 #d5d8df; }
  .demo-actions { grid-template-columns:repeat(2,1fr); }
  .demo-actions button.wide,.demo-actions button.cash,.demo-actions button.card,.demo-actions button.meal { grid-column:auto; }
  .terminal-dashboard-metrics { grid-template-columns:1fr; }
  .pricing-controls { grid-template-columns:1fr; }
  .pricing-summary { padding:22px; }
  .pricing-mini-stats { grid-template-columns:1fr; }
  .app-modal { padding:10px; }
  .demo-request-card,.stock-card { padding:14px; }
  .demo-modal-copy { padding:22px; }
  .demo-modal-copy h3 { font-size:1.65rem; }
  .stock-card-grid,.stock-card-preview { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; }.chart-stroke { stroke-dashoffset: 0; }.profit-bars i b { transform: scaleX(1); }
}