:root {
  --black: #050505; --ink: #101010; --paper: #f3f3ef; --white: #fff;
  --grey: #9b9b96; --mist: #e7f0fa; --sky: #7ba4d0; --blue: #2e5e99; --navy: #0d2440;
  --line: rgba(255,255,255,.16); --dark-line: rgba(0,0,0,.17);
  --display: "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --body: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --gutter: clamp(1.25rem, 3.8vw, 4.5rem);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); }
body { margin: 0; overflow-x: hidden; background: var(--black); color: var(--paper); font-family: var(--body); line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
::selection { background: var(--paper); color: var(--black); }
.skip-link { position: fixed; top: 0; left: 1rem; z-index: 100; padding: .8rem 1rem; transform: translateY(-120%); background: white; color: black; }
.skip-link:focus { transform: translateY(0); }

.site-header { position: fixed; inset: 0 0 auto; z-index: 40; display: flex; height: 82px; align-items: center; justify-content: space-between; padding: 0 var(--gutter); border-bottom: 1px solid var(--line); transition: background 250ms, height 250ms; }
.site-header.scrolled { height: 68px; background: rgba(5,5,5,.88); backdrop-filter: blur(18px); }
.brand { position: relative; z-index: 3; display: inline-flex; align-items: center; gap: .8rem; }
.brand-wordmark { font-size: 1rem; font-weight: 800; letter-spacing: .24em; }
.site-nav { display: flex; align-items: center; gap: clamp(1.2rem, 2.8vw, 3.2rem); color: #bbb; font-size: .65rem; text-transform: uppercase; letter-spacing: .14em; }
.site-nav > a:not(.nav-cta) { position: relative; }
.site-nav > a:not(.nav-cta)::after { position: absolute; right: 0; bottom: -.35rem; left: 0; height: 1px; content: ""; transform: scaleX(0); transform-origin: right; background: white; transition: transform 200ms; }
.site-nav > a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav-cta { display: flex; align-items: center; gap: 1.2rem; padding: .75rem 1rem; border: 1px solid #777; color: white; transition: background 200ms, color 200ms; }
.nav-cta:hover { background: white; color: black; }
.nav-cta span { font-size: .9rem; }
.menu-toggle { display: none; border: 0; background: transparent; text-transform: uppercase; font-size: .65rem; letter-spacing: .12em; }

.hero { position: relative; display: grid; min-height: 100svh; grid-template-columns: 1fr .9fr; align-items: center; gap: clamp(3rem, 6vw, 8rem); overflow: hidden; padding: 9.5rem var(--gutter) 6.5rem; isolation: isolate; }
.hero::before { position: absolute; top: 0; right: -5%; z-index: -3; width: 58%; height: 100%; background: radial-gradient(circle at 45% 45%, rgba(255,255,255,.12), transparent 58%); content: ""; }
.hero-copy { position: relative; z-index: 2; max-width: 780px; }
.eyebrow, .section-label { display: flex; align-items: center; gap: .7rem; margin: 0; color: var(--grey); font-size: .64rem; font-weight: 650; text-transform: uppercase; letter-spacing: .16em; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: white; box-shadow: 0 0 14px white; animation: pulse 1.6s ease infinite; }
@keyframes pulse { 50% { opacity: .25; } }
.hero h1, .platform h2, .rush h2, .campus h2, .demo h2 { margin: 0; font-family: var(--display); font-weight: 500; letter-spacing: -.07em; line-height: .86; text-transform: uppercase; }
.hero h1 { margin-top: 2rem; font-size: clamp(4.4rem, 8.5vw, 9.6rem); }
.hero h1 span { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.75); }
.hero-intro { max-width: 600px; margin: 2rem 0 0; color: #bcbcb7; font-size: clamp(.98rem, 1.3vw, 1.16rem); }
.hero-actions { display: flex; gap: .8rem; margin-top: 2rem; }
.button { display: inline-flex; min-width: 190px; align-items: center; justify-content: space-between; gap: 2rem; padding: 1rem 1.15rem; border: 1px solid var(--paper); font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .11em; transition: background 200ms, color 200ms, transform 200ms; }
.button:hover { transform: translateY(-2px); }
.button-solid { background: var(--paper); color: var(--black); }
.button-solid:hover { background: white; }
.button-ghost:hover { background: var(--paper); color: var(--black); }
.button span { font-size: .9rem; }
.hero-product { position: relative; z-index: 1; width: min(680px, 48vw); justify-self: end; transform: perspective(1200px) rotateY(-5deg) rotateX(2deg); }
.terminal-shell { overflow: hidden; border: 1px solid #3a3a3a; border-radius: 10px; background: #0c0c0c; box-shadow: 0 40px 100px rgba(0,0,0,.65), 0 0 60px rgba(255,255,255,.035); }
.terminal-bar { display: flex; height: 52px; align-items: center; justify-content: space-between; padding: 0 1rem; border-bottom: 1px solid #292929; }
.terminal-brand { display: flex; align-items: center; gap: .65rem; font-size: .58rem; letter-spacing: .14em; }
.terminal-brand b { display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid #555; font-size: .48rem; }
.terminal-status { display: flex; align-items: center; gap: .45rem; color: #969691; font-size: .54rem; text-transform: uppercase; letter-spacing: .1em; }
.terminal-status i, .sync i, .rush-head i, .live-orders .card-title > i { width: 6px; height: 6px; border-radius: 50%; background: white; box-shadow: 0 0 8px white; }
.terminal-body { display: grid; grid-template-columns: 54px 1fr; }
.terminal-nav { display: flex; align-items: center; flex-direction: column; gap: 1.3rem; padding: 1.2rem .6rem; border-right: 1px solid #292929; color: #666; font-size: .8rem; }
.terminal-nav .active { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 5px; background: white; color: black; }
.terminal-avatar { display: grid; width: 26px; height: 26px; place-items: center; margin-top: auto; border: 1px solid #444; border-radius: 50%; font-size: .45rem; }
.terminal-main { padding: clamp(1rem, 2.2vw, 2rem); }
.terminal-head { display: flex; align-items: end; justify-content: space-between; }
.terminal-head div { display: flex; flex-direction: column; }
.terminal-head small, .metric small, .chart-label span { color: #71716d; font-size: .53rem; text-transform: uppercase; letter-spacing: .11em; }
.terminal-head strong { margin-top: .2rem; font-size: clamp(1.15rem, 2vw, 1.75rem); font-weight: 500; letter-spacing: -.04em; }
.terminal-time { padding: .4rem .55rem; border: 1px solid #323232; border-radius: 4px; color: #999; font-size: .52rem; }
.metric-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: .6rem; margin-top: 1.25rem; }
.metric { display: flex; min-width: 0; flex-direction: column; padding: .85rem; border: 1px solid #2a2a2a; border-radius: 6px; background: #121212; }
.metric strong { overflow: hidden; margin-top: .65rem; font-size: clamp(1rem, 2vw, 1.55rem); font-weight: 500; letter-spacing: -.05em; text-overflow: ellipsis; }
.metric-main strong { font-size: clamp(1.35rem, 2.7vw, 2.3rem); }
.metric strong span { color: #666; font-size: .5em; }
.metric em { margin-top: .3rem; color: #858580; font-size: .46rem; font-style: normal; }
.metric-main em { color: #ddd; }
.sales-chart { margin-top: .6rem; padding: 1rem 1rem .65rem; border: 1px solid #2a2a2a; border-radius: 6px; background: #101010; }
.chart-label { display: flex; align-items: center; justify-content: space-between; }
.chart-label b { font-size: .66rem; font-weight: 500; }
.chart-bars { display: flex; height: 110px; align-items: end; gap: clamp(4px,.7vw,9px); padding-top: 1rem; }
.chart-bars i { width: 100%; height: var(--h); border-radius: 2px 2px 0 0; background: #393939; }
.chart-bars i.current { background: #e8e8e4; box-shadow: 0 0 16px rgba(255,255,255,.25); }
.chart-axis { display: flex; justify-content: space-between; margin-top: .4rem; color: #555; font-size: .45rem; }
.order-pop { position: absolute; z-index: 3; border: 1px solid #4b4b4b; border-radius: 6px; background: rgba(18,18,18,.94); box-shadow: 0 14px 34px rgba(0,0,0,.5); backdrop-filter: blur(12px); }
.order-one { right: -5%; bottom: -7%; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .7rem; width: 220px; padding: .75rem; animation: float 4s ease-in-out infinite; }
.order-icon { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: white; color: black; font-size: .7rem; }
.order-one div { display: flex; min-width: 0; flex-direction: column; }
.order-one strong { font-size: .63rem; }
.order-one small { color: #777; font-size: .49rem; }
.order-one > b { color: #777; font-size: .48rem; }
.order-two { top: 17%; left: -11%; display: flex; width: 180px; flex-direction: column; padding: .8rem; animation: float 5s -2s ease-in-out infinite; }
.order-two span, .order-two small { color: #777; font-size: .48rem; text-transform: uppercase; letter-spacing: .09em; }
.order-two strong { margin: .35rem 0; font-size: .65rem; }
@keyframes float { 50% { transform: translateY(-8px); } }
.hero-scroll { position: absolute; bottom: 2rem; left: var(--gutter); display: flex; gap: .8rem; color: #666; font-size: .54rem; text-transform: uppercase; letter-spacing: .14em; }

.venue-ticker { overflow: hidden; border-block: 1px solid #333; background: white; color: black; }
.venue-ticker > div { display: flex; width: max-content; align-items: center; animation: ticker 28s linear infinite; }
.venue-ticker span { padding: 1.1rem 1.5rem; font-size: clamp(.95rem,1.6vw,1.4rem); font-weight: 700; letter-spacing: -.02em; white-space: nowrap; }
.venue-ticker i { font-size: .55rem; font-style: normal; }
@keyframes ticker { to { transform: translateX(-50%); } }

.section-pad { padding: clamp(6.5rem,11vw,11rem) var(--gutter); }
.platform { background: var(--paper); color: var(--ink); }
.section-label { color: #777; }
.section-label span { display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: .53rem; }
.platform-intro { display: grid; grid-template-columns: 1.45fr .55fr; align-items: end; gap: 5rem; margin-top: clamp(3rem,6vw,6rem); }
.platform h2 { font-size: clamp(4rem,8vw,9rem); }
.platform h2 span { color: #90908c; }
.platform-copy { max-width: 440px; }
.platform-copy p { margin: 0; font-size: clamp(1rem,1.3vw,1.2rem); }
.platform-copy p + p { margin-top: 1.5rem; color: #777; font-size: .87rem; }
.product-stage { position: relative; margin-top: clamp(5rem,9vw,9rem); padding: clamp(1rem,4vw,4rem); background: #d8d8d3; }
.product-window { overflow: hidden; border: 1px solid #a8a8a2; border-radius: 9px; background: white; box-shadow: 0 25px 70px rgba(0,0,0,.14); }
.window-top { display: grid; height: 46px; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 1rem; border-bottom: 1px solid #ddd; color: #888; font-size: .52rem; text-transform: uppercase; letter-spacing: .11em; }
.window-dots { display: flex; gap: 5px; }
.window-dots i { width: 7px; height: 7px; border: 1px solid #aaa; border-radius: 50%; }
.sync { display: flex; align-items: center; justify-self: end; gap: .45rem; }
.sync i { width: 5px; height: 5px; background: #111; box-shadow: none; }
.window-layout { display: grid; grid-template-columns: 180px 1fr; min-height: 570px; }
.window-sidebar { display: flex; flex-direction: column; padding: 1.5rem 1rem; border-right: 1px solid #ddd; background: #f7f7f4; }
.mini-logo { display: grid; width: 36px; height: 36px; place-items: center; background: black; color: white; font-size: .55rem; font-weight: 700; }
.window-sidebar nav { display: flex; flex-direction: column; gap: .3rem; margin-top: 2rem; }
.window-sidebar nav span { padding: .65rem .7rem; border-radius: 4px; color: #777; font-size: .65rem; }
.window-sidebar nav .selected { background: black; color: white; }
.shift-card { display: flex; flex-direction: column; margin-top: auto; padding: .8rem; border: 1px solid #d1d1cc; border-radius: 5px; }
.shift-card small { color: #888; font-size: .48rem; text-transform: uppercase; letter-spacing: .1em; }
.shift-card strong { margin: .3rem 0; font-size: .7rem; }
.shift-card span { color: #777; font-size: .53rem; }
.window-content { min-width: 0; padding: clamp(1.4rem,3vw,2.5rem); }
.overview-head { display: flex; align-items: center; justify-content: space-between; }
.overview-head > div { display: flex; flex-direction: column; }
.overview-head small { color: #888; font-size: .55rem; text-transform: uppercase; letter-spacing: .1em; }
.overview-head strong { margin-top: .25rem; font-size: clamp(1.2rem,2.4vw,2rem); font-weight: 500; letter-spacing: -.04em; }
.overview-head button { padding: .65rem .8rem; border: 1px solid #ccc; border-radius: 4px; background: transparent; color: #555; font-size: .55rem; }
.overview-cards { display: grid; grid-template-columns: repeat(4,1fr); gap: .7rem; margin-top: 2rem; }
.overview-cards article { display: flex; min-width: 0; flex-direction: column; padding: 1rem; border: 1px solid #ddd; border-radius: 5px; }
.overview-cards small { color: #888; font-size: .5rem; text-transform: uppercase; letter-spacing: .08em; }
.overview-cards strong { overflow: hidden; margin: .6rem 0 .35rem; font-size: clamp(.85rem,1.6vw,1.3rem); font-weight: 550; letter-spacing: -.035em; text-overflow: ellipsis; }
.overview-cards span { color: #888; font-size: .5rem; }
.overview-cards .up { color: #222; }
.overview-lower { display: grid; grid-template-columns: 1.5fr .75fr; gap: .7rem; margin-top: .7rem; }
.velocity-card, .live-orders { min-width: 0; padding: 1rem; border: 1px solid #ddd; border-radius: 5px; }
.card-title { display: flex; align-items: center; justify-content: space-between; }
.card-title > div { display: flex; flex-direction: column; }
.card-title small { color: #888; font-size: .48rem; text-transform: uppercase; letter-spacing: .1em; }
.card-title strong { margin-top: .15rem; font-size: .75rem; }
.card-title > span { color: #999; font-size: .45rem; }
.velocity-card svg { width: 100%; height: 230px; overflow: visible; }
.velocity-card .area { fill: url(#area); }
.velocity-card .line { fill: none; stroke: #111; stroke-width: 2; vector-effect: non-scaling-stroke; }
.velocity-card circle { fill: #111; }
.time-axis { display: flex; justify-content: space-between; color: #aaa; font-size: .44rem; }
.live-orders .card-title > i { width: 5px; height: 5px; background: #111; box-shadow: none; }
.live-orders ul { margin: 1.2rem 0 0; padding: 0; list-style: none; }
.live-orders li { display: grid; grid-template-columns: 1fr auto; padding: .75rem 0; border-top: 1px solid #e1e1dd; }
.live-orders li b { font-size: .58rem; }
.live-orders li span { grid-row: 2; color: #999; font-size: .48rem; }
.live-orders li strong { grid-row: 1 / 3; grid-column: 2; align-self: center; font-size: .63rem; }
.stage-note { position: absolute; padding: .55rem .75rem; background: black; color: white; font-size: .55rem; text-transform: uppercase; letter-spacing: .1em; }
.note-a { top: 1.3rem; right: 1.3rem; transform: rotate(2deg); }
.note-b { bottom: 1rem; left: 1rem; transform: rotate(-2deg); }
.feature-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: clamp(5rem,9vw,9rem); border-top: 1px solid #bbb; }
.feature-card { display: flex; min-height: 430px; flex-direction: column; padding: 2rem; border-right: 1px solid #bbb; }
.feature-card:last-child { border-right: 0; }
.feature-card > span { color: #777; font-size: .58rem; text-transform: uppercase; letter-spacing: .11em; }
.feature-card h3 { margin: auto 0 1rem; font-size: clamp(2.2rem,3.5vw,4rem); font-weight: 500; letter-spacing: -.065em; text-transform: uppercase; }
.feature-card p { max-width: 38ch; margin: 0; color: #666; font-size: .86rem; }
.feature-icon { position: relative; width: 100%; height: 120px; margin-bottom: 2rem; }
.speed-icon { display: flex; align-items: center; gap: .6rem; }
.speed-icon i { width: 19%; height: 3px; background: #111; }
.speed-icon i:nth-child(2) { width: 36%; }
.speed-icon i:nth-child(3) { width: 13%; }
.pulse-icon::before, .pulse-icon::after { position: absolute; top: 50%; left: 50%; border: 1px solid #111; border-radius: 50%; content: ""; transform: translate(-50%,-50%); }
.pulse-icon::before { width: 95px; height: 95px; }
.pulse-icon::after { width: 50px; height: 50px; }
.pulse-icon i { position: absolute; top: 50%; left: 50%; width: 8px; height: 8px; border-radius: 50%; background: #111; transform: translate(-50%,-50%); }
.close-icon { display: grid; place-items: center; }
.close-icon i { display: grid; width: 74px; height: 74px; place-items: center; border: 1px solid #111; border-radius: 50%; font-style: normal; }

.rush { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: clamp(4rem,9vw,10rem); min-height: 880px; background: var(--black); }
.rush h2 { margin-top: 4rem; font-size: clamp(3.7rem,6.8vw,7.8rem); }
.rush h2 span { color: #72726f; }
.rush-copy > p { margin: 2rem 0 0; color: #999; font-size: .9rem; }
.rush-machine { border: 1px solid #383838; border-radius: 8px; background: #0d0d0d; box-shadow: 0 30px 80px rgba(0,0,0,.4); }
.rush-head { display: flex; align-items: center; justify-content: space-between; padding: 1.15rem; border-bottom: 1px solid #333; }
.rush-head span { display: flex; align-items: center; gap: .55rem; color: #aaa; font-size: .58rem; text-transform: uppercase; letter-spacing: .1em; }
.rush-head strong { font-size: .65rem; font-weight: 500; }
.ticket-stream { display: grid; grid-template-columns: repeat(2,1fr); gap: .6rem; padding: .8rem; }
.ticket-stream article { display: flex; min-height: 190px; flex-direction: column; padding: 1rem; border: 1px solid #2e2e2e; border-radius: 5px; background: #111; }
.ticket-stream article.focus { background: white; color: black; transform: rotate(1.2deg) scale(1.02); }
.ticket-stream small { color: #777; font-size: .5rem; letter-spacing: .08em; }
.ticket-stream strong { margin: 1.2rem 0 auto; font-size: 1rem; font-weight: 500; line-height: 1.5; }
.ticket-stream article > span { display: flex; align-items: center; justify-content: space-between; }
.ticket-stream b { font-size: .72rem; }
.ticket-stream em { padding: .3rem .4rem; border: 1px solid #444; border-radius: 3px; color: #888; font-size: .46rem; font-style: normal; }
.ticket-stream .focus em { border-color: #111; color: #111; }
.rush-footer { display: grid; grid-template-columns: 1fr auto; align-items: end; padding: 1.2rem; border-top: 1px solid #333; }
.rush-footer span { color: #777; font-size: .52rem; text-transform: uppercase; letter-spacing: .1em; }
.rush-footer strong { grid-row: 1 / 3; grid-column: 2; font-size: 2rem; font-weight: 500; letter-spacing: -.05em; }
.rush-footer i { color: #bbb; font-size: .52rem; font-style: normal; }

.campus { position: relative; overflow: hidden; background: #d8d8d3; color: var(--ink); }
.campus::before { position: absolute; top: -12vw; right: -9vw; width: 40vw; height: 40vw; border: 1px solid rgba(0,0,0,.18); border-radius: 50%; content: ""; }
.campus-title-wrap { display: grid; grid-template-columns: 1.35fr .65fr; align-items: end; gap: 5rem; margin-top: 4rem; }
.campus h2 { font-size: clamp(5rem,11vw,12rem); }
.campus h2 span { color: transparent; -webkit-text-stroke: 1px #111; }
.campus-title-wrap p { max-width: 480px; margin: 0 0 1rem; color: #4f4f4c; font-size: clamp(1rem,1.35vw,1.2rem); }
.campus-sticker { position: absolute; z-index: 2; display: grid; width: 82px; height: 82px; place-items: center; border: 1px solid #111; border-radius: 50%; background: #111; color: white; font-size: .63rem; font-weight: 700; line-height: 1.1; text-align: center; transform: rotate(10deg); }
.sticker-one { top: 16%; right: 4%; }
.sticker-two { top: 44%; left: 3%; background: transparent; color: #111; transform: rotate(-12deg); }
.campus-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: clamp(5rem,10vw,9rem); }
.campus-card { display: flex; min-height: 400px; flex-direction: column; padding: 1.5rem; background: #111; color: white; transform: rotate(-1.2deg); transition: transform 250ms; }
.campus-card:nth-child(2) { transform: rotate(1.1deg); }
.campus-card:nth-child(3) { transform: rotate(-.5deg); }
.campus-card:hover { transform: translateY(-8px) rotate(0); }
.campus-card > span { color: #777; font-size: .56rem; }
.card-glyph { display: grid; flex: 1; place-items: center; font-family: var(--display); font-size: clamp(4rem,8vw,8rem); font-weight: 600; letter-spacing: -.09em; }
.campus-card h3 { margin: 0; font-size: clamp(1.7rem,2.8vw,3rem); font-weight: 500; letter-spacing: -.05em; text-transform: uppercase; }
.campus-card p { margin: .5rem 0 0; color: #999; font-size: .75rem; }
.campus-card.light { background: white; color: black; }
.campus-card.light p { color: #777; }
.campus-card.outline { border: 1px solid #111; background: transparent; color: #111; }
.campus-card.outline p { color: #555; }

.demo { position: relative; min-height: 100svh; overflow: hidden; background: white; color: black; isolation: isolate; }
.demo-grid { background-image: linear-gradient(rgba(0,0,0,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,.06) 1px, transparent 1px); }
.demo .eyebrow { color: #777; }
.demo .live-dot { background: black; box-shadow: 0 0 10px rgba(0,0,0,.4); }
.demo h2 { margin-top: 4rem; font-size: clamp(4.4rem,10vw,11rem); }
.demo h2 span { color: transparent; -webkit-text-stroke: 1px black; }
.demo-lower { display: flex; max-width: 850px; align-items: end; justify-content: space-between; gap: 3rem; margin-top: 4rem; margin-left: auto; }
.demo-lower p { max-width: 400px; margin: 0; color: #555; font-size: 1rem; }
.button.inverse { background: black; color: white; }
.site-footer { display: flex; align-items: end; justify-content: space-between; gap: 3rem; padding: 2.5rem var(--gutter); border-top: 1px solid #292929; }
.footer-meta { display: flex; gap: 2.5rem; color: #777; font-size: .58rem; text-transform: uppercase; letter-spacing: .1em; }
.footer-meta a:hover { color: white; }
.reveal { opacity: 0; transform: translateY(26px); transition: opacity 750ms cubic-bezier(.22,1,.36,1), transform 750ms cubic-bezier(.22,1,.36,1); }
.reveal.visible { opacity: 1; transform: none; }

/* Real product screens + Sapphire Veil palette */
.button-solid { border-color: var(--sky); background: var(--sky); color: var(--navy); }
.button-solid:hover { border-color: var(--mist); background: var(--mist); color: var(--navy); }
.nav-cta:hover { border-color: var(--sky); background: var(--sky); color: var(--navy); }
.venue-ticker { border-color: var(--sky); background: var(--mist); color: var(--navy); }

.hero .hero-product { position: relative; width: min(760px, 52vw); padding: clamp(1.5rem, 3vw, 3.5rem) 0; transform: none; }
.hero-color-card { position: absolute; border-radius: 26px; }
.color-card-one { inset: 3% -5% 15% 12%; background: var(--navy); transform: rotate(5deg); }
.color-card-two { inset: 15% 9% 3% -8%; background: var(--blue); opacity: .78; transform: rotate(-4deg); }

.ipad { position: relative; z-index: 2; margin: 0; padding: clamp(8px, 1.1vw, 15px); border: 1px solid #e0e2e5; border-radius: clamp(16px, 2.1vw, 30px); background: linear-gradient(145deg, #e2e4e7 0%, #9ba0a8 36%, #666b73 52%, #c9ccd1 78%, #7d828a 100%); box-shadow: 0 35px 75px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.65), inset 0 0 0 3px rgba(0,0,0,.15); }
.ipad::after { position: absolute; inset: clamp(7px, 1vw, 13px); z-index: 1; border: 1px solid rgba(0,0,0,.9); border-radius: clamp(9px, 1.2vw, 18px); content: ""; pointer-events: none; }
.ipad img { position: relative; z-index: 1; display: block; width: 100%; height: auto; aspect-ratio: 2360 / 1640; border-radius: clamp(8px, 1.1vw, 16px); background: #050505; object-fit: contain; image-rendering: auto; filter: none; opacity: 1; }
.ipad-camera { position: absolute; top: 50%; right: clamp(2px, .36vw, 5px); z-index: 3; width: clamp(3px, .45vw, 6px); height: clamp(3px, .45vw, 6px); border: 1px solid #444b55; border-radius: 50%; background: #111923; box-shadow: 0 0 0 1px rgba(255,255,255,.18); transform: translateY(-50%); }
.ipad-hero { transform: none; }

.platform { background: var(--mist); }
.platform h2 span { color: var(--sky); }
.product-showcases { display: grid; gap: clamp(1.25rem, 2vw, 2rem); margin-top: clamp(5rem, 9vw, 9rem); }
.showcase { position: relative; display: grid; grid-template-columns: .72fr 1.28fr; align-items: center; gap: clamp(2rem, 6vw, 7rem); min-height: 650px; overflow: hidden; padding: clamp(2rem, 5vw, 6rem); border-radius: 28px; }
.showcase::before { position: absolute; width: 45vw; height: 45vw; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; content: ""; }
.showcase-sell { background: var(--navy); color: white; }
.showcase-sell::before { top: -28vw; left: -14vw; }
.showcase-analytics { grid-template-columns: 1.3fr .7fr; background: var(--blue); color: white; }
.showcase-analytics::before { right: -14vw; bottom: -30vw; }
.showcase-history { background: var(--sky); color: var(--navy); }
.showcase-history::before { top: -24vw; right: -8vw; border-color: rgba(13,36,64,.18); }
.showcase .ipad { width: min(100%, 940px); }
.showcase-copy { position: relative; z-index: 3; }
.showcase-index { display: inline-flex; padding: .45rem .6rem; border: 1px solid currentColor; border-radius: 999px; font-size: .55rem; text-transform: uppercase; letter-spacing: .12em; }
.showcase-copy h3 { margin: 2rem 0 1.5rem; font-family: var(--display); font-size: clamp(3rem, 5.5vw, 6.5rem); font-weight: 500; letter-spacing: -.07em; line-height: .88; text-transform: uppercase; }
.showcase-copy > p { max-width: 40ch; margin: 0; color: rgba(255,255,255,.72); font-size: clamp(.9rem, 1.15vw, 1.06rem); }
.showcase-history .showcase-copy > p { color: rgba(13,36,64,.72); }
.showcase-analytics .ipad { order: -1; }

.feature-grid { border-top-color: rgba(13,36,64,.3); }
.feature-card { border-right-color: rgba(13,36,64,.3); }
.speed-icon i, .pulse-icon i { background: var(--blue); }
.pulse-icon::before, .pulse-icon::after, .close-icon i { border-color: var(--blue); }
.campus { background: var(--sky); color: var(--navy); }
.campus h2 span { -webkit-text-stroke-color: var(--navy); }
.campus-card { background: var(--navy); }
.campus-card.light { background: var(--mist); color: var(--navy); }
.campus-card.outline { border-color: var(--navy); color: var(--navy); }
.campus-sticker { border-color: var(--navy); background: var(--navy); }
.sticker-two { background: var(--mist); color: var(--navy); }
.demo { background: var(--mist); color: var(--navy); }
.demo h2 span { -webkit-text-stroke-color: var(--blue); }
.button.inverse { border-color: var(--navy); background: var(--navy); color: white; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 10rem; }
  .hero-copy { max-width: 850px; }
  .hero-product { width: min(780px,92%); margin: 4rem auto 1rem; justify-self: center; }
  .hero-scroll { display: none; }
  .platform-intro, .campus-title-wrap { grid-template-columns: 1fr; gap: 3rem; }
  .platform-copy, .campus-title-wrap p { margin-left: 25%; }
  .overview-cards { grid-template-columns: repeat(2,1fr); }
  .window-layout { grid-template-columns: 150px 1fr; }
  .rush { grid-template-columns: 1fr; }
  .rush-copy { max-width: 800px; }
  .rush-machine { width: min(800px,100%); margin-left: auto; }
}
@media (max-width: 760px) {
  .site-header { height: 70px; }
  .menu-toggle { z-index: 4; display: flex; align-items: center; gap: .7rem; cursor: pointer; }
  .menu-toggle i { position: relative; width: 23px; height: 11px; border-top: 1px solid; border-bottom: 1px solid; }
  .menu-toggle[aria-expanded="true"] i { border: 0; }
  .menu-toggle[aria-expanded="true"] i::before, .menu-toggle[aria-expanded="true"] i::after { position: absolute; top: 5px; left: 0; width: 23px; height: 1px; background: white; content: ""; transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"] i::after { transform: rotate(-45deg); }
  .site-nav { position: fixed; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: var(--gutter); background: rgba(5,5,5,.98); visibility: hidden; opacity: 0; transform: translateY(-12px); transition: opacity 220ms, transform 220ms, visibility 220ms; }
  .site-nav.open { visibility: visible; opacity: 1; transform: none; }
  .site-nav a { font-size: clamp(2.3rem,10vw,4.5rem); font-weight: 500; letter-spacing: -.05em; }
  .nav-cta { padding: 0; border: 0; }
  .hero { padding-top: 9rem; }
  .hero h1 { font-size: clamp(4rem,16vw,6rem); }
  .hero-product { width: 100%; transform: none; }
  .order-two { display: none; }
  .terminal-body { grid-template-columns: 42px 1fr; }
  .terminal-nav { gap: 1rem; padding-inline: .35rem; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .metric-main { grid-column: 1 / 3; }
  .order-one { right: -2%; bottom: -9%; }
  .window-layout { grid-template-columns: 1fr; }
  .window-sidebar { display: none; }
  .overview-lower { grid-template-columns: 1fr; }
  .live-orders { display: none; }
  .product-stage { margin-inline: calc(var(--gutter) * -1); }
  .stage-note { display: none; }
  .feature-grid, .campus-cards { grid-template-columns: 1fr; }
  .feature-card { min-height: 340px; border-right: 0; border-bottom: 1px solid #bbb; }
  .campus-card { min-height: 360px; }
  .campus-sticker { width: 65px; height: 65px; }
  .sticker-one { top: 10%; }
  .sticker-two { display: none; }
  .demo-lower { align-items: flex-start; flex-direction: column; margin-left: 0; }
}
@media (max-width: 520px) {
  .brand-lockup small { display: none; }
  .brand-mark { width: 34px; height: 34px; }
  .hero { padding-bottom: 5rem; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .button { width: 100%; }
  .hero-product { margin-top: 3rem; }
  .terminal-bar { height: 44px; }
  .terminal-main { padding: .7rem; }
  .terminal-time { display: none; }
  .terminal-nav span:not(.active):not(.terminal-avatar) { display: none; }
  .metric { padding: .7rem; }
  .metric-main strong { font-size: 1.6rem; }
  .chart-bars { height: 76px; }
  .order-one { display: none; }
  .platform h2, .rush h2 { font-size: clamp(3.5rem,15vw,5rem); }
  .platform-copy, .campus-title-wrap p { margin-left: 0; }
  .product-stage { padding: .7rem; }
  .window-top > span:nth-child(2) { display: none; }
  .window-top { grid-template-columns: 1fr 1fr; }
  .overview-head button { display: none; }
  .overview-cards { gap: .4rem; }
  .overview-cards article { padding: .7rem; }
  .overview-cards strong { font-size: .85rem; }
  .velocity-card svg { height: 160px; }
  .ticket-stream { grid-template-columns: 1fr; }
  .ticket-stream article:nth-child(n+3) { display: none; }
  .campus h2 { font-size: clamp(4.2rem,20vw,7rem); }
  .demo h2 { font-size: clamp(3.7rem,17vw,6rem); }
  .site-footer { align-items: flex-start; flex-direction: column; }
  .footer-meta { flex-direction: column; gap: .5rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

@media (max-width: 1050px) {
  .hero .hero-product { width: min(900px, 100%); margin-top: 3rem; justify-self: center; }
  .showcase, .showcase-analytics { grid-template-columns: 1fr; min-height: auto; }
  .showcase .ipad { width: 100%; margin-top: 1rem; }
  .showcase-analytics .ipad { order: 1; }
  .showcase-copy { max-width: 700px; }
}

@media (max-width: 760px) {
  .hero .hero-product { width: 100%; padding-block: 1.5rem; transform: none; }
  .showcase { gap: 2.5rem; padding: 2rem 1.25rem 1.5rem; border-radius: 18px; }
  .showcase-copy h3 { font-size: clamp(3rem, 14vw, 5rem); }
  .ipad { padding: 7px; border-radius: 15px; }
  .ipad::after { inset: 6px; border-radius: 10px; }
  .ipad img { border-radius: 9px; }
  .ipad-camera { right: 2px; }
}

@media (max-width: 520px) {
  .color-card-one { inset: 8% -8% 12% 10%; }
  .color-card-two { inset: 16% 7% 2% -7%; }
  .showcase { margin-inline: calc(var(--gutter) * -.35); }
  .showcase-copy > p { font-size: .86rem; }
}