.ui-icon { width: 22px; height: 22px; display: inline-block; flex-shrink: 0; vertical-align: middle; }
.small-icon { width: 18px; height: 18px; }
.icon-frame, .role-symbol { width: 56px; height: 56px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #7f929c50; border-radius: 10px; background: #ffffff24; color: #294555; }
.icon-frame .ui-icon, .role-symbol .ui-icon { width: 30px; height: 30px; }
.service-top .icon-frame { margin: 0; }
.service-top .icon-frame svg { width: 30px; height: 30px; stroke: currentColor; stroke-width: 1.5; }
.value-icon .icon-frame svg { width: 30px; height: 30px; stroke: currentColor; stroke-width: 1.5; }
.role-symbol { line-height: 1; }
.confidential > span { display: inline-flex; color: #294555; }
.confidential .ui-icon { width: 30px; height: 30px; }
.button > span, .text-link > span, .underlined > span, .mega-bottom button > span, .service-card summary > span { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.button .ui-icon, .text-link .ui-icon, .underlined .ui-icon, .mega-bottom .ui-icon, .mega-intro .ui-icon, .inline-button .ui-icon { width: 19px; height: 19px; }
.service-card summary .ui-icon { width: 20px; height: 20px; }
.menu-toggle > span { display: inline-flex; padding-left: 10px; vertical-align: middle; }
.dialog-close { width: 40px; height: 40px; display: grid; place-items: center; }
.dash-footer b { display: inline-flex; vertical-align: middle; }
.footer > .wrap > a:last-child { display: inline-flex; align-items: center; gap: 12px; }
@media (hover: hover) and (pointer: fine) { .icon-frame { transition: border-color .3s, background-color .3s; } .service-card:hover .icon-frame, .value-grid article:hover .icon-frame, .role-grid article:hover .role-symbol { border-color: #566f80; background: #ffffff45; } }
@media(max-width:800px) { .footer > .wrap > a:last-child { display: none; } }