/* One visual language and one brand inventory for the preview and full portfolio. */
:root{--brand-cell-width:190px;--brand-cell-height:104px;--brand-border:#cbdcdd;--brand-surface:#f7fbfb}
.partner-strip{display:grid;grid-template-columns:240px minmax(0,1fr);padding:0;gap:0;border-color:var(--brand-border);background:var(--brand-surface);isolation:isolate}
.portfolio-strip-intro{padding:27px 30px;align-self:stretch;border-right:1px solid var(--brand-border);display:flex;flex-direction:column;justify-content:center;gap:19px;position:relative;z-index:2;background:var(--brand-surface)}
.portfolio-label{display:flex;gap:9px;align-items:center;font:9px/1.6 var(--mono);letter-spacing:.055em;color:var(--teal-dark)}
.portfolio-mark{display:inline-grid;grid-template-columns:repeat(2,3px);gap:2px;flex:none}
.portfolio-mark i{width:3px;height:3px;background:currentColor}
.portfolio-strip-intro strong{font:17px/1.45 var(--display);letter-spacing:-.045em;font-weight:400}
.portfolio-overview-link{display:flex;align-items:center;justify-content:space-between;gap:14px;font:10px/1.5 var(--mono);color:var(--teal-dark)}
.portfolio-overview-link span:last-child{font-size:20px;transition:transform .3s}
.portfolio-overview-link:hover span:last-child{transform:translate(3px,-3px)}
.portfolio-lanes{min-width:0;overflow:hidden;position:relative;mask-image:linear-gradient(90deg,transparent,black 3%,black 97%,transparent)}
.portfolio-lane{overflow:hidden;position:relative;height:var(--brand-cell-height)}
.portfolio-lane+.portfolio-lane{border-top:1px solid var(--brand-border)}
.portfolio-track,.portfolio-run{display:flex;flex-wrap:nowrap;width:max-content;gap:0;align-items:stretch}
.portfolio-run{flex-shrink:0}
.brand-tile{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;gap:13px;background:var(--brand-surface);border:0;border-right:1px solid var(--brand-border);border-bottom:1px solid var(--brand-border);padding:25px 20px 20px;min-width:0;isolation:isolate;overflow:hidden;transition:background .35s,box-shadow .35s;scroll-margin-top:125px}
.brand-tile:before{content:'+';position:absolute;right:10px;top:6px;color:#94b9bb;font:12px var(--mono);transition:color .3s,transform .3s}
.brand-tile:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,#d7eeed,transparent 80%);opacity:0;transition:opacity .35s}
.brand-tile img{display:block;width:100%;height:54px;object-fit:contain;filter:grayscale(1) brightness(.65);opacity:.82;mix-blend-mode:multiply;--logo-scale:1;transform:scale(var(--logo-scale));transition:filter .4s,opacity .4s,transform .4s}
.brand-tile:is([data-brand=microsoft-365],[data-brand-link=microsoft-365]) img{--logo-scale:1.6}
.brand-tile:is([data-brand=canovate],[data-brand-link=canovate]) img{--logo-scale:1.2}
.brand-tile:is([data-brand=h3c],[data-brand-link=h3c]) img{--logo-scale:.8}
.brand-caption{font:9px/1.45 var(--mono);color:#657c80;text-align:center;letter-spacing:.01em;max-width:100%;min-height:14px}
.brand-tile:is(:hover,:focus-visible,.is-highlighted){background:#eef8f7}
.brand-tile:is(:hover,:focus-visible,.is-highlighted) img{filter:grayscale(0);opacity:1;transform:translateY(-2px) scale(var(--logo-scale))}
.brand-tile:is(:hover,:focus-visible,.is-highlighted):before{color:var(--teal-dark);transform:rotate(90deg)}
.brand-tile:is(:hover,:focus-visible,.is-highlighted):after{opacity:1}
.brand-tile:is(:focus-visible,.is-highlighted){outline:2px solid var(--teal);outline-offset:-2px;z-index:1}
.portfolio-run>.brand-tile{width:var(--brand-cell-width);height:var(--brand-cell-height);padding:20px 23px 12px;flex-shrink:0;border-bottom:0;gap:9px}
.portfolio-run>.brand-tile img{height:37px}
.portfolio-run .brand-caption{font-size:8px}
.motion-on .portfolio-track{animation:portfolio-conveyor var(--portfolio-duration,110s) linear infinite}
.motion-on .portfolio-lane:nth-child(even) .portfolio-track{animation-direction:reverse}
.portfolio-lanes:hover .portfolio-track,.portfolio-lanes:focus-within .portfolio-track{animation-play-state:paused}
.portfolio-badge{display:flex;align-items:center;gap:20px;padding-top:25px;margin-top:30px;border-top:1px dashed var(--brand-border)}
.portfolio-badge strong{font:46px/1 var(--mono);letter-spacing:-.08em;color:var(--teal-dark);font-weight:400}
.portfolio-badge .portfolio-label{font-size:10px}
.partners .section-heading{grid-template-columns:1fr 1fr;margin-bottom:36px}
.portfolio-description>p{max-width:480px;color:#5c686e;font-size:16px}
.portfolio-tools{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:24px}
.portfolio-filters{display:flex;flex-wrap:wrap;gap:9px}
.portfolio-filter{font:10px/1.5 var(--mono);padding:11px 13px;color:#536c71;background:transparent;border:1px solid var(--brand-border);display:inline-flex;gap:12px;align-items:center;transition:background .25s,color .25s,border-color .25s}
.portfolio-filter span{opacity:.7;font-size:9px}
.portfolio-filter[aria-pressed=true]{background:var(--teal-dark);border-color:var(--teal-dark);color:white}
.portfolio-filter:hover:not([aria-pressed=true]){background:#edf7f6;border-color:var(--teal)}
.portfolio-status{font:10px/1.5 var(--mono);color:#657c80;white-space:nowrap;margin-bottom:10px}
.portfolio-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--brand-border);border-left:1px solid var(--brand-border)}
.portfolio-grid>.brand-tile{min-height:144px}
.portfolio-grid .brand-caption{max-width:160px}
.portfolio-grid>[hidden]{display:none!important}
.portfolio-footnote{display:flex;gap:20px;justify-content:space-between;font:10px/1.7 var(--mono);color:#657c80;margin-top:22px}
.portfolio-footnote a{color:var(--teal-dark);white-space:nowrap}
.portfolio-footnote a:hover{text-decoration:underline;text-underline-offset:4px}
.portfolio-lanes:has(a:focus-visible) .portfolio-track{animation:none;transform:none}
.portfolio-lanes:has(a:focus-visible) .portfolio-lane{overflow-x:auto}
.portfolio-lanes:has(a:focus-visible) .portfolio-run[aria-hidden=true]{display:none}
.motion-paused .portfolio-lane{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#adcacc transparent}
.motion-paused .portfolio-run[aria-hidden=true]{display:none}
@keyframes portfolio-conveyor{to{transform:translateX(-50%)}}
@media(min-width:1650px){.partner-strip{grid-template-columns:290px minmax(0,1fr)}.portfolio-strip-intro{padding-inline:50px}.portfolio-grid>.brand-tile{min-height:160px}.brand-tile img{height:62px}}
@media(max-width:1100px){.partner-strip{grid-template-columns:220px minmax(0,1fr)}.portfolio-strip-intro{padding-inline:24px}.portfolio-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.portfolio-tools{display:block}.portfolio-status{margin:16px 0 0}}
@media(max-width:760px){
 :root{--brand-cell-width:156px;--brand-cell-height:96px}
 .partner-strip{display:block;padding:0}.portfolio-strip-intro{display:grid;grid-template-columns:1fr auto;align-items:center;gap:13px 20px;padding:22px 20px;border-right:0;border-bottom:1px solid var(--brand-border)}
 .portfolio-strip-intro>.portfolio-label{grid-column:1/-1;font-size:8px}.portfolio-strip-intro strong{font-size:14px}.portfolio-strip-intro strong br{display:none}.portfolio-overview-link{font-size:9px;gap:10px}.portfolio-overview-link span:first-child{max-width:75px}.portfolio-lanes{mask-image:linear-gradient(90deg,transparent,black 4%,black 96%,transparent)}
 .portfolio-run>.brand-tile{padding-inline:17px}.portfolio-run>.brand-tile img{height:34px}.portfolio-run .brand-caption{font-size:8px}
 .partners .section-heading{grid-template-columns:1fr;gap:23px;margin-bottom:28px}.portfolio-badge{margin-top:22px;padding-top:20px;gap:18px}.portfolio-badge strong{font-size:38px}.portfolio-badge .portfolio-label{font-size:9px}
 .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio-grid>.brand-tile{min-height:132px;padding:22px 16px 17px}.portfolio-grid .brand-tile img{height:43px}.brand-caption{font-size:8px}
 .portfolio-filters{gap:7px}.portfolio-filter{font-size:9px;padding:9px 11px;gap:9px}.portfolio-filter span{font-size:8px}.portfolio-tools{margin-bottom:20px}.portfolio-status{font-size:9px}
 .portfolio-footnote{flex-direction:column;gap:12px;font-size:9px}.brand-tile{scroll-margin-top:100px}
}
@media(prefers-reduced-motion:reduce){.portfolio-track{animation:none!important}.portfolio-lane{overflow-x:auto}.portfolio-run[aria-hidden=true]{display:none}.brand-tile img{transition:none}}