.related-products{background:#fff;color:var(--green);padding:72px var(--page-inset) 100px}.related-products>h2{font-size:clamp(32px,3.1vw,48px);font-weight:350;line-height:1.12;letter-spacing:-.035em;margin:0 0 38px;text-wrap:balance}.related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.related-card{display:block;min-width:0}.related-visual{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:1/1.05;background:#f3f7ef;overflow:hidden;padding:22px 12px}.related-drawing{display:block;width:100%;height:auto;transition:transform .5s var(--ease)}.related-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.035);transition:opacity .35s ease,transform .6s var(--ease);pointer-events:none}.related-arrow{position:absolute;right:14px;bottom:14px;width:34px;height:34px;display:grid;place-items:center;border:1px solid #042a2250;border-radius:50%;background:#f3f7ef;z-index:1;transition:background .2s}.related-card h3{font-size:clamp(18px,1.45vw,24px);font-weight:400;line-height:1.25;letter-spacing:-.02em;margin:16px 0 0}.related-card:focus-visible{outline:2px solid var(--mid-green);outline-offset:6px}.related-card:focus-visible .related-photo{opacity:1;transform:scale(1)}.related-card:focus-visible .related-arrow{background:var(--leaf)}
@media(hover:hover){.related-card:hover .related-photo{opacity:1;transform:scale(1)}.related-card:hover .related-drawing{transform:scale(1.035)}.related-card:hover .related-arrow{background:var(--leaf)}}
@media(max-width:900px){.related-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}}
@media(max-width:700px){.related-products{padding:52px var(--page-inset) 64px}.related-products>h2{font-size:32px;margin-bottom:28px;text-wrap:initial}.related-grid{gap:28px 14px}.related-visual{padding:12px 5px;aspect-ratio:1}.related-card h3{font-size:18px;margin-top:12px}.related-arrow{width:29px;height:29px;right:9px;bottom:9px}}
@media(prefers-reduced-motion:reduce){.related-drawing,.related-photo,.related-arrow{transition:none}}
