#architecture{
  --ink:#05071A; --navy:#10153C; --blue:#3D3D6B; --blue-hi:#6C74FF; --red:#E71467; --red-hi:#FF4D8D; --amber:#F8A011;
  --text:#F4F5FC; --soft:#C6CAEA; --mute:#9095C4; --line:rgba(255,255,255,.12); --card:rgba(255,255,255,.05);
  --display:"Bahnschrift","Barlow Semi Condensed","Arial Narrow",Arial,sans-serif;
  --body:"Bahnschrift","Barlow",system-ui,Arial,sans-serif;
  color-scheme:dark;
}#architecture *{box-sizing:border-box}#architecture,#architecture{margin:0}#architecture{background:var(--ink);color:var(--text);font-family:var(--body);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}#architecture .bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(50% 45% at 90% 15%,rgba(43,91,215,.28),transparent 70%),
  radial-gradient(50% 50% at 0% 50%,rgba(108,116,255,.26),transparent 70%),
  radial-gradient(60% 50% at 60% 110%,rgba(43,91,215,.2),transparent 70%),
  linear-gradient(170deg,#070A22 0%,#0E1240 45%,#170F3A 75%,#22092C 100%)}#architecture .bg::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(108,116,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(108,116,255,.06) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(80% 70% at 50% 40%,#000 30%,transparent 80%)}#architecture .architecture-story-content{position:relative;z-index:1}#architecture .wrap{max-width:1200px;margin:0 auto;padding-inline:28px}#architecture .top{position:absolute;top:0;left:0;right:0;z-index:5}#architecture .top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:22px}#architecture .logo{display:inline-flex}#architecture .logo img{height:34px;display:block}#architecture .live{display:inline-flex;align-items:center;gap:9px;font-size:15px;color:var(--soft);border:1px solid var(--line);border-radius:999px;padding:7px 14px;background:rgba(5,7,26,.5);}#architecture .live i{width:8px;height:8px;border-radius:50%;background:var(--red-hi);box-shadow:0 0 12px var(--red-hi);animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.3}}#architecture .hero{position:relative;min-height:280px;overflow:hidden;background:var(--ink)}#architecture #stage{position:absolute;inset:0}#architecture #stage canvas{display:block;width:100%;height:100%}#architecture .labels{position:absolute;inset:0;pointer-events:none}#architecture .lab{position:absolute;transform:translate(-50%,-50%);font-family:var(--display);font-weight:500;font-size:15px;color:#fff;white-space:nowrap;padding:5px 11px;border-radius:999px;background:rgba(10,12,40,.62);border:1px solid rgba(255,255,255,.22);transition:opacity .3s}#architecture .lab b{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:7px;vertical-align:1px}#architecture .coreLab{z-index:1;position:absolute;transform:translate(-50%,-50%);text-align:center;font-family:var(--display);font-weight:400;font-size:17px;line-height:1.1;color:#fff;text-shadow:0 0 18px rgba(255,77,141,.9);pointer-events:none}#architecture .heroShade{position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(0deg,var(--ink),rgba(5,7,26,0));pointer-events:none}#architecture .heroText{position:relative;z-index:3;padding-block:28px;max-width:600px}#architecture .kick{display:inline-flex;align-items:center;gap:12px;font-family:var(--display);font-weight:600;font-size:18px;color:var(--red-hi)}#architecture .kick::before{content:"";width:34px;height:2px;background:linear-gradient(90deg,var(--red),var(--blue-hi))}#architecture .architecture-title{font-family:var(--display);font-weight:400;font-size:clamp(50px,7.4vw,96px);line-height:.95;margin:16px 0 20px;text-wrap:balance}#architecture .architecture-title .l1{display:block;color:#fff}#architecture .architecture-title .l2{display:block;background:linear-gradient(95deg,#B9BEFF 0%,#fff 35%,var(--red-hi) 75%,#FF8AB4 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 14s ease-in-out infinite}
@keyframes sheen{50%{background-position:100% 0}}#architecture .tag{font-family:var(--display);font-weight:500;font-size:clamp(28px,3.2vw,40px);line-height:1.1;margin:0 0 20px}#architecture .tag span{color:var(--red-hi)}#architecture .lead{font-size:20px;color:var(--soft);margin:0 0 30px;max-width:33em}#architecture .chips{display:flex;flex-wrap:wrap;gap:10px}#architecture .chip{font-size:15px;font-weight:600;padding:8px 14px;border-radius:12px;border:1px solid var(--line)}#architecture .chip b{font-family:var(--display);font-size:20px;margin-right:6px;color:var(--red-hi)}#architecture .ch{position:relative;padding-block:18px;border-top:1px solid var(--line)}#architecture .eyebrow{font-family:var(--display);font-weight:600;font-size:18px;color:var(--red-hi);margin:0 0 8px;display:flex;align-items:center;gap:12px}#architecture .eyebrow .num{font-size:15px;color:var(--soft);border:1px solid var(--line);border-radius:999px;padding:2px 10px}#architecture h2{font-family:var(--display);font-weight:400;font-size:clamp(36px,4.8vw,62px);line-height:1.2;margin:0 0 20px;text-wrap:balance}#architecture h2 .hl{background:linear-gradient(95deg,#fff,var(--red-hi));-webkit-background-clip:text;background-clip:text;color:transparent}#architecture p{margin:0 0 16px}#architecture .big{font-size:21px;color:#fff}#architecture .soft{color:var(--soft)}#architecture .split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px;align-items:center}#architecture .glass{border-radius:22px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));box-shadow:0 30px 80px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08)}#architecture .orgs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 22px}#architecture .orgs span{font-size:15px;font-weight:600;padding:6px 12px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--soft)}#architecture .ask{margin:22px 0 0;padding:18px 22px;border-radius:16px;background:linear-gradient(120deg,rgba(43,91,215,.2),rgba(108,116,255,.14));border:1px solid rgba(255,77,141,.38)}#architecture .ask .q{font-family:var(--display);font-weight:500;font-size:23px;line-height:1.25;margin:0 0 4px}#architecture .ask .w{color:var(--soft);font-size:16.5px;margin:0}#architecture .sim{padding:18px}#architecture .simHead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}#architecture .toggle{display:inline-flex;background:rgba(5,7,26,.6);border:1px solid var(--line);border-radius:999px;padding:4px}#architecture .toggle button{font:600 15px var(--body);color:var(--soft);background:none;border:0;padding:8px 16px;border-radius:999px;cursor:pointer}#architecture .toggle button.on{color:#fff;background:linear-gradient(120deg,var(--red),#8B2BB8)}#architecture .toggle button:focus-visible{outline:2px solid #fff;outline-offset:2px}#architecture .clock{display:flex;align-items:baseline;gap:8px}#architecture .clock b{font-family:var(--display);font-size:34px;font-weight:400;line-height:1;transition:color .4s}#architecture .clock span{font-size:14.5px;color:var(--soft)}#architecture #silo{width:100%;height:400px;display:block;border-radius:14px;background:rgba(5,7,26,.45)}#architecture .simFoot{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}#architecture .simFoot div{border-radius:12px;background:rgba(5,7,26,.5);border:1px solid var(--line);padding:10px 12px}#architecture .simFoot b{font-family:var(--display);font-size:24px;display:block;line-height:1.05}#architecture .simFoot small{font-size:13.5px;color:var(--soft)}#architecture .mat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center;margin-top:16px}#architecture .ringBox{padding:24px;display:grid;place-items:center}#architecture .ringBox svg{width:100%;max-width:470px;height:auto;display:block}#architecture .seg{transition:opacity 1.2s,filter 1.2s;opacity:.16}#architecture .seg.on{opacity:1;filter:url(#glow)}#architecture .ringCore{transition:all .8s}#architecture .stepList{display:grid;gap:12px}#architecture .stepBtn{all:unset;cursor:pointer;display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:center;padding:16px 18px;border-radius:16px;border:1px solid var(--line);background:var(--card);transition:all .35s}#architecture .stepBtn:focus-visible{outline:2px solid #fff;outline-offset:3px}#architecture .stepBtn .n{font-family:var(--display);font-weight:400;font-size:38px;line-height:1;color:rgba(255,255,255,.3);transition:color .35s}#architecture .stepBtn h4{font-family:var(--display);font-weight:500;font-size:21px;margin:0;line-height:1.2}#architecture .stepBtn p{margin:2px 0 0;font-size:15.5px;color:var(--soft)}#architecture .stepBtn .bar{grid-column:1/-1;height:3px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden;display:none}#architecture .stepBtn .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue-hi),var(--red-hi))}#architecture .stepBtn.on{background:linear-gradient(140deg,rgba(108,116,255,.25),rgba(43,91,215,.22));border-color:rgba(255,255,255,.3);transform:translateX(6px)}#architecture .stepBtn.on .n{color:var(--red-hi)}#architecture .stepBtn.on .bar{display:block}#architecture .stepBtn.on .bar i{animation:fill 5.5s linear forwards}
@keyframes fill{to{width:100%}}#architecture .budget{padding:26px}#architecture .budget svg{width:100%;height:auto;display:block}#architecture .capbar{transform-origin:bottom;transform-box:fill-box}#architecture .inview .capbar{animation:rise 2s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{transform:scaleY(0)}}#architecture .opline{stroke-dasharray:420}#architecture .inview .opline{animation:draw 3.5s .8s ease-out both}
@keyframes draw{from{stroke-dashoffset:420}}#architecture .legend{display:flex;flex-wrap:wrap;gap:18px;font-size:15px;color:var(--soft);margin-top:12px}#architecture .legend i{display:inline-block;width:16px;height:5px;border-radius:3px;margin-right:8px;vertical-align:middle}#architecture .note{font-size:13.5px;color:var(--mute);margin-top:6px}#architecture .kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}#architecture .kpi{padding:16px;border-radius:16px;border:1px solid var(--line);background:var(--card)}#architecture .kpi i{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--red),var(--blue-hi));font-style:normal;font-weight:400;margin-bottom:10px}#architecture .kpi b{font-family:var(--display);font-size:19px;line-height:1.2;display:block}#architecture .tx{display:grid;grid-template-columns:minmax(0,.9fr) 90px minmax(0,1.3fr);gap:16px;align-items:stretch;margin-top:16px}#architecture .old{padding:22px}#architecture .old h4,#architecture .dashT{font-family:var(--display);font-weight:500;font-size:21px;margin:0 0 14px}#architecture .old h4{color:var(--soft)}#architecture .sheet{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}#architecture .sheet span{height:16px;border-radius:3px;background:rgba(255,255,255,.08);animation:cell 6s infinite}
@keyframes cell{0%,100%{background:rgba(255,255,255,.08)}50%{background:rgba(255,77,141,.35)}}#architecture .mails{display:grid;gap:7px;margin-top:14px}#architecture .mails span{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--mute)}#architecture .mails span::before{content:"";width:22px;height:14px;border-radius:3px;border:1.5px solid rgba(255,255,255,.3)}#architecture .flow{position:relative;display:grid;place-items:center}#architecture .flow canvas{width:100%;height:100%;min-height:120px}#architecture .dash{padding:16px}#architecture .dashTop{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}#architecture .dashTop .live{font-size:13.5px;padding:5px 11px}#architecture .dGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}#architecture .tile{border-radius:12px;background:rgba(5,7,26,.55);border:1px solid var(--line);padding:12px}#architecture .tile b{font-family:var(--display);font-size:30px;line-height:1;display:block}#architecture .tile small{font-size:13.5px;color:var(--soft)}#architecture .tile.wide{grid-column:1/-1;padding:10px 12px}#architecture #live{width:100%;height:110px;display:block}#architecture .grow{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}#architecture .grow span{font-size:15.5px;font-weight:600;padding:8px 15px;border-radius:999px;border:1px solid rgba(255,77,141,.45);background:rgba(43,91,215,.13)}#architecture .close{position:relative;padding-block:22px;text-align:center;border-top:1px solid var(--line);overflow:hidden}#architecture #closeFx{position:absolute;inset:0;width:100%;height:100%}#architecture .close .wrap{position:relative}#architecture .close h2{font-size:clamp(44px,7vw,92px);max-width:28ch;margin:0 auto 22px;line-height:1.2}#architecture .close h2 .a{display:block;color:var(--soft)}#architecture .close h2 .b{display:block;background:linear-gradient(95deg,#fff,var(--red-hi));-webkit-background-clip:text;background-clip:text;color:transparent}#architecture .close p{color:var(--soft);font-size:20px;max-width:34em;margin:0 auto}#architecture .foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-block:16px;border-top:1px solid var(--line);color:var(--mute);font-size:15px}

@media (max-width:980px){#architecture .hero{min-height:0}#architecture #stage{position:relative;height:300px}#architecture .heroText{padding-block:18px;max-width:none}#architecture .split,#architecture .mat{grid-template-columns:1fr;gap:20px}#architecture .tx{grid-template-columns:1fr}#architecture .flow{height:90px}#architecture .top .wrap{padding-block:16px}
}
@media (max-width:600px){#architecture{font-size:17px}#architecture .wrap{padding-inline:16px}#architecture .ch{padding-block:16px}#architecture #stage{height:280px}#architecture .lab{font-size:12.5px;padding:4px 8px}#architecture .simFoot,#architecture .kpis{grid-template-columns:1fr}#architecture .dGrid{grid-template-columns:1fr 1fr}#architecture #silo{height:340px}#architecture .live.hide{display:none}
}
@media (prefers-reduced-motion:reduce){#architecture *{animation:none!important;transition:none!important}}

/* Adapt the supplied story to the approved homepage's pearl light and regular typography. */
.company-page main>#architecture{--ink:#FBF7F4;--text:#2D2E5F;--soft:#475569;--mute:#64748b;--line:rgba(45,46,95,.14);--card:rgba(255,255,255,.5);--display:Barlow,Arial,sans-serif;--body:Barlow,Arial,sans-serif;position:relative;padding:0;isolation:isolate;background:radial-gradient(ellipse at 6% 4%,rgba(45,46,95,.09),transparent 55%),radial-gradient(ellipse at 92% 22%,rgba(233,30,99,.09),transparent 55%),radial-gradient(ellipse at 12% 92%,rgba(255,107,53,.08),transparent 55%),linear-gradient(125deg,#FBF7F4,#fff,#f1f5fa);color:#2D2E5F;color-scheme:light}
.company-page main>#architecture::before{display:none}
#architecture .hero{min-height:0;background:transparent}
#architecture .heroText{padding-block:28px;max-width:540px}
.company-page main #architecture .architecture-title{font-family:Barlow,sans-serif;font-size:clamp(29px,3vw,44px);font-weight:400;line-height:1.15;color:#2D2E5F;background:none;-webkit-text-fill-color:currentColor}
#architecture .architecture-title .l1{color:#2D2E5F}
#architecture .architecture-title .l2{background:linear-gradient(115deg,#2D2E5F,#ad3771);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:none}
.company-page main #architecture h2{font-family:Barlow,sans-serif;font-size:clamp(25px,2.5vw,34px);font-weight:400;line-height:1.2;color:#2D2E5F}
#architecture h2 .hl{background:linear-gradient(115deg,#2D2E5F,#ad3771);background-clip:text;-webkit-background-clip:text;color:transparent}
.company-page main #architecture .tag{font-family:Barlow,sans-serif;font-size:24px;font-weight:400;background:none;color:#2D2E5F}
.company-page main #architecture :is(.lead,.big,.soft,p){color:var(--soft);font-size:17px;line-height:1.55}
#architecture .ch{padding-block:18px}
#architecture .split,#architecture .mat{gap:24px}
#architecture .glass{--soft:#C6CAEA;--mute:#b8bddc;--line:rgba(255,255,255,.17);--card:rgba(255,255,255,.05);background:linear-gradient(145deg,#102855 0%,#174676 38%,#14315f 70%,#101e45 100%);color:#fff;box-shadow:0 14px 36px rgba(24,65,133,.22),inset 0 1px 0 rgba(255,255,255,.24)}
.company-page main #architecture .glass :is(h4,b,.dashT){color:#fff}
#architecture .close{padding-block:22px;background:transparent}
#architecture .close h2 .a{color:#475569}
#architecture .close h2 .b{background:linear-gradient(115deg,#2D2E5F,#ad3771);background-clip:text;-webkit-background-clip:text;color:transparent}
#architecture .stepBtn{font-family:Barlow,sans-serif;color:#2D2E5F}
#architecture .stepBtn h4{font-family:Barlow,sans-serif;color:#2D2E5F;font-weight:500}
#architecture .stepBtn .n{color:#536f91}
#architecture .orgs span{color:#475569}
@media(max-width:980px){#architecture #stage{height:300px}#architecture .heroText{padding-block:18px 28px;max-width:none}#architecture .hero{min-height:0}}
@media(max-width:600px){#architecture .wrap{padding-inline:18px}#architecture .ch{padding-block:16px}#architecture .simHead{align-items:flex-start}#architecture .toggle{flex-wrap:wrap}#architecture .toggle button{font-size:14px;padding:8px 10px}#architecture .dashTop{flex-wrap:wrap;gap:8px}}
@media(prefers-reduced-motion:reduce){#architecture *,#architecture *::before,#architecture *::after{animation:none!important;transition:none!important}}

/* Clear chapter hierarchy, with a shared compact page rhythm. */
#architecture .chapter-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin:0 0 12px}
#architecture .chapter-number{font:500 12px/1.4 Barlow,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#536f91;flex:none}
.company-page main #architecture .chapter-topic{font:400 17px/1.4 Barlow,Arial,sans-serif;color:#2D2E5F;margin:0;padding-left:14px;border-left:1px solid #cbd5e1}
.company-page main>#architecture{background:transparent}
#architecture .ch{padding-block:18px;border-top:1px solid rgba(45,46,95,.1)}
#architecture .heroText{padding-block:24px}
#architecture .close{padding-block:24px}
@media(max-width:600px){#architecture .ch{padding-block:18px}#architecture .chapter-heading{gap:6px 10px}#architecture .chapter-topic{padding-left:10px}}

/* A visible shared stage connects the old workflow to the live dashboard. */
#architecture .tx{padding:18px;border-radius:26px;border:1px solid rgba(255,255,255,.3);background:radial-gradient(ellipse at 45% 10%,rgba(62,180,255,.42),transparent 65%),linear-gradient(125deg,#142c6a,#2456a3 48%,#182951);box-shadow:0 16px 36px rgba(24,65,133,.18);gap:14px}
#architecture .flow{border-radius:16px;overflow:hidden;border:1px solid rgba(163,208,255,.28);background:radial-gradient(ellipse at center,rgba(82,176,255,.36),transparent 70%),linear-gradient(180deg,#193b80,#183064)}
#architecture .flow canvas{position:relative;z-index:1;display:block;min-width:0}
#architecture .tx .glass{box-shadow:none;border-color:rgba(255,255,255,.2)}
@media(max-width:980px){#architecture .tx{padding:14px}#architecture .flow{height:72px}#architecture .flow canvas{min-height:0;height:100%}}

/* Liquid light is a separate moving surface; interface content stays still. */
#architecture :is(.glass,.tx){position:relative;isolation:isolate;overflow:hidden}
#architecture :is(.glass,.tx)::before{content:"";position:absolute;inset:-35%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 24% 30%,rgba(67,210,235,.58) 0%,rgba(40,150,225,.35) 22%,transparent 50%),radial-gradient(ellipse at 76% 68%,rgba(78,104,234,.60) 0%,rgba(48,79,187,.25) 32%,transparent 60%),linear-gradient(120deg,transparent 34%,rgba(149,220,255,.18) 46%,transparent 60%);animation:architecture-liquid-light 18s ease-in-out infinite alternate;transform-origin:center}
#architecture :is(.glass,.tx)::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:linear-gradient(155deg,rgba(224,249,255,.12),transparent 30%,transparent 65%,rgba(4,13,40,.28));box-shadow:inset 0 1px 0 rgba(220,245,255,.3)}
#architecture .glass{border-color:rgba(180,224,255,.32)}
#architecture .ringBox::before{animation-delay:-6s}
#architecture .budget::before{animation-delay:-11s}
#architecture .dash::before{animation-delay:-4s}
#architecture .tx{background:linear-gradient(135deg,#10244c,#1d497a 48%,#122246);padding:22px;gap:16px;box-shadow:0 18px 40px rgba(17,50,95,.2)}
#architecture .tx::before{animation-duration:24s;opacity:.9}
#architecture .tx .glass{background:linear-gradient(135deg,rgba(18,49,101,.86),rgba(17,33,74,.92));box-shadow:inset 0 1px 0 rgba(225,249,255,.14)}
#architecture .tx .glass::before{opacity:.48}
#architecture .flow{background:linear-gradient(180deg,rgba(30,78,129,.6),rgba(12,30,67,.72));border-color:rgba(185,226,255,.24)}
@keyframes architecture-liquid-light{0%{transform:translate3d(-6%,-4%,0) rotate(-8deg) scale(1)}50%{transform:translate3d(5%,2%,0) rotate(4deg) scale(1.08)}100%{transform:translate3d(2%,7%,0) rotate(10deg) scale(1.02)}}
@media(max-width:600px){#architecture .tx{padding:14px;gap:12px}}
@media(prefers-reduced-motion:reduce){#architecture :is(.glass,.tx)::before{animation:none;transform:none}}

/* A contextual record journey, with quieter surfaces and meaningful emphasis. */
#architecture .tx{grid-template-columns:minmax(0,.9fr) 132px minmax(0,1.3fr);background:linear-gradient(125deg,#eaf3ff,#dceafb 48%,#f4f8ff);border:1px solid #bdcee6;box-shadow:0 12px 32px rgba(27,57,95,.12)}
#architecture .tx::before{opacity:.22}
#architecture .tx::after{background:linear-gradient(145deg,rgba(255,255,255,.6),transparent 60%);box-shadow:inset 0 1px 0 #fff}
#architecture .tx .glass{background:linear-gradient(140deg,#19385f,#132647);border-color:rgba(255,255,255,.3)}
#architecture .tx .glass::before{opacity:.2;animation:none}
#architecture .tx .sheet span{animation:none;background:rgba(177,202,230,.16)}
#architecture .flow{display:flex;flex-direction:column;justify-content:center;gap:16px;padding:16px 8px;background:linear-gradient(160deg,#f5fbff,#d3e7fa);border:1px solid #afc9e4;color:#244e78;transition:box-shadow .6s}
#architecture .flow-arrow{font-size:27px;color:#3e7197}
#architecture .core-icon{width:44px;height:44px;fill:none;stroke:#24577e;stroke-width:1.5}
#architecture .core-label{text-align:center;font:500 14px/1.35 Barlow,Arial,sans-serif}
#architecture .core-active .flow{box-shadow:inset 0 0 28px rgba(56,153,213,.28)}
#architecture .mails span{padding:10px;border-radius:8px;border:1px solid transparent;transition:background .6s,border-color .6s;color:#d6e4f1}
#architecture .mails .record-active{background:rgba(76,180,212,.2);border-color:rgba(137,224,239,.6);color:#fff}
#architecture .tile{transition:background .6s,border-color .6s}
#architecture .tile.record-active{background:rgba(38,137,167,.3);border-color:#85d5e4}
#architecture .connected-record{padding:16px}
#architecture .connection-label{font:500 13px/1.4 Barlow,sans-serif;color:#bdcedf}
#architecture .record-links{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:12px 0}
#architecture .record-links span{border:1px solid #52748d;border-radius:7px;padding:6px 10px;color:#e4f3fa;font-size:15px}
#architecture .record-links i{font-style:normal;color:#87cfdf}
.company-page main #architecture .connection-caption{font-size:15px;color:#d7e9f4;margin:0;min-height:3.1em}
@media(max-width:980px){#architecture .tx{grid-template-columns:1fr}#architecture .flow{height:auto;flex-direction:row;gap:14px;padding:12px}#architecture .flow-arrow{transform:rotate(90deg)}#architecture .core-label br{display:none}}
@media(prefers-reduced-motion:reduce){#architecture .tx *{transition:none!important}}

/* TransVare brand light over a transparent transformation stage. */
#architecture .tx{background:transparent;border:0;box-shadow:none;padding:8px 0}
#architecture .tx::before{background:radial-gradient(ellipse at 24% 30%,rgba(233,30,99,.25),transparent 52%),radial-gradient(ellipse at 76% 68%,rgba(255,107,53,.22),transparent 58%);opacity:.65}
#architecture .tx::after{background:none;box-shadow:none}
#architecture .tx .glass{--soft:#475569;--mute:#64748b;--line:rgba(45,46,95,.14);--card:rgba(255,255,255,.5);background:rgba(255,255,255,.78);color:#2D2E5F;border-color:rgba(45,46,95,.16);box-shadow:0 8px 24px rgba(45,46,95,.06)}
#architecture .tx .glass::before{background:radial-gradient(ellipse at 20% 24%,rgba(233,30,99,.18),transparent 55%),radial-gradient(ellipse at 80% 76%,rgba(255,107,53,.16),transparent 58%);opacity:.6;animation:architecture-liquid-light 18s ease-in-out infinite alternate}
.company-page main #architecture .tx .glass :is(h4,b,.dashT){color:#2D2E5F}
#architecture .tx .glass::after{background:linear-gradient(145deg,rgba(255,255,255,.55),transparent);box-shadow:inset 0 1px 0 #fff}
#architecture .tx .sheet span{background:rgba(45,46,95,.1)}
#architecture .tx .mails span{color:#475569}
#architecture .tx .mails span::before{border-color:#85859d}
#architecture .tx .mails .record-active{background:linear-gradient(110deg,rgba(233,30,99,.13),rgba(255,107,53,.12));border-color:rgba(233,30,99,.38);color:#2D2E5F}
#architecture .tx .tile{background:rgba(255,255,255,.72);border-color:#dcdce6;color:#2D2E5F}
#architecture .tx .tile small{color:#475569}
#architecture .tx .tile.record-active{background:linear-gradient(110deg,rgba(233,30,99,.12),rgba(255,107,53,.13));border-color:#df89a8}
#architecture .tx .flow{background:transparent;border:0;color:#2D2E5F;box-shadow:none}
#architecture .tx .flow-arrow{color:#E91E63;transition:opacity .6s;opacity:.35}
#architecture .tx .core-icon{stroke:#2D2E5F}
#architecture .tx.core-active .flow{background:linear-gradient(145deg,rgba(233,30,99,.11),rgba(255,107,53,.12));box-shadow:0 0 24px rgba(233,30,99,.09)}
#architecture .tx.core-active .flow-arrow{opacity:1}
#architecture .tx .connection-label{color:#64748b}
#architecture .tx .record-links span{border-color:#d7cbd5;color:#2D2E5F;background:rgba(255,255,255,.65)}
#architecture .tx .record-links i{color:#E91E63}
.company-page main #architecture .tx .connection-caption{color:#475569}
#architecture .tx .live{color:#475569;background:rgba(255,255,255,.7);border-color:#dcdce6}
@media(prefers-reduced-motion:reduce){#architecture .tx .glass::before{animation:none}}

/* The same transparent brand-light treatment across the architecture story. */
#architecture .glass{--soft:#475569;--mute:#64748b;--line:rgba(45,46,95,.15);--card:rgba(255,255,255,.6);background:rgba(255,255,255,.76);color:#2D2E5F;border-color:rgba(45,46,95,.16);box-shadow:0 8px 24px rgba(45,46,95,.06)}
#architecture .glass::before{background:radial-gradient(ellipse at 20% 24%,rgba(233,30,99,.18),transparent 55%),radial-gradient(ellipse at 80% 76%,rgba(255,107,53,.16),transparent 58%);opacity:.6}
#architecture .glass::after{background:linear-gradient(145deg,rgba(255,255,255,.55),transparent);box-shadow:inset 0 1px 0 #fff}
.company-page main #architecture .glass :is(h4,b,.dashT){color:#2D2E5F}
#architecture #silo{background:transparent}
#architecture .simFoot div{background:rgba(255,255,255,.7)}
#architecture .toggle{background:rgba(45,46,95,.06)}
#architecture .toggle button{color:#475569}
#architecture .toggle button.on{background:linear-gradient(110deg,#b81854,#c94e28);color:#fff}
#architecture .budget svg text,#architecture #segLabels{fill:#2D2E5F}
#architecture .budget svg>g[stroke]{stroke:rgba(45,46,95,.12)}
#architecture .budget .capbar{fill:#9ba7ba}
#architecture .stepBtn.on{background:linear-gradient(110deg,rgba(233,30,99,.11),rgba(255,107,53,.12));border-color:#d78aa7}
#architecture .stepBtn .bar{background:rgba(45,46,95,.08)}
#architecture .stepBtn .bar i{background:linear-gradient(90deg,#E91E63,#FF6B35)}
#architecture .kpi{background:rgba(255,255,255,.7)}
#architecture .kpi i{background:linear-gradient(135deg,#b81854,#c94e28);color:#fff}
#architecture .legend i{background-color:#9ba7ba}
#architecture .lab{background:rgba(255,255,255,.86);border-color:rgba(45,46,95,.2);color:#2D2E5F}
#architecture .heroShade{background:linear-gradient(0deg,rgba(255,255,255,.35),transparent)}
#architecture .stepBtn:focus-visible,#architecture .toggle button:focus-visible{outline-color:#2D2E5F}

/* Readable, native record cards replace abstract particle noise. */
#architecture .regulator-story{padding:16px}
#architecture .regulator-story .toggle{border-radius:12px;flex-wrap:wrap}
#architecture .regulator-story .toggle button{font-size:14px;border-radius:9px;padding:9px 12px}
#architecture .story-pause{font:500 13px Barlow,sans-serif;padding:7px 10px;border:1px solid #d6cbd5;border-radius:8px;background:rgba(255,255,255,.8);color:#2D2E5F;cursor:pointer}
#architecture .regulator-request{padding:12px 14px;background:rgba(255,255,255,.7);border-left:3px solid #E91E63;border-radius:9px;margin:14px 0}
#architecture .regulator-request>span{font-size:12px;letter-spacing:.07em;color:#904563}
.company-page main #architecture .regulator-request p{color:#2D2E5F;font-size:17px;margin:5px 0 0}
#architecture .story-progress{display:flex;gap:5px;margin:12px 0}
#architecture .story-progress i{height:3px;flex:1;background:#dddbe4;border-radius:3px;transition:background .5s}
#architecture .story-progress i.on{background:linear-gradient(90deg,#E91E63,#FF6B35)}
#architecture .team-records{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#architecture .team-record{min-width:0;padding:12px;border:1px solid #dcd5e0;border-radius:12px;background:rgba(255,255,255,.75);transition:background .6s,border-color .6s}
.company-page main #architecture .team-record h4{font:500 18px/1.2 Barlow,sans-serif;margin:0 0 5px;color:#2D2E5F}
.company-page main #architecture .team-record .team-duty{font-size:13px;line-height:1.4;margin:0 0 10px;color:#475569}
#architecture .record-document{display:block;padding:7px 8px;border:1px solid #e3ccd8;border-radius:7px;font:500 13px/1.4 Barlow,sans-serif;color:#7d3555;background:linear-gradient(115deg,rgba(233,30,99,.07),rgba(255,107,53,.07))}
#architecture .team-record small{display:block;color:#64748b;font-size:12px;margin-top:7px}
#architecture .team-record.is-active{border-color:#cc7194;background:linear-gradient(135deg,rgba(233,30,99,.1),rgba(255,107,53,.08),rgba(255,255,255,.9))}
#architecture .shared-answer{display:flex;align-items:center;gap:12px;padding:13px;margin-top:12px;border-radius:12px;border:1px solid #d6c7d3;background:rgba(255,255,255,.8);transition:background .6s}
#architecture .answer-symbol{color:#E91E63;font-size:26px}
#architecture .shared-answer b{display:block;font-size:17px;font-weight:500}
#architecture .shared-answer small{display:block;font-size:13px;color:#475569;margin-top:4px}
#architecture .is-connected .shared-answer{background:linear-gradient(110deg,rgba(233,30,99,.15),rgba(255,107,53,.13));border-color:#d8819d}
#architecture .story-explanation{padding-top:14px;min-height:0}
#architecture .story-step{font-size:13px;font-weight:500;color:#8d385b}
.company-page main #architecture .story-explanation p{font-size:15px;line-height:1.5;margin:5px 0 0;color:#2D2E5F}
#architecture .story-result{font-size:11px;color:#64748b;border-top:1px solid #ded9e2;padding-top:9px}
@media(max-width:600px){#architecture .regulator-story{padding:14px}#architecture .team-record{padding:10px}#architecture .team-records{gap:8px}}

/* An audit-led adoption case, in the same transparent brand-light treatment. */
#architecture .adoption-case{padding:16px;align-self:stretch}
#architecture .adoption-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#84405d;font-size:12px;letter-spacing:.03em}
#architecture .adoption-pause{font:500 13px Barlow,sans-serif;padding:7px 10px;border:1px solid #d6cbd5;border-radius:8px;background:rgba(255,255,255,.8);color:#2D2E5F;cursor:pointer}
.company-page main #architecture .adoption-case h3{font:400 23px/1.25 Barlow,sans-serif;color:#2D2E5F;margin:14px 0}
#architecture .adoption-record{padding:15px;background:linear-gradient(115deg,rgba(233,30,99,.09),rgba(255,107,53,.08));border:1px solid #deafc2;border-radius:12px}
#architecture .record-type{font-size:12px;color:#8c3b5d}
.company-page main #architecture .adoption-record h4{font:500 18px/1.3 Barlow,sans-serif;margin:7px 0;color:#2D2E5F}
.company-page main #architecture .adoption-record p{font-size:15px;line-height:1.5;margin:0;color:#475569}
#architecture .record-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
#architecture .record-tags span{font-size:12px;padding:4px 7px;border:1px solid #d7bbc8;border-radius:6px;background:rgba(255,255,255,.7);color:#6f3651}
#architecture .assurance-links{display:grid;gap:9px;margin-top:15px}
#architecture .assurance-link{display:flex;align-items:center;gap:12px;position:relative;border:1px solid #ddd9e2;border-radius:10px;padding:12px;background:rgba(255,255,255,.6);opacity:.55;transition:opacity .6s,background .6s,border-color .6s}
#architecture .assurance-link.is-reached{opacity:1}
#architecture .assurance-link.is-current{background:linear-gradient(115deg,rgba(233,30,99,.12),rgba(255,107,53,.1));border-color:#ce7b9d}
#architecture .link-icon{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#f0e9ee;color:#8d3c60;font-size:13px}
#architecture .is-reached .link-icon{background:linear-gradient(110deg,#b81854,#c94e28);color:#fff}
#architecture .assurance-link b{display:block;font-size:16px;font-weight:500}
#architecture .assurance-link small{display:block;margin-top:3px;font-size:13px;line-height:1.45;color:#475569}
#architecture .adoption-value{border-top:1px solid #ded5de;margin-top:16px;padding-top:12px;min-height:0}
#architecture .adoption-value>span{font-size:12px;font-weight:500;color:#8c3b5d}
.company-page main #architecture .adoption-value p{font-size:15px;line-height:1.5;color:#2D2E5F;margin:5px 0 0}
.company-page main #architecture .adoption-note{font-size:11px;color:#64748b;margin:10px 0 0}
#architecture #steps .stepBtn.on .bar i{animation-duration:7s}
@media(max-width:600px){#architecture .adoption-case{padding:14px}#architecture .adoption-record{padding:12px}}

/* Board-facing commercial logic replaces an unsupported cost curve. */
#architecture .business-case{padding:16px}
.company-page main #architecture .business-case h3{font:400 23px/1.25 Barlow,sans-serif;margin:14px 0;color:#2D2E5F}
#architecture .budget-decisions{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
#architecture .budget-decisions button{flex:1;min-width:85px;font:500 13px/1.4 Barlow,sans-serif;padding:8px;border:1px solid #ded5de;border-radius:8px;background:rgba(255,255,255,.75);color:#475569;cursor:pointer;transition:background .5s}
#architecture .budget-decisions button.on{background:linear-gradient(110deg,#b81854,#c94e28);color:#fff;border-color:transparent}
#architecture .proposal-rows{display:grid;gap:8px}
#architecture .proposal-rows article{display:flex;align-items:center;gap:12px;padding:12px;border-radius:10px;border:1px solid #ded9e2;background:rgba(255,255,255,.7);opacity:.55;transition:opacity .6s,background .6s,border-color .6s}
#architecture .proposal-rows article.proposal-reached{opacity:1}
#architecture .proposal-rows article.proposal-current{border-color:#d281a1;background:linear-gradient(110deg,rgba(233,30,99,.11),rgba(255,107,53,.09))}
#architecture .proposal-reached .link-icon{background:linear-gradient(110deg,#b81854,#c94e28);color:#fff}
.company-page main #architecture .proposal-rows h4{font:500 17px/1.3 Barlow,sans-serif;margin:0 0 4px;color:#2D2E5F}
.company-page main #architecture .proposal-rows p{font-size:14px;line-height:1.45;margin:0;color:#475569}
#architecture .board-proposal{padding:13px;border:1px solid #d6cbd5;border-radius:10px;margin-top:12px;background:rgba(255,255,255,.8);transition:background .6s,border-color .6s}
#architecture .board-proposal>span{font-size:12px;color:#8d3b5b}
.company-page main #architecture .board-proposal p{font-size:15px;color:#2D2E5F;margin:5px 0 0;line-height:1.45}
#architecture .proposal-complete .board-proposal{background:linear-gradient(110deg,rgba(233,30,99,.13),rgba(255,107,53,.12));border-color:#cf7698}
@media(max-width:600px){#architecture .business-case{padding:14px}}