/* "Awards & partners" cards (template-parts/awards-cards.php, data ss_co2_award_cards() in inc/company-v2.php).
   Shared by the Company page v2 (enqueued async as ss-awards-cards) and the homepage v2 (inlined in <head> with the
   homepage critical CSS by inc/cs2-perf.php, because the section sits right under the hero). Cards sit on a navy
   section; override --ss-aw-card / --ss-aw-line / --ss-aw-mist on the section if needed. UI transitions <= 200 ms. */
.ss-awards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none}
.ss-awards+.ss-awards{margin-top:18px}
.ss-aw{display:grid;justify-items:center;align-content:start;gap:12px;text-align:center;padding:26px 16px 22px;border-radius:18px;background:var(--ss-aw-card,var(--ss-navy-deep));border:1px solid var(--ss-aw-line,var(--ss-navy-line));color:#fff;margin:0;min-width:0}
.ss-aw__med{width:120px;height:120px;border-radius:16px;background:#fff;display:grid;place-items:center;margin-bottom:4px}
.ss-aw__med img{max-height:92px;max-width:100px;width:auto;height:auto;object-fit:contain;display:block}
.ss-aw b{font-size:15.5px;line-height:1.3;font-weight:700;color:#fff}
.ss-aw span:not(.ss-aw__med){font-size:13px;color:var(--ss-aw-mist,var(--ss-mist));line-height:1.4}
@media (min-width:981px){.ss-awards:not(.ss-awards--6)>.ss-aw:last-child:nth-child(5n+1){grid-column:3}} /* a lone card in the last row sits in the middle column (16 cards since Shopify, 2026-09-29) */
@media (max-width:980px){.ss-awards{grid-template-columns:repeat(2,minmax(0,1fr))}.ss-aw:last-child:nth-child(odd){grid-column:1/-1}}
/* six-up variant (PPC service page partner cards): 6 in a row, 3 x 2 at <=1000px, 2 x 3 on phones, no full-width last card */
.ss-awards--6{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.ss-awards--6 .ss-aw{padding:24px 12px 20px}
@media (max-width:1240px){.ss-awards--6 .ss-aw__med{width:104px;height:104px}.ss-awards--6 .ss-aw__med img{max-height:80px;max-width:88px}}
@media (max-width:1000px){.ss-awards--6{grid-template-columns:repeat(3,minmax(0,1fr))}.ss-awards--6 .ss-aw__med{width:120px;height:120px}.ss-awards--6 .ss-aw__med img{max-height:92px;max-width:100px}}
@media (max-width:980px){.ss-awards--6 .ss-aw:last-child{grid-column:auto}}
@media (max-width:640px){.ss-awards--6{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.ss-awards{gap:12px}.ss-awards+.ss-awards{margin-top:12px}.ss-aw{padding:20px 10px}.ss-aw__med{width:96px;height:96px}.ss-aw__med img{max-height:72px;max-width:80px}}

/* Collapsed variant (homepage): the first row (2-up: first 4 cards) + ~half of the next row, masked so it fades into
   whatever section background is behind it. --ss-aw-cut / --ss-aw-fade are measured by the partial's script before
   first paint; the fallbacks here are close estimates. No-JS: <noscript> shows everything. */
.ss-aw-fold__clip{overflow:hidden;transition:max-height .2s ease}
.ss-aw-fold.is-collapsed .ss-aw-fold__clip{max-height:var(--ss-aw-cut,425px);-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - var(--ss-aw-fade,130px)),transparent 100%);mask-image:linear-gradient(180deg,#000 calc(100% - var(--ss-aw-fade,130px)),transparent 100%)}
.ss-aw-fold.is-instant .ss-aw-fold__clip{transition:none}
@media (max-width:980px){.ss-aw-fold.is-collapsed .ss-aw-fold__clip{max-height:var(--ss-aw-cut,640px)}}
@media (max-width:640px){.ss-aw-fold.is-collapsed .ss-aw-fold__clip{max-height:var(--ss-aw-cut,540px);-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - var(--ss-aw-fade,110px)),transparent 100%);mask-image:linear-gradient(180deg,#000 calc(100% - var(--ss-aw-fade,110px)),transparent 100%)}}
.ss-aw-fold__more{display:flex;justify-content:center;margin-top:18px}
.ss-aw-fold__more[hidden]{display:none}
.ss-aw-more{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:8px 26px;border:1.5px solid rgba(var(--ss-gold-rgb),.7);border-radius:999px;background:transparent;color:#fff;font:600 15.5px/1.2 "Proxima Nova","Helvetica Neue",Arial,sans-serif;cursor:pointer;transition:background-color .15s,border-color .15s}
.ss-aw-more:after{content:"";width:8px;height:8px;margin-top:-4px;border-right:2px solid var(--ss-gold);border-bottom:2px solid var(--ss-gold);transform:rotate(45deg);transition:transform .15s}
.ss-aw-more[aria-expanded="true"]:after{margin-top:4px;transform:rotate(-135deg)}
@media (prefers-reduced-motion:reduce){.ss-aw-fold__clip,.ss-aw-more:after{transition:none}}