:root {
    --ink: #17213b;
    --ink-soft: #536078;
    --navy: #0d1632;
    --navy-soft: #162448;
    --paper: #fcfbf7;
    --paper-warm: var(--paper);
    --line: #e5e4dc;
    --orange: #f6a05a;
    --orange-deep: #dc7540;
    --mint: #b9e9d4;
    --lavender: #c5c9ff;
    --radius: 12px;
    --shadow: 0 4px 24px rgba(20, 30, 60, .08);
    --shell: 100%;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--paper); font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", Arial, sans-serif; line-height: 1.6; -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { border: 0; cursor: pointer; }
.site-noise { position: fixed; inset: 0; pointer-events: none; opacity: .035; z-index: 10; background-image: radial-gradient(rgba(20, 30, 60, .3) .7px, transparent .7px); background-size: 5px 5px; }
.shell { width: min(var(--shell), calc(100% - 64px)); margin: 0 auto; }
.site-header { position: fixed; inset: 0 0 auto; z-index: 20; color: #fff; border-bottom: 1px solid rgba(255,255,255,.16); transition: all .2s ease; }
.site-header.scrolled { background: rgba(13, 22, 50, .9); border-bottom-color: rgba(255,255,255,.22); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 8px 30px rgba(8, 15, 37, .16); }
.nav-wrap { display: flex; align-items: center; justify-content: space-between; min-height: 84px; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 11px; flex: 0 0 auto; }
.brand-mark { position: relative; width: 31px; height: 31px; border: 2px solid var(--orange); border-radius: 50%; display: inline-grid; place-items: center; transform: rotate(45deg); }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; background: var(--orange); border-radius: 2px; }
.brand-mark::before { width: 8px; height: 2px; top: -5px; box-shadow: 0 35px 0 var(--orange); }
.brand-mark::after { width: 2px; height: 8px; left: -5px; box-shadow: 35px 0 0 var(--orange); }
.brand-mark span { width: 11px; height: 11px; border-radius: 3px; background: linear-gradient(135deg, var(--orange), #ffd088); box-shadow: 0 0 0 3px rgba(246, 160, 90, .13); }
.brand-mark.small { width: 22px; height: 22px; border-width: 1.5px; }
.brand-mark.small::before { width: 5px; top: -4px; box-shadow: 0 26px 0 var(--orange); }
.brand-mark.small::after { height: 5px; left: -4px; box-shadow: 26px 0 0 var(--orange); }
.brand-mark.small span { width: 8px; height: 8px; }
.brand-copy { display: grid; line-height: 1; gap: 5px; }
.brand-copy strong { font-size: 16px; letter-spacing: .08em; }
.brand-copy small { font-size: 8px; letter-spacing: .22em; opacity: .58; }
.site-nav { display: flex; align-items: center; gap: 34px; margin-left: auto; }
.site-nav a, .text-link { position: relative; color: rgba(255,255,255,.7); font-size: 13px; transition: all .2s ease; }
.site-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 2px; background: var(--orange); transition: all .2s ease; }
.site-nav a:hover, .site-nav a:focus-visible { color: #fff; }
.site-nav a:hover::after, .site-nav a:focus-visible::after { right: 0; }
.nav-actions { display: flex; align-items: center; gap: 22px; }
.text-link:hover, .text-link:focus-visible { color: #fff; }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 19px; padding: 0 21px; border-radius: 10px; font-size: 13px; font-weight: 700; letter-spacing: .03em; transition: all .2s ease; }
.button span { font-size: 17px; line-height: 1; transition: transform .2s ease; }
.button:hover, .button:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(13, 22, 50, .13); }
.button:hover span, .button:focus-visible span { transform: translateX(3px); }
.button-sm { min-height: 40px; padding: 0 16px; font-size: 12px; }
.button-light { color: var(--navy); background: #fffdf7; }
.button-primary { color: var(--navy); background: linear-gradient(135deg, #ffc17b, var(--orange)); box-shadow: 0 9px 24px rgba(246, 160, 90, .2); }
.button-ghost { color: #fff; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.06); }
.button-ghost:hover, .button-ghost:focus-visible { border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.12); }
.menu-toggle { display: none; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.25); border-radius: 9px; background: transparent; }
.menu-toggle span { display: block; width: 17px; height: 1px; margin: 5px auto; background: #fff; transition: all .2s ease; }

.section-dark { position: relative; overflow: hidden; color: #fff; background: var(--navy); }
.hero { min-height: 795px; padding: 166px 0 66px; background: radial-gradient(circle at 76% 30%, rgba(80, 99, 175, .25), transparent 32%), linear-gradient(128deg, #0d1632 0%, #101b3b 52%, #182754 100%); }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .13; background: linear-gradient(135deg, transparent 40%, rgba(255,255,255,.14) 40.1%, transparent 40.3%); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.hero-glow-one { width: 410px; height: 410px; right: -170px; top: 150px; border: 1px solid rgba(246,160,90,.34); box-shadow: 0 0 0 24px rgba(246,160,90,.04), 0 0 0 56px rgba(246,160,90,.035); }
.hero-glow-two { width: 170px; height: 170px; left: 33%; bottom: -85px; background: rgba(185,233,212,.09); }
.hero-grid { position: relative; display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 72px; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--orange-deep); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.eyebrow-light { color: var(--orange); }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 5px rgba(246,160,90,.14); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 700; letter-spacing: -.04em; }
h1 { max-width: 610px; margin: 25px 0 23px; font-size: clamp(45px, 5.2vw, 76px); line-height: 1.08; }
h1 em, h2 em { color: var(--orange); font-style: normal; }
.hero-lead { max-width: 500px; color: rgba(255,255,255,.64); font-size: 15px; line-height: 1.9; }
.hero-actions { display: flex; gap: 12px; margin-top: 34px; }
.hero-proof { display: flex; align-items: center; gap: 13px; margin-top: 55px; color: rgba(255,255,255,.48); font-size: 11px; line-height: 1.45; }
.hero-proof p { margin-bottom: 0; }
.hero-proof strong { color: rgba(255,255,255,.83); font-weight: 500; }
.proof-avatars { display: flex; align-items: center; }
.proof-avatars span, .proof-avatars b { width: 29px; height: 29px; display: grid; place-items: center; margin-left: -7px; border: 2px solid var(--navy); border-radius: 50%; color: var(--navy); font-size: 10px; background: var(--mint); }
.proof-avatars span:first-child { margin-left: 0; background: var(--orange); }
.proof-avatars span:nth-child(2) { background: var(--lavender); }
.proof-avatars b { color: #fff; background: rgba(255,255,255,.12); font-weight: 500; }
.hero-visual { position: relative; min-width: 0; z-index: 1; }
.dashboard-window { position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 15px; background: #f7f8fb; box-shadow: 0 30px 70px rgba(0,0,0,.27), 0 0 0 10px rgba(255,255,255,.025); transform: perspective(1600px) rotateY(-4deg) rotateX(2deg); }
.window-bar { height: 39px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; color: #66718a; font-size: 9px; background: #fff; border-bottom: 1px solid #e6e8ef; }
.window-dots { display: flex; gap: 5px; }
.window-dots i { width: 6px; height: 6px; border-radius: 50%; background: #e3a05f; }
.window-dots i:nth-child(2) { background: #d7d9e1; }.window-dots i:nth-child(3) { background: #a4d4c4; }
.window-status { display: flex; align-items: center; gap: 5px; color: #5b9e82; }.window-status i { width: 5px; height: 5px; border-radius: 50%; background: #5db58d; }
.dashboard-main { display: flex; min-height: 431px; color: #1b2742; }.dashboard-side { width: 112px; padding: 17px 10px; background: #f2f4f9; border-right: 1px solid #e2e6ee; }.mini-brand { display: flex; align-items: center; gap: 7px; margin-bottom: 27px; font-size: 11px; }.side-label { padding: 0 8px 8px; color: #a2a9b8; font-size: 8px; }.side-label-bottom { margin-top: 24px; }.side-item { display: flex; align-items: center; gap: 7px; padding: 8px; margin-bottom: 3px; border-radius: 6px; color: #758097; font-size: 8px; }.side-item b { font-size: 11px; font-weight: 400; }.side-item.active { color: #263253; background: #fff; box-shadow: 0 3px 10px rgba(25, 38, 72, .07); }.side-item.active b { color: var(--orange-deep); }.side-item.muted { color: #a6adbd; }
.dashboard-content { flex: 1; min-width: 0; padding: 20px 22px; }.dash-heading, .panel-title, .preview-title, .preview-foot { display: flex; align-items: center; justify-content: space-between; }.dash-kicker { color: #a1a8b9; font-size: 8px; letter-spacing: .15em; }.dash-heading h2 { margin: 2px 0 0; font-size: 22px; letter-spacing: -.05em; }.dash-avatar { width: 26px; height: 26px; border-radius: 50%; color: #fff; background: var(--navy); font-size: 9px; }
.dash-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 22px 0 10px; }.dash-stat { min-height: 76px; padding: 11px 12px; border: 1px solid #e9ebf0; border-radius: 8px; background: #fff; }.dash-stat > span { color: #929aae; font-size: 8px; }.dash-stat strong { display: block; margin: 4px 0 2px; font-size: 24px; line-height: 1; letter-spacing: -.08em; }.dash-stat strong small { font-size: 12px; }.dash-stat > small { font-size: 8px; }.dash-stat em { color: #b1b5c0; font-style: normal; }.up { color: #5c9f81; }.warning { color: #d4875a; }
.dash-panels { display: grid; grid-template-columns: .85fr 1.15fr; gap: 10px; }.dash-panel, .dash-table { padding: 13px; border: 1px solid #e9ebf0; border-radius: 8px; background: #fff; }.panel-title { color: #33405d; font-size: 9px; font-weight: 700; }.panel-title a { color: #a0a7b5; font-size: 8px; font-weight: 400; }.panel-period { color: #a1a8b9; font-size: 8px; font-weight: 400; }.health-score { position: relative; display: flex; align-items: baseline; margin: 18px 0 10px; }.health-score strong { font-size: 32px; line-height: 1; letter-spacing: -.1em; }.health-score > span { color: #a4abb9; font-size: 9px; }.score-ring { position: absolute; right: 10px; top: -8px; width: 46px; height: 46px; border: 5px solid #edf2f1; border-top-color: #62b995; border-right-color: #62b995; border-radius: 50%; transform: rotate(28deg); }.score-ring i { position: absolute; inset: 7px; border: 1px dashed #dce9e2; border-radius: 50%; }.health-legend { display: grid; gap: 5px; color: #9ba3b3; font-size: 8px; }.health-legend span { display: flex; align-items: center; gap: 6px; }.health-legend i { width: 5px; height: 5px; border-radius: 50%; }.legend-good { background: #62b995; }.legend-warn { background: #f2ad6c; }.legend-risk { background: #aeb6f3; }.mini-chart { position: relative; height: 92px; margin-top: 15px; padding: 0 0 15px 18px; }.chart-grid { position: absolute; inset: 0 0 15px 0; display: grid; align-content: space-between; }.chart-grid i { height: 1px; background: #f0f1f4; }.chart-line { position: absolute; inset: 5px 0 19px; overflow: hidden; background: linear-gradient(150deg, transparent 0 8%, rgba(185,233,212,.18) 8% 9%, transparent 9% 100%); }.chart-line::before { content: ""; position: absolute; inset: 22% 0 0; clip-path: polygon(0 73%, 17% 62%, 34% 75%, 50% 42%, 67% 54%, 84% 28%, 100% 9%, 100% 100%, 0 100%); background: linear-gradient(180deg, rgba(111,188,155,.25), rgba(111,188,155,0)); }.chart-line::after { content: ""; position: absolute; left: 0; right: 0; top: 22%; height: 2px; background: #6abd9d; clip-path: polygon(0 73%, 17% 62%, 34% 75%, 50% 42%, 67% 54%, 84% 28%, 100% 9%, 100% 15%, 84% 34%, 67% 60%, 50% 48%, 34% 81%, 17% 68%, 0 79%); }.chart-axis { position: absolute; left: 18px; right: 0; bottom: 0; display: flex; justify-content: space-between; color: #b0b5c1; font-size: 7px; }
.dash-table { margin-top: 10px; }.dash-table .panel-title { margin-bottom: 9px; }.table-row { display: grid; grid-template-columns: 1.5fr .7fr 1fr .5fr; align-items: center; gap: 8px; min-height: 28px; border-top: 1px solid #f0f1f4; color: #858ea2; font-size: 8px; }.table-row strong { color: #45526c; font-size: 8px; }.table-head { min-height: 21px; color: #b0b5c1; font-size: 7px; border: 0; }.table-progress { display: flex; align-items: center; gap: 5px; }.table-progress i { width: 31px; height: 3px; border-radius: 4px; background: linear-gradient(90deg, #6abd9d 78%, #e8efec 78%); }.table-progress i.progress-64 { background: linear-gradient(90deg, #6abd9d 64%, #e8efec 64%); }.status-pill { justify-self: start; padding: 2px 6px; border-radius: 10px; font-size: 7px; font-style: normal; }.status-pill.good { color: #57977e; background: #e8f6ef; }.status-pill.attention { color: #c88354; background: #fff0e5; }
.float-card { position: absolute; display: flex; align-items: center; gap: 9px; padding: 10px 13px; border: 1px solid rgba(255,255,255,.22); border-radius: 9px; color: #fff; background: rgba(27, 40, 78, .75); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 12px 27px rgba(0,0,0,.2); }.float-card-top { top: 17%; right: -26px; }.float-card-bottom { bottom: 2%; left: -28px; }.float-icon { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 7px; color: #0f3b35; background: var(--mint); font-size: 14px; }.float-icon.warm { color: #543422; background: #ffd096; }.float-card strong, .float-card small { display: block; }.float-card strong { font-size: 10px; }.float-card small { margin-top: 2px; color: rgba(255,255,255,.53); font-size: 8px; }
.hero-foot { position: absolute; right: 0; bottom: 24px; left: 0; display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.42); font-size: 9px; letter-spacing: .13em; }.hero-foot-line { width: 55px; height: 1px; background: rgba(255,255,255,.25); }.hero-foot-scroll { margin-left: auto; letter-spacing: .05em; }.hero-foot-scroll b { margin-left: 8px; color: var(--orange); font-size: 14px; }
.signal-strip { border-bottom: 1px solid var(--line); background: var(--paper-warm); }.signal-inner { display: flex; align-items: center; justify-content: space-between; min-height: 75px; gap: 28px; }.signal-label, .signal-note { color: #a3a096; font-size: 9px; letter-spacing: .16em; }.signal-items { display: flex; align-items: center; gap: 18px; color: #586178; font-size: 12px; }.signal-items i { width: 4px; height: 4px; border-radius: 50%; background: var(--orange); }
.section { padding: 125px 0; }.section-heading h2, .experience-copy h2, .about-copy h2, .contact-copy h2 { margin: 18px 0 0; font-size: clamp(36px, 4.2vw, 58px); line-height: 1.13; }.split-heading { display: flex; align-items: end; justify-content: space-between; gap: 80px; }.split-heading > p { max-width: 340px; margin-bottom: 6px; color: var(--ink-soft); font-size: 14px; line-height: 1.9; }.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 66px; }.feature-card { min-height: 325px; display: flex; flex-direction: column; justify-content: space-between; padding: 23px; border: 1px solid #e9e7df; border-radius: 16px; background: #fff; transition: all .2s ease; }.feature-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }.feature-card-large { color: #fff; border-color: transparent; background: linear-gradient(145deg, #243663, #101a38); }.feature-card-soft { background: #ecf1fb; }.feature-card-warm { background: #fff0e1; }.feature-card-dark { color: #fff; background: #212a45; }.feature-card-top { display: flex; justify-content: space-between; align-items: center; }.feature-index { color: #a2a7b5; font-size: 10px; letter-spacing: .14em; }.feature-card-large .feature-index, .feature-card-dark .feature-index { color: rgba(255,255,255,.42); }.feature-symbol { color: var(--orange-deep); font-size: 24px; }.feature-card-large .feature-symbol, .feature-card-dark .feature-symbol { color: var(--orange); }.feature-card h3 { margin: 0 0 12px; font-size: 26px; }.feature-card p { max-width: 230px; margin: 0; color: var(--ink-soft); font-size: 12px; line-height: 1.85; }.feature-card-large p, .feature-card-dark p { color: rgba(255,255,255,.56); }.feature-line { display: flex; align-items: center; gap: 9px; color: #9da2af; font-size: 9px; }.feature-line i { width: 22px; height: 1px; background: var(--orange); }.section-product { background: var(--paper); }.workflow-section { padding-top: 100px; background: var(--paper-warm); }.centered-heading { text-align: center; }.centered-heading p { max-width: 510px; margin: 22px auto 0; color: var(--ink-soft); font-size: 14px; line-height: 1.9; }.workflow-board { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; margin-top: 77px; }.workflow-line { position: absolute; top: 51px; right: 11%; left: 11%; height: 1px; background: #dadbd6; }.workflow-line i { display: block; width: 56%; height: 100%; background: linear-gradient(90deg, var(--orange), var(--mint)); }.workflow-step { position: relative; z-index: 1; text-align: center; }.step-number { display: block; margin-bottom: 15px; color: #adafa9; font-size: 10px; letter-spacing: .12em; }.step-node { width: 74px; height: 74px; display: grid; place-items: center; margin: 0 auto 21px; border: 1px solid #d9dbd5; border-radius: 50%; color: #8c918c; background: var(--paper-warm); }.step-node b { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: #7a817f; background: #e8e8e1; font-size: 16px; font-weight: 600; }.workflow-step.active .step-node { border-color: var(--orange); box-shadow: 0 0 0 9px rgba(246,160,90,.1); }.workflow-step.active .step-node b { color: var(--navy); background: var(--orange); }.step-number, .workflow-step h3, .workflow-step p { transition: all .2s ease; }.workflow-step h3 { margin: 0 0 5px; font-size: 19px; }.workflow-step p { margin: 0; color: #8c918d; font-size: 11px; line-height: 1.8; }
.experience-section { padding: 138px 0; background: radial-gradient(circle at 85% 45%, rgba(97, 126, 226, .2), transparent 31%), #111b3b; }.experience-orb { position: absolute; top: 7%; right: -8%; width: 520px; height: 520px; border: 1px solid rgba(197,201,255,.15); border-radius: 50%; box-shadow: 0 0 0 45px rgba(197,201,255,.035), 0 0 0 92px rgba(197,201,255,.025); }.experience-grid { position: relative; display: grid; grid-template-columns: .7fr 1.3fr; align-items: center; gap: 100px; }.experience-copy h2 { font-size: clamp(38px, 4.1vw, 57px); }.experience-copy > p { max-width: 390px; margin: 23px 0 34px; color: rgba(255,255,255,.57); font-size: 14px; line-height: 1.9; }.experience-tabs { display: flex; flex-wrap: wrap; gap: 7px; }.experience-tab { padding: 10px 13px; border-radius: 7px; color: rgba(255,255,255,.55); background: rgba(255,255,255,.07); font-size: 11px; transition: all .2s ease; }.experience-tab:hover, .experience-tab:focus-visible, .experience-tab.active { color: var(--navy); background: var(--orange); }.experience-preview { overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-radius: 14px; background: #f8f9fb; box-shadow: 0 25px 70px rgba(0,0,0,.22); }.preview-top { display: flex; justify-content: space-between; align-items: center; padding: 14px 20px; color: #8d96a8; border-bottom: 1px solid #e7e9ee; background: #fff; font-size: 10px; }.preview-badge { display: flex; align-items: center; gap: 6px; color: #66a78c; font-size: 9px; }.preview-badge i { width: 5px; height: 5px; border-radius: 50%; background: #6ab995; }.preview-body { display: none; padding: 25px 30px 19px; min-height: 360px; color: #1c2944; }.preview-body.active { display: block; }.preview-title { margin-bottom: 27px; }.preview-title small { color: #9da6b7; font-size: 8px; letter-spacing: .16em; }.preview-title h3 { margin: 3px 0 0; font-size: 22px; }.preview-date { color: #9da6b7; font-size: 9px; }.preview-chart { position: relative; height: 185px; padding: 0 5px 23px 37px; border-bottom: 1px solid #ebedf1; }.bar-labels { position: absolute; top: -5px; bottom: 23px; left: 0; display: flex; flex-direction: column; justify-content: space-between; color: #c1c5cd; font-size: 8px; }.bars { height: 100%; display: flex; align-items: end; justify-content: space-around; gap: 21px; border-bottom: 1px solid #ebedf1; background: repeating-linear-gradient(to bottom, transparent 0 43px, #f0f1f4 44px); }.bars i { width: min(34px, 9%); height: 62%; border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, #b8d8cc, #e3f0eb); }.bars i.bar-70 { height: 70%; }.bars i.bar-58 { height: 58%; }.bars i.bar-78 { height: 78%; }.bars i.bar-72 { height: 72%; }.bars i.bar-88 { height: 88%; }.bars i.bar-94 { height: 94%; }.bars i:nth-child(2n) { background: linear-gradient(180deg, #c4c9f2, #eaebfa); }.bars i.bar-current { background: linear-gradient(180deg, var(--orange), #ffd398); box-shadow: 0 7px 14px rgba(246,160,90,.22); }.bar-axis { position: absolute; bottom: 0; left: 36px; right: 0; display: flex; justify-content: space-around; color: #aeb4c0; font-size: 8px; }.preview-foot { gap: 20px; margin-top: 20px; color: #9099ab; font-size: 10px; }.preview-foot > span { white-space: nowrap; }.preview-foot strong { color: #2c3955; font-size: 13px; }.preview-foot i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; }.dot-mint { background: #72b99c; }.dot-orange { background: var(--orange); }.preview-link { margin-left: auto; color: #7f8ca4; }.plan-list, .risk-list { display: grid; gap: 13px; margin: 37px 0 35px; }.plan-list > div, .risk-list > div { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 11px; padding-bottom: 13px; border-bottom: 1px solid #edf0f3; }.plan-dot, .risk-icon { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 7px; color: #fff; font-size: 11px; }.plan-dot.done { background: #73b99d; }.plan-dot.progress { color: #384462; background: #d9ddfa; }.plan-dot.pending { color: #a4acb9; background: #eef0f4; }.plan-list strong, .risk-list strong { display: block; font-size: 11px; }.plan-list small, .risk-list small { display: block; margin-top: 2px; color: #a2aaba; font-size: 9px; }.plan-list em, .risk-list em { color: #73aa92; font-size: 9px; font-style: normal; }.plan-list .plan-progress { color: #d68855; }.risk-icon.high { color: #fff; background: #e38c60; }.risk-icon.medium { color: #66472f; background: #ffd08d; }.risk-icon.low { color: #4e997a; background: #dff3e9; }.risk-list em { color: #d07c50; }.risk-list > div:last-child em { color: #73aa92; }
.video-section { background: var(--paper); }.video-grid { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 84px; }.video-copy h2 { margin: 18px 0 0; font-size: clamp(36px, 4.1vw, 56px); line-height: 1.13; }.video-copy > p { max-width: 420px; margin: 24px 0 0; color: var(--ink-soft); font-size: 14px; line-height: 1.9; }.video-environment-button { margin-top: 32px; }.video-environment-note { margin-top: 18px !important; color: #9b9c97 !important; font-size: 11px !important; line-height: 1.7 !important; }.video-environment-note a { color: var(--orange-deep); transition: all .2s ease; }.video-environment-note a:hover, .video-environment-note a:focus-visible { color: var(--navy); }.video-frame { overflow: hidden; margin: 0; border: 1px solid #e3e5ea; border-radius: 18px; background: #111b3b; box-shadow: 0 18px 45px rgba(20,30,60,.13); }.video-frame-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; color: #8e98ad; border-bottom: 1px solid #e6e8ee; background: #fff; font-size: 9px; letter-spacing: .13em; }.video-frame-head span:last-child { display: flex; align-items: center; gap: 6px; color: #6aa98b; letter-spacing: 0; }.video-frame-head i { width: 5px; height: 5px; border-radius: 50%; background: #6ab995; }.video-frame video { display: block; width: 100%; aspect-ratio: 16 / 9; background: #111b3b; }
.about-section { background: var(--paper); }.about-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 115px; }.about-visual { position: relative; min-height: 410px; overflow: hidden; border-radius: 18px; background: radial-gradient(circle at 45% 48%, rgba(247,184,110,.34), transparent 25%), linear-gradient(142deg, #273761, #101a38); }.about-visual::before { content: ""; position: absolute; inset: 0; opacity: .18; background: linear-gradient(25deg, transparent 46%, rgba(255,255,255,.5) 46.2%, transparent 46.4%), linear-gradient(120deg, transparent 54%, rgba(255,255,255,.25) 54.2%, transparent 54.4%); }.sun-disc { position: absolute; top: 50%; left: 50%; width: 130px; height: 130px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: radial-gradient(circle at 35% 35%, #ffd998, var(--orange) 54%, #d87947); box-shadow: 0 0 0 18px rgba(246,160,90,.07), 0 0 0 47px rgba(246,160,90,.04); transform: translate(-50%, -50%); }.sun-disc span { color: #fff8e9; font-size: 54px; font-weight: 300; }.about-orbit { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(255,255,255,.19); border-radius: 50%; transform: translate(-50%, -50%) rotate(-25deg); }.orbit-one { width: 310px; height: 130px; }.orbit-two { width: 410px; height: 195px; transform: translate(-50%, -50%) rotate(33deg); }.about-note { position: absolute; right: 25px; bottom: 23px; padding: 14px 17px; border: 1px solid rgba(255,255,255,.15); border-radius: 9px; color: #fff; background: rgba(11,18,40,.42); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }.about-note span, .about-note strong { display: block; }.about-note span { color: var(--orange); font-size: 8px; letter-spacing: .16em; }.about-note strong { margin-top: 6px; font-size: 14px; line-height: 1.45; }.about-copy > p { max-width: 430px; margin: 24px 0 0; color: var(--ink-soft); font-size: 14px; line-height: 1.95; }.about-signature { display: flex; align-items: center; gap: 12px; margin-top: 35px; }.signature-mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: var(--navy); font-size: 21px; }.about-signature strong, .about-signature small { display: block; }.about-signature strong { font-size: 13px; }.about-signature small { margin-top: 3px; color: #a7a69e; font-size: 10px; }
.contact-section { padding: 0 0 100px; background: var(--paper); }.contact-card { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 50px; min-height: 300px; padding: 57px 76px; border-radius: 18px; color: #fff; background: linear-gradient(115deg, #17244b, #0d1632); }.contact-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, transparent 47%, rgba(255,255,255,.07) 47.1%, transparent 47.3%); }.contact-glow { position: absolute; right: -45px; top: -120px; width: 380px; height: 380px; border: 1px solid rgba(246,160,90,.38); border-radius: 50%; box-shadow: 0 0 0 25px rgba(246,160,90,.04), 0 0 0 58px rgba(246,160,90,.03); }.contact-copy, .button-contact { position: relative; z-index: 1; }.contact-copy h2 { margin-top: 16px; font-size: clamp(37px, 4vw, 54px); }.contact-copy p { max-width: 480px; margin: 18px 0 0; color: rgba(255,255,255,.57); font-size: 13px; line-height: 1.8; }.button-contact { flex: 0 0 auto; min-width: 154px; }
.site-footer { color: #fff; background: #0b1229; }.footer-main { display: flex; align-items: center; justify-content: space-between; gap: 35px; min-height: 125px; }.footer-brand { color: #fff; }.footer-links { display: flex; gap: 28px; color: rgba(255,255,255,.53); font-size: 11px; }.footer-links a { transition: all .2s ease; }.footer-links a:hover, .footer-links a:focus-visible { color: var(--orange); }.footer-location { text-align: right; }.footer-location span, .footer-location small { display: block; }.footer-location span { color: rgba(255,255,255,.7); font-size: 11px; }.footer-location small { margin-top: 4px; color: rgba(255,255,255,.35); font-size: 9px; }.footer-bottom { display: flex; justify-content: space-between; padding: 17px 0; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.3); font-size: 9px; }
.modal-backdrop { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; padding: 24px; background: rgba(8,14,32,.64); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }.modal-backdrop[hidden] { display: none; }.demo-modal { position: relative; width: min(100%, 460px); padding: 42px; border: 1px solid rgba(255,255,255,.5); border-radius: 16px; background: var(--paper); box-shadow: 0 22px 80px rgba(0,0,0,.22); }.modal-close { position: absolute; top: 15px; right: 18px; width: 32px; height: 32px; border-radius: 50%; color: #8b92a0; background: transparent; font-size: 25px; transition: all .2s ease; }.modal-close:hover, .modal-close:focus-visible { color: var(--navy); background: #ecebe3; }.modal-kicker { color: var(--orange-deep); font-size: 10px; font-weight: 800; letter-spacing: .18em; }.demo-modal h2 { margin: 12px 0 9px; font-size: 29px; }.demo-modal > p { color: var(--ink-soft); font-size: 12px; line-height: 1.8; }.demo-modal form { display: grid; gap: 13px; margin-top: 24px; }.demo-modal label { display: grid; gap: 6px; color: #505a70; font-size: 11px; font-weight: 700; }.demo-modal input { width: 100%; height: 43px; padding: 0 13px; border: 1px solid #dedfd8; border-radius: 8px; outline: 0; color: var(--ink); background: #fff; font-size: 12px; transition: all .2s ease; }.demo-modal input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(246,160,90,.15); }.form-submit { width: 100%; margin-top: 8px; }.toast { position: fixed; right: 24px; bottom: 24px; z-index: 50; max-width: 340px; padding: 13px 18px; border-radius: 9px; color: #fff; background: #192643; box-shadow: 0 12px 30px rgba(11,18,41,.22); font-size: 12px; opacity: 0; pointer-events: none; transform: translateY(12px); transition: all .2s ease; }.toast.show { opacity: 1; transform: translateY(0); }
.reveal { opacity: 0; transform: translateY(20px); transition: opacity .65s ease, transform .65s ease; }.reveal-delay { transition-delay: .12s; }.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1100px) {
    .shell { width: min(var(--shell), calc(100% - 40px)); }
    .site-nav { gap: 20px; }.nav-login { display: none; }
    .hero { padding-top: 145px; }.hero-grid { grid-template-columns: 1fr; gap: 58px; }.hero-copy { max-width: 650px; }.hero-visual { max-width: 700px; width: 100%; margin: 0 auto; }.hero-foot { width: calc(100% - 40px); }
    .feature-grid { grid-template-columns: repeat(2, 1fr); }.feature-card { min-height: 280px; }
    .experience-grid { grid-template-columns: 1fr; gap: 55px; }.experience-copy > p { max-width: 550px; }.experience-preview { max-width: 760px; }.video-grid { grid-template-columns: 1fr; gap: 55px; }.video-copy > p { max-width: 550px; }.video-frame { max-width: 760px; }
    .about-grid { gap: 60px; }.contact-card { padding: 50px; }
}

@media (max-width: 820px) {
    .shell { width: min(var(--shell), calc(100% - 32px)); }.nav-wrap { min-height: 72px; }.nav-actions { gap: 9px; }.button-sm { min-height: 37px; padding: 0 12px; }.button-sm span { display: none; }.menu-toggle { display: block; }.site-nav { position: absolute; top: 68px; right: 16px; left: 16px; display: grid; gap: 0; padding: 7px; border: 1px solid rgba(255,255,255,.15); border-radius: 12px; background: rgba(13,22,50,.96); box-shadow: 0 14px 35px rgba(0,0,0,.2); opacity: 0; pointer-events: none; transform: translateY(-7px); transition: all .2s ease; }.site-nav.open { opacity: 1; pointer-events: auto; transform: translateY(0); }.site-nav a { padding: 13px; border-radius: 7px; }.site-nav a:hover, .site-nav a:focus-visible { background: rgba(255,255,255,.07); }.site-nav a::after { display: none; }
    .hero { min-height: auto; padding: 130px 0 76px; }.hero-grid { gap: 49px; }.hero-copy h1 { font-size: clamp(40px, 12vw, 60px); }.hero-lead { font-size: 13px; }.hero-actions { flex-direction: column; align-items: stretch; }.hero-actions .button { width: 100%; }.hero-proof { margin-top: 37px; }.hero-visual { width: calc(100% + 9px); margin-left: -4px; }.dashboard-window { transform: none; }.dashboard-side { width: 72px; padding: 12px 6px; }.mini-brand strong, .side-label, .side-item { font-size: 0; }.mini-brand { justify-content: center; }.side-item { justify-content: center; padding: 8px 2px; }.side-item b { font-size: 12px; }.side-label-bottom { display: none; }.dashboard-content { padding: 14px 10px; }.dash-stats { gap: 5px; }.dash-stat { padding: 8px; }.dash-stat strong { font-size: 18px; }.dash-panels { grid-template-columns: 1fr; }.progress-panel { display: none; }.dashboard-main { min-height: 374px; }.dash-table { margin-top: 7px; }.dash-table .table-row { grid-template-columns: 1.4fr .7fr 1fr; }.dash-table .table-row > span:nth-child(2) { display: none; }.dash-table .status-pill { display: none; }.float-card { display: none; }.hero-foot { position: static; width: 100%; margin-top: 44px; }.hero-foot-scroll { display: none; }.signal-inner { display: block; padding: 22px 0; }.signal-items { flex-wrap: wrap; gap: 10px; margin-top: 9px; }.signal-note { display: block; margin-top: 12px; }
    .section { padding: 83px 0; }.section-heading h2, .experience-copy h2, .about-copy h2 { font-size: 39px; }.split-heading { display: block; }.split-heading > p { margin-top: 22px; font-size: 13px; }.feature-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 42px; }.feature-card { min-height: 245px; }.feature-card h3 { font-size: 24px; }.workflow-section { padding-top: 75px; }.centered-heading p { font-size: 13px; }.workflow-board { grid-template-columns: 1fr 1fr; gap: 42px 14px; margin-top: 49px; }.workflow-line { top: 103px; right: 18%; left: 18%; height: 130px; width: 1px; background: #dadbd6; }.workflow-line i { width: 100%; height: 56%; background: linear-gradient(180deg, var(--orange), var(--mint)); }.step-node { width: 63px; height: 63px; }.step-node b { width: 38px; height: 38px; font-size: 14px; }.workflow-step h3 { font-size: 16px; }.workflow-step p { font-size: 10px; }
    .experience-section { padding: 88px 0; }.experience-grid { gap: 40px; }.experience-copy > p { font-size: 13px; }.experience-tabs { gap: 5px; }.experience-tab { flex: 1; padding: 9px 7px; font-size: 10px; }.preview-body { padding: 20px 15px 15px; min-height: 310px; }.preview-chart { height: 155px; }.bars { gap: 10px; }.preview-foot { flex-wrap: wrap; gap: 8px 14px; }.preview-link { width: 100%; margin-left: 0; }.plan-list, .risk-list { margin: 27px 0 28px; }.video-section { padding-top: 83px; }.video-copy > p { font-size: 13px; }.video-environment-button { width: 100%; }.video-environment-note { overflow-wrap: anywhere; }.video-frame-head { flex-wrap: wrap; gap: 4px 12px; }
    .about-grid { grid-template-columns: 1fr; gap: 46px; }.about-visual { min-height: 330px; }.about-copy > p { font-size: 13px; }.contact-section { padding-bottom: 70px; }.contact-card { display: block; min-height: 0; padding: 40px 28px; }.contact-copy h2 { font-size: 40px; }.contact-copy p { font-size: 12px; }.button-contact { margin-top: 29px; }.footer-main { flex-wrap: wrap; gap: 25px; padding: 33px 0; }.footer-links { order: 3; width: 100%; flex-wrap: wrap; gap: 13px 22px; }.footer-location { margin-left: auto; }.footer-bottom { gap: 10px; line-height: 1.6; }.demo-modal { padding: 34px 24px 27px; }.toast { right: 16px; bottom: 16px; left: 16px; max-width: none; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
.video-frame video { height: auto; }

.language-toggle { display: inline-flex; align-items: center; gap: 5px; min-height: 37px; padding: 0 11px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; color: rgba(255,255,255,.6); background: rgba(255,255,255,.06); font-size: 10px; letter-spacing: .04em; transition: all .2s ease; }.language-toggle span, .language-toggle strong { font-weight: 700; }.language-toggle i { color: rgba(255,255,255,.28); font-style: normal; }.language-toggle:hover, .language-toggle:focus-visible, .language-toggle.is-en { color: var(--navy); border-color: var(--orange); background: var(--orange); }
.capability-gallery { background: var(--paper-warm); }.capability-layout { display: grid; grid-template-columns: minmax(235px, .35fr) minmax(0, 1fr); gap: 28px; margin-top: 58px; }.capability-tabs { display: grid; align-content: start; gap: 8px; }.capability-tab { display: grid; grid-template-columns: 28px 1fr; gap: 2px 10px; padding: 16px 17px; border: 1px solid #e4e4dc; border-radius: 12px; text-align: left; color: var(--ink); background: rgba(255,255,255,.66); transition: all .2s ease; }.capability-tab span { grid-row: 1 / span 2; padding-top: 2px; color: #aaada5; font-size: 10px; letter-spacing: .12em; }.capability-tab strong { font-size: 14px; }.capability-tab small { color: #999d98; font-size: 10px; line-height: 1.5; }.capability-tab:hover, .capability-tab:focus-visible, .capability-tab.active { border-color: var(--orange); background: #fff; box-shadow: 0 9px 25px rgba(30,38,62,.08); transform: translateX(4px); }.capability-tab.active span, .capability-tab.active strong { color: var(--orange-deep); }.capability-stage { overflow: hidden; border: 1px solid #dfe2df; border-radius: 17px; background: #fff; box-shadow: 0 18px 44px rgba(22,32,58,.08); }.capability-stage-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 20px; border-bottom: 1px solid #ecece6; color: #969b94; font-size: 9px; letter-spacing: .14em; }.capability-stage-top span:last-child { color: var(--orange-deep); letter-spacing: .08em; }.capability-screen { aspect-ratio: 16 / 9; overflow: hidden; background: #e9edf4; }.capability-screen img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }.capability-caption { display: flex; align-items: end; justify-content: space-between; gap: 25px; padding: 22px 22px 24px; }.capability-caption h3 { margin: 0; font-size: clamp(20px, 2vw, 29px); }.capability-caption p { max-width: 550px; margin: 9px 0 0; color: var(--ink-soft); font-size: 12px; line-height: 1.85; }.capability-thumbs { display: flex; flex: 0 0 auto; gap: 7px; }.capability-thumb { width: 72px; height: 47px; overflow: hidden; padding: 0; border: 2px solid transparent; border-radius: 6px; background: #edf0f4; transition: all .2s ease; }.capability-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }.capability-thumb:hover, .capability-thumb:focus-visible, .capability-thumb.active { border-color: var(--orange); box-shadow: 0 4px 11px rgba(246,160,90,.2); }.capability-thumb.active { transform: translateY(-3px); }

@media (max-width: 1100px) {
    .capability-layout { grid-template-columns: 1fr; }.capability-tabs { grid-template-columns: repeat(3, 1fr); }.capability-tab:hover, .capability-tab:focus-visible, .capability-tab.active { transform: translateY(-2px); }
}

@media (max-width: 820px) {
    .language-toggle { min-height: 35px; padding: 0 9px; }.capability-tabs { grid-template-columns: repeat(2, 1fr); gap: 7px; }.capability-tab { padding: 13px 12px; }.capability-tab strong { font-size: 12px; }.capability-tab small { font-size: 9px; }.capability-caption { display: block; padding: 18px 16px 20px; }.capability-thumbs { margin-top: 18px; }.capability-thumb { width: 64px; height: 42px; }
}

.projects-section { background: var(--paper); }.project-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 58px; }.project-metrics > div { display: flex; align-items: baseline; gap: 9px; padding: 16px 18px; border: 1px solid #e6e5dd; border-radius: 11px; background: #fff; }.project-metrics strong { color: var(--orange-deep); font-size: 29px; font-weight: 650; }.project-metrics span { color: #93968f; font-size: 10px; line-height: 1.4; }.project-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px; }.project-card { display: flex; min-height: 310px; flex-direction: column; padding: 21px; border: 1px solid #e5e5dd; border-radius: 14px; background: #fff; transition: all .2s ease; }.project-card:hover { border-color: rgba(246,160,90,.65); box-shadow: var(--shadow); transform: translateY(-4px); }.project-card-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; }.project-card-top > span { color: var(--orange); font-size: 10px; letter-spacing: .12em; }.project-card-top small { padding: 5px 8px; border-radius: 999px; color: #8d948d; background: #f2f3ee; font-size: 9px; }.project-card h4 { margin: 21px 0 0; color: var(--ink); font-size: 18px; line-height: 1.45; }.project-card p { margin: 11px 0 0; color: var(--ink-soft); font-size: 11px; line-height: 1.8; }.project-card-meta { display: grid; gap: 5px; margin-top: auto; padding-top: 17px; color: #9b9d97; font-size: 9px; line-height: 1.5; }.project-card-meta span:last-child { color: var(--orange-deep); }.project-systems { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 14px; }.project-systems b { padding: 4px 6px; border: 1px solid #e7e7e0; border-radius: 4px; color: #687064; background: #fafaf7; font-size: 9px; font-weight: 600; }.integration-band { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 50px; margin-top: 58px; padding: 36px 40px; border-radius: 17px; color: #fff; background: linear-gradient(120deg, #1b2b59, #0d1733); }.integration-band h3 { margin: 14px 0 0; font-size: clamp(25px, 3vw, 37px); line-height: 1.2; }.integration-band p { max-width: 430px; margin: 17px 0 0; color: rgba(255,255,255,.56); font-size: 12px; line-height: 1.85; }.integration-chips { display: flex; flex-wrap: wrap; gap: 8px; align-content: center; }.integration-chips span { padding: 9px 11px; border: 1px solid rgba(255,255,255,.15); border-radius: 7px; color: rgba(255,255,255,.74); background: rgba(255,255,255,.07); font-size: 10px; }.team-block { margin-top: 108px; }.team-heading { max-width: 580px; }.team-heading h3 { margin: 15px 0 0; font-size: clamp(31px, 3.5vw, 48px); line-height: 1.16; }.team-heading p { max-width: 470px; margin: 18px 0 0; color: var(--ink-soft); font-size: 13px; line-height: 1.85; }.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 36px; }.team-card { min-height: 168px; padding: 18px; border: 1px solid #e5e5dd; border-radius: 13px; background: #fff; }.team-card-top { display: flex; align-items: center; gap: 11px; }.team-avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; color: var(--navy); background: var(--orange); font-size: 10px; font-weight: 800; }.team-card strong, .team-card small { display: block; }.team-card strong { font-size: 14px; }.team-card small { margin-top: 3px; color: var(--orange-deep); font-size: 10px; }.team-card p { margin: 17px 0 0; color: var(--ink-soft); font-size: 11px; line-height: 1.75; }

@media (max-width: 1100px) {
    .project-grid { grid-template-columns: repeat(2, 1fr); }.team-grid { grid-template-columns: repeat(3, 1fr); }.integration-band { grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 820px) {
    .project-metrics { grid-template-columns: repeat(2, 1fr); margin-top: 42px; }.project-metrics > div { display: block; padding: 13px; }.project-metrics strong, .project-metrics span { display: block; }.project-metrics span { margin-top: 3px; }.project-grid { grid-template-columns: 1fr; }.project-card { min-height: 275px; }.integration-band { margin-top: 43px; padding: 29px 23px; }.integration-chips { gap: 6px; }.integration-chips span { padding: 7px 8px; font-size: 9px; }.team-block { margin-top: 76px; }.team-grid { grid-template-columns: repeat(2, 1fr); margin-top: 27px; }.team-card { min-height: 185px; padding: 15px; }
}