/* One outline icon family across navigation, content and project forms. */
.ui-icon{display:inline-block;width:22px;height:22px;flex:0 0 auto;vertical-align:middle;color:inherit}
.icon-heading{display:flex;align-items:center;gap:12px}
.icon-heading>.ui-icon{width:26px;height:26px;color:var(--blue)}
.icon-badge{display:grid;place-items:center;width:48px;height:48px;margin-bottom:18px;border-radius:12px;background:#eaf2fc;color:var(--blue)}
.icon-badge>.ui-icon{width:27px;height:27px}
.text-columns .icon-badge{margin-bottom:16px}
.breadcrumb,.anchor-nav a,.filters button,.footer-top>div:not(.footer-brand)>a,.footer-bottom a,.mobile-nav>a{display:inline-flex;align-items:center;gap:9px}
.breadcrumb .ui-icon,.footer-top .ui-icon,.footer-bottom .ui-icon{width:17px;height:17px}
.mobile-nav>a{display:flex;gap:14px}
.menu-toggle span{transition:transform .18s ease}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.footer-top>div:not(.footer-brand)>a{display:flex}
.footer-address{display:flex;align-items:flex-start;gap:9px}
.footer-address .ui-icon{margin-top:5px}
.anchor-nav .ui-icon,.filters .ui-icon{width:19px;height:19px}
.solution-grid h3.icon-heading{align-items:flex-start;gap:12px}
.solution-grid h3 .ui-icon{margin-top:3px}
.solution-grid .number{display:none}
.process h3{display:flex;align-items:center;gap:12px}
.process h3 .ui-icon{color:var(--sky);width:27px;height:27px}
.brand-rows h3{display:flex;align-items:center;gap:10px}
.brand-rows h3 .ui-icon{color:var(--blue)}
.project-location{display:flex;align-items:flex-start;gap:7px}
.project-location .ui-icon{width:16px;height:16px;margin-top:3px}
.project-meta>div>.ui-icon{display:block;color:var(--blue);margin-bottom:12px;width:27px;height:27px}
.gallery-item>span{display:grid;place-items:center;width:38px;height:38px;padding:0;border-radius:4px}
.gallery-item .ui-icon{width:20px;height:20px}
.lightbox-close,.lightbox-prev,.lightbox-next{display:grid;place-items:center}
.icon-reverse{transform:rotate(180deg)}
.icon-close{transform:rotate(45deg)}
.faq summary>span{display:flex;align-items:center;justify-content:center}
.faq summary .ui-icon{width:21px;height:21px}
.guide-list .guide-icon{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.guide-icon>.ui-icon{width:33px;height:33px;color:var(--blue)}
.contact-item>span{display:flex;align-items:center;gap:9px}
.contact-item>span .ui-icon{color:var(--blue);width:19px;height:19px}
label>.ui-icon,.upload label>.ui-icon{width:18px;height:18px;margin-right:7px;color:var(--blue);vertical-align:-4px}
.privacy-note{position:relative;padding-left:27px}
.privacy-note>.ui-icon{position:absolute;left:0;top:2px;width:17px;height:17px;color:var(--blue)}
.config-main h2.icon-heading{align-items:flex-start;gap:12px}
.config-main h2.icon-heading>.ui-icon{width:28px;height:28px;margin-top:5px}
.config-sidebar h2.icon-heading>.ui-icon{color:var(--sky)}
.choice>.ui-icon{width:30px;height:30px;color:var(--blue)}
.edit-link,.summary-sub button,.summary-section button,.product-stack button{display:inline-flex;align-items:center;gap:5px}
.edit-link .ui-icon,.summary-sub button .ui-icon,.summary-section button .ui-icon,.product-stack button .ui-icon{width:15px;height:15px}
.upload li>span{overflow-wrap:anywhere;min-width:0}
.upload li>span>.ui-icon{width:16px;height:16px;margin-right:6px}
.upload li button{flex-shrink:0}
.success>.icon-badge{background:#e0f1e9;color:#20764d}
@media(max-width:680px){
 .icon-heading{gap:10px}.icon-heading>.ui-icon{width:24px;height:24px}
 .icon-badge{width:42px;height:42px;margin-bottom:13px;border-radius:10px}
 .icon-badge>.ui-icon{width:24px;height:24px}
 .anchor-nav{gap:20px}.anchor-nav a{gap:7px}
 .filters button{gap:6px}.filters .ui-icon{width:16px;height:16px}
 .guide-icon>.ui-icon{width:28px;height:28px}
 .config-main h2.icon-heading>.ui-icon{width:25px;height:25px;margin-top:3px}
 .config-actions .ui-icon{width:17px;height:17px}
 .footer-bottom a{gap:5px}.footer-bottom .ui-icon{width:14px;height:14px}
}
@media(max-width:380px){
 .header .header-inner{padding-inline:20px;gap:8px}
 .header .header-inner .brand{width:72px;min-width:72px;flex:0 0 72px}
 .header .header-inner .brand img{width:72px;height:56px}
 .header .header-inner .header-cta{padding:10px 11px;gap:8px;font-size:11px;min-height:42px}
 .header .header-inner .menu-toggle{padding:6px;flex:0 0 36px}
 .summary-sub>div:first-child{flex-wrap:wrap;gap:7px}
}
