.system-offer { --so-navy:#102f4b; --so-muted:#4c6477; --so-teal:#006f65; --so-line:#d9e5eb; color:var(--so-navy); background:#fff; font-size:1rem; line-height:1.85; overflow-wrap:anywhere; }
.system-offer *, .system-service-card * { box-sizing:border-box; }
.system-offer h1,.system-offer h2,.system-offer h3,.system-offer h4,.system-offer p,.system-offer figure { margin:0; }
.system-offer h2 { font-size:clamp(1.6rem,2.7vw,2.25rem);line-height:1.55;letter-spacing:-.025em;text-wrap:balance; }
.system-offer h3 {font-size:1.125rem;line-height:1.7;}
.system-offer p {color:var(--so-muted);}
.system-offer a {text-decoration:none;}
.system-offer :is(a,button,input,textarea,summary,[tabindex]):focus-visible {outline:3px solid #008677;outline-offset:5px;}
.system-offer :is(h2,section[id]) {scroll-margin-top:112px;}
.system-hero {padding:28px 0 76px;background:linear-gradient(115deg,#f1f8fa 0%,#f8fbfd 64%,#e4f1f5 100%);border-bottom:1px solid var(--so-line);}
.system-breadcrumb {display:flex;flex-wrap:wrap;gap:10px;font-size:.875rem;color:var(--so-muted);margin-bottom:48px;}
.system-breadcrumb a {color:var(--so-muted);}
.system-hero-grid {display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center;}
.system-hero-kickers {display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;}
.system-demo-tag,.system-service-card .system-demo-tag {display:inline-flex;align-self:flex-start;max-width:100%;padding:7px 13px;border-radius:5px;background:#006f65;color:#fff!important;font-size:.875rem;font-weight:700;line-height:1.65;letter-spacing:normal;overflow-wrap:anywhere;}
.system-preview-panel {display:grid;gap:22px;min-width:0;}
.system-demo-promise {padding:22px 25px;border:1px solid #bfdad6;border-left:4px solid #007168;border-radius:8px;background:#fff;}
.system-demo-promise h2 {font-size:clamp(1.125rem,1.7vw,1.4rem);color:#075c54;line-height:1.6;}
.system-demo-promise > p {margin-top:10px;font-size:.9375rem;}
.system-demo-promise > .system-note {font-size:.875rem;color:#4c6477;}
.system-demo-promise > a {display:inline-flex;align-items:center;gap:14px;margin-top:16px;color:#006f65;font-size:.875rem;font-weight:700;text-decoration:underline;text-underline-offset:4px;}
.system-service-card .system-demo-tag {margin:16px 0 12px;}
.system-demo-contact {margin-top:20px!important;padding:17px 20px;border-left:3px solid #007168;background:#fff;color:#075c54!important;font-weight:600;}
.system-eyebrow {color:var(--so-teal)!important;font-size:.875rem;font-weight:700;letter-spacing:.06em;}
.system-offer h1 {font-size:clamp(1.8rem,3vw,2.65rem);font-weight:700;line-height:1.58;letter-spacing:-.035em;margin:20px 0;}
.system-offer h1 span,.system-offer h1 strong {display:block;}
.system-offer h1 strong {color:#007168;font-weight:700;margin-top:8px;}
.system-lead {max-width:42em;}
.system-hero-price {margin:26px 0 24px;border-left:3px solid #02988a;padding:0 0 0 20px;}
.system-hero-price > div {display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;}
.system-hero-price strong {font-size:clamp(2.5rem,4vw,3.7rem);font-weight:800;line-height:1.25;letter-spacing:-.04em;color:var(--so-navy);}
.system-hero-price > p {font-size:.875rem;margin-top:5px;}
.system-actions {display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px;}
.system-button {display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:54px;padding:13px 21px;border:1px solid var(--so-teal);border-radius:7px;background:var(--so-teal);color:white!important;font-family:inherit;font-size:1rem;font-weight:700;line-height:1.6;text-align:left;cursor:pointer;transition:background .18s,box-shadow .18s;}
.system-button:hover {background:#005c53;box-shadow:0 5px 15px #05363218;}
.system-button--secondary {background:transparent;color:var(--so-navy)!important;border-color:#b2c9d2;}
.system-button--secondary:hover {background:#e3eff2;}
.system-button:disabled {opacity:.55;cursor:not-allowed;}
.system-note {font-size:.875rem;line-height:1.85;}
.system-workspace {min-width:0;position:relative;}
.system-workspace > figcaption,.system-mini-screen > figcaption {font-size:.875rem;color:var(--so-muted);text-align:right;margin-bottom:10px;}
.system-screen {background:#fff;border:1px solid #cbdce4;border-radius:12px;overflow:hidden;box-shadow:0 25px 60px #143d5717;}
.system-screen-top {display:flex;align-items:center;gap:10px;background:var(--so-navy);color:#fff;padding:15px 18px;font-size:.875rem;}
.system-screen-brand {font:800 1.2rem/1 Manrope,sans-serif;letter-spacing:-.07em;background:#fff;color:var(--so-navy);border-radius:5px;padding:9px 7px;}
.system-status-dot {width:7px;height:7px;flex-shrink:0;border-radius:50%;background:#7bd7c5;margin-left:auto;}
.system-screen-tabs {display:flex;gap:20px;padding:0 20px;font-size:.875rem;border-bottom:1px solid var(--so-line);color:var(--so-muted);}
.system-screen-tabs span {padding:16px 0 12px;}
.system-screen-tabs .is-selected {border-bottom:3px solid var(--so-teal);color:var(--so-teal);font-weight:700;}
.system-screen-content {padding:24px 20px 12px;}
.system-screen-content h2 {font-size:1.15rem;margin-bottom:18px;}
.system-table-scroll {overflow:auto;}
.system-screen table {border-collapse:collapse;width:100%;font-size:.875rem;min-width:400px;text-align:left;}
.system-screen th,.system-screen td {padding:15px 9px;border-bottom:1px solid #e6eef2;font-weight:400;white-space:nowrap;}
.system-screen thead th {background:#f3f7f9;font-weight:500;color:var(--so-muted);padding-top:9px;padding-bottom:9px;}
.system-screen tbody th {color:#234359;}
.system-status {display:inline-block;padding:2px 7px;border-radius:4px;background:#edf2f6;color:#405c70;}
.system-status--1 {background:#e4f6ef;color:#116249;}
.system-status--2 {background:#fff3dd;color:#785421;}
.system-screen-bottom {padding:17px 22px;font-size:.875rem;color:var(--so-teal);}
.system-connected {list-style:none;padding:22px 0 0;margin:0;display:flex;align-items:stretch;gap:20px;text-align:center;font-size:.875rem;font-weight:700;}
.system-connected li {flex:1;position:relative;padding:12px 6px;border:1px solid #bdd8df;background:#ffffffb3;border-radius:5px;}
.system-connected li+li:before {content:'→';position:absolute;left:-18px;top:50%;transform:translateY(-50%);color:#5d8797;}
.system-section {padding:84px 0;}
.system-section--tint {background:#f2f7fa;}
.system-section-heading {display:flex;align-items:baseline;gap:22px;max-width:930px;margin-bottom:36px;}
.system-section-heading > span {font:500 .875rem/1.5 Manrope,sans-serif;color:#006f65;border-top:2px solid #008476;padding-top:8px;flex-shrink:0;}
.system-pain-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;}
.system-pain {border-top:1px solid var(--so-line);padding-top:25px;}
.system-item-number {display:inline-block;font:500 .875rem/1.5 Manrope,sans-serif;color:#48817f;margin-bottom:18px;}
.system-pain p,.system-feature p,.system-reason p {margin-top:10px;}
.system-bridge {margin-top:38px!important;padding:22px 28px;border-radius:7px;background:#eff7f5;text-align:center;color:#17534b!important;font-weight:500;}
.system-feature-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
.system-feature {border:1px solid var(--so-line);border-radius:8px;background:white;padding:26px 28px;}
.system-feature-grid+.system-note {margin-top:24px;max-width:70em;}
.system-inline-cta {margin-top:32px;text-align:center;}
.system-scenarios {display:grid;gap:22px;}
.system-scenario {display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:40px;padding:32px;border:1px solid var(--so-line);border-radius:10px;align-items:center;}
.system-scenario h3 {font-size:1.5rem;margin:7px 0 25px;}
.system-flow {list-style:none;display:flex;flex-wrap:wrap;gap:13px;padding:0;margin:0;align-items:center;}
.system-flow li {position:relative;background:#eff5f8;border:1px solid #d9e6eb;padding:9px 12px;border-radius:4px;font-size:.875rem;}
.system-flow li+li:before {content:'›';position:absolute;left:-10px;color:#638592;}
.system-mini-screen {padding:15px 20px 10px;background:#f6f9fb;border:1px solid #d6e3e9;border-radius:7px;}
.system-mini-screen h4 {font-size:1rem;border-bottom:1px solid var(--so-line);padding-bottom:10px;}
.system-mini-screen dl {margin:0;font-size:.875rem;}
.system-mini-screen dl > div {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:14px;padding:10px 0;border-bottom:1px solid #e4edf1;}
.system-mini-screen dl > div:last-child {border-bottom:0;}
.system-mini-screen dt {color:var(--so-muted);}.system-mini-screen dd {margin:0;}
.system-section--navy {background:var(--so-navy);color:#fff;}
.system-section--navy .system-section-heading > span,.system-section--navy .system-item-number {color:#9cdccf;border-color:#6cd0bd;}
.system-reason-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;}
.system-reason {border-top:1px solid #ffffff30;padding-top:26px;}
.system-reason p {color:#d4e1ea;}
.system-section--navy .system-button {background:#b5efde;border-color:#b5efde;color:#103e38!important;}
.system-price-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.system-price {padding:30px;border:1px solid var(--so-line);border-radius:9px;background:#fff;}
.system-price--primary {border-top:4px solid var(--so-teal);padding-top:27px;background:#f1faf7;}
.system-price-amount {font-size:clamp(1.7rem,2.7vw,2.5rem);font-weight:800;letter-spacing:-.035em;line-height:1.4;margin-top:20px!important;color:var(--so-navy)!important;}
.system-price-tax {font-size:.875rem;margin:5px 0 21px!important;}
.system-cost-total {margin-top:24px;padding:22px 26px;background:#f3f7fa;border-left:3px solid #93b8c9;}
.system-cost-total strong {color:var(--so-navy);}
.system-cost-total p+p {font-size:.875rem;margin-top:8px;}
.system-cost-total+.system-note {margin-top:18px;}
.system-process {list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;padding:0;margin:0 0 30px;}
.system-process li {border-top:2px solid #b4cfd9;padding-top:24px;}
.system-process .system-process-demo {padding:20px;background:#e2f2ed;border-color:#007168;border-radius:0 0 7px 7px;}
.system-process-phase {display:inline-block;margin-bottom:8px;color:#00645b;font-size:.875rem;font-weight:700;line-height:1.65;}
.system-step {display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid #bed9df;background:#fff;border-radius:50%;font:.875rem/1 Manrope,sans-serif;margin-bottom:18px;color:var(--so-teal);}
.system-process h3 {font-size:1rem;}.system-process p {font-size:.9375rem;margin-top:10px;}
.system-faq-layout {display:grid;grid-template-columns:1fr 2fr;gap:64px;}
.system-faq details {border-top:1px solid var(--so-line);}
.system-faq details:last-child {border-bottom:1px solid var(--so-line);}
.system-faq summary {display:flex;align-items:baseline;gap:15px;cursor:pointer;padding:23px 0;font-weight:600;list-style:none;}
.system-faq summary::-webkit-details-marker {display:none;}
.system-faq summary > span:first-child {color:var(--so-teal);font-family:Manrope,sans-serif;}
.system-faq-toggle {margin-left:auto;font-size:1.4rem;line-height:1;flex-shrink:0;}
.system-faq details[open] .system-faq-toggle {transform:rotate(45deg);}
.system-faq details p {padding:0 30px 24px;}
.system-contact {background:#edf5f6;border-top:1px solid #dce9ec;}
.system-contact-grid {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:64px;align-items:start;}
.system-contact-copy h2 {margin:18px 0;}.system-contact-copy .system-note {margin-top:25px;}
.system-provider {border-top:1px solid #c6dce2;padding-top:23px;margin-top:34px;font-size:.875rem;}
.system-provider strong {font-size:1.25rem;display:block;margin:7px 0;}.system-provider a {text-decoration:underline;display:inline-block;margin-top:12px;color:var(--so-navy);}
.system-form-panel {padding:32px;background:white;border:1px solid #d0e1e6;border-radius:10px;}
.system-inquiry {margin:0!important;}.system-inquiry .form-fields {border:0;padding:0;margin:0;min-width:0;}
.system-form-grid {display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.system-inquiry .form-field {margin:0;min-width:0;}.system-field-wide {grid-column:1/-1;}
.system-inquiry label {font-size:.9375rem;font-weight:600;line-height:1.6;}
.system-inquiry .field-tag {font-size:.875rem;font-weight:400;white-space:nowrap;}
.system-inquiry :is(input:not([type=checkbox]),textarea) {font:inherit;width:100%;padding:11px 12px;margin-top:8px;border:1px solid #b8ced8;border-radius:4px;box-shadow:none;min-height:48px;background:#fff;color:var(--so-navy);}
.system-inquiry textarea {resize:vertical;}
.system-inquiry .consent-panel {padding:20px 0;margin:0;background:none;border:0;font-size:.875rem;}
.system-inquiry .consent-panel a {text-decoration:underline;color:var(--so-teal);display:inline-block;margin-bottom:14px;}
.system-inquiry .consent-panel label {display:flex;align-items:flex-start;gap:10px;font-size:.875rem;font-weight:400;}
.system-inquiry input[type=checkbox] {width:20px;height:20px;flex-shrink:0;margin-top:3px;accent-color:var(--so-teal);}
.system-inquiry .form-submit {margin-top:20px;width:100%;}
.system-inquiry .field-help {font-size:.875rem;margin-top:18px;}.system-inquiry .field-help a {text-decoration:underline;}
.system-inquiry .field-error {font-size:.875rem;color:#a12a2a;}
.system-mobile-consult {display:none;}
.system-service-card {background:#102f4b!important;border:1px solid #264c6a!important;color:#fff!important;}
.specialist-service.system-service-card {padding:32px 28px;border-radius:12px;min-width:0;}
.system-service-card .business-label,.system-service-card .solution-meta {color:#c2d8e8;letter-spacing:.035em;}
.system-service-card .solution-meta {padding-right:62px;margin-bottom:32px;}
.system-service-card .solution-meta > span:first-child:not(:last-child) {color:#ffc15a;border-color:#55728b;}
.system-service-layout {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center;}
.system-service-card .system-demo-feature {min-width:0;margin:0;color:#fff;font-size:clamp(2rem,3.8vw,3.75rem);font-weight:700;line-height:1.5;letter-spacing:-.025em;overflow-wrap:anywhere;text-wrap:balance;}
.system-service-card .system-demo-feature > span,.system-service-card .system-demo-feature > strong {display:block;}
.system-service-card .system-demo-feature > strong {color:#ffc15a;font-weight:800;}
.specialist-service.system-service-card .system-demo-feature {margin:24px 0 28px;font-size:clamp(1.7rem,2.6vw,2.5rem);color:#fff;line-height:1.5;}
html[lang="my"] .system-service-card .system-demo-feature {letter-spacing:normal;line-height:1.85;}
.system-service-details {min-width:0;border-left:1px solid #55728b;padding-left:36px;}
.system-service-card .system-service-details h2,.system-service-card .system-service-details h3 {color:#fff;font-size:clamp(1.3rem,2vw,1.75rem);font-weight:600;line-height:1.65;text-wrap:balance;margin:0 0 14px;padding:0;}
.system-service-card .system-service-details > p {color:#e0ebf3;margin:0;font-size:1rem;line-height:1.9;}
.system-service-card .system-service-fees {font-size:.875rem!important;color:#c2d8e8!important;margin:18px 0 0!important;}
.specialist-service.system-service-card .system-service-details {border-left:0;border-top:1px solid #55728b;padding:24px 0 28px;}
.specialist-service.system-service-card .system-service-details h3 {font-size:1.25rem;}
.system-service-card .text-link {color:#ffc15a;width:100%;justify-content:space-between;gap:16px;text-decoration:none;}
.system-service-card .text-link:hover {color:#ffda91;text-decoration:underline;text-underline-offset:5px;}
.system-service-card:focus-visible,.system-service-card .text-link:focus-visible {outline:3px solid #ffc15a;outline-offset:-5px;}
.system-service-card .solution-arrow {color:#102f4b;border-color:#ffc15a;background:#ffc15a;}
.system-service-card:hover .solution-arrow {color:#102f4b;border-color:#ffda91;background:#ffda91;}
.system-service-card--directory {margin-top:22px;padding:34px 38px!important;border-radius:12px;position:relative;min-height:0!important;overflow:hidden;}
.system-service-card--directory::before {content:'';position:absolute;inset:0 0 auto;height:4px;background:#246ccc;}
.system-service-card--directory .solution-arrow {position:absolute;right:30px;top:32px;}
.specialist-services:has(.system-service-card) {grid-template-columns:repeat(3,minmax(0,1fr));}
@media(max-width:900px) {.system-service-layout {grid-template-columns:minmax(0,1fr);gap:28px;}.system-service-card .system-service-details {border-left:0;border-top:1px solid #55728b;padding:24px 0 0;}.specialist-service.system-service-card .system-service-details {padding-bottom:28px;}.system-service-card .system-demo-feature {font-size:clamp(2rem,6vw,3.5rem);}.specialist-service.system-service-card .system-demo-feature {font-size:clamp(2rem,6vw,3.5rem);}}
@media(min-width:901px) {.engineering-options:has(> :nth-child(3):last-child) > :last-child {grid-column:1/-1;}}
@media(max-width:1100px) {.system-hero-grid {gap:30px;}.system-actions {flex-direction:column;align-items:flex-start;}.system-pain-grid,.system-reason-grid {grid-template-columns:repeat(2,minmax(0,1fr));}.system-process {gap:16px;}.system-contact-grid {gap:35px;}.system-price {padding:22px;}.system-price--primary {padding-top:19px;}}
@media(max-width:900px) {.system-hero-grid {grid-template-columns:1fr;gap:38px;}.system-workspace {width:100%;max-width:680px;margin-inline:auto!important;}.system-hero-copy {max-width:720px;}.system-actions {flex-direction:row;}.system-hero {padding-bottom:50px;}.system-section {padding:60px 0;}.system-contact-grid,.system-faq-layout {grid-template-columns:1fr;gap:28px;}.system-faq-layout .system-section-heading {margin-bottom:0;}.system-scenario {gap:22px;padding:24px;grid-template-columns:1fr;}.system-mini-screen {max-width:520px;}.system-process {grid-template-columns:1fr;gap:0;}.system-process li {display:flex;gap:18px;padding:22px 0;border-top:1px solid var(--so-line);}.system-step {flex-shrink:0;margin:0;}.specialist-services:has(.system-service-card) {grid-template-columns:1fr;}}
@media(max-width:600px) {.system-breadcrumb {margin-bottom:30px;}.system-offer h1 {font-size:1.8rem;}.system-hero-grid {gap:30px;}.system-actions {flex-direction:column;}.system-actions .system-button {width:100%;}.system-section-heading {gap:16px;margin-bottom:26px;}.system-feature-grid,.system-price-grid,.system-pain-grid,.system-reason-grid {grid-template-columns:1fr;}.system-feature {padding:24px;}.system-pain {padding-top:20px;}.system-pain .system-item-number {margin-bottom:10px;}.system-bridge {padding:20px;}.system-screen-content {padding:18px 10px 8px;}.system-screen-tabs {gap:14px;padding:0 12px;}.system-connected {gap:15px;}.system-connected li {padding:9px 4px;}.system-connected li+li:before {left:-14px;}.system-scenario {padding:20px;}.system-scenario h3 {font-size:1.3rem;}.system-form-panel {padding:24px 18px;}.system-form-grid {grid-template-columns:1fr;}.system-mobile-consult {position:sticky;bottom:0;z-index:12;display:flex;align-items:center;gap:12px;padding:10px 18px max(10px,env(safe-area-inset-bottom));border-top:1px solid #c4dce1;background:#fffffffa;box-shadow:0 -6px 20px #10354b0a;}.system-mobile-consult .system-button {font-size:.9375rem;min-height:46px;padding:10px 15px;flex-shrink:0;}.system-mobile-consult > span {font-size:.875rem;line-height:1.5;}.system-service-card--directory {padding:26px!important;}.system-service-card--directory .solution-arrow {top:22px;right:20px;}.system-service-card--directory .solution-meta {padding-right:35px;}}
@media(prefers-reduced-motion:reduce) {.system-offer * {scroll-behavior:auto!important;transition:none!important;}}
@media print {.system-mobile-consult,.system-form-panel,.system-inline-cta {display:none!important;}.system-section {padding:25px 0;}.system-hero {padding:20px 0;}.system-screen {box-shadow:none;}.system-offer details > p {display:block!important;}.system-offer article {break-inside:avoid;}}
