/* Shared typography, inline icons and interaction rules. No external dependency. */
:root{--ui-font:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",Arial,sans-serif;--ui-motion:180ms ease-out}
body,button,input,textarea,select{font-family:var(--ui-font);font-weight:400;line-height:1.6}
body{font-size:16px}
h1,h2,h3,h4{font-family:var(--ui-font);font-weight:600;line-height:1.4;letter-spacing:-.025em}
h1,.hero h1,.inner-hero h1{font-size:clamp(40px,3.4vw,48px);line-height:1.4;white-space:normal}
h2,.section h2,.section-heading h2,.cta-inner h2,#management .management-intro h2{font-size:clamp(28px,2.3vw,32px);line-height:1.4}
h3,.section h3,.audience-card h2,.journey-card h3,.tab-panel h3,.service-grid h3,.operation-grid h3,.delivery-flow h3,.workflow-step h2,.step-title h2,.dialog-content h2{font-size:20px;line-height:1.5}
.serif-accent{font-family:var(--ui-font);font-weight:600;letter-spacing:inherit}
.eyebrow,.visual-label,.card-index,.hero-label,.chart-heading,.arch-stage,.step-number{font-family:var(--ui-font)}
p,.hero-description,.inner-hero .lead,.section-copy>p,.section-heading>p,.platform-section p,.scenario-feature p,.contact-grid>div>p,.dark-section p,.faq-list details p,.before-after p,.service-grid p,.billing-grid p,.journey-card p,.delivery-flow p,.compute-note p,.estimate-note p,.dialog-content p{font-size:16px;line-height:1.6;font-weight:400}
.hero-description,.hero-state{max-width:100%}
.eyebrow,.hero-label,.visual-label,.section-overline,.section-overline>span:last-child,.card-index,.breadcrumb,.inline-tags span,.arch-overview,.arch-chip,.arch-node>div>span,.arch-node .node-label,.arch-integration>span:last-child,.arch-integration b,.org-map-head>div>span,.org-map-refined>small,.org-members>span:last-child,.limit-step>small,.limit-chain-refined .step-number,.arch-stage,.service-grid small,.before-after small,.key-compare-refined>div>small,.key-compare-refined>div>span:not(.diagram-icon),.workflow-index>a,.workflow-index>a>span,.scenario-notice,.step-result,.step-result b,.contact-note p,.lead-form-intro,.form-tip,.form-message,.form-types label>span,.contact-grid label:not(.consent),.contact-grid legend,.contact-grid label>small,.consent,.consent .text-button,.footer p,.footer .small,.footer .footer-note p,.footer-bottom,.footer-bottom .text-button,.footer .text-button,.footer-grid>div>a:not(.brand),.product-shot figcaption,.shot-top,.shot-top b,.hero-state{font-size:12px;line-height:1.6;font-weight:400}
.button,.nav-cta,.text-link,.header nav,.resource-toggle,.resource-menu a,.anchor-bar .container,.check-list,.mini-flow,#management .management-tabs button,.contact-grid input:not([type=checkbox]):not([type=radio]),.contact-grid textarea{font-size:14px;line-height:1.6}
.note,.dark-section .note{font-size:14px!important;line-height:1.6}
.check-list li{line-height:1.6}
.check-list li:before{content:none}
.check-list li{gap:8px}
.check-list li:after{content:none}
.brand strong{font-weight:600}
.arch-node b,.arch-consoles .arch-node b,.org-map-head b,.key-compare-refined>div>b{font-size:18px;font-weight:600;line-height:1.5}
.arch-node .node-label{font-size:12px}
.org-map-refined section b,.limit-step>b{font-size:14px;line-height:1.6}
.operation-grid p{font-size:14px;line-height:1.6}
.footer h3{font-size:14px;font-weight:600}
.contact-grid input::placeholder,.contact-grid textarea::placeholder{font-size:12px}
.contact-grid input:not([type=checkbox]):not([type=radio]),.contact-grid textarea{min-height:42px}
.dash-sidebar{font-size:12px}
.dash-logo{font-size:16px}
.dash-logo small,.dash-side-bottom,.dash-head small,.dash-stats small,.dash-stats span,.chart-heading,.chart-heading span,.dash-table,.bar-chart span,.floating-note small,.visual-caption{font-size:12px;line-height:1.6}
.dash-head h3{font-size:18px;line-height:1.4;white-space:normal}
.dash-stats b{font-size:20px;font-weight:600}
.floating-note b{font-size:14px;font-weight:600}
.dash-main{min-width:0}
.dashboard{grid-template-columns:135px minmax(0,1fr)}
.dash-table>div{gap:8px;flex-wrap:wrap}
.dash-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.dash-stats>div{min-width:0}
.dash-avatar{font-size:12px}
.hero-label{white-space:normal;flex-wrap:wrap}
.hero-grid>*{min-width:0}
.dash-menu{white-space:normal}
.chart-heading{flex-wrap:wrap}
.floating-note{max-width:100%}
.visual-label{flex-wrap:wrap}
.arch-node .node-label{display:none}
.arch-consoles .arch-node>div>span{font-size:12px}

/* Inline SVG geometry and alignment; inherited text color is the only icon color. */
.ui-icon{display:block;width:24px;height:24px;flex:0 0 auto;color:inherit;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.button,.nav-cta,.text-link,.hero-link,.resource-toggle,.resource-menu a,.header nav a,.anchor-bar a,.dash-menu,.footer-bottom>a,.image-zoom>span,.menu-toggle,.dialog-close,.line-icon,.note-icon,.operation-icon,.diagram-icon,.faq-list summary>span,.button>span,.hero-link>span,.text-link>span,.audience-card h2>span{display:inline-flex;align-items:center;gap:8px}
.button>span,.hero-link>span,.text-link>span{margin:0;line-height:1}
.button,.nav-cta,.text-link,.hero-link,.resource-toggle{gap:8px}
.header .ui-icon,.dash-menu .ui-icon{width:20px;height:20px}
.button .ui-icon,.nav-cta .ui-icon,.text-link .ui-icon,.hero-link .ui-icon,.resource-toggle .ui-icon,.footer-bottom .ui-icon,.image-zoom .ui-icon,.dialog-close .ui-icon,.faq-list summary .ui-icon{width:16px;height:16px}
.menu-toggle .ui-icon{width:20px;height:20px}
.menu-toggle{display:none}
.line-icon .ui-icon,.diagram-icon .ui-icon,.operation-icon .ui-icon{width:24px;height:24px}
.note-icon .ui-icon{width:18px;height:18px}
.line-icon{line-height:1}
.check-list .ui-icon{width:16px;height:16px;margin-top:4px;color:inherit}
.check-list li{display:flex;align-items:flex-start}
.faq-list summary>span{font-size:inherit;line-height:1}
.dialog-close{justify-content:center;width:36px;height:36px}
.audience-card h2{align-items:center;gap:8px}
.mini-flow li+li:before{content:none}
.mini-flow li{display:inline-flex;align-items:center;gap:8px}
.mini-flow .ui-icon{width:14px;height:14px}
.hero .note-icon{font-weight:400}

/* Motion is reserved for actual actions. Static information cards stay still. */
.button,.nav-cta,.text-link,.audience-card,.menu-toggle,.resource-toggle,.image-zoom,.dialog-close,button[role=tab],.contact-grid button[type=submit]{transition:transform var(--ui-motion),box-shadow var(--ui-motion),background-color var(--ui-motion),border-color var(--ui-motion)}
.arch-node,.limit-step,.org-map-refined section>div,.operation-grid>div{transition:none}
.header{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;transition:background-color var(--ui-motion),box-shadow var(--ui-motion)}
.header.is-scrolled{background:rgba(255,255,255,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 3px 14px #1d386308}
:where(a,button,input,textarea,select,summary):focus-visible{outline:3px solid #2478ff;outline-offset:4px}
.dark-section :where(a,button):focus-visible,.cta-section :where(a,button):focus-visible,.footer :where(a,button):focus-visible{outline-color:#fff}
.form-types input:focus-visible+span{outline:3px solid #2478ff;outline-offset:3px}
@media(hover:hover){
 .button:hover,.nav-cta:hover,.audience-card:hover,.menu-toggle:hover,.resource-toggle:hover,.image-zoom:hover,.dialog-close:hover,button[role=tab]:hover{transform:translateY(-1px);box-shadow:0 7px 18px #244b7e14}
 .arch-node:hover,.limit-step:hover,.org-map-refined section>div:hover{box-shadow:0 5px 16px #244a7c06}
 .operation-grid>div:hover{background:#ffffff0e;border-color:#ffffff35}
 .operation-grid>div:nth-child(2):hover,.operation-grid>div:nth-child(3):hover{background:#ffffff14}
}
@keyframes hero-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.hero-copy,.hero-visual,.inner-hero .container{animation:hero-enter 300ms ease-out both}

@media(max-width:1150px){.nav-shell{gap:24px}.header nav{gap:20px}.nav-actions{gap:15px}.dashboard{grid-template-columns:125px minmax(0,1fr)}.dash-main{padding:20px 14px}.arch-node b,.arch-consoles .arch-node b{font-size:18px}.hero-grid{gap:30px}}
@media(max-width:960px){.hero-visual{max-width:650px}.dashboard{grid-template-columns:135px minmax(0,1fr)}.header nav,.resource-toggle,.nav-cta{font-size:12px}.nav-shell{gap:18px}.header nav{gap:16px}.arch-consoles .arch-node>div>span{font-size:12px}}
@media(max-width:720px){
 h1,.hero h1,.inner-hero h1{font-size:clamp(28px,7.5vw,32px);line-height:1.4;white-space:normal}
 h2,.section h2,.cta-inner h2,#management .management-intro h2{font-size:28px;line-height:1.4}
 h3,.section h3,.audience-card h2,.journey-card h3,.service-grid h3,.operation-grid h3,.tab-panel h3,.step-title h2,.workflow-step h2{font-size:18px;line-height:1.5}
 p,.hero-description,.inner-hero .lead,.section-copy>p,.section-heading>p,.platform-section p,.scenario-feature p,.dark-section p,.faq-list details p,.before-after p,.service-grid p,.billing-grid p,.journey-card p,.delivery-flow p,.compute-note p,.estimate-note p,.contact-grid>div>p,#management .management-intro>p{font-size:16px;line-height:1.6}
 .note,.dark-section .note{font-size:14px!important;line-height:1.6}
 .nav-shell{gap:8px}.nav-actions{gap:8px}.header .resource-toggle,.header .nav-cta{font-size:12px}.header .nav-cta{padding:8px}.resource-toggle{gap:4px}.brand strong{font-size:24px}.brand strong span{font-size:9px}
 .menu-toggle{display:inline-flex}
 .brand-symbol{width:27px}.brand{gap:7px}.menu-toggle{padding:8px}.header .resources .ui-icon{width:20px;height:20px}
 .hero-buttons{gap:10px}.button{font-size:14px;padding:12px 15px;gap:8px}
 .hero-grid{gap:30px}.hero-label{font-size:12px}.hero .label-line{display:none}.hero-visual{padding-bottom:54px}
 .dashboard{grid-template-columns:92px minmax(0,1fr)}.dash-sidebar{padding:16px 5px;gap:6px}.dash-logo{padding:0 4px 12px;font-size:16px}.dash-logo small{font-size:12px}.dash-menu{font-size:12px;padding:7px 3px;gap:5px}.dash-menu .ui-icon{width:20px;height:20px}.dash-main{padding:18px 10px}.dash-head h3{font-size:18px}.dash-stats b{font-size:18px}.dash-stats small,.dash-stats span,.dash-head small,.dash-side-bottom,.chart-heading,.chart-heading span,.dash-table,.bar-chart span,.floating-note small,.visual-caption{font-size:12px}.chart-heading{gap:4px}.bar-chart{height:100px}.dash-table>div{font-size:12px}.floating-note{left:0;right:0;bottom:16px;padding:12px;transform:none;max-width:100%}.floating-note b{font-size:14px}.visual-caption{position:static;margin-top:15px;font-size:12px}.visual-label{font-size:12px}
 .arch-node b,.arch-consoles .arch-node b,.org-map-head b{font-size:18px}.arch-consoles .arch-node>div>span,.arch-node>div>span,.arch-overview,.arch-integration>span:last-child,.org-map-refined>small{font-size:12px}.arch-node{gap:8px}.arch-overview{padding-left:30px}.diagram-icon{width:37px;height:37px}.diagram-icon .ui-icon{width:24px;height:24px}.arch-integration{margin-left:0}
 .org-map-refined section b,.org-members>span:last-child{font-size:14px}.org-map-head>div>span{font-size:12px}
 .limit-step>small{font-size:12px}.limit-step>b{font-size:14px}.limit-step .step-number{font-size:12px}.limit-step+.limit-step:before{content:none}
 .operation-grid p,.footer p,.footer .small,.footer-bottom,.footer-grid>div>a:not(.brand),.footer-bottom .text-button,.footer .text-button,.product-shot figcaption{font-size:12px;line-height:1.6}
 .key-compare-refined{align-items:stretch;gap:12px}.key-compare-refined>div{min-width:0}.key-compare-refined>div>b{font-size:18px}.key-compare-refined>div>small{font-size:12px}.key-compare-refined>span{display:none}
 .contact-grid .form-types label>span{font-size:12px!important}.contact-grid input::placeholder,.contact-grid textarea::placeholder{font-size:12px}.contact-grid input:not([type=checkbox]):not([type=radio]),.contact-grid textarea{font-size:16px}
 .mini-flow{flex-wrap:wrap;gap:12px 18px;font-size:12px}
}
@media(max-width:380px){.nav-shell{gap:4px}.nav-actions{gap:5px}.brand-symbol{width:22px;gap:2px}.brand-symbol i{width:6px}.brand{gap:6px}.brand strong{font-size:20px}.header .brand strong span{display:none}.header .resource-toggle,.header .nav-cta{font-size:12px}.header .nav-cta{padding:8px 6px}.menu-toggle{padding:7px 5px}.header .resource-toggle{gap:2px}.container{padding-left:18px;padding-right:18px}.operation-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .hero-copy,.hero-visual,.inner-hero .container{opacity:1;transform:none}
 .button:hover,.nav-cta:hover,.audience-card:hover,.menu-toggle:hover,.resource-toggle:hover,.image-zoom:hover,.dialog-close:hover,button[role=tab]:hover{transform:none}
}