:where(.hi-page) { color:var(--color-text); background:var(--color-background); font-family:var(--font-family-body) }
:where(.hi-page) h1 { font-family:var(--font-family-display); font-weight:var(--font-weight-display); color:var(--color-heading); letter-spacing:var(--letter-spacing-display); line-height:var(--line-height-display) }
:where(.hi-page) h2 { font-family:var(--font-family-display); font-weight:var(--font-weight-display); color:var(--color-heading); letter-spacing:var(--letter-spacing-display); line-height:var(--line-height-display) }
:where(.hi-page) h1 { font-size:clamp(var(--size-44),4.5vw,var(--size-68)); max-width:var(--size-660); margin:var(--size-25) 0 }
:where(.hi-page) h1 em { color:var(--color-accent); font-weight:var(--font-weight-regular) }
:where(.hi-page) h2 { font-size:var(--font-size-section); max-width:var(--size-860); margin:var(--size-14) 0 var(--size-28) }
:where(.hi-page) h3 { font:var(--font-weight-bold) var(--size-19)/var(--line-height-1-4) var(--font-family-body); letter-spacing:var(--letter-spacing-heading); color:var(--color-heading); margin:0 0 var(--size-12) }
:where(.hi-page) p { font-size:var(--size-16); line-height:var(--line-height-relaxed); color:var(--color-text-muted) }
:where(.hi-page) .eyebrow { font:var(--font-weight-medium) var(--size-11)/var(--line-height-1-5) var(--font-family-mono); letter-spacing:var(--letter-spacing-12em); color:var(--color-heading); text-transform:uppercase; margin:0 0 var(--size-18) }
:where(.hi-page) .container { width:calc(100% - var(--page-gutter)*2); max-width:var(--size-1320); margin:auto }
:where(.hi-page) .hi-sec { padding:var(--size-96) 0; scroll-margin-top:calc(var(--header-height) + var(--size-24)) }
:where(.hi-page) [hidden] { display:none!important }
:where(.hi-page) .lead { max-width:var(--size-920) }
:where(.hi-page) .hi-sec__head { margin-bottom:var(--size-42) }
:where(.hi-page) .hi-home-icon { display:inline-flex; align-items:center; justify-content:center; flex:0 0 var(--size-44); width:var(--size-44); height:var(--size-44); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-10); background:var(--color-surface-secondary); color:var(--color-heading); margin-bottom:var(--size-20) }
:where(.hi-page) .hi-home-icon svg { display:block; width:var(--size-24); height:var(--size-24); max-width:var(--size-24); max-height:var(--size-24); fill:none; stroke:currentColor; stroke-width:1.5 }
:where(.hi-page) .hi-arw { width:var(--size-18); height:var(--size-18); fill:none; stroke:currentColor; flex:none }
:where(.hi-page) .hi-home-hero { padding:var(--size-65) 0 var(--size-55) }
:where(.hi-page) .hi-home-hero__grid { display:grid; grid-template-columns:1.14fr .86fr; gap:7%; align-items:center }
:where(.hi-page) .hi-home-hero__grid>* { min-width:0 }
:where(.hi-page) .hi-home-hero__lead { font-size:var(--size-17); line-height:var(--line-height-relaxed); max-width:var(--size-630) }
:where(.hi-page) .hi-home-hero__actions { display:flex; align-items:center; flex-wrap:wrap; gap:var(--size-24); margin:var(--size-28) 0 }
:where(.hi-page) .hi-home-hero__meta { display:flex; align-items:center; flex-wrap:wrap; gap:var(--size-12) var(--size-20); font-size:var(--size-11); color:var(--color-text-muted); margin:var(--size-24) 0 0; padding-top:var(--size-22); border-top:var(--border-default) }
:where(.hi-page) .hi-home-hero__meta li { display:flex; align-items:center; gap:var(--size-8); line-height:var(--line-height-1-7) }
:where(.hi-page) .hi-home-hero__meta li:before { content:'✓'; color:var(--color-heading); font-size:var(--size-12) }
/* One compact scene at a time, with visible autoplay controls. */
:where(.hi-page) .hi-product-player { width:100%; max-width:var(--size-500); margin:0; justify-self:center; padding:var(--size-24); background:var(--color-surface-secondary); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-18); box-shadow:var(--size-8) var(--size-8) 0 var(--color-surface-accent) }
:where(.hi-page) .hi-product-player__top { display:flex; justify-content:space-between; align-items:center; gap:var(--size-16); margin-bottom:var(--size-20) }
:where(.hi-page) .hi-product-player__top>span { font:var(--size-10)/var(--line-height-1-5) var(--font-family-mono); letter-spacing:var(--letter-spacing-08em); color:var(--color-heading) }
:where(.hi-page) .hi-product-toggle { background:transparent; border:var(--size-1) var(--border-style) var(--color-illustration-739582); border-radius:var(--size-6); padding:var(--size-8) var(--size-10); min-height:var(--size-34); color:var(--color-heading); font-size:var(--size-11); white-space:nowrap }
:where(.hi-page) .hi-product-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-7); margin-bottom:var(--size-16) }
:where(.hi-page) .hi-product-tabs button { background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-6); color:var(--color-text-muted); padding:var(--size-10) var(--size-7); font-size:var(--size-11); line-height:var(--line-height-label); font-weight:var(--font-weight-medium); min-height:var(--size-40) }
:where(.hi-page) .hi-product-tabs button[aria-selected="true"] { background:var(--color-primary); color:var(--color-white); border-color:var(--color-primary) }
:where(.hi-page) .hi-product-stage { background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-10); overflow:hidden }
:where(.hi-page) .hi-product-panel { min-height:var(--size-315); animation:hi-home-scene .35s ease-out }
:where(.hi-page) .hi-mini-browser { height:var(--size-34); display:flex; align-items:center; gap:var(--size-5); padding:0 var(--size-12); background:var(--color-background); border-bottom:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-mini-browser>span { height:var(--size-5); width:var(--size-5); border-radius:50%; background:var(--color-border-strong) }
:where(.hi-page) .hi-mini-browser>span:first-child { background:var(--color-accent) }
:where(.hi-page) .hi-mini-browser small { margin-left:auto; font:var(--size-9) var(--font-family-mono); color:var(--color-text-muted) }
:where(.hi-page) .hi-brand-preview__nav { display:flex; align-items:center; gap:var(--size-13); padding:var(--size-16) var(--size-20) }
:where(.hi-page) .hi-brand-preview__nav b { font:var(--size-24)/var(--line-height-1) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-06em); margin-right:auto; color:var(--color-heading) }
:where(.hi-page) .hi-brand-preview__nav i { width:var(--size-25); height:var(--size-3); background:var(--color-border-strong); border-radius:var(--size-2) }
:where(.hi-page) .hi-brand-preview__body { display:grid; grid-template-columns:1.2fr .8fr; gap:var(--size-18); padding:var(--size-12) var(--size-20) var(--size-22); align-items:center }
:where(.hi-page) .hi-brand-preview__body>div { min-width:0 }
:where(.hi-page) .hi-mini-kicker { font:var(--size-8)/var(--line-height-1-5) var(--font-family-mono); letter-spacing:var(--letter-spacing-05em); color:var(--color-heading) }
:where(.hi-page) .hi-brand-preview__body strong { display:block; font:var(--font-weight-regular) var(--size-29)/var(--line-height-1-12) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-035em); color:var(--color-heading); margin:var(--size-12) 0 }
:where(.hi-page) .hi-brand-preview__body p { font-size:var(--size-10); line-height:var(--line-height-1-6); color:var(--color-text-muted); max-width:var(--size-180) }
:where(.hi-page) .hi-mini-button { display:inline-flex; align-items:center; padding:var(--size-9) var(--size-12); margin-top:var(--size-14); border-radius:var(--size-4); background:var(--color-primary); color:var(--color-white); font-size:var(--size-9); font-weight:var(--font-weight-medium) }
:where(.hi-page) .hi-brand-art { height:var(--size-175); position:relative; overflow:hidden; background:var(--color-surface-accent); border-radius:var(--size-65) var(--size-65) var(--size-5) var(--size-5); isolation:isolate }
:where(.hi-page) .hi-arch { position:absolute; width:80%; height:80%; border-radius:var(--size-55) var(--size-55) 0 0; bottom:-8%; right:-12%; border:var(--size-19) var(--border-style) var(--color-accent); background:var(--color-surface-secondary); transform:rotate(-10deg) }
:where(.hi-page) .hi-arch--back { bottom:4%; right:8%; border-color:var(--color-border); transform:rotate(12deg) }
:where(.hi-page) .hi-brand-art>span { position:absolute; left:12%; bottom:14%; width:var(--size-36); height:var(--size-36); background:var(--color-highlight); border-radius:50% }
:where(.hi-page) .hi-brand-preview__base { display:flex; justify-content:space-between; gap:var(--size-8); padding:var(--size-10) var(--size-20); background:var(--color-surface-secondary); font:var(--size-9) var(--font-family-mono); color:var(--color-text-muted) }
:where(.hi-page) .hi-operation-preview { padding:var(--size-22) }
:where(.hi-page) .hi-operation-heading { display:flex; flex-wrap:wrap; align-items:center; gap:var(--size-10) }
:where(.hi-page) .hi-operation-heading strong { font:var(--size-23)/var(--line-height-1-2) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-025em); color:var(--color-heading) }
:where(.hi-page) .hi-operation-heading>span { font:var(--size-9) var(--font-family-mono); color:var(--color-text-muted) }
:where(.hi-page) .hi-operation-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-8); margin-top:var(--size-20) }
:where(.hi-page) .hi-operation-summary>div { background:var(--color-surface-secondary); border:var(--size-1) var(--border-style) var(--color-border); border-radius:var(--size-6); padding:var(--size-10); font-size:var(--size-9); color:var(--color-text-muted) }
:where(.hi-page) .hi-operation-summary b { display:block; font-size:var(--size-12); line-height:var(--line-height-art-1-4); font-weight:var(--font-weight-bold); color:var(--color-heading); margin-top:var(--size-7) }
:where(.hi-page) .hi-operation-rows { display:grid; gap:var(--size-10); margin-top:var(--size-18) }
:where(.hi-page) .hi-operation-rows>div { display:flex; align-items:center; gap:var(--size-10); padding:var(--size-10); background:var(--color-background); border-radius:var(--size-5) }
:where(.hi-page) .hi-row-dot { height:var(--size-8); width:var(--size-8); border-radius:50%; background:var(--color-illustration-739582); flex:none }
:where(.hi-page) .hi-operation-rows b { font-size:var(--size-11); font-weight:var(--font-weight-medium); color:var(--color-heading) }
:where(.hi-page) .hi-operation-rows small { margin-left:auto; background:var(--color-surface-accent); color:var(--color-heading); padding:var(--size-4) var(--size-6); font-size:var(--size-9); border-radius:var(--size-3) }
:where(.hi-page) .hi-connection-preview { padding:var(--size-25) }
:where(.hi-page) .hi-connection-inputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-10) }
:where(.hi-page) .hi-connection-outputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-10) }
:where(.hi-page) .hi-connection-inputs>span { border:var(--size-1) var(--border-style) var(--color-border-strong); background:var(--color-surface-secondary); border-radius:var(--size-6); text-align:center; padding:var(--size-12) var(--size-5); font-size:var(--size-12); font-weight:var(--font-weight-medium); color:var(--color-heading) }
:where(.hi-page) .hi-connection-outputs>span { border:var(--size-1) var(--border-style) var(--color-border-strong); background:var(--color-surface-secondary); border-radius:var(--size-6); text-align:center; padding:var(--size-12) var(--size-5); font-size:var(--size-12); font-weight:var(--font-weight-medium); color:var(--color-heading) }
:where(.hi-page) .hi-connection-lines { height:var(--size-28); display:flex; justify-content:space-around; margin:0 8% }
:where(.hi-page) .hi-connection-lines i { width:var(--size-1); background:var(--color-illustration-739582); position:relative }
:where(.hi-page) .hi-connection-lines i:after { content:''; position:absolute; width:var(--size-4); height:var(--size-4); background:var(--color-accent); border-radius:50%; top:var(--size-8); left:-1.var(--size-5) }
:where(.hi-page) .hi-connection-core { display:flex; justify-content:center; align-items:center; gap:var(--size-16); padding:var(--size-22) var(--size-16); background:var(--color-primary); color:var(--color-white); border-radius:var(--size-8) }
:where(.hi-page) .hi-connection-core svg { color:var(--color-highlight); width:var(--size-30); height:var(--size-30); flex:none }
:where(.hi-page) .hi-connection-core strong { display:block; font:var(--size-24) var(--font-family-display); font-weight:var(--font-weight-regular) }
:where(.hi-page) .hi-connection-core small { display:block; color:var(--color-illustration-d9eade); font-size:var(--size-10); margin-top:var(--size-6) }
:where(.hi-page) .hi-connection-outputs { grid-template-columns:repeat(2,minmax(0,1fr)); margin-inline:10% }
:where(.hi-page) .hi-connection-lines--two { margin-inline:25%; justify-content:space-between }
:where(.hi-page) .hi-product-progress { height:var(--size-3); background:var(--color-surface-accent); border-radius:var(--size-3); margin:var(--size-17) 0 }
:where(.hi-page) .hi-product-progress i { display:block; height:100%; background:var(--color-primary); border-radius:var(--size-3); width:0; transition:width .15s linear }
:where(.hi-page) .hi-product-caption strong { font-size:var(--size-12); font-weight:var(--font-weight-medium); line-height:var(--line-height-1-7); color:var(--color-heading); display:block; min-height:var(--length-em-2) }
:where(.hi-page) .hi-product-caption small { display:block; font:var(--size-9)/var(--line-height-1-7) var(--font-family-mono); color:var(--color-text-muted); margin-top:var(--size-7) }
:where(.hi-page) .hi-product-formula { display:flex; justify-content:space-between; align-items:center; gap:var(--size-8); margin-top:var(--size-18) }
:where(.hi-page) .hi-product-formula span { font-size:var(--size-12); font-weight:var(--font-weight-medium); line-height:var(--line-height-art-1-4); color:var(--color-heading) }
:where(.hi-page) .hi-product-formula b { font-size:var(--size-12); font-weight:var(--font-weight-medium); line-height:var(--line-height-art-1-4); color:var(--color-heading) }
:where(.hi-page) .hi-product-formula i { font-style:normal; color:var(--color-text-muted); font-size:var(--size-14) }
:where(.hi-page) .hi-product-formula b { border-radius:var(--size-5); background:var(--color-primary); color:var(--color-highlight); padding:var(--size-8) var(--size-10) }
/* The opening statement is a band, not a collection of competing cards. */
:where(.hi-page) .hi-home-trust { padding:var(--size-32) 0 }
:where(.hi-page) .hi-home-trust__inner { display:grid; grid-template-columns:1.1fr .9fr; gap:7%; align-items:center }
:where(.hi-page) .hi-home-trust__line { font:var(--font-weight-regular) var(--size-24)/var(--line-height-1-5) var(--font-family-display); color:var(--color-heading); letter-spacing:var(--letter-spacing-negative-015em) }
:where(.hi-page) .hi-home-trust .tags { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-12) }
:where(.hi-page) .hi-home-trust li { font-size:var(--size-12); line-height:var(--line-height-1-7); color:var(--color-text) }
:where(.hi-page) .hi-home-trust li>a { display:flex; align-items:flex-start; gap:var(--size-10) }
:where(.hi-page) .hi-home-trust li>a:before { content:'↗'; color:var(--color-accent); font-size:var(--size-14) }
:where(.hi-page) .hi-home-trust a:hover { color:var(--color-accent) }
/* Two equal service pillars, with the same card dimensions and hierarchy. */
:where(.hi-page) .hi-home-services { padding-bottom:0 }
:where(.hi-page) .hi-pillar-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-28) }
:where(.hi-page) .hi-pillar { position:relative; min-width:0; overflow:hidden }
:where(.hi-page) .hi-service-art { height:var(--size-175); position:relative; background:var(--color-surface-secondary); margin:var(--space-px-negative-28) var(--space-px-negative-28) var(--size-28); overflow:hidden; display:flex; align-items:center; justify-content:center; padding:var(--size-22); gap:var(--size-20) }
:where(.hi-page) .hi-pillar h3 { font:var(--font-weight-regular) var(--size-32)/var(--line-height-1-2) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-025em); color:var(--color-heading); margin:0 0 var(--size-18) }
:where(.hi-page) .hi-pillar__body { font-size:var(--size-15); line-height:var(--line-height-relaxed); color:var(--color-text-muted); min-height:var(--length-em-6) }
:where(.hi-page) .hi-pillar__subs { display:grid; gap:var(--size-12); margin:var(--size-24) 0 var(--size-28) }
:where(.hi-page) .hi-pillar__subs li { font-size:var(--size-14); color:var(--color-text); line-height:var(--line-height-relaxed); padding-left:var(--size-23); position:relative }
:where(.hi-page) .hi-pillar__subs li:before { content:'✓'; position:absolute; left:0; top:0; color:var(--color-accent) }
:where(.hi-page) .hi-pillar__subs a:hover { color:var(--color-accent); text-decoration:underline; text-underline-offset:var(--size-4) }
:where(.hi-page) .hi-pillar__foot { padding-top:0; border:0 }
:where(.hi-page) .hi-design-swatch { width:var(--size-110); flex:none; padding:var(--size-18); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-7); box-shadow:var(--size-5) var(--size-5) 0 var(--color-illustration-b6d1bf); transform:rotate(-5deg) }
:where(.hi-page) .hi-design-swatch b { font:var(--size-45)/var(--line-height-1) var(--font-family-display); color:var(--color-heading); font-weight:var(--font-weight-regular) }
:where(.hi-page) .hi-design-swatch>div { display:flex; gap:var(--size-6); margin-top:var(--size-14) }
:where(.hi-page) .hi-design-swatch i { display:block; width:var(--size-17); height:var(--size-17); border-radius:50%; background:var(--color-primary) }
:where(.hi-page) .hi-design-swatch i:nth-child(2) { background:var(--color-accent) }
:where(.hi-page) .hi-design-swatch i:nth-child(3) { background:var(--color-highlight) }
:where(.hi-page) .hi-design-components { width:var(--size-135); padding:var(--size-15); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-7); box-shadow:var(--size-5) var(--size-5) 0 var(--color-illustration-b6d1bf); transform:rotate(4deg); display:grid; grid-template-columns:1fr 1fr; gap:var(--size-8) }
:where(.hi-page) .hi-design-components span { height:var(--size-20); border-radius:var(--size-4); background:var(--color-primary) }
:where(.hi-page) .hi-design-components span:nth-child(2) { background:var(--color-highlight) }
:where(.hi-page) .hi-design-components i { height:var(--size-35); border-radius:var(--size-4); background:var(--color-surface-secondary) }
:where(.hi-page) .hi-design-phone { height:var(--size-115); width:var(--size-58); background:var(--color-surface); border:var(--size-2) var(--border-style) var(--color-illustration-739582); border-radius:var(--size-10); padding:var(--size-6); transform:rotate(7deg) }
:where(.hi-page) .hi-design-phone div { height:var(--size-50); background:var(--color-surface-accent); border-radius:var(--size-5) }
:where(.hi-page) .hi-design-phone span { display:block; height:var(--size-4); margin:var(--size-9) 0; background:var(--color-border-strong); border-radius:var(--size-2) }
:where(.hi-page) .hi-design-phone i { display:block; height:var(--size-15); background:var(--color-primary); border-radius:var(--size-3) }
:where(.hi-page) .hi-code-art { flex-direction:column; gap:0 }
:where(.hi-page) .hi-code-art__app { background:var(--color-primary); color:var(--color-white); border-radius:var(--size-8); padding:var(--size-16) var(--size-25); text-align:center; min-width:var(--size-200) }
:where(.hi-page) .hi-code-art__app>span { display:block; color:var(--color-illustration-c9dfd1); font:var(--size-9) var(--font-family-mono) }
:where(.hi-page) .hi-code-art__app>b { display:block; font:var(--size-24) var(--font-family-display); font-weight:var(--font-weight-regular); margin-top:var(--size-5) }
:where(.hi-page) .hi-code-art__branch { height:var(--size-23); width:var(--size-1); background:var(--color-illustration-739582) }
:where(.hi-page) .hi-code-art__layers { display:flex; gap:var(--size-10); border-top:var(--size-1) var(--border-style) var(--color-illustration-739582); padding-top:var(--size-12) }
:where(.hi-page) .hi-code-art__layers span { padding:var(--size-9) var(--size-14); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-5); background:var(--color-surface); color:var(--color-heading); font-size:var(--size-11) }
/* Work examples have honest labels and explicit light-on-dark contrast. */
:where(.hi-page) .hi-work-grid { display:grid; gap:var(--size-28) }
:where(.hi-page) .hi-work-card { min-width:0 }
:where(.hi-page) .hi-work-card--featured { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:7%; background:var(--color-primary); border-color:var(--color-primary); padding:var(--size-36) }
:where(.hi-page) .hi-work-card--featured .hi-work-card__eyebrow { color:var(--color-highlight) }
:where(.hi-page) .hi-work-card__title { font:var(--font-weight-regular) var(--size-38)/var(--line-height-1-2) var(--font-family-display); color:var(--color-white); letter-spacing:var(--letter-spacing-negative-03em); margin:var(--size-16) 0 var(--size-20) }
:where(.hi-page) .hi-work-card__desc { font-size:var(--size-15); line-height:var(--line-height-relaxed); color:var(--color-text-muted) }
:where(.hi-page) .hi-work-card--featured .hi-work-card__desc { font-size:var(--size-16); color:var(--color-illustration-e0eee5) }
:where(.hi-page) .hi-work-card__foot { margin-top:var(--size-26) }
:where(.hi-page) .hi-work-card .tags { display:flex; gap:var(--size-8); flex-wrap:wrap; margin-top:var(--size-24) }
:where(.hi-page) .hi-work-card .hi-tag { font-size:var(--size-11); line-height:var(--line-height-label); padding:var(--size-7) var(--size-10); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-5); color:var(--color-heading) }
:where(.hi-page) .hi-work-card--featured .hi-tag { border-color:var(--color-illustration-72998b); color:var(--color-illustration-d9eade) }
:where(.hi-page) .hi-work-sub { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-28) }
:where(.hi-page) .hi-work-sub .hi-work-card__eyebrow { font:var(--font-weight-regular) var(--size-27)/var(--line-height-1-2) var(--font-family-display); color:var(--color-heading); text-transform:none; letter-spacing:var(--letter-spacing-negative-025em); margin-bottom:var(--size-18) }
:where(.hi-page) .hi-project-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-20); border-radius:var(--size-9); background:var(--color-surface-secondary); padding:var(--size-24) var(--size-18); margin-bottom:var(--size-28) }
:where(.hi-page) .hi-project-flow>div { text-align:center; position:relative; min-width:0 }
:where(.hi-page) .hi-project-flow>div:not(:last-child):after { content:'→'; position:absolute; top:var(--size-16); right:var(--length-px-negative-18); color:var(--color-text-muted); font-size:var(--size-16) }
:where(.hi-page) .hi-project-flow .hi-home-icon { margin-bottom:var(--size-12); background:var(--color-surface); width:var(--size-40); height:var(--size-40) }
:where(.hi-page) .hi-project-flow>div>span:not(.hi-home-icon) { display:block; font-size:var(--size-11); line-height:var(--line-height-label); font-weight:var(--font-weight-medium); color:var(--color-heading) }
:where(.hi-page) .hi-home-work__foot { margin-top:var(--size-28); text-align:right }
:where(.hi-page) .hi-store-preview { border-radius:var(--size-10); border:var(--size-1) var(--border-style) var(--color-border); background:var(--color-background); color:var(--color-heading); overflow:hidden }
:where(.hi-page) .hi-store-preview__bar { display:flex; justify-content:space-between; align-items:center; gap:var(--size-16); padding:var(--size-15) var(--size-18); background:var(--color-surface-secondary) }
:where(.hi-page) .hi-store-preview__bar b { font-size:var(--size-15); font-weight:var(--font-weight-bold); letter-spacing:var(--letter-spacing-negative-02em) }
:where(.hi-page) .hi-store-preview__bar>span { font:var(--size-9) var(--font-family-mono); color:var(--color-text-muted) }
:where(.hi-page) .hi-store-preview__inner { display:grid; grid-template-columns:var(--size-44) minmax(0,1fr) }
:where(.hi-page) .hi-store-preview__inner { grid-template-columns:var(--size-44) minmax(0,1fr) }
:where(.hi-page) .hi-store-preview__inner aside { background:var(--color-surface-secondary); border-right:var(--size-1) var(--border-style) var(--color-border-strong); display:flex; flex-direction:column; align-items:center; gap:var(--size-22); padding:var(--size-18) var(--size-5); font:var(--size-10) var(--font-family-mono); color:var(--color-heading) }
:where(.hi-page) .hi-store-preview__inner aside i { width:var(--size-16); height:var(--size-16); border:var(--size-1) var(--border-style) var(--color-border); border-radius:var(--size-3) }
:where(.hi-page) .hi-store-preview__body { padding:var(--size-24) }
:where(.hi-page) .hi-store-preview__body>strong { font:var(--font-weight-regular) var(--size-25)/var(--line-height-1-2) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-025em); color:var(--color-heading) }
:where(.hi-page) .hi-store-preview__tiles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-8); margin-top:var(--size-23) }
:where(.hi-page) .hi-store-preview__tiles span { padding:var(--size-15) var(--size-8); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-6); background:var(--color-surface); font-size:var(--size-11); color:var(--color-heading); text-align:center }
:where(.hi-page) .hi-store-preview__list { display:grid; gap:var(--size-10); margin-top:var(--size-20) }
:where(.hi-page) .hi-store-preview__list>div { display:flex; align-items:center; gap:var(--size-10); padding:var(--size-10) var(--size-12); border-radius:var(--size-5); background:var(--color-surface) }
:where(.hi-page) .hi-store-preview__list i { display:block; width:var(--size-9); height:var(--size-9); border-radius:var(--size-3); background:var(--color-surface-accent); flex:none }
:where(.hi-page) .hi-store-preview__list b { font-size:var(--size-11); color:var(--color-heading); font-weight:var(--font-weight-medium) }
:where(.hi-page) .hi-store-preview__list span { font-size:var(--size-9); color:var(--color-text-muted); margin-left:auto }
:where(.hi-page) .hi-store-preview figcaption { font:var(--size-9)/var(--line-height-1-7) var(--font-family-mono); padding:var(--size-12) var(--size-18); color:var(--color-text-muted); background:var(--color-surface-secondary) }
/* Four substantial reasons, with room for the original body copy. */
:where(.hi-page) .hi-why-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-24) }
:where(.hi-page) .hi-why-item { padding:var(--size-28); border:0; border-radius:var(--size-14); background:var(--color-surface-secondary); min-width:0 }
:where(.hi-page) .hi-why-item p { font-size:var(--size-15); line-height:var(--line-height-relaxed) }
:where(.hi-page) .hi-why-item .hi-home-icon { background:var(--color-surface) }
/* Only the original step numbers mark the process; no extra icons or rails. */
:where(.hi-page) .hi-process-track { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-24) }
:where(.hi-page) .hi-process-step { display:grid; grid-template-columns:var(--size-46) minmax(0,1fr); gap:var(--size-22); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); padding:var(--size-28); border-radius:var(--size-14); min-width:0 }
:where(.hi-page) .hi-process-step__num { display:grid; place-items:center; width:var(--size-46); height:var(--size-46); border-radius:var(--size-10); background:var(--color-primary); color:var(--color-highlight); font:var(--size-12) var(--font-family-mono) }
:where(.hi-page) .hi-process-step__body { font-size:var(--size-16); line-height:var(--line-height-relaxed); color:var(--color-text-muted) }
:where(.hi-page) .hi-step-art { display:flex; align-items:center; justify-content:center; gap:var(--size-12); height:var(--size-74); max-width:var(--size-390); padding:var(--size-15); background:var(--color-surface-secondary); border-radius:var(--size-8); margin-top:var(--size-24); min-width:0 }
:where(.hi-page) .hi-research-art span { padding:var(--size-8) var(--size-10); font-size:var(--size-11); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-5); background:var(--color-surface); color:var(--color-heading); white-space:nowrap }
:where(.hi-page) .hi-test-art span { padding:var(--size-8) var(--size-10); font-size:var(--size-11); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-5); background:var(--color-surface); color:var(--color-heading); white-space:nowrap }
:where(.hi-page) .hi-plan-art { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-10); position:relative }
:where(.hi-page) .hi-plan-art>div { position:absolute; left:46%; top:var(--size-10); width:8%; height:var(--size-14); border:var(--size-1) var(--border-style) var(--color-illustration-739582); background:var(--color-primary); border-radius:var(--size-3) }
:where(.hi-page) .hi-plan-art span { height:var(--size-22); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-4); background:var(--color-surface); margin-top:var(--size-15) }
:where(.hi-page) .hi-build-art span { font:var(--size-25) var(--font-family-display); color:var(--color-heading) }
:where(.hi-page) .hi-build-art span:nth-of-type(2) { font-family:var(--font-family-mono); font-size:var(--size-20) }
:where(.hi-page) .hi-build-art i { font-style:normal; color:var(--color-text-muted) }
:where(.hi-page) .hi-build-art b { margin-left:var(--size-10); font-size:var(--size-11); font-weight:var(--font-weight-medium); padding:var(--size-9); background:var(--color-primary); color:var(--color-highlight); border-radius:var(--size-5) }
/* Interactive craft preview, scoped so it never changes the site's brand theme. */
:where(.hi-page) .hi-home-proof__panel { display:grid; grid-template-columns:1.1fr .9fr; gap:7%; align-items:center }
:where(.hi-page) .hi-proof-copy>p { max-width:var(--size-630) }
:where(.hi-page) .hi-proof-copy .text-link { margin-top:var(--size-26) }
:where(.hi-page) .hi-craft-preview { padding:var(--size-25); background:var(--color-surface-secondary); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-16); min-width:0; box-shadow:var(--size-7) var(--size-7) 0 var(--color-surface-accent) }
:where(.hi-page) .hi-craft-toolbar { display:flex; justify-content:space-between; align-items:center; gap:var(--size-15); margin-bottom:var(--size-20) }
:where(.hi-page) .hi-craft-toolbar>span { font:var(--size-9)/var(--line-height-1-7) var(--font-family-mono); color:var(--color-heading); letter-spacing:var(--letter-spacing-06em) }
:where(.hi-page) .hi-craft-theme { font-size:var(--size-10); line-height:var(--line-height-label); padding:var(--size-8) var(--size-10); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-5); color:var(--color-heading); min-height:var(--size-34) }
:where(.hi-page) .hi-craft-screen { --craft-bg:var(--color-background); --craft-text:var(--color-primary); --craft-muted:var(--color-text-muted); --craft-tone:var(--color-surface-accent); --craft-line:var(--color-border-strong); background:var(--craft-bg); color:var(--craft-text); border:var(--size-1) var(--border-style) var(--craft-line); border-radius:var(--size-9); overflow:hidden; transition:background .2s ease,color .2s ease }
:where(.hi-page) .hi-craft-screen.is-dark { --craft-bg:var(--color-primary); --craft-text:var(--color-background); --craft-muted:var(--color-illustration-d9eade); --craft-tone:var(--color-illustration-1c5847); --craft-line:var(--color-illustration-72998b) }
:where(.hi-page) .hi-craft-screen__nav { display:flex; align-items:baseline; gap:var(--size-7); padding:var(--size-20); font:var(--size-29) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-055em) }
:where(.hi-page) .hi-craft-screen__nav>span { font:var(--size-11) var(--font-family-body); letter-spacing:0 }
:where(.hi-page) .hi-craft-screen__nav>b { font:var(--size-10) var(--font-family-body); color:var(--color-accent) }
:where(.hi-page) .hi-craft-screen.is-dark .hi-craft-screen__nav>b { color:var(--color-highlight) }
:where(.hi-page) .hi-craft-screen__copy { padding:var(--size-15) var(--size-24) var(--size-24) }
:where(.hi-page) .hi-craft-screen__copy>span { font:var(--size-9)/var(--line-height-1-5) var(--font-family-mono); letter-spacing:var(--letter-spacing-06em); color:var(--craft-muted) }
:where(.hi-page) .hi-craft-screen__copy>strong { display:block; font:var(--font-weight-regular) var(--size-34)/var(--line-height-1-13) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-035em); margin:var(--size-16) 0 var(--size-24) }
:where(.hi-page) .hi-craft-blocks { display:flex; gap:var(--size-10) }
:where(.hi-page) .hi-craft-blocks i { height:var(--size-55); flex:1; border:var(--size-1) var(--border-style) var(--craft-line); border-radius:var(--size-5); background:var(--craft-tone) }
:where(.hi-page) .hi-craft-blocks i:last-child { background:var(--color-highlight) }
:where(.hi-page) .hi-craft-quality { display:flex; flex-wrap:wrap; gap:var(--size-8) var(--size-14); padding:var(--size-14) var(--size-20); border-top:var(--size-1) var(--border-style) var(--craft-line); font-size:var(--size-9); line-height:var(--line-height-label); color:var(--craft-muted) }
:where(.hi-page) .hi-craft-preview figcaption { margin-top:var(--size-18); font:var(--size-9)/var(--line-height-1-65) var(--font-family-mono); color:var(--color-text-muted) }
/* Technology cards: diagrammed foundations, not decorative code fragments. */
:where(.hi-page) .hi-tech-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--size-24) }
:where(.hi-page) .hi-tech-item { display:flex; flex-direction:column; align-items:flex-start; padding:var(--size-28); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-14); min-width:0 }
:where(.hi-page) .hi-tech-item p { font-size:var(--size-15); line-height:var(--line-height-relaxed); margin-bottom:var(--size-24) }
:where(.hi-page) .hi-tech-art { height:var(--size-155); width:100%; background:var(--color-surface-secondary); border-radius:var(--size-8); padding:var(--size-18); margin-top:auto; min-width:0 }
:where(.hi-page) .hi-layer-art { display:grid; gap:var(--size-8) }
:where(.hi-page) .hi-layer-art span { padding:var(--size-7) var(--size-12); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-5); background:var(--color-surface); font-size:var(--size-11); line-height:var(--line-height-label); color:var(--color-heading) }
:where(.hi-page) .hi-layer-art span:first-child { background:var(--color-primary); color:var(--color-highlight); border-color:var(--color-primary) }
:where(.hi-page) .hi-security-art { display:flex; align-items:center; justify-content:center; gap:var(--size-24) }
:where(.hi-page) .hi-security-art>svg { width:var(--size-62); height:var(--size-62); max-width:var(--size-62); max-height:var(--size-62); stroke:var(--color-heading); fill:none; stroke-width:1.2; flex:none }
:where(.hi-page) .hi-security-art>div { display:grid; gap:var(--size-8) }
:where(.hi-page) .hi-security-art span { display:block; font-size:var(--size-11); color:var(--color-heading); padding:var(--size-6) var(--size-10); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-4); background:var(--color-surface) }
:where(.hi-page) .hi-cloud-art { padding:var(--size-12) var(--size-18) }
:where(.hi-page) .hi-cloud-art svg { width:100%; height:var(--size-108); max-height:var(--size-108) }
:where(.hi-page) .hi-cloud-art figcaption { font:var(--size-9)/var(--line-height-1-5) var(--font-family-mono); color:var(--color-text-muted); text-align:center }
/* Closing action in the same strong green as the service pages. */
:where(.hi-page) .hi-home-cta { padding:var(--size-85) 0 }
:where(.hi-page) .hi-home-cta__panel { display:grid; grid-template-columns:1.25fr .75fr; gap:7%; align-items:center }
:where(.hi-page) .hi-home-cta h2 { font-size:var(--font-size-closing); color:var(--color-white); max-width:var(--size-780) }
:where(.hi-page) .hi-home-cta p { color:var(--color-illustration-e0eee5); max-width:var(--size-720); font-size:var(--size-17); line-height:var(--line-height-relaxed) }
:where(.hi-page) .hi-home-cta .button { margin-top:var(--size-28) }
:where(.hi-page) .hi-cta-roadmap { display:grid; grid-template-columns:1fr; align-items:center; justify-items:center; gap:var(--size-10); padding:var(--size-28); background:var(--color-illustration-194e3e); border:var(--size-1) var(--border-style) var(--color-illustration-72998b); border-radius:var(--size-14) }
:where(.hi-page) .hi-cta-roadmap>div { display:flex; align-items:center; gap:var(--size-14); width:100% }
:where(.hi-page) .hi-cta-roadmap .hi-home-icon { margin:0; background:var(--color-primary); border-color:var(--color-illustration-72998b); color:var(--color-highlight); width:var(--size-38); height:var(--size-38); flex-basis:var(--size-38) }
:where(.hi-page) .hi-cta-roadmap>div>span:not(.hi-home-icon) { color:var(--color-illustration-e0eee5); font-size:var(--size-14) }
:where(.hi-page) .hi-cta-roadmap>i { font-style:normal; transform:rotate(90deg); color:var(--color-highlight); font-size:var(--size-16) }
@keyframes hi-home-scene {
from { opacity:.3; transform:translateY(var(--size-4)) }
to { opacity:1; transform:none }
}
@media(max-width:1200px) {
:where(.hi-page) .hi-home-hero__grid { gap:4% }
:where(.hi-page) .hi-product-player { padding:var(--size-22) }
:where(.hi-page) .hi-brand-preview__body { gap:var(--size-10); padding-inline:var(--size-16) }
:where(.hi-page) .hi-brand-preview__body strong { font-size:var(--size-26) }
:where(.hi-page) .hi-brand-art { height:var(--size-160) }
:where(.hi-page) .hi-work-card--featured { gap:5%; padding:var(--size-30) }
:where(.hi-page) .hi-store-preview__body { padding:var(--size-20) }
:where(.hi-page) .hi-tech-item { padding:var(--size-24) }
:where(.hi-page) .hi-craft-preview { padding:var(--size-22) }
:where(.hi-page) .hi-service-art { gap:var(--size-14) }
:where(.hi-page) .hi-design-components { width:var(--size-110) }
:where(.hi-page) .hi-product-player__top>span { font-size:var(--size-9) }
:where(.hi-page) .hi-project-flow { gap:var(--size-18) }
}
@media(max-width:1000px) {
:where(.hi-page) .hi-home-hero__grid { grid-template-columns:1fr }
:where(.hi-page) .hi-home-hero__col { max-width:var(--size-780) }
:where(.hi-page) h1 { max-width:var(--size-780) }
:where(.hi-page) .hi-product-player { margin-top:var(--size-30); max-width:var(--size-530); justify-self:center }
:where(.hi-page) .hi-brand-preview__body strong { font-size:var(--size-31) }
:where(.hi-page) .hi-brand-art { height:var(--size-180) }
:where(.hi-page) .hi-home-trust__inner { grid-template-columns:1fr; gap:var(--size-26) }
:where(.hi-page) .hi-home-trust .tags { grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--size-20) }
:where(.hi-page) .hi-home-trust__line { max-width:var(--size-940) }
:where(.hi-page) .hi-home-proof__panel { grid-template-columns:1fr; gap:var(--size-38) }
:where(.hi-page) .hi-proof-copy { max-width:var(--size-860) }
:where(.hi-page) .hi-craft-preview { width:100%; max-width:var(--size-520); justify-self:center }
:where(.hi-page) .hi-tech-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
:where(.hi-page) .hi-tech-item:last-child { grid-column:1/-1; display:grid; grid-template-columns:var(--size-44) 1fr 1fr; gap:0 var(--size-24); align-items:start }
:where(.hi-page) .hi-tech-item:last-child .hi-home-icon { grid-column:1; grid-row:span 2 }
:where(.hi-page) .hi-tech-item:last-child h3 { grid-column:2 }
:where(.hi-page) .hi-tech-item:last-child p { grid-column:2 }
:where(.hi-page) .hi-tech-item:last-child .hi-tech-art { grid-column:3; grid-row:1/3; align-self:center; margin:0 }
:where(.hi-page) .hi-work-card--featured { grid-template-columns:1fr; gap:var(--size-30) }
:where(.hi-page) .hi-featured-copy { max-width:var(--size-750) }
:where(.hi-page) .hi-store-preview { max-width:var(--size-660); width:100%; justify-self:center }
:where(.hi-page) .hi-service-art { gap:var(--size-13); padding:var(--size-20) }
:where(.hi-page) .hi-design-phone { display:none }
:where(.hi-page) .hi-process-step { padding:var(--size-26); gap:var(--size-18) }
:where(.hi-page) .hi-step-art { gap:var(--size-9) }
:where(.hi-page) .hi-research-art span { font-size:var(--size-10); padding:var(--size-8) }
:where(.hi-page) .hi-test-art span { font-size:var(--size-10); padding:var(--size-8) }
:where(.hi-page) .hi-home-cta__panel { grid-template-columns:1fr; gap:var(--size-38) }
:where(.hi-page) .hi-cta-roadmap { max-width:var(--size-540); width:100%; justify-self:start; grid-template-columns:1fr auto 1fr auto 1fr; padding:var(--size-24) var(--size-20); gap:var(--size-12) }
:where(.hi-page) .hi-cta-roadmap>div { flex-direction:column; text-align:center; gap:var(--size-10) }
:where(.hi-page) .hi-cta-roadmap>i { transform:none }
:where(.hi-page) .hi-cta-roadmap>div>span:not(.hi-home-icon) { font-size:var(--size-12) }
}
@media(max-width:800px) {
:where(.hi-page) .hi-sec { padding:var(--size-70) 0 }
:where(.hi-page) .hi-home-hero { padding:var(--size-45) 0 }
:where(.hi-page) .hi-pillar-grid { grid-template-columns:1fr }
:where(.hi-page) .hi-work-sub { grid-template-columns:1fr }
:where(.hi-page) .hi-why-grid { grid-template-columns:1fr }
:where(.hi-page) .hi-process-track { grid-template-columns:1fr }
:where(.hi-page) .hi-pillar__body { min-height:0 }
:where(.hi-page) .hi-service-art { gap:var(--size-25) }
:where(.hi-page) .hi-design-phone { display:block }
:where(.hi-page) .hi-service-art { margin:var(--space-px-negative-28) var(--space-px-negative-28) var(--size-28) }
:where(.hi-page) .hi-home-trust .tags { grid-template-columns:repeat(2,minmax(0,1fr)) }
:where(.hi-page) .hi-home-trust { padding:var(--size-30) 0 }
:where(.hi-page) .hi-process-step { padding:var(--size-28) }
:where(.hi-page) .hi-step-art { max-width:none }
:where(.hi-page) .hi-project-flow { max-width:var(--size-600) }
:where(.hi-page) .hi-tech-grid { grid-template-columns:1fr }
:where(.hi-page) .hi-tech-item:last-child { display:flex; grid-column:auto }
:where(.hi-page) .hi-tech-item:last-child .hi-tech-art { height:var(--size-155); width:100%; margin-top:auto }
:where(.hi-page) .hi-tech-item { padding:var(--size-28) }
:where(.hi-page) .hi-tech-art { max-width:var(--size-450) }
:where(.hi-page) .hi-home-cta { padding:var(--size-70) 0 }
:where(.hi-page) .hi-cta-roadmap { max-width:var(--size-600) }
}
@media(max-width:520px) {
:where(.hi-page) .hi-sec { padding:var(--size-58) 0 }
:where(.hi-page) .hi-home-hero { padding:var(--size-42) 0 }
:where(.hi-page) h1 { font-size:var(--size-44) }
:where(.hi-page) h2 { font-size:var(--size-34) }
:where(.hi-page) .hi-home-hero__lead { font-size:var(--size-16) }
:where(.hi-page) .hi-home-hero__actions { gap:var(--size-18) }
:where(.hi-page) .hi-home-hero__meta { gap:var(--size-9) var(--size-15); font-size:var(--size-10) }
:where(.hi-page) .hi-product-player { padding:var(--size-20) var(--size-17); box-shadow:var(--size-5) var(--size-5) 0 var(--color-surface-accent) }
:where(.hi-page) .hi-product-player__top { gap:var(--size-10) }
:where(.hi-page) .hi-product-player__top>span { max-width:16ch; line-height:var(--line-height-1-6) }
:where(.hi-page) .hi-product-toggle { font-size:var(--size-10); padding:var(--size-8) }
:where(.hi-page) .hi-product-tabs { gap:var(--size-5) }
:where(.hi-page) .hi-product-tabs button { font-size:var(--size-10); padding:var(--size-9) var(--size-4) }
:where(.hi-page) .hi-product-panel { min-height:var(--size-305) }
:where(.hi-page) .hi-brand-preview__nav { padding:var(--size-15) }
:where(.hi-page) .hi-brand-preview__body { padding:var(--size-10) var(--size-15) var(--size-20); grid-template-columns:1.3fr .7fr; gap:var(--size-8) }
:where(.hi-page) .hi-brand-preview__body strong { font-size:var(--size-26) }
:where(.hi-page) .hi-mini-kicker { font-size:var(--size-7) }
:where(.hi-page) .hi-brand-preview__body p { font-size:var(--size-9) }
:where(.hi-page) .hi-brand-art { height:var(--size-155) }
:where(.hi-page) .hi-arch { border-width:var(--size-15) }
:where(.hi-page) .hi-brand-art>span { width:var(--size-25); height:var(--size-25) }
:where(.hi-page) .hi-brand-preview__base { padding:var(--size-11) var(--size-15); font-size:var(--size-8) }
:where(.hi-page) .hi-operation-preview { padding:var(--size-20) var(--size-15) }
:where(.hi-page) .hi-operation-heading strong { font-size:var(--size-23) }
:where(.hi-page) .hi-operation-summary>div { padding:var(--size-10) var(--size-7); font-size:var(--size-8) }
:where(.hi-page) .hi-operation-summary b { font-size:var(--size-11) }
:where(.hi-page) .hi-operation-rows b { font-size:var(--size-10) }
:where(.hi-page) .hi-operation-rows small { font-size:var(--size-8) }
:where(.hi-page) .hi-operation-rows>div { gap:var(--size-8); padding:var(--size-10) var(--size-8) }
:where(.hi-page) .hi-connection-preview { padding:var(--size-24) var(--size-16) }
:where(.hi-page) .hi-connection-inputs>span { font-size:var(--size-10) }
:where(.hi-page) .hi-connection-outputs>span { font-size:var(--size-10) }
:where(.hi-page) .hi-connection-core strong { font-size:var(--size-23) }
:where(.hi-page) .hi-connection-core small { font-size:var(--size-9) }
:where(.hi-page) .hi-product-caption strong { font-size:var(--size-11); min-height:var(--length-em-3-4) }
:where(.hi-page) .hi-product-formula span { font-size:var(--size-11) }
:where(.hi-page) .hi-product-formula b { font-size:var(--size-11) }
:where(.hi-page) .hi-home-trust__line { font-size:var(--size-21) }
:where(.hi-page) .hi-home-trust .tags { gap:var(--size-14) var(--size-16) }
:where(.hi-page) .hi-home-trust li { font-size:var(--size-11) }
:where(.hi-page) .hi-sec__head { margin-bottom:var(--size-30) }
:where(.hi-page) .hi-service-art { margin:var(--space-px-negative-26) var(--space-px-negative-26) var(--size-26); height:var(--size-165); gap:var(--size-16) }
:where(.hi-page) .hi-design-swatch { width:var(--size-95); padding:var(--size-15) }
:where(.hi-page) .hi-design-swatch b { font-size:var(--size-40) }
:where(.hi-page) .hi-design-components { width:var(--size-100); padding:var(--size-12) }
:where(.hi-page) .hi-design-phone { width:var(--size-50); height:var(--size-110) }
:where(.hi-page) .hi-pillar h3 { font-size:var(--size-30) }
:where(.hi-page) .hi-pillar__subs li { font-size:var(--size-13) }
:where(.hi-page) .hi-code-art__layers span { padding:var(--size-8) var(--size-9); font-size:var(--size-10) }
:where(.hi-page) .hi-work-card--featured { padding:var(--size-26) var(--size-20) }
:where(.hi-page) .hi-work-card__title { font-size:var(--size-32) }
:where(.hi-page) .hi-work-card--featured .hi-work-card__desc { font-size:var(--size-15) }
:where(.hi-page) .hi-work-card .hi-tag { font-size:var(--size-10); padding:var(--size-6) var(--size-8) }
:where(.hi-page) .hi-store-preview__bar { padding:var(--size-13) }
:where(.hi-page) .hi-store-preview__bar b { font-size:var(--size-13) }
:where(.hi-page) .hi-store-preview__bar>span { font-size:var(--size-8) }
:where(.hi-page) .hi-store-preview__inner { grid-template-columns:1fr }
:where(.hi-page) .hi-store-preview__inner aside { display:none }
:where(.hi-page) .hi-store-preview__body { padding:var(--size-20) var(--size-15) }
:where(.hi-page) .hi-store-preview__body>strong { font-size:var(--size-24) }
:where(.hi-page) .hi-store-preview__tiles span { font-size:var(--size-10); padding:var(--size-13) var(--size-5) }
:where(.hi-page) .hi-store-preview__list b { font-size:var(--size-10) }
:where(.hi-page) .hi-store-preview__list span { font-size:var(--size-8) }
:where(.hi-page) .hi-store-preview figcaption { font-size:var(--size-8) }
:where(.hi-page) .hi-project-flow { gap:var(--size-17); padding:var(--size-22) var(--size-12) }
:where(.hi-page) .hi-project-flow>div>span:not(.hi-home-icon) { font-size:var(--size-10) }
:where(.hi-page) .hi-project-flow .hi-home-icon { width:var(--size-35); height:var(--size-35); margin-bottom:var(--size-10) }
:where(.hi-page) .hi-project-flow>div:not(:last-child):after { right:var(--length-px-negative-16); top:var(--size-12) }
:where(.hi-page) .hi-why-item { padding:var(--size-26) }
:where(.hi-page) .hi-process-step { grid-template-columns:var(--size-39) minmax(0,1fr); gap:var(--size-15); padding:var(--size-24) var(--size-18) }
:where(.hi-page) .hi-process-step__num { width:var(--size-39); height:var(--size-39); font-size:var(--size-11) }
:where(.hi-page) .hi-process-step__title { font-size:var(--size-18) }
:where(.hi-page) .hi-process-step__body { font-size:var(--size-15) }
:where(.hi-page) .hi-step-art { gap:var(--size-6); padding:var(--size-10); height:var(--size-70) }
:where(.hi-page) .hi-research-art span { font-size:var(--size-9); padding:var(--size-7) }
:where(.hi-page) .hi-test-art span { font-size:var(--size-9); padding:var(--size-7) }
:where(.hi-page) .hi-build-art { gap:var(--size-8) }
:where(.hi-page) .hi-build-art span { font-size:var(--size-23) }
:where(.hi-page) .hi-build-art span:nth-of-type(2) { font-size:var(--size-17) }
:where(.hi-page) .hi-build-art b { font-size:var(--size-10); margin-left:0; padding:var(--size-7) }
:where(.hi-page) .hi-craft-preview { padding:var(--size-22) var(--size-18); box-shadow:var(--size-5) var(--size-5) 0 var(--color-surface-accent) }
:where(.hi-page) .hi-craft-toolbar { gap:var(--size-10) }
:where(.hi-page) .hi-craft-toolbar>span { font-size:var(--size-8); max-width:15ch }
:where(.hi-page) .hi-craft-theme { font-size:var(--size-9); padding:var(--size-7) var(--size-8) }
:where(.hi-page) .hi-craft-screen__copy { padding:var(--size-15) var(--size-20) var(--size-22) }
:where(.hi-page) .hi-craft-screen__copy>strong { font-size:var(--size-31) }
:where(.hi-page) .hi-craft-quality { gap:var(--size-8) var(--size-10); font-size:var(--size-8) }
:where(.hi-page) .hi-tech-item { padding:var(--size-26) }
:where(.hi-page) .hi-tech-art { height:var(--size-145) }
:where(.hi-page) .hi-home-cta { padding:var(--size-65) 0 }
:where(.hi-page) .hi-home-cta h2 { font-size:var(--size-38) }
:where(.hi-page) .hi-home-cta p { font-size:var(--size-16) }
:where(.hi-page) .hi-cta-roadmap { padding:var(--size-24) var(--size-16); gap:var(--size-10) }
:where(.hi-page) .hi-cta-roadmap>div>span:not(.hi-home-icon) { font-size:var(--size-11) }
:where(.hi-page) .hi-cta-roadmap .hi-home-icon { width:var(--size-33); height:var(--size-33); flex-basis:var(--size-33) }
:where(.hi-page) .hi-cta-roadmap .hi-home-icon svg { width:var(--size-20); height:var(--size-20) }
}
@media(max-width:360px) {
:where(.hi-page) .hi-brand-preview__body { grid-template-columns:1fr .65fr }
:where(.hi-page) .hi-brand-preview__body strong { font-size:var(--size-24) }
:where(.hi-page) .hi-brand-art { height:var(--size-140) }
:where(.hi-page) .hi-brand-preview__nav b { font-size:var(--size-23) }
:where(.hi-page) .hi-product-formula { gap:var(--size-6) }
:where(.hi-page) .hi-product-formula span { font-size:var(--size-10) }
:where(.hi-page) .hi-product-formula b { font-size:var(--size-10) }
:where(.hi-page) .hi-product-formula b { padding:var(--size-8) }
:where(.hi-page) .hi-service-art { gap:var(--size-12) }
:where(.hi-page) .hi-design-phone { display:none }
:where(.hi-page) .hi-cta-roadmap { gap:var(--size-7) }
:where(.hi-page) h1 { font-size:var(--size-41) }
}
@media(prefers-reduced-motion:reduce) {
:where(.hi-page) .hi-product-panel { animation:none }
:where(.hi-page) .hi-product-progress i { transition:none }
:where(.hi-page) .hi-craft-screen { transition:none }
}
@media print {
:where(.hi-page) .hi-product-toggle { display:none }
:where(.hi-page) .hi-product-tabs { display:none }
:where(.hi-page) .hi-product-progress { display:none }
:where(.hi-page) .hi-craft-theme { display:none }
:where(.hi-page) .hi-sec { padding:var(--size-28) 0 }
:where(.hi-page) .hi-product-player { break-inside:avoid; box-shadow:none }
:where(.hi-page) .hi-work-card { break-inside:avoid }
:where(.hi-page) .hi-why-item { break-inside:avoid; box-shadow:none }
:where(.hi-page) .hi-process-step { break-inside:avoid; box-shadow:none }
:where(.hi-page) .hi-tech-item { break-inside:avoid; box-shadow:none }
:where(.hi-page) .hi-home-cta { print-color-adjust:exact }
:where(.hi-page) .hi-work-card--featured { print-color-adjust:exact }
}
/* Icons and labels are separate layout roles; label rules must not affect icon tiles. */
:where(.hi-page) .hi-home-icon { display:inline-grid; place-items:center; align-items:center; justify-content:center; padding:0; line-height:var(--line-height-art-1) }
:where(.hi-page) .hi-home-icon>svg { display:block; margin:0; position:static; align-self:center; justify-self:center; flex:none }
:where(.hi-page) .hi-project-flow>div { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:var(--size-12); position:relative; min-width:0; text-align:center }
:where(.hi-page) .hi-project-flow .hi-home-icon { display:inline-grid; flex:0 0 var(--size-44); width:var(--size-44); height:var(--size-44); margin:0; background:var(--color-surface) }
:where(.hi-page) .hi-project-flow>div>span:not(.hi-home-icon) { display:block; font-size:var(--size-12); font-weight:var(--font-weight-medium); line-height:var(--line-height-1-6); color:var(--color-heading); text-align:center }
:where(.hi-page) .hi-project-flow>div:not(:last-child):after { left:calc(100% + var(--size-3)); right:auto; top:var(--size-10); width:var(--size-14); line-height:var(--size-24); font-size:var(--size-18); text-align:center; color:var(--color-text-muted) }
/* Closing schematic: aligned icons, readable labels, arrows joining equal steps. */
:where(.hi-page) .hi-cta-roadmap { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; justify-items:stretch; gap:var(--size-24); padding:var(--size-28) var(--size-20); width:100%; max-width:var(--size-540); justify-self:end; border-radius:var(--size-14); background:var(--color-illustration-194e3e); border-color:var(--color-illustration-72998b) }
:where(.hi-page) .hi-cta-roadmap>div { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:var(--size-14); width:100%; position:relative; text-align:center; min-width:0 }
:where(.hi-page) .hi-cta-roadmap .hi-home-icon { display:inline-grid; flex:0 0 var(--size-44); width:var(--size-44); height:var(--size-44); margin:0; background:var(--color-primary); border-color:var(--color-illustration-72998b); color:var(--color-highlight) }
:where(.hi-page) .hi-cta-roadmap>div>span:not(.hi-home-icon) { display:block; font-size:var(--size-13); line-height:var(--line-height-1-6); font-weight:var(--font-weight-medium); color:var(--color-illustration-e0eee5); text-align:center }
:where(.hi-page) .hi-cta-roadmap>div:not(:last-child):after { content:'→'; position:absolute; left:calc(100% + var(--size-5)); top:var(--size-10); width:var(--size-14); line-height:var(--size-24); font-size:var(--size-18); text-align:center; color:var(--color-highlight) }
:where(.hi-page) .hi-cta-roadmap>.hi-cta-roadmap__caption { grid-column:1/-1; font:var(--size-10)/var(--line-height-1-7) var(--font-family-mono); letter-spacing:var(--letter-spacing-05em); color:var(--color-illustration-c9dfd1); text-align:left; margin:0 0 var(--size-2) }
@media(max-width:1000px) {
:where(.hi-page) .hi-cta-roadmap { justify-self:start }
}
@media(max-width:520px) {
:where(.hi-page) .hi-project-flow { gap:var(--size-20); padding:var(--size-22) var(--size-14) }
:where(.hi-page) .hi-project-flow .hi-home-icon { width:var(--size-40); height:var(--size-40); flex-basis:var(--size-40) }
:where(.hi-page) .hi-project-flow>div>span:not(.hi-home-icon) { font-size:var(--size-10) }
:where(.hi-page) .hi-project-flow>div:not(:last-child):after { top:var(--size-8); left:calc(100% + var(--size-3)); font-size:var(--size-16) }
:where(.hi-page) .hi-cta-roadmap { gap:var(--size-20); padding:var(--size-24) var(--size-18) }
:where(.hi-page) .hi-cta-roadmap>div { gap:var(--size-12) }
:where(.hi-page) .hi-cta-roadmap .hi-home-icon { width:var(--size-40); height:var(--size-40); flex-basis:var(--size-40) }
:where(.hi-page) .hi-cta-roadmap .hi-home-icon svg { width:var(--size-23); height:var(--size-23) }
:where(.hi-page) .hi-cta-roadmap>div>span:not(.hi-home-icon) { font-size:var(--size-11) }
:where(.hi-page) .hi-cta-roadmap>div:not(:last-child):after { left:calc(100% + var(--size-3)); top:var(--size-8); font-size:var(--size-16) }
:where(.hi-page) .hi-cta-roadmap>.hi-cta-roadmap__caption { font-size:var(--size-9); margin-bottom:0 }
}
/* Homepage review: keep the established Avielon palette and icon geometry. */
:where(.hi-page) #baslayalim .hi-cta-roadmap { display:grid; grid-template-columns:minmax(0,1fr); justify-items:stretch; gap:var(--size-16); padding:var(--size-30); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-surface-accent); border-radius:var(--size-12); color:var(--color-heading); width:100%; min-width:0 }
:where(.hi-page) #baslayalim .hi-cta-roadmap .hi-cta-roadmap__caption { margin:0 0 var(--size-8); max-width:none; color:var(--color-heading); font:var(--font-weight-medium) var(--size-11)/var(--line-height-1-7) var(--font-family-mono); letter-spacing:var(--letter-spacing-06em); text-align:left }
:where(.hi-page) #baslayalim .hi-cta-roadmap>div { display:flex; flex-direction:row; align-items:center; text-align:left; gap:var(--size-16); padding:var(--size-16); background:var(--color-background); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-8); width:100%; min-width:0 }
:where(.hi-page) #baslayalim .hi-cta-roadmap .hi-home-icon { margin:0; background:var(--color-surface-accent); border:var(--size-1) var(--border-style) var(--color-border-strong); color:var(--color-heading); width:var(--size-44); height:var(--size-44); flex:0 0 var(--size-44); border-radius:var(--size-8) }
:where(.hi-page) #baslayalim .hi-cta-roadmap>div>span:not(.hi-home-icon) { color:var(--color-heading); font:var(--font-weight-bold) var(--size-16)/var(--line-height-1-5) var(--font-family-body) }
@media(max-width:520px) {
:where(.hi-page) #baslayalim .hi-cta-roadmap { padding:var(--size-24) var(--size-20); gap:var(--size-14) }
:where(.hi-page) #baslayalim .hi-cta-roadmap>div { padding:var(--size-14); gap:var(--size-14) }
:where(.hi-page) #baslayalim .hi-cta-roadmap>div>span:not(.hi-home-icon) { font-size:var(--size-15) }
}
/* Homepage visual refinement: contrast, rhythm and consistent icon placement. */
:where(.hi-page) .hi-product-player { background:var(--color-primary); border-color:var(--color-primary); border-radius:var(--size-12) }
:where(.hi-page) .hi-product-player__top>span { color:var(--color-white) }
:where(.hi-page) .hi-product-caption strong { color:var(--color-white) }
:where(.hi-page) .hi-product-toggle { color:var(--color-white); border-color:var(--color-border-strong) }
:where(.hi-page) .hi-product-toggle:hover { background:var(--color-accent) }
:where(.hi-page) .hi-product-tabs button { background:var(--color-surface); color:var(--color-heading); border-color:var(--color-surface-accent) }
:where(.hi-page) .hi-product-tabs button[aria-selected="true"] { background:var(--color-highlight); color:var(--color-heading); border-color:var(--color-highlight) }
:where(.hi-page) .hi-product-caption small { color:var(--color-surface-secondary) }
:where(.hi-page) .hi-product-formula>span { color:var(--color-white) }
:where(.hi-page) .hi-product-formula>i { color:var(--color-highlight) }
:where(.hi-page) .hi-product-formula>b { background:var(--color-highlight); color:var(--color-heading) }
:where(.hi-page) .hi-product-progress { background:var(--color-illustration-487769) }
:where(.hi-page) .hi-product-progress i { background:var(--color-highlight) }
:where(.hi-page) .hi-home-hero__actions .hi-home-secondary-link { display:inline-flex; align-items:center; gap:var(--size-12); background:none; border:0; border-bottom:var(--size-1) var(--border-style) currentColor; border-radius:0; padding:0 0 var(--size-6); color:var(--color-heading); text-decoration:none; font:var(--font-weight-medium) var(--size-14)/var(--line-height-1-6) var(--font-family-body) }
:where(.hi-page) .hi-home-secondary-link:before { display:none }
:where(.hi-page) .hi-home-secondary-link:after { display:none }
:where(.hi-page) .hi-home-secondary-link svg { width:var(--size-21); height:var(--size-21); flex:0 0 var(--size-21) }
:where(.hi-page) .hi-home-hero__meta { font-size:var(--size-13); color:var(--color-text); gap:var(--size-16) var(--size-22) }
:where(.hi-page) .hi-home-hero__meta li { gap:var(--size-10) }
:where(.hi-page) .hi-home-hero__meta li:before { display:none }
:where(.hi-page) .hi-home-hero__meta svg { width:var(--size-24); height:var(--size-24); flex:0 0 var(--size-24); color:var(--color-heading) }
:where(.hi-page) .hi-home-trust { padding:var(--size-54) 0 }
:where(.hi-page) .hi-home-trust__inner { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--size-26) 7%; align-items:center }
:where(.hi-page) .hi-trust-heading .eyebrow { margin:0 0 var(--size-16) }
:where(.hi-page) .hi-trust-heading h2 { font:var(--font-weight-display) clamp(var(--size-30),3vw,var(--size-42))/var(--line-height-1-18) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-025em); margin:0; color:var(--color-heading) }
:where(.hi-page) .hi-home-trust__line { font:var(--font-weight-regular) var(--size-16)/var(--line-height-1-8) var(--font-family-body); margin:0; color:var(--color-text) }
:where(.hi-page) .hi-home-trust .tags { grid-column:1/-1; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--size-20); margin:var(--size-10) 0 0; padding:var(--size-28) 0 0; border-top:var(--size-1) var(--border-style) var(--color-border-strong) }
:where(.hi-page) .hi-home-trust .hi-tag { background:none; border:0; padding:0 }
:where(.hi-page) .hi-home-trust .tags a { display:flex; align-items:center; gap:var(--size-12); font:var(--font-weight-medium) var(--size-14)/var(--line-height-1-6) var(--font-family-body); color:var(--color-heading) }
:where(.hi-page) .hi-home-trust .tags a:before { display:none }
:where(.hi-page) .hi-home-trust .tags svg { width:var(--size-24); height:var(--size-24); flex:0 0 var(--size-24) }
:where(.hi-page) .hi-pillar { background:var(--color-surface); display:flex; flex-direction:column }
:where(.hi-page) .hi-pillar .hi-service-art { flex:0 0 var(--size-190); height:var(--size-190); margin-bottom:var(--size-28) }
:where(.hi-page) .hi-pillar__foot { margin-top:auto }
:where(.hi-page) .hi-software-composition { flex-direction:row; gap:var(--size-20) }
:where(.hi-page) .hi-software-swatch { width:var(--size-100); flex:0 0 var(--size-100); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-7); padding:var(--size-14); box-shadow:var(--size-5) var(--size-5) 0 var(--color-illustration-b6d1bf); transform:rotate(-5deg) }
:where(.hi-page) .hi-software-swatch>span { font:var(--font-weight-medium) var(--size-8)/var(--line-height-1-5) var(--font-family-mono); color:var(--color-text-muted) }
:where(.hi-page) .hi-software-swatch>b { display:block; font:var(--font-weight-regular) var(--size-36)/var(--line-height-1-3) var(--font-family-mono); color:var(--color-heading); white-space:nowrap }
:where(.hi-page) .hi-software-swatch>div { display:flex; gap:var(--size-5); margin-top:var(--size-10) }
:where(.hi-page) .hi-software-swatch i { width:var(--size-15); height:var(--size-15); border-radius:50%; background:var(--color-primary) }
:where(.hi-page) .hi-software-swatch i:nth-child(2) { background:var(--color-accent) }
:where(.hi-page) .hi-software-swatch i:nth-child(3) { background:var(--color-highlight) }
:where(.hi-page) .hi-software-window { width:var(--size-135); flex:0 0 var(--size-135); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-7); padding:var(--size-12); box-shadow:var(--size-5) var(--size-5) 0 var(--color-illustration-b6d1bf); transform:rotate(4deg) }
:where(.hi-page) .hi-software-window-bar { display:flex; gap:var(--size-4); margin-bottom:var(--size-12) }
:where(.hi-page) .hi-software-window-bar i { width:var(--size-4); height:var(--size-4); border-radius:50%; background:var(--color-illustration-739582) }
:where(.hi-page) .hi-software-code-lines { display:grid; gap:var(--size-7); padding:var(--size-13) var(--size-10); background:var(--color-primary); border-radius:var(--size-4) }
:where(.hi-page) .hi-software-code-lines span { height:var(--size-4); border-radius:var(--size-2); width:80%; background:var(--color-surface-accent) }
:where(.hi-page) .hi-software-code-lines span:nth-child(2) { width:60%; margin-left:var(--size-9); background:var(--color-highlight) }
:where(.hi-page) .hi-software-code-lines span:nth-child(3) { width:68%; margin-left:var(--size-9) }
:where(.hi-page) .hi-software-code-lines span:nth-child(4) { width:45% }
:where(.hi-page) .hi-software-window small { display:block; font:var(--font-weight-medium) var(--size-8)/var(--line-height-1-5) var(--font-family-mono); color:var(--color-heading); margin-top:var(--size-9) }
:where(.hi-page) .hi-software-api { width:var(--size-58); flex:0 0 var(--size-58); height:var(--size-115); padding:var(--size-10) var(--size-6); background:var(--color-surface); border:var(--size-2) var(--border-style) var(--color-illustration-739582); border-radius:var(--size-10); transform:rotate(7deg); text-align:center }
:where(.hi-page) .hi-software-api>span { font:var(--font-weight-medium) var(--size-10) var(--font-family-mono); color:var(--color-heading) }
:where(.hi-page) .hi-software-api>div { height:var(--size-10); background:var(--color-surface-secondary); border-radius:var(--size-3); margin-top:var(--size-9) }
:where(.hi-page) .hi-software-api>b { display:block; color:var(--color-heading); font-size:var(--size-23); margin-top:var(--size-5) }
:where(.hi-page) .hi-process-step>div { display:flex; flex-direction:column; min-width:0 }
:where(.hi-page) .hi-process-step .hi-step-art { margin-top:auto; flex:0 0 var(--size-74); width:100%; max-width:none }
:where(.hi-page) .hi-process-step__body { margin-bottom:var(--size-24) }
:where(.hi-page) .hi-craft-preview { background:var(--color-primary); border-color:var(--color-primary); border-radius:var(--size-12) }
:where(.hi-page) .hi-craft-toolbar>span { color:var(--color-highlight); max-width:none; font-size:var(--size-10) }
:where(.hi-page) .hi-craft-preview figcaption { color:var(--color-surface-secondary); font-size:var(--size-10) }
:where(.hi-page) .hi-craft-screen { --craft-bg:var(--color-white) }
:where(.hi-page) .hi-home-project-title { font:var(--font-weight-display) var(--size-28)/var(--line-height-1-25) var(--font-family-display); color:var(--color-heading); margin:var(--size-26) 0 var(--size-20); letter-spacing:var(--letter-spacing-negative-02em) }
:where(.hi-page) .hi-home-project-title:before { display:none }
:where(.hi-page) .hi-home-project-title:after { display:none }
@media(max-width:1100px) {
:where(.hi-page) .hi-software-composition { gap:var(--size-13) }
:where(.hi-page) .hi-software-api { display:none }
}
@media(max-width:800px) {
:where(.hi-page) .hi-home-trust__inner { grid-template-columns:minmax(0,1fr); gap:var(--size-24) }
:where(.hi-page) .hi-home-trust .tags { grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-24) }
:where(.hi-page) .hi-software-composition { gap:var(--size-20) }
:where(.hi-page) .hi-software-api { display:block }
:where(.hi-page) .hi-home-trust { padding:var(--size-46) 0 }
}
@media(max-width:520px) {
:where(.hi-page) .hi-home-trust .tags { gap:var(--size-22) var(--size-16) }
:where(.hi-page) .hi-home-trust .tags a { font-size:var(--size-12); gap:var(--size-9) }
:where(.hi-page) .hi-home-trust__line { font-size:var(--size-15) }
:where(.hi-page) .hi-home-hero__meta { font-size:var(--size-13) }
:where(.hi-page) .hi-pillar .hi-service-art { flex-basis:var(--size-175); height:var(--size-175) }
:where(.hi-page) .hi-software-composition { gap:var(--size-12) }
:where(.hi-page) .hi-software-swatch { width:var(--size-85); flex-basis:var(--size-85); padding:var(--size-10) }
:where(.hi-page) .hi-software-swatch>b { font-size:var(--size-32) }
:where(.hi-page) .hi-software-window { width:var(--size-110); flex-basis:var(--size-110); padding:var(--size-10) }
:where(.hi-page) .hi-software-api { display:none }
:where(.hi-page) .hi-craft-toolbar>span { font-size:var(--size-9) }
:where(.hi-page) .hi-home-project-title { font-size:var(--size-26) }
:where(.hi-page) .hi-process-step .hi-step-art { flex-basis:var(--size-70) }
}
:where(.hi-page) .hi-design-routes { margin-top:var(--size-28); padding:var(--size-32); border-radius:var(--size-16); background:var(--color-primary); color:var(--color-white) }
:where(.hi-page) .hi-design-routes__head { display:grid; grid-template-columns:1fr 1fr; gap:7%; align-items:end; margin-bottom:var(--size-26) }
:where(.hi-page) .hi-design-routes__head .eyebrow { color:var(--color-highlight); margin-bottom:var(--size-12) }
:where(.hi-page) .hi-design-routes__head h3 { margin:0; color:var(--color-white); font:var(--font-weight-display) clamp(var(--size-27),2.5vw,var(--size-38))/var(--line-height-1-2) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-03em) }
:where(.hi-page) .hi-design-routes__head p { margin:0; color:var(--color-surface-secondary); font-size:var(--size-15); line-height:var(--line-height-1-75) }
:where(.hi-page) .hi-design-routes__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--size-14) }
:where(.hi-page) .hi-design-route { display:flex; flex-direction:column; min-height:var(--size-170); padding:var(--size-20); border-radius:var(--size-10); background:var(--color-surface); color:var(--color-heading); text-decoration:none }
:where(.hi-page) .hi-design-route svg { width:var(--size-26); height:var(--size-26); margin-bottom:var(--size-22); stroke:var(--color-accent) }
:where(.hi-page) .hi-design-route strong { display:block; font-size:var(--size-15); line-height:var(--line-height-1-45); color:var(--color-heading) }
:where(.hi-page) .hi-design-route small { display:block; margin-top:var(--size-8); font-size:var(--size-11); line-height:var(--line-height-1-6); color:var(--color-text-muted) }
:where(.hi-page) .hi-design-route b { margin-top:auto; padding-top:var(--size-17); font-size:var(--size-18); font-weight:var(--font-weight-regular); color:var(--color-accent) }
:where(.hi-page) .hi-design-route:hover { background:var(--color-highlight) }
:where(.hi-page) .hi-design-route--knowledge { background:var(--color-surface-secondary) }
@media(max-width:1000px) {
:where(.hi-page) .hi-design-routes__grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:700px) {
:where(.hi-page) .hi-design-routes { padding:var(--size-24) }
:where(.hi-page) .hi-design-routes__head { grid-template-columns:1fr; gap:var(--size-16) }
:where(.hi-page) .hi-design-routes__grid { grid-template-columns:1fr }
:where(.hi-page) .hi-design-route { min-height:var(--size-150) }
}
/* Service architecture: two equal disciplines, with digital-product routes visibly nested. */
:where(.hi-page) .hi-home-services>.container>.hi-pillar-grid { display:none }
:where(.hi-page) .hi-home-services>.container>.hi-design-routes { display:none }
:where(.hi-page) .hi-service-families { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-28); align-items:start }
:where(.hi-page) .hi-service-family { min-width:0; border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-16); background:var(--color-surface); overflow:hidden }
:where(.hi-page) .hi-service-family__visual { height:var(--size-184); margin:0; background:var(--color-surface-secondary); display:flex; align-items:center; justify-content:center; padding:var(--size-22); gap:var(--size-20); overflow:hidden }
:where(.hi-page) .hi-service-family__intro { padding:var(--size-28) var(--size-30) var(--size-25); border-bottom:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-service-family__title-row { display:flex; align-items:center; gap:var(--size-14); margin-bottom:var(--size-15) }
:where(.hi-page) .hi-service-family__title-row .hi-home-icon { margin:0; flex:0 0 var(--size-42) }
:where(.hi-page) .hi-service-family__title { margin:0; color:var(--color-heading); font:var(--font-weight-display) var(--size-34)/var(--line-height-1-15) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-025em) }
:where(.hi-page) .hi-service-family__intro>p { margin:0; color:var(--color-text-muted); font-size:var(--size-15); line-height:var(--line-height-1-78) }
:where(.hi-page) .hi-service-family__services { padding:0 var(--size-30) }
:where(.hi-page) .hi-service-entry { padding:var(--size-25) 0; border-bottom:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-service-entry:last-child { border-bottom:0 }
:where(.hi-page) .hi-service-entry__top { display:grid; grid-template-columns:var(--size-28) minmax(0,1fr) var(--size-22); gap:var(--size-13); align-items:start; color:var(--color-heading); text-decoration:none }
:where(.hi-page) .hi-service-entry__top>svg { width:var(--size-25); height:var(--size-25); margin-top:var(--size-2); color:var(--color-accent) }
:where(.hi-page) .hi-service-entry__top>span { font-size:var(--size-18); line-height:var(--line-height-heading); font-weight:var(--font-weight-bold); letter-spacing:var(--letter-spacing-negative-015em) }
:where(.hi-page) .hi-service-entry__top>b { font-size:var(--size-19); line-height:var(--line-height-art-1-3); font-weight:var(--font-weight-regular); color:var(--color-accent); text-align:right }
:where(.hi-page) .hi-service-entry>p { margin:var(--size-10) var(--size-35) 0 var(--size-41); color:var(--color-text-muted); font-size:var(--size-14); line-height:var(--line-height-1-72) }
:where(.hi-page) .hi-service-entry--expanded { margin:0 var(--space-px-negative-16); padding:var(--size-25) var(--size-16) var(--size-18); background:var(--color-primary); border:0 }
:where(.hi-page) .hi-service-entry--expanded .hi-service-entry__top { color:var(--color-white) }
:where(.hi-page) .hi-service-entry--expanded .hi-service-entry__top>svg { color:var(--color-white) }
:where(.hi-page) .hi-service-entry--expanded .hi-service-entry__top>b { color:var(--color-white) }
:where(.hi-page) .hi-service-entry--expanded .hi-service-entry__top>svg { color:var(--color-highlight) }
:where(.hi-page) .hi-service-entry--expanded>p { color:var(--color-surface-secondary) }
:where(.hi-page) .hi-product-routes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--size-10); margin:var(--size-20) 0 0 var(--size-41) }
:where(.hi-page) .hi-product-route { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--size-8) var(--size-12); align-items:start; min-height:var(--size-116); padding:var(--size-16); border-radius:var(--size-9); background:var(--color-surface); color:var(--color-heading); text-decoration:none; transition:background .2s ease,transform .2s ease }
:where(.hi-page) .hi-product-route:hover { background:var(--color-highlight); transform:translateY(var(--length-px-negative-2)) }
:where(.hi-page) .hi-product-route strong { font-size:var(--size-14); line-height:var(--line-height-art-1-4); font-weight:var(--font-weight-bold) }
:where(.hi-page) .hi-product-route>b { font-size:var(--size-17); line-height:var(--line-height-1-2); font-weight:var(--font-weight-regular); color:var(--color-accent) }
:where(.hi-page) .hi-product-route small { grid-column:1/-1; color:var(--color-text-muted); font-size:var(--size-11); line-height:var(--line-height-1-6) }
:where(.hi-page) .hi-product-route--knowledge { background:var(--color-surface-secondary) }
:where(.hi-page) .hi-product-route__label { grid-column:1/-1; width:max-content; margin-bottom:var(--size-2); padding:var(--size-4) var(--size-7); border-radius:var(--size-3); background:var(--color-highlight); color:var(--color-heading); font:var(--font-weight-bold) var(--size-8)/var(--line-height-1-3) var(--font-family-mono); letter-spacing:var(--letter-spacing-08em); text-transform:uppercase }
:where(.hi-page) .hi-service-family__foot { padding:0 var(--size-30) var(--size-30) }
:where(.hi-page) .hi-service-family__foot .text-link { margin-top:var(--size-4) }
@media(max-width:1000px) {
:where(.hi-page) .hi-service-families { grid-template-columns:1fr }
:where(.hi-page) .hi-service-family__visual { height:var(--size-200) }
:where(.hi-page) .hi-product-routes { grid-template-columns:repeat(4,minmax(0,1fr)) }
}
@media(max-width:800px) {
:where(.hi-page) .hi-product-routes { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:520px) {
:where(.hi-page) .hi-service-family__visual { height:var(--size-170); gap:var(--size-14) }
:where(.hi-page) .hi-service-family__intro { padding:var(--size-25) var(--size-22) var(--size-22) }
:where(.hi-page) .hi-service-family__services { padding:0 var(--size-22) }
:where(.hi-page) .hi-service-family__foot { padding:0 var(--size-22) var(--size-26) }
:where(.hi-page) .hi-service-family__title { font-size:var(--size-30) }
:where(.hi-page) .hi-service-entry { padding:var(--size-22) 0 }
:where(.hi-page) .hi-service-entry--expanded { margin:0 var(--space-px-negative-10); padding:var(--size-22) var(--size-10) var(--size-15) }
:where(.hi-page) .hi-service-entry>p { margin-left:var(--size-38); margin-right:0 }
:where(.hi-page) .hi-product-routes { grid-template-columns:1fr; margin-left:var(--size-38) }
:where(.hi-page) .hi-product-route { min-height:var(--size-104) }
}
/* Final service hierarchy: calm parent cards, separate compact digital-product map. */
:where(.hi-page) .hi-service-families { align-items:stretch }
:where(.hi-page) .hi-service-family { display:flex; flex-direction:column }
:where(.hi-page) .hi-service-family__services { flex:1 }
:where(.hi-page) .hi-service-family__foot { margin-top:auto }
:where(.hi-page) .hi-service-entry--expanded { margin:0; padding:var(--size-25) 0; background:transparent; border-bottom:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-service-entry--expanded .hi-service-entry__top { color:var(--color-heading) }
:where(.hi-page) .hi-service-entry--expanded .hi-service-entry__top>svg { color:var(--color-accent) }
:where(.hi-page) .hi-service-entry--expanded .hi-service-entry__top>b { color:var(--color-accent) }
:where(.hi-page) .hi-service-entry--expanded>p { color:var(--color-text-muted) }
:where(.hi-page) .hi-service-entry--expanded>.hi-product-routes { display:none }
:where(.hi-page) .hi-digital-product-map { margin-top:var(--size-28); padding:var(--size-30); border-radius:var(--size-16); background:var(--color-primary); color:var(--color-white) }
:where(.hi-page) .hi-digital-product-map__head { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr); gap:7%; align-items:end; margin-bottom:var(--size-24) }
:where(.hi-page) .hi-digital-product-map__head .eyebrow { margin:0 0 var(--size-11); color:var(--color-highlight) }
:where(.hi-page) .hi-digital-product-map__head h3 { margin:0; color:var(--color-white); font:var(--font-weight-display) clamp(var(--size-27),2.5vw,var(--size-38))/var(--line-height-1-2) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-03em) }
:where(.hi-page) .hi-digital-product-map__head>p { margin:0; color:var(--color-surface-secondary); font-size:var(--size-15); line-height:var(--line-height-1-75) }
:where(.hi-page) .hi-digital-product-map .hi-product-routes { grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--size-12); margin:0 }
:where(.hi-page) .hi-digital-product-map .hi-product-route { min-height:var(--size-138); padding:var(--size-18); background:var(--color-surface) }
:where(.hi-page) .hi-digital-product-map .hi-product-route__label { background:var(--color-surface-secondary) }
:where(.hi-page) .hi-digital-product-map .hi-product-route--knowledge { background:var(--color-surface) }
:where(.hi-page) .hi-digital-product-map .hi-product-route--knowledge .hi-product-route__label { background:var(--color-highlight) }
@media(max-width:1000px) {
:where(.hi-page) .hi-digital-product-map .hi-product-routes { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:700px) {
:where(.hi-page) .hi-digital-product-map { padding:var(--size-24) }
:where(.hi-page) .hi-digital-product-map__head { grid-template-columns:1fr; gap:var(--size-14) }
:where(.hi-page) .hi-digital-product-map .hi-product-routes { grid-template-columns:1fr }
:where(.hi-page) .hi-digital-product-map .hi-product-route { min-height:var(--size-118) }
}
@media(max-width:520px) {
:where(.hi-page) .hi-service-entry--expanded { margin:0; padding:var(--size-22) 0 }
}
/* Editorial service index: open sections and ruled rows instead of nested cards. */
:where(.hi-page) .hi-service-families { display:none }
:where(.hi-page) .hi-digital-product-map { display:none }
:where(.hi-page) .hi-home-services { padding-bottom:0 }
:where(.hi-page) .hi-home-services>.container>.hi-sec__head { margin-bottom:var(--size-18) }
:where(.hi-page) .hi-service-index { margin-top:0; border-top:var(--size-1) var(--border-style) var(--color-border-strong) }
:where(.hi-page) .hi-service-discipline { padding:var(--size-72) 0 var(--size-78); color:var(--color-heading) }
:where(.hi-page) .hi-service-discipline+.hi-service-discipline { border-top:var(--size-1) var(--border-style) var(--color-border-strong) }
:where(.hi-page) .hi-service-discipline--software { position:relative; box-shadow:0 0 0 100vmax var(--color-primary); clip-path:inset(0 -100vmax) }
:where(.hi-page) .hi-service-discipline__hero { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:6%; align-items:start; margin-bottom:var(--size-48) }
:where(.hi-page) .hi-service-discipline__copy { max-width:var(--size-610) }
:where(.hi-page) .hi-service-discipline__label { display:flex; align-items:center; gap:var(--size-12); margin:0 0 var(--size-18); color:var(--color-accent); font:var(--font-weight-bold) var(--size-11)/var(--line-height-1-4) var(--font-family-mono); letter-spacing:var(--letter-spacing-12em); text-transform:uppercase }
:where(.hi-page) .hi-service-discipline__label svg { width:var(--size-23); height:var(--size-23); flex:0 0 var(--size-23) }
:where(.hi-page) .hi-service-discipline__title { margin:0; color:inherit; font:var(--font-weight-display) clamp(var(--size-45),5vw,var(--size-72))/var(--line-height--98) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-045em) }
:where(.hi-page) .hi-service-discipline__intro { max-width:var(--size-570); margin:var(--size-22) 0 0; color:var(--color-text-muted); font-size:var(--size-17); line-height:var(--line-height-1-72) }
:where(.hi-page) .hi-service-discipline--software .hi-service-discipline__label { color:var(--color-highlight) }
:where(.hi-page) .hi-service-discipline--software .hi-service-discipline__intro { color:var(--color-surface-secondary) }
:where(.hi-page) .hi-service-discipline__visual { position:relative; width:100%; max-width:none; height:var(--size-400); min-width:0; justify-self:stretch; overflow:hidden; padding:var(--size-24) }
:where(.hi-page) .hi-design-story { display:grid; grid-template-columns:var(--size-135) minmax(0,1fr); gap:var(--size-18); align-items:stretch }
:where(.hi-page) .hi-design-toolkit { display:flex; flex-direction:column; padding:var(--size-20) var(--size-16); background:var(--color-primary); color:var(--color-white) }
:where(.hi-page) .hi-design-toolkit__label { font:var(--font-weight-bold) var(--size-8)/var(--line-height-1-4) var(--font-family-mono); letter-spacing:var(--letter-spacing-1em); color:var(--color-highlight); text-transform:uppercase }
:where(.hi-page) .hi-design-toolkit strong { margin:var(--size-24) 0 var(--size-20); font:var(--font-weight-regular) var(--size-50)/var(--line-height-1) var(--font-family-display) }
:where(.hi-page) .hi-design-palette { display:flex; gap:var(--size-6); padding-top:var(--size-17); border-top:var(--size-1) var(--border-style) var(--color-illustration-4f8073) }
:where(.hi-page) .hi-design-palette i { width:var(--size-16); height:var(--size-16); border-radius:50%; background:var(--color-surface) }
:where(.hi-page) .hi-design-palette i:nth-child(2) { background:var(--color-accent) }
:where(.hi-page) .hi-design-palette i:nth-child(3) { background:var(--color-highlight) }
:where(.hi-page) .hi-design-spacing { display:grid; gap:var(--size-8); margin-top:auto }
:where(.hi-page) .hi-design-spacing i { display:block; height:var(--size-4); background:var(--color-surface-secondary) }
:where(.hi-page) .hi-design-spacing i:nth-child(2) { width:72% }
:where(.hi-page) .hi-design-spacing i:nth-child(3) { width:45%; background:var(--color-highlight) }
:where(.hi-page) .hi-design-screen { display:flex; min-width:0; flex-direction:column; background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong) }
:where(.hi-page) .hi-design-screen__top { display:flex; align-items:center; gap:var(--size-5); padding:var(--size-13); border-bottom:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-design-screen__top i { width:var(--size-5); height:var(--size-5); border-radius:50%; background:var(--color-illustration-739582) }
:where(.hi-page) .hi-design-screen__top small { margin-left:auto; font:var(--font-weight-medium) var(--size-7)/var(--line-height-1) var(--font-family-mono); color:var(--color-text-muted); letter-spacing:var(--letter-spacing-07em) }
:where(.hi-page) .hi-design-screen__body { padding:var(--size-25) var(--size-22) var(--size-20) }
:where(.hi-page) .hi-design-screen__body>small { color:var(--color-accent); font:var(--font-weight-bold) var(--size-8)/var(--line-height-1-4) var(--font-family-mono); letter-spacing:var(--letter-spacing-1em) }
:where(.hi-page) .hi-design-screen__body h4 { margin:var(--size-14) 0 var(--size-21); color:var(--color-heading); font:var(--font-weight-display) var(--size-28)/var(--line-height-1-08) var(--font-family-display); letter-spacing:var(--letter-spacing-negative-03em) }
:where(.hi-page) .hi-design-ui-block { height:var(--size-42); margin-top:var(--size-9); background:var(--color-surface-secondary); border-left:var(--size-5) var(--border-style) var(--color-accent) }
:where(.hi-page) .hi-design-ui-block--accent { height:var(--size-28); width:68%; background:var(--color-highlight); border-color:var(--color-primary) }
:where(.hi-page) .hi-design-screen__nav { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--size-1); margin-top:auto; background:var(--color-surface-accent); border-top:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-design-screen__nav span { padding:var(--size-13) var(--size-4); background:var(--color-background); color:var(--color-text-muted); text-align:center; font:var(--font-weight-medium) var(--size-7)/var(--line-height-1-3) var(--font-family-mono) }
:where(.hi-page) .hi-software-story { display:flex; flex-direction:column; align-items:center; background:var(--color-background) }
:where(.hi-page) .hi-architecture-label { align-self:stretch; padding:var(--size-12) var(--size-15); border-bottom:var(--size-1) var(--border-style) var(--color-border); color:var(--color-accent); font:var(--font-weight-bold) var(--size-8)/var(--line-height-1-4) var(--font-family-mono); letter-spacing:var(--letter-spacing-12em) }
:where(.hi-page) .hi-architecture-node { width:var(--size-180); padding:var(--size-14) var(--size-18); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); text-align:center }
:where(.hi-page) .hi-architecture-node small { display:block; /*color:var(--color-text-muted);*/ font:var(--font-weight-bold) var(--size-7)/var(--line-height-1-4) var(--font-family-mono); letter-spacing:var(--letter-spacing-09em) }
:where(.hi-page) .hi-architecture-core small { display:block; /*color:var(--color-text-muted);*/ font:var(--font-weight-bold) var(--size-7)/var(--line-height-1-4) var(--font-family-mono); letter-spacing:var(--letter-spacing-09em) }
/*:where(.hi-page) .hi-architecture-node strong { display:block; margin-top:var(--size-5); color:var(--color-heading); font-size:var(--size-14) }*/
:where(.hi-page) .hi-architecture-node--source { margin-top:var(--size-22) }
:where(.hi-page) .hi-architecture-connector { width:var(--size-1); height:var(--size-22); background:var(--color-illustration-739582); position:relative }
:where(.hi-page) .hi-architecture-connector:after { content:''; position:absolute; left:var(--length-px-negative-3); bottom:var(--length-px-negative-1); width:var(--size-7); height:var(--size-7); border-radius:50%; background:var(--color-highlight); border:var(--size-1) var(--border-style) var(--color-primary) }
:where(.hi-page) .hi-architecture-core { width:var(--size-150); padding:var(--size-15) var(--size-18); background:var(--color-primary); color:var(--color-white); text-align:center }
:where(.hi-page) .hi-architecture-core strong { display:block; font:var(--font-weight-medium) var(--size-24)/var(--line-height-1) var(--font-family-mono); color:var(--color-highlight) }
:where(.hi-page) .hi-architecture-core small { margin-top:var(--size-6); color:var(--color-surface-secondary) }
:where(.hi-page) .hi-architecture-branches { position:relative; width:var(--size-280); height:var(--size-28); border-top:var(--size-1) var(--border-style) var(--color-illustration-739582); margin-top:var(--size-22) }
:where(.hi-page) .hi-architecture-branches:before { content:''; position:absolute; top:0; height:var(--size-28); border-left:var(--size-1) var(--border-style) var(--color-illustration-739582) }
:where(.hi-page) .hi-architecture-branches:after { content:''; position:absolute; top:0; height:var(--size-28); border-left:var(--size-1) var(--border-style) var(--color-illustration-739582) }
:where(.hi-page) .hi-architecture-branches:before { left:0 }
:where(.hi-page) .hi-architecture-branches:after { right:0 }
:where(.hi-page) .hi-architecture-branches i { position:absolute; left:50%; top:var(--length-px-negative-23); height:var(--size-51); border-left:var(--size-1) var(--border-style) var(--color-illustration-739582) }
:where(.hi-page) .hi-architecture-systems { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--size-8); width:min(100%,var(--size-380)) }
:where(.hi-page) .hi-architecture-systems span { padding:var(--size-12) var(--size-5); background:var(--color-surface); border:var(--size-1) var(--border-style) var(--color-border-strong); color:var(--color-heading); text-align:center; font:var(--font-weight-bold) var(--size-9)/var(--line-height-1-3) var(--font-family-mono) }
:where(.hi-page) .hi-architecture-status { margin-top:auto; width:100%; padding:var(--size-12); background:var(--color-surface-secondary); color:var(--color-heading); text-align:center; font:var(--font-weight-bold) var(--size-8)/var(--line-height-1-3) var(--font-family-mono); letter-spacing:var(--letter-spacing-07em); text-transform:uppercase }
:where(.hi-page) .hi-service-discipline:not(.hi-service-discipline--software) .hi-service-discipline__visual { background:var(--color-surface-secondary) }
:where(.hi-page) .hi-service-discipline--software .hi-service-discipline__visual { background:var(--color-background) }
:where(.hi-page) .hi-service-discipline__list { border-top:var(--size-1) var(--border-style) var(--color-border-strong) }
:where(.hi-page) .hi-service-discipline--software .hi-service-discipline__list { border-color:var(--color-illustration-4f8073) }
:where(.hi-page) .hi-service-line { border-bottom:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-service-discipline--software .hi-service-line { border-color:var(--color-illustration-4f8073) }
:where(.hi-page) .hi-service-line__main { display:grid; grid-template-columns:var(--size-38) minmax(var(--size-210),.82fr) minmax(var(--size-280),1.2fr) var(--size-34); gap:var(--size-24); align-items:start; padding:var(--size-29) 0; color:inherit; text-decoration:none; transition:padding .2s ease,background .2s ease }
:where(.hi-page) .hi-service-line__main>svg { width:var(--size-27); height:var(--size-27); margin-top:var(--size-2); color:var(--color-accent) }
:where(.hi-page) .hi-service-discipline--software .hi-service-line__main>svg { color:var(--color-highlight) }
:where(.hi-page) .hi-service-line__title { font-size:var(--size-20); line-height:var(--line-height-heading); font-weight:var(--font-weight-bold); letter-spacing:var(--letter-spacing-negative-02em) }
:where(.hi-page) .hi-service-line__main p { margin:0; color:var(--color-text-muted); font-size:var(--size-15); line-height:var(--line-height-1-72) }
:where(.hi-page) .hi-service-discipline--software .hi-service-line__main p { color:var(--color-surface-secondary) }
:where(.hi-page) .hi-service-line__arrow { color:var(--color-accent); font-size:var(--size-24); line-height:var(--line-height-art-1); text-align:right; font-weight:var(--font-weight-regular); transition:transform .2s ease }
:where(.hi-page) .hi-service-discipline--software .hi-service-line__arrow { color:var(--color-highlight) }
:where(.hi-page) .hi-service-line__main:hover { padding-left:var(--size-12); padding-right:var(--size-12); background:var(--color-overlay-72676261283139392c3233382c3135392c2e3229) }
:where(.hi-page) .hi-service-line__main:hover .hi-service-line__arrow { transform:translate(var(--size-3),var(--length-px-negative-3)) }
:where(.hi-page) .hi-subservice-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0 0 var(--size-30) var(--size-62); border-top:var(--size-1) var(--border-style) var(--color-border); border-bottom:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-subservice-link { position:relative; display:flex; min-width:0; min-height:var(--size-152); flex-direction:column; padding:var(--size-20) var(--size-22) var(--size-8); color:var(--color-heading); text-decoration:none; border-right:var(--size-1) var(--border-style) var(--color-border); transition:background .2s ease }
:where(.hi-page) .hi-subservice-link:first-child { border-left:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-subservice-link:hover { background:var(--color-surface-secondary) }
:where(.hi-page) .hi-subservice-link__type { margin-bottom:var(--size-16); color:var(--color-accent); font:var(--font-weight-bold) var(--size-9)/var(--line-height-1-35) var(--font-family-mono); letter-spacing:var(--letter-spacing-1em); text-transform:uppercase }
:where(.hi-page) .hi-subservice-link--knowledge .hi-subservice-link__type { width:max-content; padding:var(--size-4) var(--size-7); background:var(--color-highlight); color:var(--color-heading) }
:where(.hi-page) .hi-subservice-link strong { padding-right:var(--size-24); font-size:var(--size-15); line-height:var(--line-height-1-45) }
:where(.hi-page) .hi-subservice-link small { display:block; margin-top:var(--size-8); color:var(--color-text-muted); font-size:var(--size-12); line-height:var(--line-height-1-58) }
:where(.hi-page) .hi-subservice-link b { position:absolute; right:var(--size-20); top:var(--size-50); color:var(--color-accent); font-size:var(--size-17); font-weight:var(--font-weight-regular) }
:where(.hi-page) .hi-service-discipline__footer { display:flex; justify-content:flex-end; padding-top:var(--size-28) }
@media(max-width:1050px) {
:where(.hi-page) .hi-service-discipline__hero { grid-template-columns:1fr; gap:var(--size-34) }
:where(.hi-page) .hi-service-discipline__visual { width:min(100%,var(--size-560)); justify-self:start }
:where(.hi-page) .hi-service-line__main { grid-template-columns:var(--size-34) minmax(var(--size-180),.8fr) minmax(var(--size-220),1.2fr) var(--size-28); gap:var(--size-18) }
:where(.hi-page) .hi-subservice-strip { grid-template-columns:repeat(2,minmax(0,1fr)) }
:where(.hi-page) .hi-subservice-link:nth-child(2) { border-right:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-subservice-link:nth-child(3) { border-left:var(--size-1) var(--border-style) var(--color-border); border-top:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-subservice-link:nth-child(4) { border-top:var(--size-1) var(--border-style) var(--color-border) }
}
@media(max-width:700px) {
:where(.hi-page) .hi-home-services>.container>.hi-sec__head { margin-bottom:var(--size-18) }
:where(.hi-page) .hi-service-index { margin-top:0 }
:where(.hi-page) .hi-service-discipline { padding:var(--size-54) 0 var(--size-60) }
:where(.hi-page) .hi-service-discipline__hero { margin-bottom:var(--size-34) }
:where(.hi-page) .hi-service-discipline__visual { width:100%; height:var(--size-380); padding:var(--size-20) }
:where(.hi-page) .hi-service-line__main { grid-template-columns:var(--size-30) minmax(0,1fr) var(--size-24); gap:var(--size-13); padding:var(--size-24) 0 }
:where(.hi-page) .hi-service-line__main p { grid-column:2/-1; margin-top:var(--space-px-negative-3) }
:where(.hi-page) .hi-service-line__title { font-size:var(--size-18) }
:where(.hi-page) .hi-subservice-strip { grid-template-columns:1fr; margin:0 0 var(--size-25) var(--size-43) }
:where(.hi-page) .hi-subservice-link { min-height:var(--size-126); border-left:var(--size-1) var(--border-style) var(--color-border); border-right:var(--size-1) var(--border-style) var(--color-border); border-top:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-subservice-link:first-child { min-height:var(--size-126); border-left:var(--size-1) var(--border-style) var(--color-border); border-right:var(--size-1) var(--border-style) var(--color-border); border-top:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-subservice-link:nth-child(3) { min-height:var(--size-126); border-left:var(--size-1) var(--border-style) var(--color-border); border-right:var(--size-1) var(--border-style) var(--color-border); border-top:var(--size-1) var(--border-style) var(--color-border) }
:where(.hi-page) .hi-subservice-link:first-child { border-top:0 }
:where(.hi-page) .hi-service-discipline__footer { justify-content:flex-start }
}
@media(max-width:480px) {
:where(.hi-page) .hi-service-discipline__title { font-size:var(--size-43) }
:where(.hi-page) .hi-service-discipline__intro { font-size:var(--size-16) }
:where(.hi-page) .hi-service-discipline__visual { height:var(--size-350); padding:var(--size-15) }
:where(.hi-page) .hi-design-story { grid-template-columns:var(--size-92) minmax(0,1fr); gap:var(--size-10) }
:where(.hi-page) .hi-design-toolkit { padding:var(--size-16) var(--size-12) }
:where(.hi-page) .hi-design-toolkit strong { font-size:var(--size-41) }
:where(.hi-page) .hi-design-screen__body { padding:var(--size-20) var(--size-16) }
:where(.hi-page) .hi-design-screen__body h4 { font-size:var(--size-23) }
:where(.hi-page) .hi-architecture-branches { width:var(--size-210) }
:where(.hi-page) .hi-subservice-strip { margin-left:0 }
:where(.hi-page) .hi-service-line__main:hover { padding-left:0; padding-right:0 }
}
:where(.hi-page) .feature-grid { border: none; overflow: visible; }