/* A restrained signature: copper signals, square registration marks, ink contrast. */
:root{--signal:#9b5c3e;--signal-light:#c6977d;--technical-font:'SFMono-Regular',Consolas,'Liberation Mono',monospace}
header{border-bottom:1px solid #efefef}
.hero{padding-top:86px;position:relative}.hero>.eyebrow{display:flex;align-items:center;gap:11px}.hero>.eyebrow:before{content:'';width:5px;height:5px;background:var(--signal);flex-shrink:0}
.hero-composition{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:5%;margin:37px 0 50px}
.hero-composition h1{font-size:clamp(60px,6.65vw,100px)}
.hero-line:nth-child(2){color:#838383}.hero-line .signature-period{display:inline;color:var(--signal)}
.eyebrow,.number,.network-labels,.node-labels,.lifecycle-centre,.diagram-caption,.approach-foot{font-family:var(--technical-font)}
.eyebrow{font-size:12px;letter-spacing:1.2px}.section-index{color:var(--signal);letter-spacing:0;margin-right:17px;font-size:12px;display:inline-block}
.compute-network{width:100%;margin:0}
.network-plate{position:relative;background:transparent;border:0;padding:24px 12px 5px;}
.network-diagram{position:relative}.network-labels{fill:#7b7773;font-size:10px;letter-spacing:.8px}.node-labels{fill:#77716d;font-size:12px}
.network-paths{stroke:#ccc7c3}.network-flow path{stroke:var(--signal);stroke-width:1.7;transition:opacity .35s,stroke-width .35s}.core-orbit{stroke:var(--signal);opacity:.6}.core-bracket{stroke:var(--signal);stroke-width:1.2}.core-node{stroke:#333;stroke-width:1.2}.core-label{fill:#222}.supplier-nodes rect{transition:stroke .3s,fill .3s}
.compute-network figcaption{margin:14px 0 0;color:#8c8580;line-height:1.6}.compute-network figcaption br{display:inline}.compute-network figcaption span{font-size:12px}
.hero-bottom{padding-top:23px}.quiet-link{border-color:#c5b5aa;padding:10px 0;font-size:14px;position:relative}.quiet-link:after{content:'';position:absolute;left:0;bottom:-1px;width:100%;height:1px;background:var(--signal);transform:scaleX(.16);transform-origin:left;transition:transform .5s}.quiet-link:hover:after{transform:scaleX(1)}.quiet-link:hover{background:transparent}
.integration-flow,.cycle-signal{stroke:var(--signal)}.diagram-port{stroke:var(--signal)}.diagram-core{stroke:#333}.diagram-caption{font-size:12px}.requirements-frame{stroke:#c9b3a5;stroke-width:.8}.lifecycle-centre{font-size:10px;letter-spacing:1.2px}
.capability-list article:after{background:var(--signal)}.capability-list article:hover .number{color:var(--signal)}
.approach{position:relative;background:#222321;color:#f4f3f1;padding:49px 4.5% 30px;overflow:hidden}.approach:before,.approach:after{content:'';position:absolute;width:18px;height:18px;pointer-events:none}.approach:before{left:16px;top:16px;border-left:1px solid #9b795f;border-top:1px solid #9b795f}.approach:after{bottom:16px;right:16px;border-right:1px solid #9b795f;border-bottom:1px solid #9b795f}.approach .eyebrow{color:#a3a29d;font-size:12px}.approach .section-index{color:var(--signal-light)}.approach h2{color:#f1f0ed}.approach-content p{color:#b6b6b0}.approach-foot{color:#a3a39b;border-color:#42443f;font-size:12px;gap:24px;line-height:1.6}.continuity-grid{stroke:#3d403a}.continuity-branch{stroke:#353831}.continuity-signal{stroke:var(--signal-light);stroke-width:1.5}.continuity-nodes rect{fill:#222321;stroke:#77786d;animation-name:ink-continuity}
@keyframes ink-continuity{0%,12%,100%{fill:#c6977d;stroke:#c6977d}24%,88%{fill:#222321;stroke:#77786d}}
.contact .section-side{position:relative}.contact .section-side:after{content:'';display:block;margin-top:38px;width:30px;height:30px;border-left:1px solid var(--signal);border-bottom:1px solid var(--signal)}
.submit-enquiry{position:relative;overflow:hidden;border-color:#252622;background:#252622;padding-left:24px;padding-right:24px}.submit-enquiry:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--signal-light);transform:scaleX(0);transform-origin:left;transition:transform .4s}.submit-enquiry:hover{background:#363832}.submit-enquiry:hover:after{transform:scaleX(1)}
nav a:after{background:var(--signal)}.identity{position:relative}.identity .monogram{position:relative}.identity .monogram:after{content:'';position:absolute;right:-5px;bottom:-5px;width:8px;height:8px;border-right:1px solid var(--signal);border-bottom:1px solid var(--signal);opacity:0;transform:translate(-3px,-3px);transition:opacity .3s,transform .3s}.identity:hover .monogram:after{opacity:1;transform:translate(0,0)}
.motion-toggle{border-radius:0;color:#726f69;border-color:#ded9d5}.motion-symbol{color:var(--signal)}
@media(min-width:1560px){.hero-composition h1{font-size:100px}}
@media(max-width:1050px) and (min-width:761px){.hero-composition{gap:4%;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.hero-composition h1{font-size:clamp(49px,6.4vw,70px)}.network-plate{padding:22px 7px 5px}}
@media(max-width:760px){.hero{padding-top:56px}.hero-composition{grid-template-columns:1fr;gap:36px}.hero-composition h1{font-size:clamp(48px,9.9vw,76px)}.compute-network{max-width:440px;justify-self:end}.hero-bottom{padding-top:7px}.network-plate{padding:24px 14px 5px}}
@media(max-width:640px){.hero-composition h1{font-size:clamp(44px,10.4vw,66px)}.compute-network{max-width:440px;justify-self:center}.hero-composition{margin-top:27px}.eyebrow{font-size:11px}.section-index{margin-right:12px}.approach{padding:36px 7% 28px}.approach:before{left:10px;top:10px}.approach:after{right:10px;bottom:10px}.approach .eyebrow{font-size:11px}.approach-foot{font-size:11px}.contact .section-side:after{display:none}.network-labels{font-size:11px}}
.motion-paused .network-plate,.tab-inactive .network-plate{transform:none;transition:none}
@media(prefers-reduced-motion:reduce){.network-plate{transform:none!important}.continuity-nodes rect{animation:none!important}}

/* Scroll content independently so backgrounds and dividers retain their color. */
.scroll-motion .scroll-content{opacity:var(--section-opacity,1);transform:translate3d(0,var(--section-lift,0px),0);transition:opacity .28s ease-out,transform .5s var(--motion-ease)}
.scroll-motion main>section:focus-within .scroll-content{opacity:1!important}
.scroll-motion #contact-form:focus-within{transform:none;transition:opacity .2s}
.contact>.section-side{align-self:start}
.scroll-motion .contact>.section-side{transform:translate3d(0,calc(var(--contact-travel,0px) + var(--section-lift,0px)),0);transition:opacity .28s ease-out,transform .6s var(--motion-ease)}
@media(max-width:950px){.scroll-motion .contact>.section-side{transform:translate3d(0,var(--section-lift,0px),0)}}
@media(prefers-reduced-motion:reduce){.scroll-motion .scroll-content,.scroll-motion .contact>.section-side{opacity:1!important;transform:none!important;transition:none!important}}
@media print{.scroll-content,.contact>.section-side{opacity:1!important;transform:none!important;transition:none!important}.motion-toggle{display:none!important}}

/* Shared color and motion language, with readable secondary text. */
:root{--ink:#222321;--muted:#6f6a66;--line:#e5e1dd;--signal-soft:#f3ebe5;--surface:#fcfbfa;--motion-ease:cubic-bezier(.22,1,.36,1);--signal-beat:6s}
body{color:var(--ink)}
.hero-line{color:var(--ink)}.hero-line:nth-child(2){color:#74716d}
.section-body>p,.capability-list p,.contact-intro,.hero-bottom>p{color:var(--muted)}
.form-note,.field-hint,.form-footer p,.field label span,.footer-description,footer small,.compute-network figcaption{color:#716b67}
.field input::placeholder,.field textarea::placeholder,.select-trigger.is-placeholder{color:#756f6a;opacity:1}
.field label{color:#45423f}.field input,.field textarea,.select-trigger{border-color:#c9c4bf}
.select-menu{border-color:#d3cec8;background:#fff;box-shadow:0 6px 22px #2223210c}
.select-option.is-active{background:#f4f1ee;color:var(--ink)}.select-option[aria-selected=true] .select-check{color:var(--signal)}
.diagram-caption{fill:#716b67}.network-labels{font-size:12px;fill:#716b67}.node-labels{fill:#716b67}.lifecycle-centre{font-size:11px;fill:#716b67}.number{color:#79726b}
.approach{background:var(--ink)}.approach:before,.approach:after{border-color:var(--signal-light)}
.approach-foot{color:#b5b3ac}.approach .eyebrow{color:#b5b3ac}
.network-plate{background:transparent;transition-timing-function:var(--motion-ease)}
.network-flow path,.network-flow path:nth-child(4),.supplier-nodes rect,.enterprise-lines{animation-duration:var(--signal-beat)}
.network-flow path:nth-child(2),.supplier-nodes rect:nth-child(2){animation-delay:-2s}
.network-flow path:nth-child(3),.supplier-nodes rect:nth-child(3){animation-delay:-4s}
.network-flow path:nth-child(4){animation-delay:-.8s}
.integration-flow path,.integration-diagram .diagram-surface rect{animation-duration:var(--signal-beat)}
.cycle-signal,.lifecycle-diagram .diagram-surface rect{animation-duration:18s}
.lifecycle-diagram .diagram-surface rect:nth-child(2){animation-delay:-9s}.lifecycle-diagram .diagram-surface rect:nth-child(3){animation-delay:-13.5s}
.continuity-signal,.continuity-nodes rect{animation-duration:12s}.continuity-nodes rect:nth-child(2){animation-delay:2.4s}.continuity-nodes rect:nth-child(3){animation-delay:4.8s}.continuity-nodes rect:nth-child(4){animation-delay:7.2s}.continuity-nodes rect:nth-child(5){animation-delay:9.6s}
@keyframes supplier-tint{0%,60%,100%{fill:#fff;stroke:#d2cbc5}20%,35%{fill:var(--signal-soft);stroke:var(--signal)}}
@keyframes integration-tint{0%,60%,100%{fill:var(--surface);stroke:#d8d2cc}20%,35%{fill:var(--signal-soft);stroke:var(--signal)}}
@keyframes cycle-tint{0%,7%,94%,100%{fill:var(--signal-soft);stroke:var(--signal)}15%,85%{fill:var(--surface);stroke:#d8d2cc}}
@keyframes enterprise-tint{0%,100%{stroke:#aaa39d}45%,60%{stroke:var(--signal)}}
:where(a,button,input,textarea,select):focus-visible{outline:2px solid var(--signal);outline-offset:4px}
.field input:focus-visible,.field textarea:focus-visible,.select-trigger:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-color:var(--signal)}
nav a{min-height:44px;display:inline-flex;align-items:center}.motion-toggle{min-height:44px;padding:10px 14px}
.motion-toggle:focus-visible,.submit-enquiry:focus-visible{outline:2px solid var(--signal);outline-offset:4px}
footer{padding-bottom:96px}
html.motion-paused{scroll-behavior:auto}
.motion-paused .select-menu{animation:none!important}
.tab-inactive .hero-line>span{animation-play-state:paused}
@media(max-width:640px){.eyebrow,.approach .eyebrow,.approach-foot{font-size:12px}.approach-foot{flex-wrap:wrap;gap:8px 20px}.section-index{margin-right:10px}footer{padding-bottom:92px}.network-labels{font-size:12px}.motion-toggle{bottom:max(14px,env(safe-area-inset-bottom));right:14px}}

/* The same quiet zoom across all graphics. */
.network-diagram,.section-diagram>svg,.continuity>svg{transform:scale(1);transform-origin:center;transition:transform .55s var(--motion-ease)}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  html:not(.motion-paused) .compute-network:hover .network-diagram,
  html:not(.motion-paused) .section-diagram:hover>svg,
  html:not(.motion-paused) .continuity:hover>svg{transform:scale(1.03)}
}
@media(prefers-reduced-motion:reduce){.network-diagram,.section-diagram>svg,.continuity>svg{transform:none!important;transition:none!important}}

/* A compact invitation, with the enquiry form in an accessible same-page dialog. */
html{scrollbar-gutter:stable}
.contact.split-section{display:block;padding-top:90px;padding-bottom:84px}
.contact>.section-side{max-width:680px}
.contact-intro{max-width:410px}
.contact-open{margin-top:28px;min-width:148px}
.contact .section-side:after{display:none}
.contact-dialog{width:min(720px,calc(100% - 40px));max-width:none;max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);margin:auto;padding:0;border:1px solid #d8d1ca;border-radius:3px;background:#fff;color:var(--ink);overflow:visible;box-shadow:0 24px 90px #00000024}
.contact-dialog:not([open]){display:none}
.contact-dialog[open]{display:flex;flex-direction:column;animation:contact-appear .24s ease-out}
.contact-dialog::backdrop{background:rgb(25 25 24 / 44%);backdrop-filter:blur(2px)}
.contact-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:27px 32px 22px;flex-shrink:0}
.contact-dialog-header h2{font-size:30px;line-height:1.2;letter-spacing:-.04em;margin:0;outline:none}
.contact-dialog-close{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;padding:0;background:transparent;border:1px solid transparent;border-radius:2px;color:#6f6a66;cursor:pointer;transition:color .2s,background .2s}
.contact-dialog-close:hover{color:var(--signal);background:var(--signal-soft)}
.contact-dialog-body{padding:0 32px 32px;overflow-y:auto;overscroll-behavior:contain;min-height:0;scroll-padding:18px;scrollbar-width:thin;scrollbar-color:#c9c4bf transparent}
.contact-dialog .form-note{margin-bottom:22px}
.contact-dialog .form-grid{gap:22px 20px}
.contact-dialog .field-hint{font-size:13px}
.contact-dialog .form-footer{padding-top:3px}
.contact-dialog .select-menu{box-shadow:0 8px 24px #22232114}
html.contact-dialog-open,html.contact-dialog-open body{overflow:hidden}
.contact-dialog-open .motion-scene *{animation-play-state:paused!important}
@keyframes contact-appear{from{opacity:0}to{opacity:1}}
@media(max-width:640px){.contact.split-section{padding-top:56px;padding-bottom:56px}.contact-open{width:auto;min-width:150px;justify-content:center}.contact-dialog{width:calc(100% - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}.contact-dialog-header{padding:19px 20px 14px}.contact-dialog-header h2{font-size:27px}.contact-dialog-body{padding:0 20px 24px}.contact-dialog .form-grid{gap:20px}.contact-dialog .form-footer{gap:17px}}
@media(prefers-reduced-motion:reduce){.contact-dialog[open]{animation:none}.contact-dialog-close{transition:none}}
.motion-paused .contact-dialog[open]{animation:none}

/* A simple connection: one quiet arrival into EG, then three sources of capacity. */
.contact.split-section{display:grid;grid-template-columns:minmax(0,410px) minmax(0,435px);gap:clamp(32px,4vw,60px);align-items:center;justify-content:center}
.contact-network{width:100%;max-width:435px;margin:0;justify-self:center}
.contact-network-paths{fill:none;stroke:#d8d2cc;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.contact-network-node{fill:#fff;stroke:#d8d2cc;stroke-width:1.2}
.contact-network-core{fill:#fff;stroke:var(--ink);stroke-width:1.6}
.contact-network-monogram{fill:var(--ink);font-family:Arial,sans-serif;font-size:29px;letter-spacing:-1.8px;font-weight:700}
.contact-network-flow path{fill:none;stroke:var(--signal);stroke-width:1.7;stroke-linecap:round;stroke-dasharray:6 94;stroke-dashoffset:100;animation:signal-flow var(--signal-beat) linear infinite}
.contact-network-flow path:nth-child(2){animation-delay:-2s}
.contact-network-flow path:nth-child(3){animation-delay:-4s}
.contact-arrival{opacity:0;animation:contact-arrive var(--signal-beat) linear infinite}
.contact-arrival-dot{fill:var(--signal)}
@keyframes contact-arrive{0%{transform:translateX(0);opacity:0}12%,65%{opacity:.85}78%,100%{transform:translateX(100px);opacity:0}}
@media(max-width:760px){.contact.split-section{grid-template-columns:minmax(0,420px);gap:36px}.contact-network{max-width:420px}}
@media(prefers-reduced-motion:reduce){.contact-arrival,.contact-network-flow{display:none;animation:none!important}}
