@font-face{font-family:Kanit;src:url(media/kanit.ttf)}@font-face{font-family:Kanit;src:url(media/kanit-bold.ttf);font-weight:700}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:#f7f9fa;color:#102b35;font-family:Kanit,system-ui,sans-serif}a{text-decoration:none;color:inherit}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #05b5cd;outline-offset:5px}.draftbar{padding:8px 5%;background:#102b35;color:#d9eaf0;font-size:10px;letter-spacing:1.5px;display:flex;justify-content:space-between}.draftbar span{letter-spacing:0;color:#9db7c2}header{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;position:sticky;top:0;z-index:20;background:#f9fcfbdc;backdrop-filter:blur(22px);border-bottom:1px solid #d7e4e6}.logo img{width:145px;display:block}nav{display:flex;gap:32px;font-size:14px}.navtools{display:flex;gap:10px;align-items:center}.navtools button{width:42px;height:42px;border:1px solid #cedde0;border-radius:50%;background:transparent;color:#153b48}.login{padding:10px 20px;border-radius:99px;background:#e1f0f1;border:1px solid #c9e1e4;font-size:13px}.hero{min-height:690px;position:relative;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#f9fbfa,#e8f9f9 65%,#ebeafa);border-bottom:1px solid #d7e4e6}.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.75}.orb{position:absolute;width:540px;height:540px;border-radius:50%;background:radial-gradient(circle,#b8e9ec60,transparent 66%);top:180px;left:calc(50% - 270px)}.hero-content{position:relative;z-index:1;text-align:center;padding:70px 20px 105px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:700;color:#428292;display:flex;align-items:center;gap:10px}.hero .eyebrow,.closing .eyebrow{justify-content:center}.eyebrow i{width:7px;height:7px;border-radius:50%;background:#0ab7c9;box-shadow:0 0 0 5px #0ab7c911}h1{font-size:clamp(46px,4.8vw,72px);font-weight:700;line-height:1.22;letter-spacing:-2.5px;margin:30px 0 23px}h1 span{display:block;color:#178b9c;font-size:.72em;margin-top:10px;letter-spacing:-1px}.mobile{display:none}.intro{font-size:18px;line-height:1.8;color:#607982;margin:24px 0}.intro b{color:#214957;font-weight:500}.actions{display:flex;gap:12px;justify-content:center;margin:28px 0 17px}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;padding:15px 23px;border-radius:9px;font-size:14px;transition:transform .2s,box-shadow .2s}.primary{color:#fff;background:#102f3b;box-shadow:0 8px 22px #0f3e4e15}.primary:hover{transform:translateY(-3px);box-shadow:0 12px 28px #0f3e4e33}.secondary{border:1px solid #b9d6dc;background:#ffffffb5;gap:20px}.tiny{font-size:11px;color:#6d8790}.scene-label{position:absolute;bottom:24px;left:5%;right:5%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;color:#73949b}.system{padding:70px 6% 85px;max-width:1500px;margin:auto}.sectiontop{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #d8e2e5;padding-bottom:24px;margin-bottom:50px}.sectiontop>span{font-size:11px;color:#8ba0a7}.systemgrid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:center}h2{font-size:44px;line-height:1.25;letter-spacing:-1.2px;margin:12px 0 24px}h2 em{font-style:normal;color:#138c9e}.sectioncopy>p{color:#71848c;font-size:16px;line-height:1.8}.features{margin-top:30px}.feature{display:flex;text-align:left;align-items:center;gap:15px;width:100%;padding:18px 6px;border:0;border-bottom:1px solid #dce6e8;background:transparent;color:#83959d}.feature b{font-size:11px;font-weight:400}.feature span{font-size:16px;flex:1}.feature small{display:block;font-size:11px;margin-top:4px}.feature i{font-style:normal}.feature.active{color:#0d879b}.dashboard{background:#fff;border:1px solid #cbdde2;border-radius:18px;box-shadow:0 35px 60px -25px #295c7530;transform:perspective(1300px) rotateY(-4deg) rotateX(2deg);transition:transform .6s}.dashboard:hover{transform:perspective(1300px) rotateY(0) rotateX(0)}.dashbar{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid #e5eef0;font-size:12px}.dashbar b{display:flex;align-items:center;gap:8px}.brandicon{background:#0db9d7;color:#fff;border-radius:7px;width:24px;height:24px;font-style:normal;text-align:center;font-size:18px}.dashbar>span{color:#8ba0ac;display:flex;align-items:center;gap:8px}.status{display:inline-block;width:6px;height:6px;background:#21bb8d;border-radius:50%;box-shadow:0 0 0 4px #21bb8d13}.dashbody{padding:25px}.dashtitle{display:flex;justify-content:space-between;align-items:center}.dashtitle small{font-size:8px;letter-spacing:1.4px;color:#839ba5}.dashtitle h3{font-size:20px;margin:4px 0 20px}.sample{font-size:9px;color:#8d9eaa;background:#f3f7f8;padding:4px 8px;border-radius:4px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stats>div{padding:15px;background:#f3f8f9;border:1px solid #e6eff1;border-radius:8px}.stats small{font-size:10px;color:#718993}.stats strong{display:block;font-size:25px;font-weight:500;margin-top:5px}.stats em{font-style:normal;font-size:11px;color:#88a0a9}.viewtitle{font-size:12px;margin:25px 0 8px}.oarow{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid #edf3f4;animation:appear .4s both}.oaicon{border-radius:10px;background:#e1f4ee;width:38px;height:38px;display:grid;place-items:center;color:#2c9d7e;font-size:14px}.oarow>div:nth-child(2){flex:1;font-size:12px}.oarow small{display:block;color:#8a9da8;font-size:10px}.badge{padding:4px 8px;font-size:9px;border-radius:20px;color:#218d71;background:#e7f7ef}.dashfoot{display:flex;justify-content:space-between;font-size:9px;color:#7d96a1;margin-top:25px}.dashfoot .status{margin-right:7px;width:5px;height:5px}.film{padding:85px 6%;background:#0b202b;color:#ecf7fa}.filmhead{display:flex;justify-content:space-between;align-items:end;max-width:1300px;margin:0 auto 35px}.filmhead h2{margin-bottom:0}.filmhead>p{font-size:14px;color:#b2cbd4;line-height:1.8}.filmhead>p span{font-size:11px;color:#6c96a7}.film .eyebrow{color:#43c9da}.videobox{position:relative;max-width:1300px;margin:auto;border-radius:14px;overflow:hidden;border:1px solid #28505f;background:#07131c}.videobox video{display:block;width:100%;aspect-ratio:16/9}.draftbadge{position:absolute;right:15px;top:15px;font-size:9px;letter-spacing:1px;color:#b6d5e0;background:#0b202bbf;padding:6px 10px;border:1px solid #43616d;border-radius:5px;pointer-events:none}.chapters{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;max-width:1300px;margin:25px auto 0}.chapters button{background:transparent;color:#b9cfd6;text-align:left;border:0;border-top:2px solid #294957;padding:14px 0;font-size:12px}.chapters button:hover{border-color:#40d5e6;color:#fff}.chapters b{font-size:10px;color:#52c3d6;display:block;margin-bottom:7px}.filmnote{font-size:10px;color:#7796a5;text-align:center;margin-top:24px}.closing{text-align:center;padding:100px 20px;background:radial-gradient(ellipse at center,#d9f4f3,transparent 70%)}.closing h2{font-size:48px;margin:25px 0 32px}footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #d7e4e6;padding:30px 6%;font-size:10px;color:#6d8993}footer img{width:110px}footer span{letter-spacing:1.5px}@keyframes appear{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}.dashboard{transform:none}}@media(max-width:800px){.draftbar{font-size:8px;letter-spacing:1px;padding:7px 4%}.draftbar span{font-size:8px}header{height:70px;padding:0 4%}.logo img{width:110px}nav{display:none}.login{font-size:11px;padding:10px 13px}.navtools button{height:38px;width:38px}.hero{min-height:640px}.hero-content{padding:65px 22px 90px}h1{font-size:42px;letter-spacing:-1.3px}h1 span{font-size:.75em;line-height:1.5}.mobile{display:block}.intro{font-size:16px}.eyebrow{font-size:8px;letter-spacing:1.5px}.actions{gap:8px}.primary,.secondary{font-size:12px;padding:13px 15px}.scene-label{font-size:7px;letter-spacing:1px}.scene-label span{display:none}.tiny{font-size:9px}.system{padding:40px 5% 55px}.sectiontop{margin-bottom:30px}.systemgrid{grid-template-columns:1fr;gap:35px}h2{font-size:34px}.sectioncopy>p{font-size:14px}.features{margin-top:15px}.dashboard{transform:none}.dashbody{padding:17px}.stats{gap:6px}.stats>div{padding:11px 8px}.stats strong{font-size:20px}.stats small{font-size:9px}.film{padding:48px 5%}.filmhead{display:block}.filmhead h2{font-size:32px}.filmhead>p{font-size:12px;margin-top:20px}.chapters{grid-template-columns:repeat(3,1fr);gap:12px}.chapters button{font-size:10px}.draftbadge{font-size:7px;padding:3px 6px;right:8px;top:8px}.filmnote{text-align:left;line-height:1.7}.closing{padding:60px 20px}.closing h2{font-size:34px}footer{flex-wrap:wrap;gap:20px}footer span{display:none}}

