@font-face {
  font-family:"Alibaba PuHuiTi 3";
  src:local("Alibaba PuHuiTi 3.0 55 Regular"),local("Alibaba PuHuiTi 3"),url("/assets/fonts/AlibabaPuHuiTi-3-Regular.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:"YouShe BiaoTiHei";
  src:local("YouSheBiaoTiHei"),local("优设标题黑"),url("/assets/fonts/YouSheBiaoTiHei-Regular.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

:root {
  --ink: #101427;
  --muted: #697086;
  --line: #e7e9f1;
  --paper: #f7f8fc;
  --white: #fff;
  --blue: #5e6df6;
  --blue-dark: #3544d6;
  --lime: #b8f34a;
  --navy: #12162c;
  --shadow: 0 24px 70px rgba(24, 31, 74, .12);
  --radius: 24px;
  --font-body:"Alibaba PuHuiTi 3","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --font-display:"YouShe BiaoTiHei","Alibaba PuHuiTi 3","PingFang SC",sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family:var(--font-body); font-size: 14px; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
button, input, select, textarea { font:inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { border: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }
.hidden { display: none !important; }
.section-pad { padding-left: max(5vw, calc((100vw - 1240px)/2)); padding-right: max(5vw, calc((100vw - 1240px)/2)); }

.site-header { height: 82px; display: flex; align-items: center; justify-content: space-between; padding: 0 max(5vw, calc((100vw - 1240px)/2)); position: fixed; inset: 0 0 auto; z-index: 40; transition: .3s ease; }
.site-header.scrolled { height: 70px; background: rgba(255,255,255,.9); border-bottom: 1px solid rgba(231,233,241,.8); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; gap: 10px; }
.brand > span:last-child { display: flex; flex-direction: column; line-height: 1; }
.brand b { font-family:var(--font-display); font-size: 20px; font-weight: 400; letter-spacing: .2px; }
.brand small { color: #858ba0; font-size: 8px; letter-spacing: 1.2px; margin-top: 6px; }
.brand-mark { width: 39px; height: 39px; display:block; flex:none; object-fit:contain; }
.brand.invert .brand-mark { filter:brightness(0) invert(1); }
.brand.invert { color: white; }
.brand.invert small { color: #9ca2b8; }
.main-nav { display: flex; gap: 36px; margin-left: 50px; }
.main-nav a { font-size: 13px; font-weight: 600; color: #454b5e; position: relative; }
.main-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -9px; height: 2px; background: var(--blue); transition: .25s; }
.main-nav a:hover::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.text-button { background: transparent; color: var(--ink); padding: 11px 14px; }
.primary-button { background: var(--blue); color: #fff; border-radius: 12px; padding: 13px 21px; font-weight: 700; box-shadow: 0 10px 26px rgba(94,109,246,.24); transition: .25s ease; }
.primary-button:hover { background: var(--blue-dark); transform: translateY(-2px); }
.primary-button.compact { padding: 11px 18px; }
#loggedWorkbenchButton { max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.primary-button.large { padding: 17px 24px; border-radius: 14px; }
.primary-button span { margin-left: 20px; }
.menu-button { display: none; background: transparent; font-size: 24px; }

.hero { min-height: 720px; padding-top: 145px; padding-bottom: 90px; background: radial-gradient(circle at 80% 15%, #eef0ff 0, transparent 30%), linear-gradient(135deg,#fbfbfd 0%,#f4f5fb 100%); display: grid; grid-template-columns: .93fr 1.07fr; gap: 50px; align-items: center; overflow: hidden; position: relative; }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(1px); opacity: .65; }
.hero-glow.one { width: 420px; height: 420px; right: -210px; top: -180px; border: 1px solid #d9dcf5; box-shadow: inset 0 0 90px #e9ebff; }
.hero-glow.two { width: 260px; height: 260px; left: -150px; bottom: -80px; border: 1px solid #e1e4f5; }
.hero-copy, .hero-visual { position: relative; z-index: 1; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #555c70; font-size: 13px; font-weight: 600; letter-spacing: .5px; }
.eyebrow > span { width: 32px; height: 2px; background: var(--blue); }
.hero h1 { font-size: clamp(46px,4.5vw,64px); line-height: 1.12; letter-spacing: -3px; margin: 24px 0 21px; }
.hero h1 em, .section-heading h2 em, .scenarios h2 em { color: var(--blue); font-style: normal; }
.hero-copy > p { font-size: 15px; line-height: 1.85; color: var(--muted); max-width: 520px; }
.hero-actions { display: flex; align-items: center; gap: 26px; margin-top: 31px; }
.secondary-link { font-size: 14px; font-weight: 700; }
.secondary-link span { color: var(--blue); margin-left: 7px; }
.hero-proof { display: flex; align-items: center; gap: 14px; margin-top: 34px; }
.avatar-stack { display: flex; }
.avatar-stack span { width: 34px; height: 34px; margin-left: -7px; border-radius: 50%; border: 3px solid #f5f6fb; background: var(--navy); color: white; display: grid; place-items: center; font-size: 11px; }
.avatar-stack span:first-child { margin-left: 0; background: var(--blue); }
.avatar-stack span:last-child { background: var(--lime); color: var(--navy); }
.hero-proof p { margin: 0; display: flex; flex-direction: column; font-size: 12px; }
.hero-proof small { margin-top: 4px; color: var(--muted); }

.hero-visual { min-height: 500px; background: #fff; border: 1px solid rgba(255,255,255,.8); border-radius: 25px; box-shadow: 0 36px 90px rgba(36,44,103,.17); transform: perspective(1200px) rotateY(-3deg) rotateX(2deg); }
.visual-topbar { height: 50px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 18px; color: #81869a; font-size: 11px; }
.visual-topbar div { display: flex; gap: 6px; }.visual-topbar i { width: 7px; height: 7px; border-radius: 50%; background: #d8dbe5; }
.visual-body { display: flex; height: 449px; }
.visual-sidebar { width: 58px; background: #151a30; display: flex; flex-direction: column; align-items: center; gap: 25px; padding: 18px 0; border-radius: 0 0 0 24px; }
.mini-brand-mark { width:25px; height:25px; margin-bottom:12px; object-fit:contain; filter:brightness(0) invert(1); }.visual-sidebar span { width: 18px; height: 18px; border: 2px solid #555b72; border-radius: 5px; }.visual-sidebar .active { border-color: var(--lime); box-shadow: 0 0 0 5px rgba(184,243,74,.08); }
.visual-content { flex: 1; padding: 30px 28px; background: #fafbfe; border-radius: 0 0 24px 0; min-width: 0; }
.visual-greeting { display: flex; justify-content: space-between; align-items: center; }.visual-greeting div { display: flex; flex-direction: column; gap: 7px; }.visual-greeting small { color: #9297aa; font-size: 10px; }.visual-greeting strong { font-size: 18px; }.visual-greeting > span { background: #eff1ff; color: var(--blue); padding: 8px 10px; border-radius: 9px; font-size: 9px; }
.metric-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 24px 0 20px; }
.metric-grid article { background: white; border: 1px solid #eceef5; padding: 15px; border-radius: 13px; display: flex; flex-direction: column; gap: 9px; }
.metric-grid small { color: #8b90a2; font-size: 9px; }.metric-grid strong { font-size: 17px; }.metric-grid em { color: #18a674; font-style: normal; font-size: 8px; }
.table-status { background: white; border: 1px solid #eceef5; border-radius: 14px; padding: 18px; }
.status-heading { display: flex; justify-content: space-between; font-size: 11px; }.status-heading small { color: #9297a9; font-size: 8px; }.status-heading i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin: 0 3px 0 8px; }.status-heading .free { background: #d9dde8; }.status-heading .busy { background: var(--blue); }
.tables { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-top: 16px; }
.tables > span { min-height: 61px; background: #f2f3f7; border: 1px solid #e7e9f0; border-radius: 9px; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; }
.tables span small { font-size: 7px; color: #8c91a3; margin-top: 5px; font-weight: 500; }.tables > .busy { background: #616ff7; color: white; border-color: #616ff7; }.tables > .busy small { color: #dce0ff; }.tables > .reserved { background: #fff7e9; border-color: #ffe3ae; color: #d88a1a; }
.floating-card { position: absolute; background: white; border: 1px solid #eceef7; border-radius: 14px; box-shadow: 0 18px 38px rgba(22,28,66,.15); display: flex; align-items: center; }
.floating-card.revenue { left: -42px; bottom: 60px; padding: 13px 15px; gap: 10px; }.float-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: #eff1ff; color: var(--blue); font-weight: 900; }.floating-card div { display: flex; flex-direction: column; gap: 4px; }.floating-card small { font-size: 8px; color: #8c91a2; }.floating-card strong { font-size: 12px; }.floating-card em { color: #18a674; font-size: 8px; font-style: normal; margin-left: 11px; }
.floating-card.automation { right: -28px; top: 80px; padding: 13px 17px; gap: 11px; }.pulse { width: 11px; height: 11px; border-radius: 50%; background: #43cf8e; box-shadow: 0 0 0 6px rgba(67,207,142,.14); }

.trust-strip { background: #fff; padding: 28px max(5vw, calc((100vw - 1200px)/2)) 34px; }.trust-strip > p { color: #9297a8; font-size: 11px; text-align: center; margin: 0 0 18px; letter-spacing: .4px; }.trust-strip > div { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }.trust-strip span { min-height: 96px; border-radius: 14px; padding: 18px 20px; background: linear-gradient(145deg,#151a30,#202743); color: white; display: grid; grid-template-columns: auto 1fr; column-gap: 13px; align-content: center; box-shadow: 0 12px 28px rgba(20,26,54,.12); }.trust-strip span i { grid-row: 1/3; width: 34px; height: 34px; border-radius: 10px; background: rgba(184,243,74,.12); color: var(--lime); display: grid; place-items: center; font-size: 9px; font-style: normal; }.trust-strip span b { font-size: 15px; line-height: 1.2; }.trust-strip span small { color: #aab0c3; font-size: 10px; margin-top: 7px; line-height: 1.5; }

.solutions { padding-top: 105px; padding-bottom: 115px; }
.section-heading { display: grid; grid-template-columns: .8fr 1.3fr .9fr; align-items: end; gap: 40px; margin-bottom: 50px; }.section-heading > div p, .kicker { font-size: 10px; letter-spacing: 1.8px; color: #9398a8; margin: 12px 0 0; }.section-number { color: var(--blue); font-size: 12px; font-weight: 800; }.section-heading h2, .capabilities-copy h2, .number-intro h2, .about-copy h2 { font-size: clamp(32px,3.2vw,44px); line-height: 1.23; letter-spacing: -1.5px; margin: 0; }.section-heading > p { color: var(--muted); line-height: 1.8; font-size: 13px; margin: 0; }
.solution-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.solution-card { min-height: 470px; border-radius: var(--radius); padding: 30px; overflow: hidden; position: relative; }.solution-card.dark { background: var(--navy); color: white; }.solution-card.blue { background: #6472f7; color: white; }.solution-card.light { background: #f2f3f8; }
.card-icon { width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.2); border-radius: 12px; display: grid; place-items: center; font-size: 20px; }.light .card-icon { border-color: #dfe1ea; }.card-tag { display: block; margin-top: 42px; font-size: 10px; opacity: .65; letter-spacing: 1px; }.solution-card h3 { font-size: 22px; margin: 10px 0 13px; }.solution-card p { font-size: 12px; line-height: 1.8; opacity: .72; }.solution-card ul { list-style: none; padding: 0; margin: 20px 0; display: flex; gap: 10px; flex-wrap: wrap; }.solution-card li { font-size: 10px; padding: 7px 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 20px; }.light li { border-color: #d9dce7; }
.mini-phone { position: absolute; width: 145px; height: 230px; right: 38px; bottom: -82px; border: 7px solid #303650; background: white; border-radius: 27px; color: var(--ink); transform: rotate(6deg); box-shadow: 0 20px 50px rgba(0,0,0,.35); }.mini-phone > span { display: block; width: 48px; height: 9px; background: #303650; margin: -1px auto 18px; border-radius: 0 0 8px 8px; }.mini-phone div { padding: 10px; }.mini-phone b { font-size: 11px; }.mini-phone i { height: 33px; background: #eff1f5; display: block; margin-top: 8px; border-radius: 8px; }.mini-phone i:nth-of-type(2) { background: #e9f8cd; }
.order-ticket { position: absolute; left: 33px; right: 33px; bottom: 35px; background: rgba(255,255,255,.94); color: var(--ink); padding: 22px; border-radius: 16px; display: grid; grid-template-columns: 1fr auto; gap: 8px; box-shadow: 0 18px 35px rgba(32,42,125,.23); }.order-ticket small { color: var(--muted); grid-column: 1/-1; }.order-ticket b { font-size: 23px; }.order-ticket span { background: #e9f8d0; color: #5d8b13; padding: 7px 10px; border-radius: 20px; font-size: 10px; }
.chart-card { position: absolute; bottom: 28px; left: 32px; right: 32px; background: white; padding: 20px; border-radius: 15px; box-shadow: 0 14px 32px rgba(27,33,66,.1); }.chart-card div { display: flex; align-items: end; gap: 9px; height: 90px; border-bottom: 1px solid #e8eaf1; }.chart-card i { flex: 1; background: #7b87f8; border-radius: 5px 5px 0 0; }.chart-card i:nth-child(even) { background: var(--lime); }.chart-card small { display: block; color: var(--muted); margin-top: 11px; }

.capabilities { padding-top: 100px; padding-bottom: 105px; background: #f6f7fb; display: grid; grid-template-columns: .7fr 1.3fr; gap: 75px; align-items: center; }.capabilities-copy,.capability-stage { min-width:0; }.capabilities-copy h2 { margin: 22px 0 19px; }.capabilities-copy > p:not(.kicker) { color: var(--muted); line-height: 1.8; }.capability-tabs { margin-top: 34px; display: flex; flex-direction: column; gap: 5px; }.capability-tabs button { background: transparent; padding: 13px 17px; text-align: left; color: #858b9c; border-left: 2px solid #dfe2ea; }.capability-tabs button.active { color: var(--ink); border-left-color: var(--blue); background: linear-gradient(90deg,#eceeff,transparent); font-weight: 700; }
.capability-stage { min-height: 555px; background: #151a30; border-radius: 28px; padding: 30px; color: white; box-shadow: 0 30px 65px rgba(24,29,60,.22); position: relative; overflow: hidden; }.capability-stage::before { content:""; position:absolute; width:260px; height:260px; border:1px solid #343b5b; border-radius:50%; right:-80px; top:-90px; }.stage-top { display:flex; justify-content:space-between; align-items:flex-start; position:relative; z-index:1; }.stage-top small { color:#8e95ad; letter-spacing:1px; }.stage-top h3 { font-size:28px; margin:8px 0; }.stage-top > span { width:46px; height:46px; border-radius:13px; background:var(--lime); color:var(--navy); display:grid; place-items:center; font-size:20px; }.stage-screen { position:relative; margin-top:32px; background:#f8f9fc; border-radius:18px; min-height:390px; padding:20px; color:var(--ink); }.stage-screen-head { display:flex; justify-content:space-between; align-items:center; }.stage-screen-head b { font-size:13px; }.stage-screen-head span { font-size:9px; background:#e9ebff; color:var(--blue); padding:7px 9px; border-radius:8px; }.stage-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:18px 0; }.stage-metrics div { background:white; border:1px solid #eceef4; border-radius:11px; padding:13px; display:flex; flex-direction:column; gap:6px; }.stage-metrics small { color:#9297a8; font-size:8px; }.stage-metrics strong { font-size:15px; }.stage-main { display:grid; grid-template-columns:1.3fr .7fr; gap:11px; }.stage-chart,.stage-list { background:white; border:1px solid #eceef4; border-radius:12px; padding:14px; min-height:205px; }.stage-chart strong,.stage-list strong { font-size:10px; }.bars { height:130px; display:flex; align-items:end; gap:8px; border-bottom:1px solid #e8eaf0; margin-top:15px; }.bars i { flex:1; background:#6876f7; border-radius:4px 4px 0 0; }.bars i:nth-child(3n) { background:var(--lime); }.stage-list p { display:flex; align-items:center; justify-content:space-between; font-size:9px; padding:10px 0; border-bottom:1px solid #eff0f4; margin:0; }.stage-list i { width:6px; height:6px; border-radius:50%; background:#6977f7; margin-right:6px; }.stage-list em { color:#8f95a7; font-style:normal; }

.numbers { padding-top: 90px; padding-bottom: 95px; background: var(--navy); color: white; }.number-intro { display: flex; align-items: baseline; gap: 25px; }.number-intro .kicker { margin-left: auto; }.number-grid { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 58px; border-top: 1px solid #34394f; }.number-grid article { padding: 36px 25px 8px 0; border-right: 1px solid #34394f; }.number-grid article:not(:first-child) { padding-left: 28px; }.number-grid strong { font-size: clamp(46px,5vw,68px); letter-spacing: -3px; }.number-grid em { color: var(--lime); font-size: 18px; font-style: normal; margin-left: 6px; }.number-grid p { color: #989eb1; font-size: 12px; margin-top: 17px; }

.scenarios { padding-top: 105px; padding-bottom: 105px; }.compact-heading { grid-template-columns: .8fr 2fr; }.scenario-list { border-top: 1px solid var(--line); }.scenario { min-height: 132px; display: grid; grid-template-columns: 100px 1fr auto; align-items: center; gap: 28px; border-bottom: 1px solid var(--line); transition: .25s; }.scenario:hover { padding: 0 18px; background: #f7f8fb; }.scenario > span { color: #a0a5b5; font-size: 11px; }.scenario small { color: var(--blue); font-size: 10px; }.scenario h3 { font-size: 21px; margin: 7px 0; }.scenario p { margin: 0; color: var(--muted); font-size: 12px; }.scenario > b { background: #f1f2f7; border-radius: 30px; padding: 10px 15px; font-size: 10px; }

.about { padding-top: 0; padding-bottom: 130px; }.about-panel { background: #f2f3f8; border-radius: 30px; min-height: 540px; display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; }.about-copy { padding: 70px; }.about-copy h2 { margin: 24px 0; }.about-copy > p:not(.kicker) { color: var(--muted); line-height: 2; font-size: 14px; }.about-badges { display: flex; gap: 10px; margin-top: 30px; }.about-badges span { background: white; padding: 9px 13px; border-radius: 20px; font-size: 11px; }.about-visual { position: relative; background: var(--blue); overflow: hidden; }.orbit { position:absolute; border:1px solid rgba(255,255,255,.18); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); }.o1 { width:280px; height:280px; }.o2 { width:470px; height:470px; }.core-logo { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:20px; color:white; font-size:11px; letter-spacing:2px; }.brand-mark.big { width:86px; height:86px; filter:brightness(0) invert(1); }.node { position:absolute; width:58px; height:58px; border-radius:50%; background:white; color:var(--blue); display:grid; place-items:center; font-size:11px; font-weight:800; box-shadow:0 14px 35px rgba(24,30,97,.23); }.n1 { left:15%; top:22%; }.n2 { right:16%; top:17%; }.n3 { left:18%; bottom:18%; }.n4 { right:14%; bottom:23%; }

.cta { padding-bottom: 100px; }.cta-panel { min-height: 350px; background: var(--navy); border-radius: 30px; padding: 60px 70px; color: white; display: flex; align-items: center; justify-content: space-between; position: relative; overflow: hidden; }.cta-panel > div:first-child { z-index:2; }.eyebrow.light { color: #aeb4c7; }.cta h2 { font-size: clamp(36px,4vw,56px); line-height: 1.17; margin: 20px 0; }.cta p { color: #9ba1b5; }.cta-button { width: 210px; height: 210px; border-radius: 50%; background: var(--lime); color: var(--navy); position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:25px; font-weight:800; transition:.3s; }.cta-button:hover { transform:scale(1.05) rotate(-3deg); }.cta-button b { font-size:30px; }.cta-ball { position:absolute; border-radius:50%; border:1px solid #31364c; }.b1 { width:300px; height:300px; right:-60px; bottom:-130px; }.b2 { width:180px; height:180px; right:160px; top:-100px; }.b3 { width:28px; height:28px; background:var(--blue); border:0; left:52%; bottom:40px; }

.site-footer { background: #0c1022; color: white; padding: 75px max(5vw, calc((100vw - 1240px)/2)) 25px; }.footer-main { display:grid; grid-template-columns:1.5fr .7fr .8fr 1fr; gap:60px; padding-bottom:55px; }.footer-brand p { color:#7f8599; font-size:12px; line-height:1.8; max-width:240px; margin-top:22px; }.footer-column,.footer-contact { display:flex; flex-direction:column; align-items:flex-start; gap:13px; }.footer-column b,.footer-contact b { font-size:13px; margin-bottom:9px; }.footer-column a,.footer-column button { color:#7f8599; font-size:12px; background:transparent; padding:0; }.footer-column a:hover,.footer-column button:hover { color:white; }.footer-contact strong { font-size:22px; }.footer-contact p,.footer-contact small { color:#7f8599; font-size:12px; margin:0; }.footer-bottom { border-top:1px solid #282c3e; padding-top:23px; display:flex; gap:35px; color:#666d83; font-size:10px; flex-wrap:wrap; }.footer-bottom a { color:inherit; transition:color .2s ease; }.footer-bottom a:hover { color:#fff; }

.modal-backdrop { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:24px; background:rgba(8,11,26,.68); backdrop-filter:blur(8px); animation:fadeIn .2s ease; }.auth-modal { width:min(1000px,100%); min-height:720px; max-height:calc(100vh - 48px); display:grid; grid-template-columns:.84fr 1.16fr; background:white; border-radius:26px; overflow:hidden; position:relative; box-shadow:0 35px 100px rgba(0,0,0,.35); }.modal-close { width:38px; height:38px; border-radius:50%; background:#f1f2f6; font-size:25px; color:#6b7183; position:absolute; top:18px; right:18px; z-index:2; }.auth-side { background:var(--navy); color:white; padding:44px; display:flex; flex-direction:column; justify-content:space-between; background-image:radial-gradient(circle at 15% 80%,rgba(94,109,246,.35),transparent 32%); }.auth-badge { display:inline-block; font-size:10px; padding:8px 11px; border:1px solid #3a405a; border-radius:20px; color:#aeb5ca; }.auth-side h2 { font-size:36px; line-height:1.3; margin:18px 0; }.auth-side p { color:#9da3b7; line-height:1.8; font-size:13px; }.auth-side ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:13px; color:#b7bdce; font-size:12px; }.auth-side li span { color:var(--lime); margin-right:9px; }.auth-form-wrap { padding:38px 58px 30px; overflow-y:auto; max-height:calc(100vh - 48px); }.auth-tabs { display:flex; gap:25px; border-bottom:1px solid var(--line); }.auth-tabs button { background:transparent; padding:10px 2px 14px; color:#9aa0b0; position:relative; }.auth-tabs button.active { color:var(--ink); font-weight:800; }.auth-tabs button.active::after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--blue); }.auth-heading { margin:23px 0 20px; }.auth-heading h2 { margin:0 0 8px; font-size:27px; }.auth-heading p { color:var(--muted); margin:0; font-size:12px; }.auth-form { display:flex; flex-direction:column; gap:13px; }.auth-form > label { display:flex; flex-direction:column; gap:7px; font-size:11px; font-weight:700; }.auth-form input[type=text],.auth-form input[type=tel],.auth-form input[type=password],.auth-form select { width:100%; height:48px; border:1px solid #dfe2eb; border-radius:11px; padding:0 14px; outline:none; transition:.2s; background:#fbfbfd; color:var(--ink); }.auth-form input:focus,.auth-form select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(94,109,246,.1); background:white; }.auth-form select:disabled { color:#a1a6b5; cursor:not-allowed; }.region-fields { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.code-field { display:grid; grid-template-columns:minmax(0,1fr) 126px; gap:10px; }.send-code-button { height:48px; border-radius:11px; border:1px solid #dfe2ff; background:#f0f2ff; color:var(--blue); font-size:13px; font-weight:700; white-space:nowrap; }.send-code-button:hover { background:#e7eaff; }.send-code-button:disabled { color:#9da3b4; background:#f3f4f7; border-color:#e5e7ee; cursor:not-allowed; }.password-field { position:relative; }.password-toggle { position:absolute; right:11px; top:9px; height:30px; background:transparent; color:var(--blue); font-size:10px; }.agreement { flex-direction:row !important; align-items:flex-start; color:#73798b; font-weight:400 !important; line-height:1.5; }.agreement input { margin-top:2px; accent-color:var(--blue); }.agreement button,.switch-prompt button,.login-options button { background:transparent; color:var(--blue); padding:0; font-size:inherit; }.form-submit { height:50px; margin-top:2px; }.switch-prompt { text-align:center; color:#858b9b; font-size:11px; margin:0; }.form-message { min-height:16px; font-size:11px; color:#df4d58; }.form-message.success { color:#149568; }.login-options { display:flex; justify-content:space-between; font-size:11px; color:#7e8496; }.login-options label { display:flex; align-items:center; }.login-options input { accent-color:var(--blue); }
.policy-modal { width:min(760px,100%); max-height:86vh; background:white; border-radius:24px; overflow:hidden; position:relative; }.policy-header { padding:28px 34px 20px; border-bottom:1px solid var(--line); }.policy-header span { font-size:10px; color:var(--blue); }.policy-header h2 { margin:7px 0 0; }.policy-content { padding:27px 34px 40px; overflow:auto; max-height:calc(86vh - 100px); color:#555c70; font-size:13px; line-height:1.9; }.policy-content h3 { color:var(--ink); margin-top:25px; }.policy-content p { margin:9px 0; }.policy-content .contact-box { background:#f2f4ff; border-radius:14px; padding:20px; color:var(--ink); }
.toast { position:fixed; left:50%; bottom:35px; transform:translateX(-50%); z-index:200; background:#151a30; color:white; padding:13px 18px; border-radius:12px; box-shadow:var(--shadow); display:flex; align-items:center; gap:10px; font-size:12px; }.toast span { color:var(--lime); }.toast p { margin:0; }

.portal { min-height:100vh; background:#f5f6fa; display:flex; }.portal-sidebar { width:236px; background:#11162b; color:white; padding:28px 20px; position:fixed; inset:0 auto 0 0; display:flex; flex-direction:column; z-index:30; }.portal-sidebar nav { margin-top:50px; display:flex; flex-direction:column; gap:5px; }.portal-sidebar nav button { color:#8f96ab; background:transparent; padding:13px 15px; border-radius:10px; display:flex; align-items:center; gap:13px; text-align:left; font-size:12px; }.portal-sidebar nav button span { width:18px; text-align:center; }.portal-sidebar nav button.active { color:white; background:#626ff2; }.portal-help { margin-top:auto; background:#1c2239; border:1px solid #2b324d; border-radius:14px; padding:18px; display:flex; flex-direction:column; gap:7px; }.portal-help > span { width:26px; height:26px; background:var(--lime); color:var(--navy); border-radius:8px; display:grid; place-items:center; font-weight:900; }.portal-help b { font-size:12px; }.portal-help small { color:#8f96aa; font-size:9px; line-height:1.5; }.portal-help a { color:var(--lime); font-size:11px; }.portal-main { margin-left:236px; flex:1; min-width:0; }.portal-header { height:74px; background:white; border-bottom:1px solid var(--line); display:flex; align-items:center; padding:0 34px; position:sticky; top:0; z-index:20; }.portal-menu { display:none; }.portal-store { display:flex; align-items:center; gap:11px; }.store-avatar { width:37px; height:37px; border-radius:10px; background:#e8eaff; color:var(--blue); display:grid; place-items:center; font-weight:900; }.portal-store div { display:flex; flex-direction:column; gap:4px; }.portal-store strong { font-size:13px; }.portal-store small { color:#9298a8; font-size:9px; }.portal-header-actions { margin-left:auto; display:flex; align-items:center; gap:14px; position:relative; }.trial-pill { background:#eff8df; color:#628b22; border-radius:20px; padding:8px 12px; font-size:10px; }.portal-header-actions > button { background:transparent; }.user-menu { display:flex; align-items:center; gap:7px; }.user-menu span { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--navy); color:white; }.user-menu i { width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:5px solid #9ba0af; }.user-dropdown { position:absolute; right:0; top:47px; width:190px; background:white; border:1px solid var(--line); border-radius:12px; box-shadow:0 15px 35px rgba(23,29,68,.13); padding:14px; }.user-dropdown div { display:flex; flex-direction:column; gap:4px; padding-bottom:11px; border-bottom:1px solid var(--line); }.user-dropdown small { color:#8f95a6; }.user-dropdown button { margin-top:8px; width:100%; padding:9px; color:#d94c57; background:#fff4f4; border-radius:8px; }.portal-content { padding:34px; max-width:1440px; margin:0 auto; }.portal-welcome { display:flex; align-items:flex-end; justify-content:space-between; }.portal-welcome p { color:var(--blue); font-size:10px; font-weight:700; margin:0 0 7px; }.portal-welcome h1 { font-size:28px; margin:0 0 7px; }.portal-welcome span { color:#8a90a1; font-size:11px; }.trial-banner { min-height:78px; margin:25px 0 18px; background:linear-gradient(110deg,#151a30,#28305a); color:white; border-radius:16px; padding:18px 22px; display:flex; align-items:center; gap:18px; position:relative; overflow:hidden; }.trial-banner::after { content:"7"; position:absolute; right:120px; font-size:100px; font-weight:900; color:rgba(255,255,255,.035); }.trial-progress { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(var(--lime) 100%,#39405d 0); position:relative; }.trial-progress::after { content:""; width:34px; height:34px; background:#1b213c; border-radius:50%; }.trial-banner b { font-size:12px; }.trial-banner p { color:#9fa6bb; font-size:10px; margin:6px 0 0; }.trial-banner button { margin-left:auto; z-index:1; padding:9px 13px; border-radius:9px; background:var(--lime); color:var(--navy); font-size:10px; font-weight:800; }.dashboard-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.dashboard-metric { background:white; border:1px solid #e8eaf1; border-radius:15px; padding:18px; display:flex; align-items:center; gap:14px; }.dashboard-metric > span { width:42px; height:42px; border-radius:12px; background:#eef0ff; color:var(--blue); display:grid; place-items:center; font-size:17px; }.dashboard-metric:nth-child(2) > span { background:#eff8df; color:#6a9525; }.dashboard-metric:nth-child(3) > span { background:#fff4de; color:#cf8a1a; }.dashboard-metric:nth-child(4) > span { background:#e8f8f4; color:#159271; }.dashboard-metric div { display:flex; flex-direction:column; gap:5px; }.dashboard-metric small { color:#8b91a2; font-size:9px; }.dashboard-metric strong { font-size:19px; }.dashboard-grid { display:grid; grid-template-columns:1.45fr .75fr; gap:17px; margin-top:17px; }.dashboard-card { background:white; border:1px solid #e8eaf1; border-radius:16px; padding:20px; }.dashboard-card-heading { display:flex; justify-content:space-between; align-items:center; }.dashboard-card-heading > div { display:flex; flex-direction:column; gap:5px; }.dashboard-card-heading strong { font-size:13px; }.dashboard-card-heading small { color:#9398a9; font-size:9px; }.dashboard-card-heading select,.dashboard-card-heading button { border:1px solid var(--line); background:white; color:#777e91; border-radius:8px; padding:7px 9px; font-size:9px; }.empty-chart { height:255px; position:relative; margin-top:15px; padding:10px 0 24px 30px; }.chart-axis { position:absolute; left:0; top:10px; bottom:24px; display:flex; flex-direction:column; justify-content:space-between; color:#adb1bf; font-size:8px; }.empty-chart svg { width:100%; height:100%; overflow:visible; }.chart-area { fill:url(#chartFill); }.chart-line { fill:none; stroke:#6573f6; stroke-width:3; vector-effect:non-scaling-stroke; }.chart-days { position:absolute; left:35px; right:0; bottom:0; display:flex; justify-content:space-between; color:#9ca1b2; font-size:8px; }.setup-list { margin-top:15px; display:flex; flex-direction:column; }.setup-item { display:flex; gap:11px; padding:13px 0; border-bottom:1px solid #eff0f4; }.setup-item:last-child { border-bottom:0; }.setup-item button { width:28px; height:28px; border-radius:8px; background:#eef0ff; color:var(--blue); flex:none; }.setup-item.done button { background:#e9f7d3; color:#6b942b; }.setup-item div { display:flex; flex-direction:column; gap:4px; }.setup-item b { font-size:10px; }.setup-item small { color:#9298a9; font-size:8px; line-height:1.4; }.setup-item.done b { color:#9298a9; text-decoration:line-through; }.table-overview { margin-top:17px; }.demo-tables { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:16px; }.demo-table { min-height:78px; border:1px solid #e6e8f0; border-radius:11px; background:#f8f9fb; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; }.demo-table b { font-size:11px; }.demo-table small { color:#969bac; font-size:8px; }.demo-table.busy { background:#6674f6; border-color:#6674f6; color:white; }.demo-table.busy small { color:#e1e4ff; }.demo-table.reserved { background:#fff8e9; border-color:#f5dfb7; color:#bd7b1c; }

.reveal { opacity:0; transform:translateY(22px); transition:opacity .7s ease,transform .7s ease; }.reveal.visible { opacity:1; transform:none; }.delay-1 { transition-delay:.1s; }.delay-2 { transition-delay:.2s; }.delay-3 { transition-delay:.3s; }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

@media (max-width: 1050px) {
  .main-nav { gap:20px; margin-left:20px; }.hero { grid-template-columns:1fr; padding-top:135px; }.hero-copy { max-width:700px; }.hero-visual { width:90%; margin-left:auto; }.trust-strip > div { grid-template-columns:repeat(2,1fr); }.section-heading { grid-template-columns:.55fr 1.3fr; }.section-heading > p { grid-column:2; }.solution-grid { grid-template-columns:1fr 1fr; }.solution-card:last-child { grid-column:1/-1; }.capabilities { gap:45px; }.footer-main { grid-template-columns:1.3fr .7fr .7fr; }.footer-contact { grid-column:1/-1; }.demo-tables { grid-template-columns:repeat(4,1fr); }
}
@media (max-width: 760px) {
  .section-pad { padding-left:20px; padding-right:20px; }.site-header { padding:0 20px; }.site-header .main-nav { position:absolute; top:70px; left:20px; right:20px; margin:0; padding:18px; border-radius:14px; background:white; box-shadow:var(--shadow); flex-direction:column; display:none; }.site-header.menu-open .main-nav { display:flex; }.header-actions .text-button { display:none; }.menu-button { display:block; }.hero { padding-top:120px; padding-bottom:80px; gap:45px; }.hero h1 { letter-spacing:-2px; }.hero-actions { flex-direction:column; align-items:flex-start; }.hero-visual { width:100%; min-height:430px; transform:none; }.visual-body { height:380px; }.visual-content { padding:22px 14px; }.visual-sidebar { width:42px; }.metric-grid { gap:6px; }.metric-grid article { padding:9px; }.metric-grid strong { font-size:12px; }.tables { grid-template-columns:repeat(3,1fr); }.tables > span:nth-child(n+7) { display:none; }.floating-card.automation { right:-7px; top:66px; }.floating-card.revenue { left:-8px; bottom:25px; }.trust-strip { padding:25px 20px 30px; }.trust-strip > div { grid-template-columns:1fr; gap:10px; }.trust-strip span { min-height:86px; }.solutions,.scenarios { padding-top:90px; padding-bottom:90px; }.section-heading,.compact-heading { grid-template-columns:1fr; gap:20px; }.section-heading > p { grid-column:auto; }.solution-grid { grid-template-columns:1fr; }.solution-card:last-child { grid-column:auto; }.capabilities { padding-top:90px; padding-bottom:90px; grid-template-columns:1fr; }.capability-tabs { flex-direction:row; overflow-x:auto; }.capability-tabs button { border-left:0; border-bottom:2px solid #dfe2ea; white-space:nowrap; }.capability-tabs button.active { border-bottom-color:var(--blue); }.capability-stage { padding:18px; min-height:490px; }.stage-main { grid-template-columns:1fr; }.stage-list { display:none; }.number-intro { flex-wrap:wrap; }.number-intro .kicker { margin-left:0; }.number-grid { grid-template-columns:1fr 1fr; }.number-grid article:nth-child(2) { border-right:0; }.scenario { grid-template-columns:40px 1fr; padding:22px 0; }.scenario > b { display:none; }.about-panel { grid-template-columns:1fr; }.about-copy { padding:42px 28px; }.about-visual { min-height:400px; }.cta-panel { min-height:560px; padding:45px 30px; flex-direction:column; align-items:flex-start; }.cta-button { width:170px; height:170px; align-self:flex-end; }.footer-main { grid-template-columns:1fr 1fr; }.footer-brand { grid-column:1/-1; }.auth-modal { grid-template-columns:1fr; min-height:0; }.auth-side { display:none; }.auth-form-wrap { padding:36px 25px 25px; }.dashboard-metrics { grid-template-columns:1fr 1fr; }.dashboard-grid { grid-template-columns:1fr; }.portal-sidebar { transform:translateX(-100%); transition:.25s; }.portal.sidebar-open .portal-sidebar { transform:none; }.portal-main { margin-left:0; }.portal-menu { display:block; background:transparent; margin-right:12px; }.portal-header { padding:0 16px; }.portal-content { padding:22px 16px; }.portal-welcome { align-items:flex-start; }.portal-welcome .primary-button { font-size:10px; padding:11px; }.trial-banner::after { display:none; }.dashboard-metric { padding:13px; }.demo-tables { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 430px) {
  .hero h1 { font-size:43px; }.hero-copy > p { font-size:15px; }.primary-button.large { width:100%; }.hero-visual { min-height:390px; }.visual-body { height:340px; }.metric-grid article:nth-child(3) { display:none; }.metric-grid { grid-template-columns:1fr 1fr; }.floating-card.automation { display:none; }.solution-card { padding:27px; }.number-grid { grid-template-columns:1fr; }.number-grid article { border-right:0; border-bottom:1px solid #34394f; padding-left:0 !important; }.footer-main { grid-template-columns:1fr; }.footer-brand { grid-column:auto; }.dashboard-metrics { grid-template-columns:1fr; }.trial-pill { display:none; }.portal-store strong { max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.demo-tables { grid-template-columns:repeat(2,1fr); }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; }.reveal { opacity:1; transform:none; transition:none; } * { animation:none !important; } }

/* PDF-backed product visuals: consistent real interfaces across the site */
.solution-card {
  display:flex;
  min-height:585px;
  flex-direction:column;
}
.solution-card ul { margin-bottom:22px; }
.solution-art {
  position:relative;
  display:grid;
  min-height:190px;
  margin-top:auto;
  overflow:hidden;
  place-items:center;
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;
  background:radial-gradient(circle at 50% 15%,rgba(102,117,247,.27),transparent 40%),#090d1d;
  box-shadow:inset 0 1px rgba(255,255,255,.05),0 20px 40px rgba(5,8,20,.2);
}
.solution-art::after {
  content:"";
  position:absolute;
  inset:auto 12% 13px;
  height:18px;
  border-radius:50%;
  background:rgba(87,103,245,.22);
  filter:blur(15px);
}
.solution-art img {
  position:relative;
  z-index:1;
  width:auto;
  max-width:90%;
  height:165px;
  object-fit:contain;
}
.solution-card.blue .solution-art { background:radial-gradient(circle at 50% 15%,rgba(184,243,74,.2),transparent 38%),#151a35; }
.solution-card.light .solution-art { border-color:#dfe3ee; background:radial-gradient(circle at 50% 15%,rgba(101,118,247,.26),transparent 42%),#11162c; }

.solution-art.mode-visual {
  display:block;
  min-height:218px;
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 72%,rgba(93,110,246,.32),transparent 48%),
    linear-gradient(155deg,#0b1022,#151b38);
}
.solution-art.mode-visual::after { inset:auto 10% 5px; opacity:.8; }
.solution-scene-caption {
  position:absolute;
  top:13px;
  left:14px;
  z-index:8;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px;
  background:rgba(8,13,31,.62);
  color:#d9def1;
  font-size:8px;
  font-weight:650;
  letter-spacing:.25px;
  backdrop-filter:blur(9px);
}
.solution-phone {
  position:absolute;
  z-index:3;
  width:27%;
  aspect-ratio:480/1024;
  filter:drop-shadow(0 12px 14px rgba(0,0,0,.36));
}
.solution-phone img {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  max-width:none;
  height:100%;
  object-fit:fill;
}
.solution-phone .phone-screen { z-index:1; padding:2.2% 3.7% 2.5%; border-radius:14%/7%; }
.solution-phone .phone-frame { z-index:2; }
.phone-home { left:7%; bottom:-18%; transform:rotate(-4deg); }
.phone-light { left:36.5%; bottom:-8%; width:28%; }
.phone-overview { right:7%; bottom:-18%; transform:rotate(4deg); }

.assisted-visual { overflow:hidden; }
.assisted-visual .assisted-order { left:16%; bottom:-15%; width:31%; transform:rotate(-3deg); }
.assisted-visual .assisted-open { right:16%; bottom:-15%; width:31%; transform:rotate(3deg); }
.assisted-callout {
  position:absolute !important;
  z-index:6 !important;
  width:35% !important;
  max-width:none !important;
  height:auto !important;
  border:1px solid rgba(101,118,247,.4);
  border-radius:10px;
  background:#fff;
  box-shadow:0 12px 25px rgba(2,6,22,.3);
}
.callout-product { left:2%; bottom:17px; transform:rotate(-2deg); }
.callout-service { right:2%; bottom:17px; transform:rotate(2deg); }

.commercial-visual { overflow:hidden; background:#11162c !important; }
.commercial-visual::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(6,10,24,.18),rgba(6,10,24,.72));
}
.mode-visual .commercial-room-image {
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  max-width:none;
  height:100%;
  object-fit:cover;
}
.commercial-screen {
  position:absolute;
  left:13%;
  right:13%;
  bottom:17px;
  z-index:5;
  padding:6px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:12px;
  background:#090d1d;
  box-shadow:0 18px 32px rgba(0,0,0,.48);
  transform:perspective(700px) rotateX(2deg);
}
.commercial-screen::before {
  content:"";
  position:absolute;
  top:2px;
  left:50%;
  width:18px;
  height:2px;
  border-radius:999px;
  background:#4c536a;
  transform:translateX(-50%);
}
.commercial-screen img {
  display:block;
  position:relative;
  z-index:1;
  width:100%;
  max-width:none;
  height:auto;
  border-radius:7px;
}

.capability-stage { min-height:620px; }
.stage-real-screen {
  position:relative;
  z-index:1;
  margin-top:26px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  background:#f8f9fc;
  color:var(--ink);
  box-shadow:0 22px 50px rgba(3,6,18,.2);
}
.stage-real-screen .stage-screen-head { padding:17px 18px; }
.stage-image-frame {
  display:grid;
  height:320px;
  overflow:hidden;
  place-items:center;
  border-top:1px solid #eceef4;
  border-bottom:1px solid #eceef4;
  background:#0b0f20;
}
.stage-image-frame img {
  width:100%;
  height:100%;
  object-fit:contain;
}
.stage-image-frame.operation { background:#eef1f6; }
.stage-image-frame.operation img,
.stage-image-frame.finance img { object-fit:cover; }
.stage-image-frame.finance { background:#e7ebf2; }
.stage-image-frame.finance-device-showcase {
  position:relative;
  display:block;
  height:350px;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 20%,rgba(94,109,246,.2),transparent 34%),
    linear-gradient(145deg,#080d1d,#171e3a);
}
.finance-device-showcase .finance-monitor { inset:22px 28px 46px; }
.stage-image-frame.operation-dual {
  display:grid;
  height:350px;
  grid-template-columns:minmax(0,1fr) 142px;
  gap:16px;
  padding:16px;
  place-items:stretch;
  background:
    radial-gradient(circle at 88% 22%,rgba(94,109,246,.2),transparent 34%),
    linear-gradient(145deg,#080d1d,#141b38);
}
.operation-web-preview,
.operation-mobile-preview { position:relative; min-width:0; overflow:hidden; }
.operation-web-preview {
  display:flex;
  padding:23px 5px 35px;
  align-items:center;
  justify-content:center;
  overflow:visible;
}
.operation-monitor {
  position:absolute;
  inset:31px 5px 35px;
  z-index:2;
}
.operation-monitor-screen {
  position:absolute;
  inset:0;
  z-index:2;
  overflow:hidden;
  padding:7px 7px 13px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:13px;
  background:linear-gradient(145deg,#202638,#070a12);
  box-shadow:0 20px 38px rgba(0,0,0,.5),inset 0 1px rgba(255,255,255,.1);
}
.operation-monitor-screen::after {
  content:"";
  position:absolute;
  left:50%;
  bottom:4px;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#67718a;
  box-shadow:0 0 6px rgba(105,119,246,.45);
  transform:translateX(-50%);
}
.operation-monitor::before {
  content:"";
  position:absolute;
  left:50%;
  bottom:-25px;
  z-index:1;
  width:68px;
  height:29px;
  background:linear-gradient(90deg,#303747,#98a0ae 48%,#333a49);
  clip-path:polygon(32% 0,68% 0,78% 100%,22% 100%);
  transform:translateX(-50%);
}
.operation-monitor::after {
  content:"";
  position:absolute;
  left:50%;
  bottom:-30px;
  z-index:2;
  width:126px;
  height:8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50% 50% 8px 8px;
  background:linear-gradient(90deg,#262c3a,#8f97a7 50%,#252b38);
  box-shadow:0 8px 12px rgba(0,0,0,.32);
  transform:translateX(-50%);
}
.operation-web-preview > span,
.operation-mobile-preview > span {
  position:absolute;
  top:10px;
  left:10px;
  z-index:4;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(7,11,26,.74);
  color:#fff;
  font-size:8px;
  font-weight:700;
  letter-spacing:.5px;
  backdrop-filter:blur(10px);
}
.operation-monitor-screen > img {
  display:block;
  width:100%;
  height:100%;
  border-radius:7px;
  object-fit:cover;
  object-position:center;
}
.operation-mobile-preview {
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.operation-mobile-preview::before {
  content:"";
  position:absolute;
  right:-35px;
  bottom:-55px;
  width:180px;
  height:180px;
  border:1px solid rgba(184,243,74,.18);
  border-radius:50%;
  box-shadow:0 0 0 32px rgba(94,109,246,.05);
}
.operation-mobile-preview > span { left:50%; transform:translateX(-50%); }
.operation-phone {
  position:relative;
  z-index:2;
  height:100%;
  max-height:318px;
  aspect-ratio:1320/2868;
  padding:5px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  border-radius:23px;
  background:#070a14;
  box-shadow:0 22px 40px rgba(0,0,0,.45);
}
.operation-phone::before {
  content:"";
  position:absolute;
  top:8px;
  left:50%;
  z-index:3;
  width:34%;
  height:6px;
  border-radius:999px;
  background:#090b12;
  transform:translateX(-50%);
}
.operation-phone img {
  display:block;
  width:100%;
  height:100%;
  border-radius:18px;
  object-fit:cover;
  object-position:top;
}
.stage-image-frame.growth-showcase {
  position:relative;
  display:block;
  height:350px;
  overflow:hidden;
  background:
    radial-gradient(circle at 84% 42%,rgba(94,109,246,.24),transparent 34%),
    radial-gradient(circle at 24% 52%,rgba(184,243,74,.07),transparent 31%),
    linear-gradient(135deg,#080d1d 0%,#151d3b 54%,#0c1228 100%);
}
.growth-web-preview {
  position:absolute;
  top:40px;
  bottom:70px;
  left:22px;
  z-index:2;
  width:60%;
}
.growth-web-preview::before {
  content:"";
  position:absolute;
  bottom:-40px;
  left:50%;
  z-index:-1;
  width:70px;
  height:42px;
  background:linear-gradient(90deg,#687186,#b9c0cc 50%,#687186);
  clip-path:polygon(29% 0,71% 0,84% 100%,16% 100%);
  transform:translateX(-50%);
}
.growth-web-preview::after {
  content:"";
  position:absolute;
  bottom:-47px;
  left:50%;
  z-index:2;
  width:142px;
  height:9px;
  border-radius:999px 999px 5px 5px;
  background:linear-gradient(180deg,#d2d7df,#70798d);
  box-shadow:0 8px 16px rgba(0,0,0,.3);
  transform:translateX(-50%);
}
.growth-web-preview > span,
.growth-mobile-stack > span {
  position:absolute;
  top:-16px;
  left:4px;
  z-index:8;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(7,11,26,.76);
  color:#fff;
  font-size:8px;
  font-weight:700;
  letter-spacing:.4px;
  backdrop-filter:blur(10px);
}
.growth-monitor-screen {
  position:absolute;
  inset:0;
  overflow:hidden;
  border:9px solid #1b2130;
  border-bottom-width:18px;
  border-radius:14px;
  background:#03050a;
  box-shadow:0 24px 48px rgba(0,0,0,.38),inset 0 0 0 1px rgba(255,255,255,.05);
}
.growth-monitor-screen::after {
  content:"";
  position:absolute;
  bottom:5px;
  left:50%;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#6f788c;
  transform:translateX(-50%);
}
.growth-monitor-screen > img {
  position:absolute;
  top:72%;
  left:50%;
  display:block;
  width:134%;
  max-width:none;
  height:auto;
  object-fit:initial;
  transform:translate(-50%,-50%);
}
.growth-mobile-stack {
  position:absolute;
  top:30px;
  right:12px;
  bottom:24px;
  z-index:3;
  display:flex;
  width:36%;
  align-items:flex-end;
  justify-content:center;
  gap:8px;
}
.growth-mobile-stack::before {
  content:"";
  position:absolute;
  inset:16px 0 0;
  border:1px solid rgba(255,255,255,.08);
  border-radius:26px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  box-shadow:inset 0 1px rgba(255,255,255,.05);
}
.growth-mobile-stack > span { top:2px; left:50%; transform:translateX(-50%); white-space:nowrap; }
.growth-phone {
  position:relative;
  z-index:3;
  height:262px;
  aspect-ratio:1320/2868;
  padding:5px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.2);
  border-radius:23px;
  background:#070a14;
  box-shadow:0 22px 38px rgba(0,0,0,.46);
  transform-origin:center bottom;
}
.growth-phone::before {
  content:"";
  position:absolute;
  top:8px;
  left:50%;
  z-index:5;
  width:34%;
  height:6px;
  border-radius:999px;
  background:#090b12;
  transform:translateX(-50%);
}
.growth-phone img {
  display:block;
  width:100%;
  height:100%;
  border-radius:18px;
  object-fit:cover;
  object-position:top;
}
.growth-phone.phone-1 { transform:translateY(7px); }
.growth-phone.phone-2 { transform:translateY(-3px); }
.stage-image-frame.chain-showcase {
  position:relative;
  display:grid;
  height:350px;
  grid-template-columns:minmax(0,1fr) 205px;
  gap:16px;
  padding:24px 24px 0 28px;
  place-items:stretch;
  background:
    radial-gradient(circle at 80% 28%,rgba(184,243,74,.19),transparent 29%),
    radial-gradient(circle at 18% 76%,rgba(94,109,246,.22),transparent 34%),
    linear-gradient(145deg,#070b18,#151b37);
}
.chain-network {
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:12px 10px 34px 0;
  color:#fff;
}
.chain-network::before,
.chain-network::after {
  content:"";
  position:absolute;
  z-index:-1;
  border:1px solid rgba(184,243,74,.15);
  border-radius:50%;
}
.chain-network::before { width:270px; height:270px; left:-136px; top:44px; }
.chain-network::after { width:180px; height:180px; left:-91px; top:89px; }
.chain-kicker {
  margin-bottom:16px;
  color:#b8f34a;
  font-size:9px;
  font-weight:800;
  letter-spacing:1.6px;
}
.chain-network strong {
  font-family:var(--display-font);
  font-size:30px;
  line-height:1.2;
  letter-spacing:-1px;
}
.chain-network p {
  max-width:360px;
  margin:17px 0 21px;
  color:#aeb6cc;
  font-size:12px;
  line-height:1.75;
}
.chain-nodes { display:flex; gap:8px; flex-wrap:wrap; }
.chain-nodes span {
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:#e9edf7;
  font-size:9px;
  backdrop-filter:blur(8px);
}
.chain-phone-wrap { position:relative; display:flex; align-items:flex-end; justify-content:center; }
.chain-phone-wrap > span {
  position:absolute;
  top:2px;
  left:50%;
  z-index:6;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(7,11,26,.8);
  color:#fff;
  font-size:8px;
  font-weight:700;
  white-space:nowrap;
  transform:translateX(-50%);
  backdrop-filter:blur(10px);
}
.chain-phone-wrap::before {
  content:"";
  position:absolute;
  right:-56px;
  bottom:16px;
  width:230px;
  height:230px;
  border:1px solid rgba(184,243,74,.14);
  border-radius:50%;
  box-shadow:0 0 0 34px rgba(94,109,246,.05);
}
.chain-phone {
  position:relative;
  z-index:3;
  height:318px;
  aspect-ratio:1320/2868;
  padding:5px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  border-radius:24px 24px 9px 9px;
  background:#070a14;
  box-shadow:0 24px 44px rgba(0,0,0,.52);
  transform:rotate(1.8deg);
  transform-origin:center bottom;
}
.chain-phone::before {
  content:"";
  position:absolute;
  top:8px;
  left:50%;
  z-index:5;
  width:34%;
  height:6px;
  border-radius:999px;
  background:#090b12;
  transform:translateX(-50%);
}
.chain-phone img {
  display:block;
  width:100%;
  height:100%;
  border-radius:18px 18px 5px 5px;
  object-fit:cover;
  object-position:top;
}
.stage-proof {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:17px 18px 19px;
}
.stage-proof p {
  margin:0;
  color:#6f7688;
  font-size:12px;
  line-height:1.75;
}
.stage-proof > div { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; }
.stage-proof span {
  padding:6px 9px;
  border-radius:999px;
  background:#edf0ff;
  color:#5364e9;
  font-size:10px;
  font-weight:700;
  white-space:nowrap;
}

.hardware {
  position:relative;
  overflow:hidden;
  padding-top:104px;
  padding-bottom:112px;
  background:radial-gradient(circle at 85% 10%,rgba(101,117,247,.24),transparent 30%),linear-gradient(135deg,#0b1022,#171f40);
  color:#fff;
}
.hardware::before {
  content:"";
  position:absolute;
  width:390px;
  height:390px;
  left:-240px;
  bottom:-250px;
  border:1px solid rgba(184,243,74,.16);
  border-radius:50%;
  box-shadow:0 0 0 70px rgba(184,243,74,.025),0 0 0 140px rgba(184,243,74,.018);
}
.hardware-heading {
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:70px;
  margin-bottom:45px;
}
.hardware-heading h2 {
  margin:22px 0 0;
  color:#fff;
  font-size:clamp(38px,3.55vw,52px);
  line-height:1.2;
  letter-spacing:-1.2px;
}
.hardware-heading > p {
  max-width:440px;
  margin:0;
  color:#aeb6ce;
  font-size:16px;
  line-height:1.9;
}
.hardware .eyebrow { color:#aab4d2; }
.hardware-grid {
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.hardware-card {
  overflow:hidden;
  padding:13px 13px 24px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:24px;
  background:rgba(255,255,255,.055);
  box-shadow:0 22px 46px rgba(3,6,18,.18);
  backdrop-filter:blur(12px);
  transition:transform .3s ease,border-color .3s ease,background .3s ease;
}
.hardware-card:hover {
  transform:translateY(-6px);
  border-color:rgba(184,243,74,.3);
  background:rgba(255,255,255,.08);
}
.hardware-card > div {
  position:relative;
  display:grid;
  height:185px;
  margin-bottom:18px;
  overflow:hidden;
  place-items:center;
  border-radius:17px;
  background:#e9f0fd;
}
.hardware-card img {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  transform:scale(1.12);
}
.hardware-card:nth-child(3) img { transform:scale(1.22); }
.hardware-card:nth-child(4) img { transform:scale(1.18); }
.hardware-card > span {
  display:inline-grid;
  width:31px;
  height:31px;
  margin:0 12px 11px;
  place-items:center;
  border-radius:9px;
  background:rgba(184,243,74,.12);
  color:var(--lime);
  font-size:10px;
  font-weight:800;
}
.hardware-card h3 { margin:0 12px 7px; font-size:21px; }
.hardware-card p { margin:0 12px; color:#9ea7c0; font-size:13px; line-height:1.7; }

.catalog-group + .catalog-group {
  margin-top:58px;
  padding-top:50px;
  border-top:1px solid rgba(255,255,255,.1);
}
.catalog-group-heading {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) minmax(260px,430px);
  gap:16px;
  align-items:center;
  margin-bottom:24px;
}
.catalog-group-heading > span {
  display:grid;
  width:46px;
  height:46px;
  place-items:center;
  border:1px solid rgba(184,243,74,.24);
  border-radius:14px;
  background:rgba(184,243,74,.1);
  color:var(--lime);
  font-size:12px;
  font-weight:800;
}
.catalog-group-heading small {
  display:block;
  margin-bottom:4px;
  color:#8792af;
  font-size:9px;
  font-weight:800;
  letter-spacing:1.5px;
}
.catalog-group-heading h3 { margin:0; color:#fff; font-size:24px; }
.catalog-group-heading > p { margin:0; color:#929db8; font-size:13px; line-height:1.7; text-align:right; }
.catalog-grid { display:grid; gap:12px; }
.software-catalog-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.hardware-catalog-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
.catalog-card {
  display:flex;
  min-width:0;
  overflow:hidden;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:rgba(255,255,255,.055);
  box-shadow:0 20px 44px rgba(3,6,18,.16);
  transition:transform .3s ease,border-color .3s ease,background .3s ease;
}
.catalog-card:hover {
  transform:translateY(-5px);
  border-color:rgba(184,243,74,.26);
  background:rgba(255,255,255,.075);
}
.catalog-media {
  position:relative;
  display:grid;
  height:150px;
  margin:9px 9px 0;
  overflow:hidden;
  place-items:center;
  border-radius:13px;
  background:linear-gradient(145deg,#f6faf9,#e8f1f5);
}
.catalog-media img {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.phone-catalog-media { background:radial-gradient(circle at 50% 42%,#fff,#e7eef8 70%); }
.phone-catalog-media img {
  inset:auto;
  top:50%;
  left:50%;
  width:auto;
  height:88%;
  max-width:64%;
  padding:3px;
  border:1px solid rgba(14,19,38,.85);
  border-radius:15px;
  background:#0b0f20;
  box-shadow:0 14px 24px rgba(15,21,46,.24);
  transform:translate(-50%,-50%);
}
.screen-catalog-media { background:linear-gradient(145deg,#e8edf5,#f7fafc); }
.screen-catalog-media img { inset:9px 8px; width:calc(100% - 16px); height:calc(100% - 18px); border-radius:7px; }
.catalog-card-body { padding:13px 14px 16px; }
.catalog-card-body small {
  display:inline-block;
  margin-bottom:7px;
  padding:4px 7px;
  border-radius:999px;
  background:rgba(184,243,74,.11);
  color:var(--lime);
  font-size:9px;
  font-weight:800;
  letter-spacing:.3px;
}
.catalog-card-body h3 { margin:0 0 6px; color:#fff; font-size:17px; line-height:1.35; }
.catalog-card-body p { margin:0; color:#9ea8c0; font-size:11px; line-height:1.6; }
.hardware-catalog-grid .catalog-media { height:142px; }
.hardware-catalog-grid .catalog-card:nth-child(5) .catalog-media img,
.hardware-catalog-grid .catalog-card:nth-child(6) .catalog-media img,
.hardware-catalog-grid .smart-screen-product .catalog-media img { transform:scale(1.08); }

.case-card:first-child .case-photo img { object-position:center 58%; }
.case-card:nth-child(2) .case-photo img { object-position:center; }
.case-card:nth-child(3) .case-photo img { object-fit:contain; background:#11172c; }

@media (max-width: 1280px) {
  .hardware-catalog-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}

@media (max-width: 1050px) {
  .hardware-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hardware-card > div { height:230px; }
  .software-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hardware-catalog-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width: 760px) {
  .solution-card { min-height:560px; }
  .solution-art { min-height:178px; }
  .solution-art img { height:152px; }
  .solution-art.mode-visual { min-height:214px; }
  .solution-phone img { height:100%; }
  .assisted-callout { height:auto !important; }
  .mode-visual .commercial-room-image { height:100%; }
  .commercial-screen img { height:auto; }
  .capability-stage { min-height:0; }
  .stage-real-screen { margin-top:22px; }
  .stage-image-frame { height:230px; }
  .stage-image-frame.operation-dual { height:248px; grid-template-columns:minmax(0,1fr) 92px; gap:9px; padding:10px; }
  .stage-image-frame.finance-device-showcase { height:248px; }
  .finance-device-showcase .finance-monitor { inset:18px 8px 38px; }
  .operation-web-preview { border-radius:11px; }
  .operation-web-preview { padding:22px 2px 30px; }
  .operation-monitor { inset:28px 2px 30px; }
  .operation-monitor-screen { padding:4px 4px 8px; border-radius:8px; }
  .operation-monitor-screen > img { border-radius:4px; }
  .operation-monitor::before { bottom:-18px; width:38px; height:21px; }
  .operation-monitor::after { bottom:-22px; width:69px; height:5px; }
  .operation-monitor-screen::after { bottom:2px; width:3px; height:3px; }
  .operation-phone { max-height:228px; padding:4px; border-radius:18px; }
  .operation-phone img { border-radius:14px; }
  .operation-web-preview > span,
  .operation-mobile-preview > span { top:7px; padding:4px 6px; font-size:7px; }
  .stage-image-frame.growth-showcase { height:248px; }
  .growth-web-preview { top:38px; bottom:58px; left:8px; width:59%; }
  .growth-web-preview::before { bottom:-27px; width:45px; height:29px; }
  .growth-web-preview::after { bottom:-32px; width:86px; height:6px; }
  .growth-monitor-screen { border-width:6px; border-bottom-width:12px; border-radius:9px; }
  .growth-monitor-screen::after { bottom:3px; width:3px; height:3px; }
  .growth-monitor-screen > img { top:72%; width:137%; }
  .growth-mobile-stack { top:20px; right:0; bottom:18px; width:42%; gap:0; }
  .growth-mobile-stack::before { inset:14px 4px 0; border-radius:19px; }
  .growth-phone { height:156px; padding:4px; border-radius:17px; }
  .growth-phone img { border-radius:14px; }
  .growth-phone::before { top:6px; height:4px; }
  .growth-phone.phone-1 { margin-right:-9px; transform:translateY(7px); }
  .growth-phone.phone-2 { transform:translateY(-1px); }
  .growth-web-preview > span,
  .growth-mobile-stack > span { padding:4px 6px; font-size:7px; }
  .stage-image-frame.chain-showcase { height:248px; grid-template-columns:minmax(0,1fr) 116px; gap:8px; padding:14px 10px 0 15px; }
  .chain-network { padding:0 0 22px; }
  .chain-kicker { margin-bottom:10px; font-size:7px; letter-spacing:1px; }
  .chain-network strong { font-size:21px; line-height:1.25; }
  .chain-network p { margin:12px 0 14px; font-size:9px; line-height:1.65; }
  .chain-nodes { gap:5px; }
  .chain-nodes span { padding:5px 7px; font-size:7px; }
  .chain-phone-wrap > span { top:1px; padding:4px 6px; font-size:7px; }
  .chain-phone { height:226px; padding:4px; border-radius:19px 19px 7px 7px; }
  .chain-phone::before { top:6px; height:4px; }
  .chain-phone img { border-radius:15px 15px 4px 4px; }
  .chain-phone-wrap::before { right:-74px; bottom:4px; width:174px; height:174px; }
  .stage-proof { grid-template-columns:1fr; gap:12px; }
  .stage-proof > div { justify-content:flex-start; }
  .hardware { padding-top:82px; padding-bottom:88px; }
  .hardware-heading { display:block; margin-bottom:34px; }
  .hardware-heading h2 { font-size:36px; }
  .hardware-heading > p { margin-top:20px; }
  .hardware-grid { grid-template-columns:1fr; }
  .hardware-card > div { height:225px; }
  .catalog-group + .catalog-group { margin-top:42px; padding-top:40px; }
  .catalog-group-heading { grid-template-columns:auto minmax(0,1fr); gap:12px; margin-bottom:18px; }
  .catalog-group-heading > span { width:40px; height:40px; border-radius:12px; }
  .catalog-group-heading h3 { font-size:21px; }
  .catalog-group-heading > p { grid-column:1/-1; font-size:12px; text-align:left; }
  .software-catalog-grid { grid-template-columns:1fr; }
  .hardware-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .catalog-media { height:178px; }
  .hardware-catalog-grid .catalog-media { height:118px; margin:7px 7px 0; border-radius:12px; }
  .hardware-catalog-grid .catalog-card { border-radius:17px; }
  .hardware-catalog-grid .catalog-card-body { padding:13px 13px 16px; }
  .hardware-catalog-grid .catalog-card-body h3 { font-size:16px; }
  .hardware-catalog-grid .catalog-card-body p { font-size:11px; line-height:1.55; }
  .hardware-catalog-grid .catalog-card-body small { margin-bottom:7px; padding:4px 7px; font-size:8px; }
}

/* Premium visual direction: venue storytelling + product UI */
.site-header { border-bottom: 1px solid transparent; }
.site-header:not(.scrolled) .brand,
.site-header:not(.scrolled) .main-nav a,
.site-header:not(.scrolled) .text-button { color: #fff; }
.site-header:not(.scrolled) .brand small { color: rgba(255,255,255,.55); }
.site-header:not(.scrolled) .main-nav a::after { background: var(--lime); }
.site-header:not(.scrolled) .menu-button { color: #fff; }
.site-header.scrolled { box-shadow: 0 10px 35px rgba(16,20,39,.06); }

.hero { min-height: 780px; padding-top: 150px; padding-bottom: 115px; background: #0d1224; isolation: isolate; }
.hero::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background-image: linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px); background-size:70px 70px; mask-image:linear-gradient(90deg,#000,transparent 70%); }
.hero-photo { position:absolute; inset:0; z-index:-2; background-image: linear-gradient(90deg,rgba(8,12,25,.99) 0%,rgba(8,12,25,.92) 31%,rgba(8,12,25,.55) 58%,rgba(8,12,25,.24) 78%,rgba(8,12,25,.63) 100%), linear-gradient(0deg,rgba(8,12,25,.45),rgba(8,12,25,.04) 45%), url('/assets/hero-billiards-v2.webp'); background-size:cover; background-position:center; filter:saturate(.88) contrast(1.04); }
.hero-glow.one { right:-110px; top:-260px; border-color:rgba(113,129,255,.25); box-shadow:inset 0 0 100px rgba(94,109,246,.12); }
.hero-glow.two { border-color:rgba(184,243,74,.12); }
.hero .eyebrow { color:#aeb6c9; text-transform:uppercase; letter-spacing:1.1px; }
.hero .eyebrow > span { background:var(--lime); }
.hero h1 { color:#fff; text-shadow:0 8px 35px rgba(0,0,0,.28); }
.hero h1 em { color:var(--lime); }
.hero-copy > p { color:#b7becd; }
.hero .secondary-link { color:#fff; }
.hero .secondary-link span { color:var(--lime); }
.hero-proof p { color:#fff; }
.hero-proof small { color:#969fb5; }
.avatar-stack span { border-color:#11162a; }
.hero .primary-button { background:var(--lime); color:#11162a; box-shadow:0 14px 35px rgba(184,243,74,.2); }
.hero .primary-button:hover { background:#c8ff61; }
.hero-visual { background:rgba(255,255,255,.97); border-color:rgba(255,255,255,.38); box-shadow:0 38px 100px rgba(0,0,0,.42); transform:perspective(1200px) rotateY(-3deg) rotateX(1deg) translateY(8px); }
.floating-card { border-color:rgba(255,255,255,.7); box-shadow:0 20px 48px rgba(5,8,20,.25); }

.trust-strip { position:relative; z-index:4; margin-top:-62px; background:transparent; }
.trust-strip > p { color:#778096; }
.trust-strip span { background:rgba(18,23,44,.96); border:1px solid rgba(255,255,255,.08); box-shadow:0 18px 45px rgba(11,16,36,.18); backdrop-filter:blur(18px); transition:transform .3s ease,border-color .3s ease; }
.trust-strip span:hover { transform:translateY(-5px); border-color:rgba(184,243,74,.35); }

.solutions { background:#fff; }
.solution-card { border:1px solid transparent; transition:transform .35s ease,box-shadow .35s ease; }
.solution-card:hover { transform:translateY(-7px); box-shadow:0 28px 65px rgba(22,28,70,.13); }
.solution-card.light { border-color:#e7e9f1; background:linear-gradient(145deg,#f7f8fb,#eef0f6); }
.solution-card.blue { background:linear-gradient(145deg,#6c79ff,#4b5ae6); }
.solution-card.dark { background:linear-gradient(145deg,#12172c,#1d2442); }

.solution-type {
  display:flex;
  width:100%;
  min-height:68px;
  padding:10px 16px 10px 10px;
  align-items:center;
  gap:14px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:18px;
  background:rgba(255,255,255,.065);
  box-shadow:inset 0 1px rgba(255,255,255,.04);
}
.solution-type > span {
  display:grid;
  width:46px;
  height:46px;
  flex:0 0 46px;
  place-items:center;
  border-radius:13px;
  background:var(--lime);
  color:#11162a;
  font-size:13px;
  font-weight:900;
  letter-spacing:.5px;
}
.solution-type > div { display:flex; min-width:0; flex-direction:column; gap:3px; }
.solution-type small {
  color:rgba(255,255,255,.58);
  font-size:9px;
  font-weight:600;
  letter-spacing:1.3px;
}
.solution-type strong {
  color:#fff;
  font-size:19px;
  line-height:1.2;
  letter-spacing:.2px;
}
.solution-card.blue .solution-type { border-color:rgba(255,255,255,.22); background:rgba(21,27,61,.14); }
.solution-card.blue .solution-type > span { background:#fff; color:#5362ea; }
.solution-card.light .solution-type { border-color:#dde1ec; background:rgba(255,255,255,.78); box-shadow:0 10px 28px rgba(31,39,85,.06); }
.solution-card.light .solution-type > span { background:#151a30; color:var(--lime); }
.solution-card.light .solution-type small { color:#8990a3; }
.solution-card.light .solution-type strong { color:#151a30; }
.solution-type + h3 { margin-top:26px; }

@media (max-width:760px) {
  .solution-type { min-height:64px; border-radius:16px; }
  .solution-type > span { width:42px; height:42px; flex-basis:42px; }
  .solution-type strong { font-size:18px; }
  .solution-type + h3 { margin-top:23px; }
}

.capabilities { background:linear-gradient(180deg,#f7f8fb 0%,#f2f4f9 100%); }
.capability-stage { background:linear-gradient(145deg,#11162b,#1a2140); border:1px solid rgba(255,255,255,.06); box-shadow:0 34px 80px rgba(17,22,50,.25); }
.stage-screen { box-shadow:0 20px 45px rgba(3,6,18,.16); }

.numbers { position:relative; overflow:hidden; background:linear-gradient(135deg,#0c1124,#192143); }
.numbers::after { content:""; position:absolute; width:440px; height:440px; right:-180px; top:-220px; border:1px solid rgba(184,243,74,.12); border-radius:50%; box-shadow:0 0 0 80px rgba(94,109,246,.04),0 0 0 160px rgba(94,109,246,.025); }
.number-intro,.number-grid { position:relative; z-index:1; }

.about-panel { background:#11162b; color:#fff; box-shadow:0 30px 80px rgba(18,23,50,.15); }
.about-copy > p:not(.kicker) { color:#9fa7ba; }
.about-badges span { background:#202741; color:#dfe3ee; border:1px solid #303851; }
.about-visual { background:linear-gradient(145deg,#6574f7,#4051da); }

.cta-panel { background:linear-gradient(135deg,#10152a,#1b2344); box-shadow:0 28px 70px rgba(15,20,45,.17); }
.site-footer { background:#090d1c; }

@media (max-width:1050px) {
  .site-header:not(.scrolled).menu-open .main-nav { background:#11162b; border:1px solid #29304a; }
  .hero { padding-top:135px; }
  .hero-photo { background-position:60% center; }
}
@media (max-width:760px) {
  .hero { min-height:auto; padding-top:125px; padding-bottom:110px; }
  .hero-photo { background-image:linear-gradient(180deg,rgba(8,12,25,.9) 0%,rgba(8,12,25,.82) 42%,rgba(8,12,25,.95) 100%),url('/assets/hero-billiards-v2.webp'); background-position:64% center; }
  .hero-visual { box-shadow:0 28px 65px rgba(0,0,0,.38); }
  .trust-strip { margin-top:-68px; }
  .trust-strip > p { color:#8991a4; }
}

/* Typography scale v2: stronger, more readable corporate rhythm */
body {
  font-family:var(--font-body);
  font-size: 16px;
  line-height: 1.65;
}

.brand b { font-size: 20px; letter-spacing: -.4px; }
.brand small { font-size: 9px; letter-spacing: 1.35px; }
.main-nav a { font-size: 15px; font-weight: 700; }
.text-button,
.primary-button { font-size: 15px; }
.primary-button.large { font-size: 16px; }

.eyebrow { font-size: 15px; font-weight: 700; }
.hero h1 {
  font-size: clamp(54px, 5vw, 72px);
  line-height: 1.1;
  letter-spacing: -2.4px;
  font-weight: 900;
}
.hero-copy > p { font-size: 17px; line-height: 1.9; max-width: 560px; }
.secondary-link { font-size: 16px; }
.hero-proof p { font-size: 14px; }
.hero-proof small { font-size: 12px; }

.trust-strip > p { font-size: 13px; }
.trust-strip span b { font-size: 17px; }
.trust-strip span small { font-size: 13px; line-height: 1.55; }
.trust-strip span i { font-size: 11px; }

.section-heading > div p,
.kicker { font-size: 12px; }
.section-number { font-size: 14px; }
.section-heading h2,
.capabilities-copy h2,
.number-intro h2,
.about-copy h2 {
  font-size: clamp(38px, 3.55vw, 52px);
  line-height: 1.2;
  letter-spacing: -1.2px;
  font-weight: 900;
}
.section-heading > p,
.capabilities-copy > p:not(.kicker) { font-size: 16px; line-height: 1.9; }

.card-tag { font-size: 12px; }
.solution-card h3 { font-size: 26px; line-height: 1.35; }
.solution-card p { font-size: 15px; line-height: 1.85; }
.solution-card li { font-size: 12px; }
.order-ticket small,
.chart-card small { font-size: 13px; }
.order-ticket span { font-size: 12px; }

.capability-tabs button { font-size: 15px; }
.stage-top small { font-size: 12px; }
.stage-top h3 { font-size: 31px; }
.stage-screen-head b { font-size: 15px; }
.stage-screen-head span { font-size: 11px; }
.stage-metrics small { font-size: 10px; }
.stage-metrics strong { font-size: 18px; }
.stage-chart strong,
.stage-list strong { font-size: 12px; }
.stage-list p { font-size: 11px; }

.number-grid p { font-size: 14px; line-height: 1.7; }
.scenario > span { font-size: 13px; }
.scenario small { font-size: 12px; }
.scenario h3 { font-size: 25px; }
.scenario p { font-size: 15px; line-height: 1.75; }
.scenario > b { font-size: 12px; }

.about-copy > p:not(.kicker) { font-size: 16px; line-height: 2; }
.about-badges span,
.node,
.core-logo { font-size: 13px; }
.cta p { font-size: 16px; }
.cta-button { font-size: 16px; }

.footer-brand p { font-size: 14px; max-width: 280px; }
.footer-brand .footer-brand-copy { max-width: 390px; margin-top: 22px; }
.footer-about-title { margin:0; color:#fff; font-size:22px; font-weight:800; line-height:1.25; }
.footer-brand .footer-brand-copy p { max-width:none; margin:0; color:#8a92a8; font-size:13px; line-height:1.9; }
.footer-brand .footer-brand-copy p + p { margin-top:10px; }
.footer-column b,
.footer-contact b { font-size: 15px; }
.footer-column a,
.footer-column button,
.footer-contact p,
.footer-contact small { font-size: 14px; }
.footer-bottom { font-size: 12px; }

.auth-tabs button { font-size: 16px; }
.auth-heading h2 { font-size: 30px; }
.auth-heading p { font-size: 14px; }
.auth-form > label { font-size: 13px; }
.auth-form input[type=text],
.auth-form input[type=tel],
.auth-form input[type=password],
.auth-form select { font-size: 15px; }
.password-toggle,
.switch-prompt,
.form-message,
.login-options { font-size: 13px; }
.policy-content { font-size: 15px; }
.toast { font-size: 14px; }

/* Merchant console remains information-dense, but no longer reads undersized. */
.portal-sidebar nav button { font-size: 14px; }
.portal-help b { font-size: 14px; }
.portal-help small { font-size: 11px; }
.portal-help a { font-size: 13px; }
.portal-store strong { font-size: 15px; }
.portal-store small,
.trial-pill { font-size: 11px; }
.portal-welcome p { font-size: 12px; }
.portal-welcome h1 { font-size: 32px; }
.portal-welcome span { font-size: 13px; }
.trial-banner b { font-size: 14px; }
.trial-banner p,
.trial-banner button { font-size: 12px; }
.dashboard-metric small { font-size: 11px; }
.dashboard-metric strong { font-size: 22px; }
.dashboard-card-heading strong { font-size: 15px; }
.dashboard-card-heading small,
.dashboard-card-heading select,
.dashboard-card-heading button { font-size: 11px; }
.setup-item b { font-size: 12px; }
.setup-item small { font-size: 10px; }
.demo-table b { font-size: 13px; }
.demo-table small { font-size: 10px; }

@media (max-width: 760px) {
  body { font-size: 16px; }
  .site-header { height: 76px; }
  .brand b { font-size: 19px; }
  .main-nav a { font-size: 16px; }
  .hero h1 { font-size: clamp(43px, 12vw, 48px); letter-spacing: -1.8px; }
  .hero-copy > p { font-size: 17px; line-height: 1.85; }
  .hero .eyebrow { font-size: 14px; }
  .section-heading h2,
  .capabilities-copy h2,
  .number-intro h2,
  .about-copy h2 { font-size: 36px; }
  .section-heading > p,
  .capabilities-copy > p:not(.kicker),
  .about-copy > p:not(.kicker) { font-size: 16px; }
  .solution-card h3 { font-size: 26px; }
  .solution-card p { font-size: 15px; }
  .scenario h3 { font-size: 22px; }
  .scenario p { font-size: 14px; }
  .cta h2 { font-size: 40px; }
  .auth-heading h2 { font-size: 28px; }
  .auth-form > label { font-size: 13px; }
  .code-field { grid-template-columns:minmax(0,1fr) 112px; }
  .send-code-button { font-size:12px; }
}

/* Web-native section headings: no slide-style chapter numbers or labels */
.section-heading {
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.8fr);
  align-items:end;
  gap:72px;
}
.compact-heading {
  display:block;
  text-align:center;
}
.compact-heading h2 {
  max-width:760px;
  margin:0 auto;
}
.capabilities-copy h2 { margin-top:0; }
.number-intro { justify-content:flex-end; }
.about-copy h2 { margin-top:0; }

@media (max-width: 760px) {
  .section-heading { grid-template-columns:1fr; gap:20px; }
  .compact-heading { text-align:left; }
  .compact-heading h2 { margin:0; }
  .number-intro { justify-content:flex-start; }
}

/* A single product capability bridge between the dark hero and white content */
.trust-strip {
  margin-top:-82px;
  padding:0 max(5vw, calc((100vw - 1240px)/2)) 52px;
  background:linear-gradient(180deg,transparent 0 78px,#fff 78px 100%);
}
.trust-strip > p {
  margin:0 0 14px;
  color:rgba(255,255,255,.66);
  text-shadow:0 2px 18px rgba(0,0,0,.5);
}
.trust-strip > div {
  gap:1px;
  padding:1px;
  overflow:hidden;
  border:1px solid rgba(226,229,238,.9);
  border-radius:24px;
  background:#e5e8f0;
  box-shadow:0 24px 60px rgba(17,23,54,.14);
}
.trust-strip span {
  min-height:118px;
  padding:24px 25px;
  border:0;
  border-radius:0;
  background:rgba(255,255,255,.98);
  color:var(--ink);
  grid-template-columns:48px 1fr;
  column-gap:16px;
  box-shadow:none;
  backdrop-filter:none;
  transition:background .25s ease;
}
.trust-strip span:hover {
  transform:none;
  border-color:transparent;
  background:#f7f8fc;
}
.trust-strip span i {
  width:46px;
  height:46px;
  border-radius:14px;
  background:#eef0ff;
  color:#5868ed;
}
.trust-strip span i svg {
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.trust-strip span b { font-size:18px; }
.trust-strip span small { color:#72798d; font-size:13px; }

@media (max-width: 760px) {
  .trust-strip {
    margin-top:-72px;
    padding:0 20px 38px;
    background:linear-gradient(180deg,transparent 0 72px,#fff 72px 100%);
  }
  .trust-strip > p { margin-bottom:12px; }
  .trust-strip > div { gap:1px; }
  .trust-strip span { min-height:102px; padding:19px 18px; }
}

/* Customer cases: real-photo slots with an honest, polished fallback */
.cases {
  padding-top:100px;
  padding-bottom:110px;
  background:linear-gradient(180deg,#f5f6fa 0%,#f8f9fc 100%);
}
.case-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:70px;
  margin-bottom:46px;
}
.case-heading h2 {
  margin:22px 0 0;
  font-size:clamp(38px,3.55vw,52px);
  line-height:1.2;
  letter-spacing:-1.2px;
}
.case-heading > p {
  max-width:440px;
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.9;
}
.case-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}
.case-card {
  overflow:hidden;
  border:1px solid #e4e7ef;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 45px rgba(22,28,65,.07);
  transition:transform .3s ease,box-shadow .3s ease;
}
.case-card:hover {
  transform:translateY(-6px);
  box-shadow:0 28px 60px rgba(22,28,65,.12);
}
.case-photo {
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  background:radial-gradient(circle at 75% 20%,rgba(103,118,247,.34),transparent 28%),linear-gradient(145deg,#11172d,#252e56);
}
.case-photo::after {
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:45%;
  background:linear-gradient(transparent,rgba(7,11,25,.58));
  pointer-events:none;
}
.case-photo img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .3s ease,transform .5s ease;
}
.case-photo.has-image img { opacity:1; }
.case-card:hover .case-photo.has-image img { transform:scale(1.035); }
.case-photo.has-image .case-placeholder { display:none; }
.case-placeholder {
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#dce1f2;
}
.case-placeholder svg {
  width:38px;
  height:38px;
  margin-bottom:4px;
  fill:none;
  stroke:#91a0ff;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.case-placeholder b { font-size:15px; }
.case-placeholder small { color:#8992aa; font-size:12px; }
.case-type {
  position:absolute;
  left:18px;
  bottom:16px;
  z-index:2;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(12,17,37,.68);
  color:#fff;
  font-size:12px;
  font-weight:700;
  backdrop-filter:blur(12px);
}
.case-body { padding:25px 25px 28px; }
.case-body h3 { margin:0 0 11px; font-size:23px; line-height:1.4; }
.case-body p { margin:0; color:var(--muted); font-size:14px; line-height:1.8; }
.case-link { display:inline-flex; align-items:center; gap:9px; margin-top:19px; color:var(--blue); font-size:12px; font-weight:800; }
.case-link span { transition:transform .25s ease; }
.case-link:hover span { transform:translateX(4px); }

/* Partner cases: business metrics with a compact, image-backed logo wall */
.partner-cases {
  position:relative;
  overflow:hidden;
  padding-top:104px;
  padding-bottom:112px;
  background:
    radial-gradient(circle at 16% 10%,rgba(184,243,74,.11),transparent 25%),
    radial-gradient(circle at 88% 18%,rgba(94,109,246,.16),transparent 32%),
    linear-gradient(145deg,#f9fbfd 0%,#eef4fb 55%,#e8eff9 100%);
}
.partner-cases::before {
  content:"";
  position:absolute;
  right:-150px;
  bottom:-210px;
  width:540px;
  height:540px;
  border:1px solid rgba(94,109,246,.08);
  border-radius:50%;
  box-shadow:0 0 0 80px rgba(94,109,246,.025),0 0 0 160px rgba(94,109,246,.018);
}
.partner-cases-heading {
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:70px;
  margin-bottom:42px;
}
.partner-cases-heading h2 {
  margin:20px 0 0;
  font-family:var(--font-display);
  font-size:clamp(42px,4vw,58px);
  font-weight:400;
  line-height:1.08;
  letter-spacing:-1.5px;
}
.partner-cases-heading > p {
  max-width:470px;
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.9;
}
.partner-metrics {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-bottom:24px;
}
.partner-metrics article {
  display:flex;
  min-height:148px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(94,109,246,.13);
  border-radius:23px;
  background:rgba(255,255,255,.76);
  box-shadow:0 18px 44px rgba(34,52,101,.075);
  backdrop-filter:blur(12px);
}
.partner-metrics strong {
  color:#28449d;
  font-size:clamp(44px,5vw,66px);
  font-weight:900;
  line-height:1;
  letter-spacing:-2px;
}
.partner-metrics strong em {
  margin-left:3px;
  color:var(--blue);
  font-size:.7em;
  font-style:normal;
}
.partner-metrics span {
  margin-top:12px;
  color:var(--ink);
  font-size:21px;
  font-weight:800;
}
.partner-logo-wall {
  position:relative;
  z-index:1;
  height:315px;
  overflow:hidden;
  border:1px solid rgba(94,109,246,.12);
  border-radius:26px;
  background:#fff;
  box-shadow:0 24px 60px rgba(35,52,97,.1);
}
.partner-logo-wall img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 70%;
}
.partner-note {
  position:relative;
  z-index:1;
  margin:18px 2px 0;
  color:#8a93a8;
  font-size:12px;
  text-align:right;
}

.smart-screen-solution-entry {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  min-height:410px;
  margin-top:20px;
  overflow:hidden;
  border:1px solid #29314e;
  border-radius:28px;
  background:radial-gradient(circle at 88% 12%,rgba(103,118,247,.32),transparent 31%),linear-gradient(125deg,#0b1022,#171e3b);
  color:#fff;
  box-shadow:0 28px 70px rgba(14,20,48,.19);
}
.smart-screen-entry-copy { display:flex; flex-direction:column; justify-content:center; padding:54px 58px; }
.smart-screen-entry-copy > span { color:#aab3c9; font-size:9px; font-weight:800; letter-spacing:1.1px; }
.smart-screen-entry-copy > span i { display:inline-block; width:7px; height:7px; margin-right:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 5px rgba(184,243,74,.1); }
.smart-screen-entry-copy h3 { margin:22px 0 17px; font-family:var(--font-display); font-size:clamp(36px,3.2vw,48px); font-weight:400; line-height:1.18; }
.smart-screen-entry-copy p { max-width:580px; margin:0; color:#a8b0c3; font-size:14px; line-height:1.85; }
.smart-screen-entry-copy > div { display:flex; flex-wrap:wrap; gap:8px; margin-top:27px; }
.smart-screen-entry-copy > div b { padding:8px 11px; border:1px solid rgba(255,255,255,.12); border-radius:999px; background:rgba(255,255,255,.045); color:#dbe0ed; font-size:10px; }
.smart-screen-entry-visual { position:relative; display:grid; min-height:410px; place-items:center; overflow:hidden; background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.01)); }
.smart-screen-entry-visual::before { content:""; position:absolute; width:360px; height:360px; border:1px solid rgba(184,243,74,.13); border-radius:50%; box-shadow:0 0 0 60px rgba(184,243,74,.025); }
.smart-display-pair { position:relative; z-index:1; display:flex; align-items:flex-end; justify-content:center; gap:20px; transition:transform .45s ease; }
.smart-display-device { position:relative; width:158px; height:270px; margin:0; padding:6px 6px 14px; border:1px solid #343b4d; border-radius:9px 9px 4px 4px; background:linear-gradient(145deg,#222838,#0d111b); box-shadow:0 27px 34px rgba(0,0,0,.36); }
.smart-display-device::before { content:""; position:absolute; left:50%; bottom:4px; width:4px; height:4px; border-radius:50%; background:#687185; transform:translateX(-50%); }
.smart-display-device::after { content:""; position:absolute; left:50%; bottom:-10px; width:116%; height:10px; border-radius:3px 3px 8px 8px; background:linear-gradient(#343b4b,#131721); box-shadow:0 8px 12px rgba(0,0,0,.28); transform:translateX(-50%); }
.smart-display-device img { display:block; width:100%; height:100%; border-radius:3px; object-fit:cover; object-position:top center; }
.smart-display-device:nth-child(2) { transform:translateY(8px); }
.smart-screen-entry-visual > span { position:absolute; z-index:2; right:25px; bottom:22px; display:flex; align-items:center; gap:13px; padding:11px 14px; border:1px solid rgba(255,255,255,.13); border-radius:999px; background:rgba(9,13,29,.72); color:#fff; font-size:11px; font-weight:800; backdrop-filter:blur(12px); }
.smart-screen-entry-visual > span b { color:var(--lime); font-size:17px; }
.smart-screen-solution-entry:hover .smart-display-pair { transform:translateY(-8px) scale(1.025); }
.catalog-detail-link { display:inline-flex; margin-top:11px; color:var(--lime); font-size:10px; font-weight:800; }

@media (max-width: 1050px) {
  .case-grid { grid-template-columns:1fr 1fr; }
  .case-card:first-child { grid-column:1/-1; }
  .case-card:first-child .case-photo { aspect-ratio:2/1; }
  .partner-cases-heading { align-items:flex-start; }
}

@media (max-width: 760px) {
  .cases { padding-top:82px; padding-bottom:88px; }
  .case-heading { display:block; margin-bottom:34px; }
  .case-heading h2 { font-size:36px; }
  .case-heading > p { margin-top:20px; font-size:16px; }
  .case-grid { grid-template-columns:1fr; }
  .case-card:first-child { grid-column:auto; }
  .case-card:first-child .case-photo,
  .case-photo { aspect-ratio:16/10; }
  .case-body h3 { font-size:22px; }
  .partner-cases { padding-top:82px; padding-bottom:88px; }
  .partner-cases-heading { display:block; margin-bottom:30px; }
  .partner-cases-heading h2 { margin-top:16px; font-size:38px; }
  .partner-cases-heading > p { margin-top:18px; font-size:14px; }
  .partner-metrics { grid-template-columns:1fr; gap:10px; margin-bottom:16px; }
  .partner-metrics article { min-height:92px; flex-direction:row; justify-content:space-between; padding:0 22px; border-radius:18px; }
  .partner-metrics strong { font-size:42px; }
  .partner-metrics span { margin-top:0; font-size:18px; }
  .partner-logo-wall { height:235px; overflow-x:auto; overflow-y:hidden; border-radius:20px; scrollbar-width:none; }
  .partner-logo-wall::-webkit-scrollbar { display:none; }
  .partner-logo-wall img { position:static; width:900px; max-width:none; height:235px; object-fit:cover; object-position:center 70%; }
  .partner-note { margin-top:13px; font-size:11px; text-align:left; }
}

/* Product interface previews: one Web view and two mobile views */
.product-media {
  padding-top:108px;
  padding-bottom:116px;
  background:#fff;
}
.product-media-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:72px;
  margin-bottom:48px;
}
.product-media-heading h2 {
  margin:22px 0 0;
  font-size:clamp(38px,3.55vw,52px);
  line-height:1.2;
  letter-spacing:-1.2px;
}
.product-media-heading > p {
  max-width:440px;
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.9;
}
.product-media-grid {
  display:grid;
  grid-template-columns:minmax(0,1.48fr) minmax(330px,.72fr);
  gap:24px;
  align-items:stretch;
}
.web-showcase,
.mobile-showcase {
  overflow:hidden;
  border-radius:28px;
}
.web-showcase {
  padding:28px;
  border:1px solid #e5e8f0;
  background:linear-gradient(145deg,#f7f8fb 0%,#eef1f7 100%);
}
.mobile-showcase {
  padding:28px 28px 30px;
  background:radial-gradient(circle at 90% 8%,rgba(99,116,255,.3),transparent 35%),linear-gradient(145deg,#11162c,#202b52);
  color:#fff;
}
.showcase-label {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-bottom:24px;
}
.showcase-label > div {
  display:flex;
  flex-direction:column;
  gap:5px;
}
.showcase-label span {
  color:#6675ef;
  font-size:11px;
  font-weight:800;
  letter-spacing:1.7px;
}
.showcase-label b {
  color:var(--ink);
  font-size:22px;
  line-height:1.35;
}
.showcase-label small {
  color:#9198aa;
  font-size:12px;
  white-space:nowrap;
}
.mobile-showcase .showcase-label span { color:#aab5ff; }
.mobile-showcase .showcase-label b { color:#fff; }
.mobile-showcase .showcase-label small { color:#929cba; }
.browser-preview {
  overflow:hidden;
  border:1px solid #dde1eb;
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 45px rgba(20,27,63,.13);
}
.browser-bar {
  display:flex;
  align-items:center;
  gap:7px;
  height:43px;
  padding:0 15px;
  border-bottom:1px solid #e9ebf1;
  background:#fafbfc;
}
.browser-bar i {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#d7dbe4;
}
.browser-bar i:first-child { background:#ff8f8f; }
.browser-bar i:nth-child(2) { background:#ffc963; }
.browser-bar i:nth-child(3) { background:#65d29b; }
.browser-bar span {
  margin-left:8px;
  color:#a0a6b6;
  font-size:11px;
  letter-spacing:.3px;
}
.system-media-slot {
  position:relative;
  overflow:hidden;
  background:#f4f5f8;
}
.web-media-slot { aspect-ratio:16/9; }
.system-media-slot img {
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .3s ease;
}
.system-media-slot.has-image img { opacity:1; }
.system-media-slot.has-image .system-placeholder { display:none; }
.system-placeholder {
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:24px;
  text-align:center;
  color:#566075;
  background:radial-gradient(circle at 68% 30%,rgba(102,118,246,.16),transparent 26%),linear-gradient(145deg,#f7f8fb,#edf0f6);
}
.system-placeholder svg {
  width:42px;
  height:42px;
  margin-bottom:4px;
  fill:none;
  stroke:#6675ef;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.system-placeholder b { font-size:15px; }
.system-placeholder small { color:#8b93a6; font-size:12px; }
.phone-previews {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
  gap:14px;
  margin-top:29px;
}
.phone-preview {
  position:relative;
  padding:7px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:28px;
  background:#0b0f20;
  box-shadow:0 20px 40px rgba(0,0,0,.27);
}
.phone-preview:nth-child(2) { margin-top:27px; }
.phone-speaker {
  position:absolute;
  top:11px;
  left:50%;
  z-index:3;
  width:34%;
  height:13px;
  border-radius:999px;
  background:#0b0f20;
  transform:translateX(-50%);
}
.mobile-media-slot {
  aspect-ratio:750/1624;
  border-radius:21px;
  background:#f3f5f9;
}
.mobile-media-slot .system-placeholder {
  gap:6px;
  padding:15px 8px;
}
.mobile-media-slot .system-placeholder svg {
  width:30px;
  height:30px;
}
.mobile-media-slot .system-placeholder b { font-size:12px; }
.mobile-media-slot .system-placeholder small {
  max-width:90px;
  font-size:10px;
  line-height:1.5;
}

@media (max-width: 1050px) {
  .product-media-grid { grid-template-columns:1fr; }
  .mobile-showcase { padding-bottom:38px; }
  .phone-previews {
    max-width:560px;
    margin-right:auto;
    margin-left:auto;
  }
}

@media (max-width: 760px) {
  .product-media { padding-top:82px; padding-bottom:88px; }
  .product-media-heading { display:block; margin-bottom:34px; }
  .product-media-heading h2 { font-size:36px; }
  .product-media-heading > p { margin-top:20px; font-size:16px; }
  .product-media-grid { gap:16px; }
  .web-showcase,
  .mobile-showcase { padding:20px; border-radius:22px; }
  .showcase-label { align-items:flex-start; margin-bottom:18px; }
  .showcase-label b { font-size:19px; }
  .showcase-label small { display:none; }
  .browser-bar { height:36px; padding:0 12px; }
  .browser-bar span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .system-placeholder { padding:14px; }
  .web-media-slot .system-placeholder svg { width:32px; height:32px; }
  .web-media-slot .system-placeholder b { font-size:13px; }
  .web-media-slot .system-placeholder small { font-size:10px; }
  .phone-previews { gap:10px; margin-top:24px; }
  .phone-preview { padding:5px; border-radius:24px; }
  .phone-preview:nth-child(2) { margin-top:18px; }
  .phone-speaker { top:8px; height:10px; }
  .mobile-media-slot { border-radius:18px; }
}

/* Product proof: factual service capabilities in a lighter, more visual layout */
.numbers {
  position:relative;
  overflow:hidden;
  padding-top:86px;
  padding-bottom:82px;
  background:linear-gradient(180deg,#f4f7fb 0%,#eef3f9 100%);
  color:var(--ink);
}
.numbers::before {
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  left:50%;
  top:-340px;
  border-radius:50%;
  background:rgba(103,118,247,.12);
  filter:blur(10px);
  transform:translateX(-50%);
}
.numbers::after { display:none; }
.number-grid {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0;
  margin-top:0;
  border:0;
}
.number-grid article,
.number-grid article:not(:first-child) {
  position:relative;
  display:flex;
  min-width:0;
  padding:0 22px;
  border:0;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.number-grid article:not(:last-child)::after {
  content:"";
  position:absolute;
  top:42px;
  right:0;
  width:1px;
  height:150px;
  background:linear-gradient(transparent,#d9dfeb 24%,#d9dfeb 76%,transparent);
}
.number-icon {
  position:relative;
  display:grid;
  width:92px;
  height:92px;
  margin-bottom:23px;
  place-items:center;
  border:1px solid rgba(101,117,239,.13);
  border-radius:28px;
  background:linear-gradient(145deg,#fff,#e8edff);
  color:#6474ef;
  box-shadow:0 14px 34px rgba(40,52,111,.12);
  transform:rotate(4deg);
}
.number-icon::after {
  content:"";
  position:absolute;
  right:-6px;
  top:-7px;
  width:25px;
  height:25px;
  border:4px solid #f4f7fb;
  border-radius:50%;
  background:var(--lime);
}
.number-grid article:nth-child(even) .number-icon {
  border-radius:50%;
  transform:rotate(-3deg);
}
.number-icon svg {
  width:40px;
  height:40px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.number-grid strong {
  display:flex;
  min-height:68px;
  align-items:baseline;
  justify-content:center;
  color:#12172b;
  font-size:clamp(38px,3.8vw,56px);
  font-weight:850;
  letter-spacing:-2.3px;
  line-height:1.1;
}
.number-grid strong em {
  margin-left:4px;
  color:#6675ef;
  font-size:19px;
  font-style:normal;
  letter-spacing:0;
}
.number-grid article > i {
  width:30px;
  height:3px;
  margin:13px 0 14px;
  border-radius:99px;
  background:#cbd1de;
}
.number-grid p {
  max-width:210px;
  margin:0;
  color:#687188;
  font-size:13px;
  line-height:1.7;
}
.number-actions {
  position:relative;
  z-index:1;
  display:flex;
  width:max-content;
  margin:45px auto 0;
  overflow:hidden;
  border:1px solid #6675ef;
  border-radius:999px;
  background:#fff;
  box-shadow:0 12px 28px rgba(37,48,105,.09);
}
.number-actions a,
.number-actions button {
  display:flex;
  min-width:176px;
  height:52px;
  padding:0 24px;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:750;
}
.number-actions a { color:#5363e6; }
.number-actions button { gap:13px; border-radius:999px; background:#6675ef; color:#fff; }
.number-actions button:hover { background:#5363e6; }

@media (max-width: 1120px) {
  .number-grid { grid-template-columns:repeat(6,1fr); row-gap:52px; }
  .number-grid article:nth-child(1),
  .number-grid article:nth-child(2),
  .number-grid article:nth-child(3) { grid-column:span 2; }
  .number-grid article:nth-child(3)::after { display:none; }
  .number-grid article:nth-child(4) { grid-column:2/span 2; }
  .number-grid article:nth-child(5) { grid-column:4/span 2; }
  .number-grid article:nth-child(4)::after { display:block; }
}

@media (max-width: 760px) {
  .numbers { padding-top:70px; padding-bottom:72px; }
  .number-grid { grid-template-columns:1fr 1fr; column-gap:10px; row-gap:42px; }
  .number-grid article,
  .number-grid article:not(:first-child) { padding:0 8px; }
  .number-grid article:nth-child(1),
  .number-grid article:nth-child(2),
  .number-grid article:nth-child(3),
  .number-grid article:nth-child(4) { grid-column:auto; }
  .number-grid article:nth-child(3)::after { display:block; }
  .number-grid article:nth-child(even)::after { display:none; }
  .number-grid article:nth-child(5) { grid-column:1/-1; }
  .number-grid article:nth-child(5)::after { display:none; }
  .number-grid article:not(:last-child)::after { top:28px; height:132px; }
  .number-icon { width:74px; height:74px; margin-bottom:18px; border-radius:23px; }
  .number-icon svg { width:33px; height:33px; }
  .number-icon::after { width:21px; height:21px; border-width:3px; }
  .number-grid strong { min-height:52px; font-size:38px; }
  .number-grid strong em { font-size:16px; }
  .number-grid article > i { margin:10px 0 12px; }
  .number-grid p { max-width:155px; font-size:12px; }
  .number-actions { width:100%; margin-top:40px; }
  .number-actions a,
  .number-actions button { min-width:0; height:50px; padding:0 12px; flex:1; font-size:13px; }
}

/* Chain-brand customization */
.custom-solution {
  padding-top:0;
  padding-bottom:110px;
  background:#fff;
}
.custom-panel {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(520px,1.1fr);
  gap:68px;
  min-height:620px;
  padding:68px;
  overflow:hidden;
  border-radius:32px;
  background:radial-gradient(circle at 9% 10%,rgba(98,116,246,.25),transparent 28%),linear-gradient(145deg,#0e142a 0%,#171f3e 55%,#202b54 100%);
  color:#fff;
  box-shadow:0 34px 80px rgba(17,23,55,.2);
}
.custom-panel::before {
  content:"";
  position:absolute;
  width:440px;
  height:440px;
  right:-170px;
  bottom:-250px;
  border:1px solid rgba(184,243,74,.16);
  border-radius:50%;
  box-shadow:0 0 0 70px rgba(103,118,247,.05),0 0 0 140px rgba(103,118,247,.035);
}
.custom-copy {
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.custom-tag {
  width:max-content;
  padding:9px 14px;
  border:1px solid rgba(190,244,86,.32);
  border-radius:999px;
  background:rgba(184,243,74,.08);
  color:var(--lime);
  font-size:12px;
  font-weight:800;
  letter-spacing:.8px;
}
.custom-copy h2 {
  margin:24px 0 20px;
  color:#fff;
  font-size:clamp(40px,3.7vw,56px);
  line-height:1.18;
  letter-spacing:-1.7px;
}
.custom-copy > p {
  max-width:520px;
  margin:0;
  color:#abb3cb;
  font-size:16px;
  line-height:1.9;
}
.custom-actions {
  display:flex;
  align-items:center;
  gap:22px;
  margin-top:34px;
}
.custom-actions button {
  display:flex;
  height:56px;
  padding:0 25px;
  align-items:center;
  gap:24px;
  border-radius:15px;
  background:var(--lime);
  color:#11172b;
  font-size:15px;
  font-weight:850;
  box-shadow:0 15px 34px rgba(184,243,74,.15);
}
.custom-actions button:hover { transform:translateY(-2px); background:#c6ff58; }
.custom-actions a { color:#fff; font-size:14px; font-weight:750; }
.custom-copy > small {
  max-width:510px;
  margin-top:25px;
  color:#6f7895;
  font-size:11px;
  line-height:1.7;
}
.custom-blueprint {
  position:relative;
  z-index:1;
  align-self:center;
  padding:30px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:rgba(255,255,255,.065);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 28px 60px rgba(2,5,18,.22);
  backdrop-filter:blur(18px);
}
.custom-blueprint-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:24px;
}
.custom-blueprint-head > div { display:flex; flex-direction:column; gap:6px; }
.custom-blueprint-head small { color:#8993b0; font-size:11px; letter-spacing:1px; }
.custom-blueprint-head strong { font-size:23px; }
.custom-blueprint-head > span {
  padding:8px 11px;
  border-radius:999px;
  background:rgba(184,243,74,.12);
  color:var(--lime);
  font-size:11px;
  font-weight:800;
}
.custom-feature-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.custom-feature-grid article {
  display:flex;
  min-width:0;
  padding:20px 16px;
  align-items:center;
  gap:13px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:17px;
  background:rgba(10,15,35,.4);
  transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.custom-feature-grid article:hover {
  transform:translateY(-3px);
  border-color:rgba(184,243,74,.22);
  background:rgba(10,15,35,.62);
}
.custom-feature-grid i {
  display:grid;
  width:43px;
  height:43px;
  flex:0 0 43px;
  place-items:center;
  border-radius:13px;
  background:#222c52;
  color:#99a7ff;
  font-style:normal;
}
.custom-feature-grid svg {
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.custom-feature-grid article div { display:flex; min-width:0; flex-direction:column; gap:6px; }
.custom-feature-grid b { font-size:15px; }
.custom-feature-grid small { color:#828ba7; font-size:11px; line-height:1.5; }
.custom-foundation {
  display:flex;
  margin-top:20px;
  padding:16px 17px;
  align-items:center;
  justify-content:center;
  gap:12px;
  border-radius:15px;
  background:rgba(103,118,247,.13);
  color:#9ca6c3;
  font-size:11px;
}
.custom-foundation i { width:24px; height:1px; background:#485271; }
.custom-foundation strong { color:#fff; font-size:12px; }

@media (max-width: 1120px) {
  .custom-panel { grid-template-columns:1fr; gap:50px; padding:58px; }
  .custom-copy { max-width:720px; }
}

@media (max-width: 760px) {
  .custom-solution { padding-bottom:88px; }
  .custom-panel { min-height:0; gap:42px; padding:34px 20px 24px; border-radius:24px; }
  .custom-copy h2 { margin-top:21px; font-size:35px; letter-spacing:-1px; }
  .custom-copy > p { font-size:15px; line-height:1.8; }
  .custom-actions { align-items:flex-start; flex-direction:column; gap:18px; margin-top:28px; }
  .custom-actions button { width:100%; justify-content:space-between; }
  .custom-copy > small { margin-top:20px; }
  .custom-blueprint { padding:18px; border-radius:20px; }
  .custom-blueprint-head strong { font-size:20px; }
  .custom-feature-grid { grid-template-columns:1fr; }
  .custom-feature-grid article { padding:17px 14px; }
  .custom-foundation { gap:8px; padding:14px 9px; font-size:9px; }
  .custom-foundation i { width:14px; }
  .custom-foundation strong { font-size:10px; }
}

/* Signature navigation and section markers: light-orbit language, no plain rules */
.main-nav {
  gap:8px;
  padding:5px;
  border:1px solid rgba(255,255,255,.055);
  border-radius:999px;
  background:rgba(10,14,31,.16);
  backdrop-filter:blur(10px);
}
.main-nav a {
  z-index:0;
  padding:10px 14px 10px 21px;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:999px;
  transition:color .25s ease,border-color .25s ease,background .25s ease,box-shadow .25s ease,transform .25s ease;
}
.main-nav a::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:radial-gradient(circle at 22% 20%,rgba(184,243,74,.16),transparent 36%),rgba(255,255,255,.06);
  opacity:0;
  transform:scale(.82);
  transition:opacity .25s ease,transform .25s ease;
}
.main-nav a::after {
  content:"";
  position:absolute;
  left:8px;
  top:50%;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--lime);
  box-shadow:0 0 0 3px rgba(184,243,74,.1),0 0 14px rgba(184,243,74,.7);
  opacity:0;
  transform:translate(-4px,-50%) scale(.3);
  transition:opacity .25s ease,transform .25s ease;
}
.main-nav a:hover,
.main-nav a:focus-visible {
  border-color:rgba(255,255,255,.1);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 22px rgba(2,5,18,.12);
  transform:translateY(-1px);
}
.main-nav a:hover::before,
.main-nav a:focus-visible::before { opacity:1; transform:scale(1); }
.main-nav a:hover::after,
.main-nav a:focus-visible::after { opacity:1; transform:translate(0,-50%) scale(1); }
.site-header.scrolled .main-nav {
  border-color:#e6e9f2;
  background:rgba(246,247,252,.82);
}
.site-header.scrolled .main-nav a::before {
  background:radial-gradient(circle at 20% 20%,rgba(103,118,247,.13),transparent 38%),rgba(255,255,255,.86);
}
.site-header.scrolled .main-nav a::after {
  background:#6675ef;
  box-shadow:0 0 0 3px rgba(103,118,247,.1),0 0 12px rgba(103,118,247,.45);
}
.site-header.scrolled .main-nav a:hover,
.site-header.scrolled .main-nav a:focus-visible {
  border-color:rgba(103,118,247,.14);
  color:#3343c8;
  box-shadow:inset 0 1px 0 #fff,0 8px 22px rgba(41,53,121,.08);
}
.eyebrow { gap:12px; }
.eyebrow > span {
  position:relative;
  width:36px;
  height:18px;
  flex:0 0 36px;
  background:none !important;
  color:#6675ef;
}
.eyebrow > span::before {
  content:"";
  position:absolute;
  left:2px;
  top:3px;
  width:12px;
  height:12px;
  border:1.5px solid currentColor;
  border-radius:4px;
  box-shadow:0 0 14px rgba(103,118,247,.2);
  transform:rotate(45deg);
}
.eyebrow > span::after {
  content:"";
  position:absolute;
  left:21px;
  top:6px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:currentColor;
  box-shadow:10px -4px 0 -2px currentColor,0 0 13px currentColor;
}
.hero .eyebrow > span,
.eyebrow.light > span { color:var(--lime); }

.hero h1,
.section-heading h2,
.capabilities-copy h2,
.product-media-heading h2,
.case-heading h2,
.custom-copy h2,
.about-copy h2,
.cta h2 {
  font-family:var(--font-display);
  font-weight:400;
  letter-spacing:.2px;
}
.hero h1 { letter-spacing:.6px; }
.custom-copy h2,
.cta h2 { letter-spacing:.35px; }

@media (max-width: 1050px) {
  .main-nav { padding:12px; border-radius:20px; }
  .main-nav a { width:100%; padding:12px 14px 12px 25px; }
}

/* Scenario gallery: dense product storytelling instead of report-like rows */
.scenarios {
  display:grid;
  grid-template-columns:minmax(330px,.7fr) minmax(0,1.3fr);
  gap:60px;
  padding-top:112px;
  padding-bottom:118px;
  align-items:start;
  background:linear-gradient(180deg,#f7f8fb 0%,#f3f5f9 100%);
}
.scenario-intro {
  position:sticky;
  top:120px;
  padding-top:12px;
}
.scenario-intro h2 {
  margin:25px 0 22px;
  font-family:var(--font-display);
  font-size:clamp(40px,3.45vw,50px);
  font-weight:400;
  line-height:1.18;
  letter-spacing:.2px;
}
.scenario-intro h2 em { color:#6675ef; font-style:normal; }
.scenario-intro > p {
  max-width:410px;
  margin:0;
  color:#70788d;
  font-size:15px;
  line-height:1.9;
}
.scenario-keywords {
  display:flex;
  max-width:380px;
  margin-top:31px;
  flex-wrap:wrap;
  gap:8px;
}
.scenario-keywords span {
  padding:8px 12px;
  border:1px solid #e0e4ee;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:#7b8398;
  font-size:11px;
  font-weight:700;
}
.scenario-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.scene-card {
  position:relative;
  display:flex;
  min-width:0;
  min-height:286px;
  padding:25px;
  overflow:hidden;
  border:1px solid #e2e6ef;
  border-radius:23px;
  background:rgba(255,255,255,.92);
  flex-direction:column;
  box-shadow:0 16px 42px rgba(31,40,86,.055);
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.scene-card:hover {
  transform:translateY(-6px);
  border-color:#d5daf0;
  box-shadow:0 25px 55px rgba(31,40,86,.11);
}
.scene-featured {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:40px;
  min-height:330px;
  padding:34px;
  border-color:rgba(255,255,255,.07);
  background:radial-gradient(circle at 12% 10%,rgba(103,118,247,.25),transparent 31%),linear-gradient(140deg,#10162d,#1b2549);
  color:#fff;
  box-shadow:0 26px 65px rgba(19,25,59,.18);
}
.scene-featured::after {
  content:"";
  position:absolute;
  right:-100px;
  top:-180px;
  width:360px;
  height:360px;
  border:1px solid rgba(184,243,74,.12);
  border-radius:50%;
  box-shadow:0 0 0 55px rgba(103,118,247,.035),0 0 0 110px rgba(103,118,247,.02);
}
.scene-card-copy { position:relative; z-index:1; display:flex; flex-direction:column; }
.scene-meta {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
}
.scene-meta span {
  color:#6877ef;
  font-size:11px;
  font-weight:850;
  letter-spacing:1.2px;
}
.scene-meta b { color:#8b93a7; font-size:11px; }
.scene-featured .scene-meta span { color:var(--lime); }
.scene-featured .scene-meta b { color:#929bb7; }
.scene-icon {
  display:grid;
  width:45px;
  height:45px;
  margin:28px 0 22px;
  place-items:center;
  border-radius:14px;
  background:#eef0ff;
  color:#6675ef;
  font-style:normal;
}
.scene-icon svg {
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.scene-featured .scene-icon { margin:27px 0 21px; background:rgba(184,243,74,.12); color:var(--lime); }
.scene-card h3 {
  margin:0;
  color:#151a2d;
  font-size:20px;
  line-height:1.45;
  letter-spacing:-.4px;
}
.scene-featured h3 { color:#fff; font-size:30px; line-height:1.3; letter-spacing:-.8px; }
.scene-card p {
  margin:13px 0 0;
  color:#747c91;
  font-size:12px;
  line-height:1.8;
}
.scene-featured p { max-width:330px; color:#a3abc2; font-size:13px; }
.scene-result {
  width:max-content;
  margin-top:auto;
  padding:7px 10px;
  border-radius:999px;
  background:#f1f3f8;
  color:#646d84;
  font-size:10px;
  font-weight:750;
}
.scene-table-demo {
  position:relative;
  z-index:1;
  align-self:center;
  width:100%;
  padding:22px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;
  background:rgba(247,249,253,.98);
  color:#161b30;
  box-shadow:0 20px 45px rgba(3,7,23,.22);
  transform:rotate(1.2deg);
}
.scene-table-head {
  display:flex;
  margin-bottom:17px;
  align-items:center;
  justify-content:space-between;
  font-size:11px;
  font-weight:800;
}
.scene-table-head i { padding:6px 8px; border-radius:8px; background:#eceeff; color:#6170ec; font-size:9px; font-style:normal; }
.scene-table-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.scene-table-grid b {
  display:flex;
  min-height:63px;
  align-items:center;
  justify-content:center;
  border:1px solid #e5e8ef;
  border-radius:11px;
  background:#f1f3f7;
  flex-direction:column;
  font-size:11px;
}
.scene-table-grid small { margin-top:5px; color:#949bad; font-size:7px; font-weight:500; }
.scene-table-grid .busy { border-color:#6675ef; background:#6675ef; color:#fff; }
.scene-table-grid .busy small { color:#dde1ff; }
.scene-table-grid .reserved { border-color:#ffe0a6; background:#fff7e9; color:#d58b1c; }
.scene-table-grid .reserved small { color:#ca984c; }
.scene-live { display:flex; margin-top:15px; align-items:center; gap:8px; color:#81899f; font-size:9px; }
.scene-live i { width:7px; height:7px; border-radius:50%; background:#45cd90; box-shadow:0 0 0 5px rgba(69,205,144,.13); }

@media (max-width: 1120px) {
  .scenarios { grid-template-columns:1fr; gap:44px; }
  .scenario-intro { position:relative; top:auto; padding-top:0; }
  .scenario-intro > p { max-width:650px; }
}

@media (max-width: 760px) {
  .scenarios { gap:34px; padding-top:84px; padding-bottom:88px; }
  .scenario-intro h2 { margin-top:22px; font-size:36px; }
  .scenario-intro > p { font-size:15px; }
  .scenario-keywords { margin-top:24px; }
  .scenario-grid { grid-template-columns:1fr; }
  .scene-card { min-height:250px; padding:24px; }
  .scene-featured { grid-column:auto; grid-template-columns:1fr; gap:29px; padding:26px 20px 20px; }
  .scene-featured h3 { font-size:27px; }
  .scene-featured .scene-icon { margin:24px 0 19px; }
  .scene-table-demo { padding:16px; border-radius:17px; transform:none; }
  .scene-table-grid b { min-height:58px; }
}

/* Hero product ecosystem — real product imagery from the solution deck */
.hero-visual.hero-ecosystem {
  min-height:548px;
  isolation:isolate;
  overflow:visible;
  border:1px solid rgba(151,164,219,.17);
  border-radius:36px;
  background:
    radial-gradient(circle at 55% 54%,rgba(90,108,246,.28),transparent 48%),
    linear-gradient(148deg,rgba(20,27,54,.88),rgba(8,12,27,.54));
  box-shadow:0 44px 100px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.06);
  transform:none;
  backdrop-filter:blur(15px);
}
.hero-ecosystem::before {
  content:"";
  position:absolute;
  inset:18px;
  z-index:-1;
  border:1px solid rgba(255,255,255,.055);
  border-radius:27px;
  pointer-events:none;
}
.hero-ecosystem::after {
  content:"";
  position:absolute;
  right:34px;
  bottom:-1px;
  width:42%;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--lime));
  box-shadow:0 0 22px rgba(184,243,74,.38);
  opacity:.72;
}
.ecosystem-aura {
  position:absolute;
  inset:12% 8% 9%;
  z-index:-1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(69,90,255,.26) 0%,rgba(38,55,135,.13) 42%,transparent 70%);
  filter:blur(18px);
}
.ecosystem-label {
  position:absolute;
  top:30px;
  left:34px;
  z-index:3;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ecosystem-label span {
  color:#91a0d4;
  font-size:9px;
  font-weight:750;
  letter-spacing:2px;
}
.ecosystem-label b {
  color:#fff;
  font-size:17px;
  letter-spacing:.2px;
}
.ecosystem-product {
  position:absolute;
  top:55%;
  left:50%;
  z-index:1;
  display:block;
  width:111%;
  max-width:900px;
  height:auto;
  object-fit:contain;
  transform:translate(-50%,-50%);
  filter:drop-shadow(0 30px 28px rgba(0,0,0,.34));
}
.ecosystem-chip {
  position:absolute;
  z-index:4;
  display:flex;
  align-items:center;
  gap:11px;
  padding:13px 16px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:15px;
  box-shadow:0 18px 45px rgba(0,0,0,.26);
  backdrop-filter:blur(18px);
}
.ecosystem-chip div { display:flex; flex-direction:column; gap:3px; }
.ecosystem-chip b { color:#fff; font-size:12px; line-height:1.2; }
.ecosystem-chip small { color:#9fa8bf; font-size:8px; letter-spacing:.3px; }
.chip-sync {
  top:108px;
  right:-22px;
  background:rgba(20,27,51,.89);
}
.chip-sync > i {
  width:10px;
  height:10px;
  border-radius:50%;
  background:#53d79a;
  box-shadow:0 0 0 7px rgba(83,215,154,.14),0 0 18px rgba(83,215,154,.5);
}
.chip-device {
  left:-27px;
  bottom:40px;
  background:rgba(255,255,255,.95);
}
.chip-device > span {
  display:grid;
  width:38px;
  height:38px;
  place-items:center;
  border-radius:11px;
  background:var(--lime);
  color:#11162a;
  font-size:14px;
  font-weight:900;
}
.chip-device b { color:#151a30; }
.chip-device small { color:#7c8498; }

@media (max-width:1050px) {
  .hero-visual.hero-ecosystem {
    width:min(90%,820px);
    margin-left:auto;
    min-height:520px;
  }
  .ecosystem-product { width:104%; }
}

@media (max-width:760px) {
  .hero-visual.hero-ecosystem {
    width:100%;
    min-height:420px;
    margin-left:0;
    border-radius:27px;
  }
  .hero-ecosystem::before { inset:11px; border-radius:20px; }
  .ecosystem-label { top:23px; left:23px; }
  .ecosystem-label b { font-size:14px; }
  .ecosystem-product { top:55%; width:112%; }
  .chip-sync { top:78px; right:-8px; padding:11px 13px; }
  .chip-device { left:12px; bottom:16px; padding:10px 12px; }
}

@media (max-width:430px) {
  .hero-visual.hero-ecosystem { min-height:370px; }
  .ecosystem-label span { font-size:7px; letter-spacing:1.5px; }
  .ecosystem-label b { font-size:13px; }
  .ecosystem-product { top:54%; width:112%; }
  .chip-sync { top:70px; }
  .chip-sync small { display:none; }
  .chip-device { bottom:13px; }
  .chip-device > span { width:32px; height:32px; font-size:12px; }
  .chip-device small { display:none; }
}

@media (max-width:1050px) {
  .smart-screen-solution-entry { grid-template-columns:1fr 1fr; }
  .smart-screen-entry-copy { padding:44px 38px; }
}

@media (max-width:760px) {
  .smart-screen-solution-entry { grid-template-columns:1fr; margin-top:14px; border-radius:23px; }
  .smart-screen-entry-copy { padding:38px 24px 12px; }
  .smart-screen-entry-copy h3 { font-size:36px; }
  .smart-screen-entry-copy p { font-size:13px; }
  .smart-screen-entry-visual { min-height:330px; }
  .smart-screen-entry-visual .smart-display-pair { gap:12px; transform:scale(.84); }
  .smart-screen-solution-entry:hover .smart-display-pair { transform:translateY(-5px) scale(.86); }
}