/* SWD Products — staggered heading and a grid of product cards with letter tiles. */
.swd.swd-products { padding: clamp(90px, 12vw, 190px) 0 0; }
.swd-products .products__h { font-size: clamp(38px, 5.4vw, 78px); max-width: 13em; margin: 0 auto; }
.swd-products .stagger span { display: block; }
.swd-products .stagger--wide span:nth-child(2) { padding-left: 1.6em; }
.swd-products .stagger--wide span:nth-child(3) { padding-left: .7em; }
.swd-products .prod { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(50px, 7vw, 100px); }
.swd-products .pc { position: relative; display: grid; grid-template-columns: 52px 1fr; align-content: start; gap: 6px 18px; padding: 30px; border-radius: 28px; background: var(--card); box-shadow: inset 0 0 0 1px var(--edge); color: #fff; text-decoration: none; transition: background .2s; }
.swd-products a.pc:hover { background: var(--card-2); color: #fff; }
.swd-products .pc i { grid-row: span 2; width: 52px; height: 52px; border-radius: 12px; background: var(--c); color: var(--ink); font-style: normal; font-size: 20px; font-weight: 600; display: grid; place-items: center; }
.swd-products .pc b { font-size: 21px; font-weight: 500; letter-spacing: -.03em; line-height: 1.3; padding-right: 24px; }
.swd-products .pc span { font-size: 15px; line-height: 1.5; color: var(--muted); }
.swd-products .pc svg { position: absolute; right: 26px; top: 32px; width: 16px; height: 16px; transition: transform .2s; }
.swd-products .pc:hover svg { transform: translate(3px, -3px); }

@media (max-width: 1180px) {
	.swd-products .prod { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.swd-products .prod { grid-template-columns: minmax(0, 1fr); }
}