.connection{display:flex;justify-content:center;align-items:center;margin:24px auto 22px;max-width:370px}.line-node,.luma-node{display:block;text-align:left;padding:10px 17px;border-radius:12px;font-size:18px;line-height:1.3;font-weight:700;box-shadow:0 8px 22px #123c4010}.line-node{background:#06a957;color:white}.luma-node{background:#fff;color:#123e4c;border:1px solid #b6dce2}.connection b{display:block;font-size:9px;letter-spacing:.5px;font-weight:400;margin-top:3px}.connection-wire{width:62px;height:2px;background:#8dd4ca;position:relative;overflow:visible}.connection-wire i{position:absolute;width:7px;height:7px;border-radius:50%;background:#02b78e;top:-2px;left:0;animation:connect 2.6s infinite ease-in-out}.film-toggle{position:absolute;bottom:18px;right:18px;color:white;background:#102f3bed;border:1px solid #62929f;border-radius:30px;padding:10px 17px;min-height:44px;font-size:12px;backdrop-filter:blur(10px)}.film-toggle:hover{background:#195165}.videobox video{cursor:pointer}@keyframes connect{0%{left:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:100%;opacity:0}}body.motion-paused .connection-wire i{animation-play-state:paused}@media(max-width:800px){.connection{margin:22px auto 20px}.line-node,.luma-node{padding:9px 12px;font-size:16px}.connection-wire{width:45px}.film-toggle{bottom:9px;right:9px;padding:7px 12px;font-size:10px}}

.solutions{padding:40px 6% 85px;max-width:1500px;margin:auto}.solutionlead{color:#71848c}.solutiongrid{display:grid;grid-template-columns:1fr 1.12fr;gap:55px;margin-top:35px}.solutiontabs{display:grid;gap:8px}.solutiontabs button{display:flex;align-items:center;gap:16px;text-align:left;border:1px solid #dce8eb;border-radius:12px;background:#fff;padding:17px;color:#5c7884}.solutiontabs button[aria-selected=true]{background:#113c49;color:#fff;border-color:#113c49;box-shadow:0 9px 20px #163e4d18}.solutiontabs button>b{font-size:10px;opacity:.55}.solutiontabs button>span{flex:1;font-size:16px}.solutiontabs small{display:block;font-size:11px;margin-top:4px;opacity:.7}.solutiontabs i{font-style:normal}.solutionpreview{background:linear-gradient(145deg,#edf8f8,#e3edf3);border:1px solid #cfdee5;border-radius:20px;padding:30px;min-height:580px}.previewkicker{display:flex;justify-content:space-between;font-size:10px;color:#688b99;margin-bottom:28px;letter-spacing:1px}.solutionpreview h3{font-size:24px;line-height:1.4;margin:16px 0}.solutionpreview>p{font-size:13px;line-height:1.8;color:#607d89}.demo-panel{background:#fff;padding:22px;border-radius:14px;border:1px solid #cde0e7;box-shadow:0 18px 35px #2349580c;min-height:220px}.demo-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid #e8eff1;font-size:12px}.demo-row:last-child{border:0}.demo-row strong{font-size:10px;color:#16896d;background:#e9f8f0;padding:4px 8px;border-radius:20px}.demo-row .warn{color:#ad7d25;background:#fff5dd}.demo-card{background:#f1fbf8;border-radius:10px;border:1px solid #c6e9df;overflow:hidden}.demo-art{background:linear-gradient(125deg,#06a957,#157e94);padding:24px;color:white;font-size:24px;line-height:1.3}.demo-art small{font-size:11px;display:block;margin-top:10px}.demo-card p{padding:0 18px;font-size:12px;color:#52706d}.demo-action{display:block;text-align:center;margin:14px;padding:12px;border-radius:7px;background:#153e50;color:white;font-size:12px}.previewbuttons{display:flex;gap:7px;flex-wrap:wrap;margin:18px 0}.previewbuttons button{border:1px solid #b7d3dd;border-radius:20px;padding:8px 12px;background:white;color:#306477;font-size:11px}.previewbuttons button.active{background:#123e4c;color:white}.previewcaption{font-size:10px!important;color:#8399a3!important}.blockstats{display:flex;gap:12px}.blockstats>div{flex:1;background:#f0f7f9;padding:12px;border-radius:10px;font-size:10px;color:#74929e}.blockstats b{display:block;font-size:30px;color:#163e50;font-weight:500}.mini-chart{height:125px;display:flex;align-items:end;gap:11px;margin:25px 0 5px;border-bottom:1px solid #cfdee5}.mini-chart span{flex:1;border-radius:5px 5px 0 0;background:#53adbb}.mini-chart span:last-child{background:#eeab72}.usage-note{margin-top:30px;background:#eef5f7;border-left:3px solid #2ca6b5;padding:20px 25px;border-radius:0 10px 10px 0}.usage-note strong{font-size:14px}.usage-note p{font-size:12px;color:#67848e;line-height:1.8}.usage-note a{font-size:11px;color:#168999}@media(max-width:800px){.solutions{padding:30px 5% 45px}.solutions h2{font-size:29px}.solutiongrid{grid-template-columns:1fr;gap:22px}.solutiontabs{grid-template-columns:1fr 1fr;gap:8px}.solutiontabs button{padding:13px 10px;gap:8px;align-items:start}.solutiontabs button>span{font-size:12px}.solutiontabs small{font-size:9px}.solutiontabs i{display:none}.solutionpreview{padding:20px;min-height:0}.solutionpreview h3{font-size:23px}.usage-note{padding:17px}}

.connect-section{max-width:1500px;margin:auto;padding:35px 6% 70px}.connect-lead{color:#607d89;line-height:1.8}.connect-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center;margin-top:35px}.mobile-demo{max-width:330px;width:100%;margin:auto;padding:25px;background:#fff;border:8px solid #153c49;border-radius:34px;box-shadow:0 22px 50px #153c491a}.mobile-brand{font-weight:700;color:#078f9c;display:flex;justify-content:space-between;font-size:17px}.mobile-brand span{font-size:11px;font-weight:400}.mobile-demo h3{margin:24px 0 18px}.mobile-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mobile-metrics>div{background:#eaf5f5;border-radius:12px;padding:12px;font-size:11px}.mobile-metrics strong{display:block;font-size:30px}.mobile-account{margin:18px 0;padding:18px 0;border-bottom:1px solid #deeaed;font-size:13px}.mobile-account span{display:block;color:#16896d;font-size:10px;margin-top:5px}.mobile-shortcuts{display:flex;gap:6px;margin-bottom:24px}.mobile-shortcuts span{flex:1;text-align:center;padding:12px 4px;border-radius:9px;background:#153c49;color:white;font-size:11px}.mobile-demo small,.connect-steps>small{font-size:10px;color:#6a8792}.connect-steps article{display:flex;gap:20px;padding:18px 0;border-bottom:1px solid #d8e6e9}.connect-steps article>b{color:#078f9c;font-size:14px;padding-top:6px}.connect-steps h3{margin:0;font-size:22px}.connect-steps p{color:#607d89;line-height:1.8;font-size:14px;margin:8px 0}.connect-result{padding:18px;background:#e4f4ee;color:#16745e;border-radius:12px;margin:20px 0;font-size:14px}@media(max-width:800px){.connect-section{padding:30px 5% 45px}.connect-grid{grid-template-columns:1fr;gap:24px}.connect-section h2{font-size:30px}.connect-steps h3{font-size:20px}.connect-lead{font-size:14px}.connect-result{font-size:12px}}

.staff-copy{color:#476b78;line-height:1.9;font-size:17px;max-width:720px;margin:0 auto 16px}.staff-note{color:#6b818a;font-size:12px;margin:0 auto 28px}@media(max-width:800px){.staff-copy{font-size:14px}.staff-note{font-size:10px;line-height:1.7}}
/* Compact controls and theme surfaces. */
header .navtools{gap:8px;flex-shrink:0}header .logo{flex-shrink:0}header .navtools button{min-width:44px;height:44px;border-radius:13px;font-size:13px;font-weight:700}header .theme-toggle{width:58px!important;padding:7px;background:#d7e4eb;border-color:#c5d5dd!important;display:flex;align-items:center}header .theme-toggle span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;color:#815f0b;box-shadow:0 2px 5px #102b3526;transition:transform .2s}header .theme-toggle[aria-checked=true]{background:#089eb3!important}header .theme-toggle[aria-checked=true] span{transform:translateX(16px);color:#12425a}header .logo img{padding:6px;border-radius:10px;background:#fff}header #motion{min-width:34px;width:34px;font-weight:400}html[data-theme=dark]{color-scheme:dark}html[data-theme=dark] body{background:#0c1923;color:#e8f2f6}html[data-theme=dark] header{background:#102330ed;border-color:#304b5c}html[data-theme=dark] .hero{background:linear-gradient(145deg,#0d1d29,#12313b 65%,#242c47);border-color:#304b5c}html[data-theme=dark] h1 span,html[data-theme=dark] h2 em{color:#56cfdd}html[data-theme=dark] .intro,html[data-theme=dark] .sectioncopy>p,html[data-theme=dark] .connect-lead,html[data-theme=dark] .solutionlead,html[data-theme=dark] .staff-copy,html[data-theme=dark] .connect-steps p{color:#b6cad4}html[data-theme=dark] .eyebrow{color:#79c4d0}html[data-theme=dark] .login,html[data-theme=dark] header .navtools button{background:#203c4d;color:#e4f2f6;border-color:#4b6878}html[data-theme=dark] .secondary{color:#dfedf2;border-color:#5e8795}html[data-theme=dark] .dashboard,html[data-theme=dark] .mobile-demo,html[data-theme=dark] .demo-panel,html[data-theme=dark] .solutiontabs button{background:#142a39;color:#e4f0f4;border-color:#365566}html[data-theme=dark] .solutiontabs button[aria-selected=true]{background:#21596a;border-color:#50b7c8}html[data-theme=dark] .solutionpreview{background:linear-gradient(145deg,#153240,#1b2c40);border-color:#365566}html[data-theme=dark] .solutionpreview>p,html[data-theme=dark] .stats small,html[data-theme=dark] .oarow small,html[data-theme=dark] .staff-note,html[data-theme=dark] .connect-steps>small,html[data-theme=dark] .mobile-demo small{color:#aec5d1}html[data-theme=dark] .stats>div,html[data-theme=dark] .mobile-metrics>div,html[data-theme=dark] .blockstats>div,html[data-theme=dark] .sample{background:#203b4b;border-color:#365566;color:#d2e4ed}html[data-theme=dark] .blockstats b{color:#e8f4f7}html[data-theme=dark] .usage-note{background:#17323f}html[data-theme=dark] .usage-note p{color:#b6cfd9}html[data-theme=dark] .usage-note a,html[data-theme=dark] .feature.active,html[data-theme=dark] .mobile-brand{color:#67d1df}html[data-theme=dark] .demo-card{background:#143a38;border-color:#397569}html[data-theme=dark] .demo-card p{color:#c4e2dc}html[data-theme=dark] .closing{background:radial-gradient(ellipse at center,#163c42,transparent 70%)}html[data-theme=dark] .sectiontop,html[data-theme=dark] .dashbar,html[data-theme=dark] .oarow,html[data-theme=dark] .feature,html[data-theme=dark] .connect-steps article,html[data-theme=dark] footer{border-color:#304b5c}html[data-theme=dark] footer img{background:white;border-radius:8px;padding:6px}html[data-theme=dark] .previewkicker,html[data-theme=dark] .sectiontop>span,html[data-theme=dark] .tiny{color:#a9c5d1}.connect-grid>*,.systemgrid>*,.solutiongrid>*{min-width:0}html[lang=en] h1{font-size:clamp(36px,4.3vw,64px)}html[lang=en] h2{overflow-wrap:break-word}.sectiontop{gap:12px}.sectiontop>span{text-align:right}body{overflow-wrap:break-word}@media(max-width:800px){header{padding:0 12px;gap:8px}.logo img{width:100px}.navtools{gap:5px!important}header #motion{display:none}header .login{font-size:11px;padding:10px;white-space:nowrap}header .navtools button{min-width:44px;height:44px}header .theme-toggle{width:56px!important}.draftbar{gap:10px;line-height:1.6}.draftbar span{text-align:right}html[lang=en] h1{font-size:37px;letter-spacing:-1px}html[lang=en] h2{font-size:29px}.sectiontop{align-items:start}.sectiontop .eyebrow{max-width:60%}.connect-result{overflow-wrap:anywhere}}@media(max-width:359px){header{padding:0 8px;gap:5px}.logo img{width:83px}header .login{padding:10px 7px;font-size:10px}.navtools{gap:4px!important}} 
html[data-theme=dark] .secondary{background:#203c4d;color:#e2f3f7}html[data-theme=dark] .intro b{color:#effaff}html[lang=en] .hero h1 .mobile{display:block}.demo-row{gap:12px}.demo-row>span{min-width:0;flex:1}.demo-row strong{flex-shrink:0;max-width:46%}.previewkicker{gap:12px}.previewkicker>span{flex-shrink:0}
/* Readable secondary text across all dark-mode sections. */
html[data-theme=dark] .scene-label,html[data-theme=dark] .sectiontop>span,html[data-theme=dark] .dashbar>span,html[data-theme=dark] .dashtitle small,html[data-theme=dark] .dashfoot,html[data-theme=dark] .stats em,html[data-theme=dark] .feature,html[data-theme=dark] .blockstats>div,html[data-theme=dark] .filmnote,html[data-theme=dark] .filmhead>p span,html[data-theme=dark] footer{color:#b2cbd6}
html[data-theme=dark] .previewcaption{color:#b2cbd6!important}
html[data-theme=dark] .solutiontabs small,html[data-theme=dark] .solutiontabs button>b{opacity:1;color:#adc7d2}
html[data-theme=dark] .solutiontabs button[aria-selected=true] small,html[data-theme=dark] .solutiontabs button[aria-selected=true]>b{color:#d2edf3}
html[data-theme=dark] .mobile-account span{color:#6ce1b5}
html[data-theme=dark] .connect-result{background:#173e36;color:#a5efce;border:1px solid #397d66}
html[data-theme=dark] .previewbuttons button{background:#213d4d;color:#e0f1f7;border-color:#5f8495}
html[data-theme=dark] .previewbuttons button.active{background:#9de5ed;color:#123c49;border-color:#9de5ed}
html[data-theme=dark] .demo-row,html[data-theme=dark] .mobile-account{border-color:#385365}
html[data-theme=dark] .luma-node{color:#123e4c;background:#fff}
html[data-theme=dark] .demo-panel>small{color:#b2cbd6!important}
.line-node{background:#087d45}.brandicon{background:#087f96}.oaicon{color:#146b53}.badge,.demo-row strong{color:#146b53}.demo-row .warn{color:#79530d}.demo-art{background:linear-gradient(125deg,#087d45,#12677b)}
html[data-theme=dark] .connect-steps article>b{color:#67d1df}html[data-theme=dark] .primary{background:#17677b;border:1px solid #5ca8ba;color:#fff}html[data-theme=dark] .primary:hover{background:#1d7a90}
/* Keep preview cards and status surfaces consistent with dark mode. */
html[data-theme=dark] .luma-node{background:#203c4d;color:#eaf7fb;border-color:#55798a}
html[data-theme=dark] .oaicon{background:#1b493e;color:#a6ebd0}
html[data-theme=dark] .badge,html[data-theme=dark] .demo-row strong{background:#1a4538;color:#b0f0d3}
html[data-theme=dark] .demo-row .warn{background:#493b20;color:#ffe0a1}
html[data-theme=dark] .demo-action,html[data-theme=dark] .mobile-shortcuts span{background:#225367;color:#effbff;border:1px solid #4b7d90}
html[data-theme=dark] .theme-toggle span{background:#e9f4f7}
/* The film panel also follows the selected page theme. */
html[data-theme=light] .film{background:#e8f0f4;color:#102b35}
html[data-theme=light] .filmhead>p{color:#476776}
html[data-theme=light] .filmhead>p span,html[data-theme=light] .filmnote{color:#526d79}
html[data-theme=light] .film .eyebrow{color:#176a7b}
html[data-theme=light] .videobox{border-color:#a9c2ce}

.closing-setup{font-size:22px;font-weight:700;margin:0 auto 22px;color:#176a7b}html[data-theme=dark] .closing-setup{color:#9ae2eb}.closing h2{max-width:1100px;margin-left:auto;margin-right:auto}@media(max-width:800px){.closing-setup{font-size:18px}.closing h2{font-size:30px}}

/* Mobile reading flow: compact navigation, copy before previews. */
@media(max-width:800px){
 .hero{min-height:0}.hero-content{padding:34px 20px 48px}.hero h1{margin:20px 0 16px;font-size:36px}.hero h1 span{line-height:1.4}.hero .intro{margin:0 0 20px;line-height:1.65}.hero .actions{margin-top:18px}.hero .connection{margin:20px auto 16px}.hero .scene-label{display:none}
 .system,.connect-section,.solutions{padding:28px 5% 32px}.sectiontop{margin-bottom:20px;padding-bottom:12px}.sectiontop>span{display:none}.sectiontop .eyebrow{max-width:100%;margin:0}.systemgrid{gap:14px}h2,.solutions h2,.connect-section h2{font-size:28px;line-height:1.35;margin:0 0 14px}.sectioncopy>p,.connect-lead,.solutionlead{margin:0 0 16px;font-size:14px;line-height:1.7}
 .features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:16px 0 0}.feature{align-items:start;padding:10px 7px;border:1px solid #c4dbe2;border-radius:9px;gap:4px}.feature span{font-size:11px;line-height:1.5}.feature small,.feature i,.feature>b{display:none}.feature.active{background:#e0f2f5}.dashboard{margin:0}.dashbar{padding:12px 16px}.dashbody{padding:14px}.viewtitle{margin:16px 0 5px}.oarow{padding:11px 0}.dashfoot{margin-top:16px}.dashtitle h3{margin-bottom:14px}
 .connect-grid{display:block;margin-top:10px}.connect-grid>.mobile-demo{display:none}.connect-steps article{padding:12px 0;gap:12px}.connect-steps h3{font-size:18px}.connect-steps p{margin:5px 0;font-size:13px;line-height:1.7}.connect-result{padding:12px;margin:14px 0}
 .solutiongrid{margin-top:16px;gap:12px}.solutiontabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.solutiontabs button{padding:10px 7px;min-height:62px;align-items:center}.solutiontabs button>span{font-size:11px;line-height:1.4}.solutiontabs button>b,.solutiontabs small{display:none}.solutionpreview{display:flex;flex-direction:column;padding:17px;gap:12px}.solutionpreview>.previewkicker{order:0;margin:0;font-size:9px}.solutionpreview>h3{order:1;margin:0;font-size:21px;line-height:1.4}.solutionpreview>p:not(.previewcaption){order:2;margin:0;font-size:13px;line-height:1.75}.solutionpreview>.previewbuttons{order:3;margin:0}.solutionpreview>.demo-panel,.solutionpreview>.demo-card,.solutionpreview>#cardPreview{order:4}.solutionpreview>.previewcaption{order:5;margin:0}.demo-panel{min-height:0;padding:14px}.demo-row{padding:10px 0;font-size:11px}.demo-art{padding:18px;font-size:21px}.usage-note{margin-top:16px;padding:14px}.usage-note p{margin:8px 0;line-height:1.7}
 .film{padding:30px 5%}.filmhead{margin-bottom:16px}.filmhead h2{font-size:28px;margin:0}.filmhead>p{margin:12px 0 0}.filmhead .eyebrow{margin:0 0 12px}.filmnote{margin-top:12px}.closing{padding:32px 5%}.closing h2{font-size:27px;margin:12px auto 16px}.closing-setup{font-size:18px;margin-bottom:16px}.staff-copy{font-size:14px}.staff-note{margin-bottom:18px}footer{padding:22px 5%;gap:14px}
 html[data-theme=dark] .feature.active{background:#21596a}
 body.motion-ready .motion-reveal{opacity:1!important;translate:0 0!important;transition:none!important}
 html[lang=en] h1{font-size:34px}html[lang=en] h2{font-size:27px}
}

/* Continuous LINE OA > LumaOA > people flow. */
.hero .connection{max-width:460px;width:100%}.connection>span:not(.connection-wire){flex-shrink:0}.connection-wire{flex:1;min-width:20px;max-width:62px}.people-node{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:94px;min-height:62px;padding:9px 12px;border-radius:12px;border:1px solid #99c9d7;background:#e1f3f6;color:#165365}.people-node svg{width:32px;height:24px}.people-node b{font-size:10px;letter-spacing:0}.connection-wire i{animation:handoff-in 4s linear infinite}.people-wire i{animation-name:handoff-out}.people-node svg{animation:people-receive 4s ease-in-out infinite}
@keyframes handoff-in{0%{left:0;opacity:0}5%{opacity:1}43%{left:calc(100% - 4px);opacity:1}46%,100%{left:calc(100% - 4px);opacity:0}}
@keyframes handoff-out{0%,45%{left:0;opacity:0}49%{left:0;opacity:1}88%{left:calc(100% - 4px);opacity:1}92%,100%{left:calc(100% - 4px);opacity:0}}
@keyframes people-receive{0%,75%,100%{transform:scale(1)}88%{transform:scale(1.12)}}
html[data-theme=dark] .people-node{background:#203c4d;color:#a4edf1;border-color:#55798a}
@media(max-width:800px){.hero .connection{max-width:360px}.connection .line-node,.connection .luma-node{padding:10px 9px;font-size:14px;min-height:56px}.connection b{font-size:8px;letter-spacing:0}.people-node{min-width:76px;min-height:56px;padding:7px}.connection-wire{min-width:12px;max-width:36px}.people-node svg{width:29px;height:23px}.people-node b{font-size:9px}}
@media(prefers-reduced-motion:reduce){.connection-wire i,.people-node svg{animation:none!important}}

/* Branching delivery network, with the actual brand at its centre. */
.hydra-flow{width:min(100%,520px);margin:10px auto 8px}.hydra-flow>svg{display:block;width:100%;height:auto;overflow:visible}.hydra-track{fill:none;stroke:#79bdc5;stroke-width:1.4;opacity:.55}.hydra-signal{fill:none;stroke:url(#hydraColor);stroke-width:3;stroke-linecap:round;stroke-dasharray:14 100;stroke-dashoffset:114;animation:hydra-send 4s var(--delay,0s) linear infinite;filter:drop-shadow(0 0 3px #08bfbbaa)}.hydra-input{--delay:0s}.hydra-line{fill:#087d45}.hydra-line-title{fill:white;font:700 16px Kanit,sans-serif}.hydra-line-small{fill:white;font:8px Kanit,sans-serif}.hydra-logo-bg{fill:white;stroke:#a4d5df;stroke-width:1.3}.hydra-logo-halo{fill:#12b5cf10;stroke:#0fb8c54a;stroke-width:1;animation:hydra-core 4s infinite}.hydra-person-bg{fill:#eefafd;stroke:#7dbacb;stroke-width:1}.hydra-person-icon{stroke:#14738a;stroke-width:1.6;fill:none;stroke-linecap:round}.hydra-person-ring{fill:none;stroke:#0ab9c4;stroke-width:1.2;opacity:0;animation:hydra-receive 4s var(--delay,0s) infinite;transform-box:fill-box;transform-origin:center}
@keyframes hydra-send{0%{stroke-dashoffset:114;opacity:0}5%{opacity:1}30%{stroke-dashoffset:-14;opacity:1}34%,100%{stroke-dashoffset:-14;opacity:0}}
@keyframes hydra-receive{0%,22%,100%{opacity:0;scale:.85}5%{opacity:.9;scale:1}20%{opacity:0;scale:1.25}}
@keyframes hydra-core{0%,15%,65%,100%{opacity:.45}28%,48%{opacity:1}}
html[data-theme=dark] .hydra-person-bg{fill:#173c4c;stroke:#548b9d}html[data-theme=dark] .hydra-person-icon{stroke:#a4edf1}html[data-theme=dark] .hydra-track{stroke:#5aabbc}
@media(max-width:800px){.hydra-flow{margin:6px auto 4px;max-width:360px}.hero-content{padding-top:26px;padding-bottom:28px}.hero .actions{margin-bottom:8px}.hero .intro{margin-bottom:14px}}
@media(prefers-reduced-motion:reduce){.hydra-flow *{animation:none!important}.hydra-signal{opacity:0}.hydra-logo-halo{opacity:.6}}

.hydra-track{stroke:#3899ab;opacity:.8;stroke-width:1.7}.hydra-track.hydra-direct{stroke:#079caa;stroke-width:2.2;opacity:1}html[data-theme=dark] .hydra-track.hydra-direct{stroke:#54d7de;opacity:1}.hydra-input{stroke-width:3.8;filter:drop-shadow(0 0 3px #00bba3)}

/* Keep the short inbound link visibly active throughout the cycle. */
.hydra-signal.hydra-input{stroke:#00d8b4;stroke-width:4.5;stroke-dasharray:30 100;opacity:1;animation:hydra-input-continuous 1.25s linear infinite;filter:drop-shadow(0 0 3px #00cba8)}
@keyframes hydra-input-continuous{from{stroke-dashoffset:100}to{stroke-dashoffset:-30}}
@media(prefers-reduced-motion:reduce){.hydra-signal.hydra-input{animation:none!important;stroke-dasharray:none;opacity:.8}}

.live-illustration{order:3;position:relative;padding:12px 12px 7px;margin:0 0 16px;background:linear-gradient(135deg,#e5f6f6,#edf0fb);border:1px solid #b5d7df;border-radius:14px;overflow:hidden}.live-illustration svg{display:block;width:100%;max-height:190px;overflow:visible}.live-illustration>span{display:block;font-size:8px;letter-spacing:1.4px;color:#4d7180;text-align:right;margin-top:5px}.live-illustration text{font:10px Kanit,sans-serif;fill:#164c60}.viz-box{fill:#fff;stroke:#8bbfce;stroke-width:1.2}.viz-soft{fill:#bce6e9}.viz-line{fill:none;stroke:#4c93a5;stroke-width:1.5;stroke-linecap:round}.viz-wire{fill:none;stroke:#7bb8c5;stroke-width:1.5}.viz-packet{fill:none;stroke:#00bfa3;stroke-width:3;stroke-linecap:round;stroke-dasharray:18 100;animation:viz-flow 3s var(--d,0s) linear infinite}.viz-person{fill:#fff;stroke:#77b5c3}.viz-ring{fill:none;stroke:#00bba5;animation:viz-ring 3s var(--d,0s) ease-out infinite;transform-box:fill-box;transform-origin:center}.viz-dot{fill:#00bfa3;animation:viz-blink 2s var(--d,0s) infinite}.viz-scan{stroke:#00cbb5;stroke-width:3;filter:drop-shadow(0 0 4px #00bba5);animation:viz-scan 3s ease-in-out infinite}.viz-button{fill:#087f94}.live-illustration .viz-white{fill:white;font-size:9px}.viz-arrive{animation:viz-arrive 4s infinite}.viz-check{fill:none;stroke:#009d72;stroke-width:2;stroke-dasharray:30;animation:viz-check 3s infinite}.viz-cards{animation:viz-cards 5s ease-in-out infinite}.viz-grid{fill:none;stroke:#8cb5c44a}.viz-bar{fill:#36b5c4;transform-box:fill-box;transform-origin:bottom;animation:viz-bars 4s var(--d,0s) ease-in-out infinite}.viz-trend{fill:none;stroke:#14866f;stroke-width:3;stroke-dasharray:100;animation:viz-trend 4s infinite}
@keyframes viz-flow{from{stroke-dashoffset:100}to{stroke-dashoffset:-18}}@keyframes viz-ring{0%{opacity:0;scale:.7}25%{opacity:.8}80%,100%{opacity:0;scale:1.35}}@keyframes viz-blink{0%,100%{opacity:.4}50%{opacity:1}}@keyframes viz-scan{0%,100%{transform:translateY(0)}50%{transform:translateY(105px)}}@keyframes viz-arrive{0%,100%{opacity:.5;translate:0 3px}30%,80%{opacity:1;translate:0 0}}@keyframes viz-check{0%,25%{stroke-dashoffset:30}55%,100%{stroke-dashoffset:0}}@keyframes viz-cards{0%,100%{translate:-5px 0}50%{translate:5px 0}}@keyframes viz-bars{0%,100%{scale:1 .72}50%{scale:1 1}}@keyframes viz-trend{0%{stroke-dashoffset:100}65%,100%{stroke-dashoffset:0}}
html[data-theme=dark] .live-illustration{background:linear-gradient(135deg,#122f3a,#1c2943);border-color:#3b6172}html[data-theme=dark] .viz-box,html[data-theme=dark] .viz-person{fill:#1d4050;stroke:#5594a7}html[data-theme=dark] .viz-soft{fill:#286a75}html[data-theme=dark] .live-illustration text{fill:#c4eaf4}html[data-theme=dark] .live-illustration>span{color:#a3c7d3}html[data-theme=dark] .viz-trend{stroke:#68e5be}
.dashboard .status,.mobile-demo .mobile-account span{animation:viz-blink 3s infinite}.section-live .dashboard .oaicon{animation:viz-arrive 5s infinite}.section-live .mobile-demo{animation:phone-breathe 6s ease-in-out infinite}@keyframes phone-breathe{0%,100%{translate:0 0}50%{translate:0 -5px}}
main>section:not(.section-live) .live-illustration *,main>section:not(.section-live) .dashboard *{animation-play-state:paused}
@media(max-width:800px){.live-illustration{margin:0;padding:8px 8px 5px}.live-illustration svg{max-height:145px}.solutionpreview>.previewbuttons{order:3}.solutionpreview>.live-illustration{order:3}}
@media(prefers-reduced-motion:reduce){.live-illustration *,.dashboard .status,.mobile-demo{animation:none!important}.viz-packet{stroke-dasharray:none;opacity:.6}}