.tool-cards{--tc-ink:#1b2722;--tc-ink-secondary:#6a716e;--tc-heading:#211e1b;--tc-brand:#3a7e49;--tc-brand-dark:#254b36;--tc-chip:#eef4e6;--tc-white:#fff;container:tool-cards/inline-size;margin:28px 0;color:var(--tc-ink)}.tool-cards__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px 24px}@container tool-cards (min-width: 464px){.tool-cards:is([data-count="2"],[data-count="4"],[data-count="5"]) .tool-cards__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@container tool-cards (min-width: 708px){.tool-cards:is([data-count="3"],[data-count="5"]) .tool-cards__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@container tool-cards (min-width: 952px){.tool-cards[data-count="4"] .tool-cards__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@container tool-cards (min-width: 1196px){.tool-cards[data-count="5"] .tool-cards__grid{grid-template-columns:repeat(5,minmax(0,1fr))}}.tool-card{container:tool-card/inline-size;display:block;height:100%;border:1px solid color-mix(in srgb,var(--tc-brand) 18%,transparent);border-radius:14px;background:color-mix(in srgb,var(--tc-chip) 70%,var(--tc-white));color:inherit;text-decoration:none;box-shadow:0 1px 2px color-mix(in srgb,var(--tc-ink) 4%,transparent);transition:border-color .15s ease-out,box-shadow .15s ease-out}.tool-card:focus-visible{outline:2px solid var(--tc-brand);outline-offset:3px}.tool-card__inner{display:grid;grid-template-columns:120px minmax(0,1fr);grid-template-areas:"preview body" "preview action";align-items:start;gap:6px 14px;padding:10px 14px 12px 10px}.tool-card__preview{grid-area:preview;position:relative;overflow:hidden;aspect-ratio:16/10;border-radius:9px;background:var(--tc-chip);box-shadow:0 0 0 1px color-mix(in srgb,var(--tc-ink) 8%,transparent)}.tool-card__preview>img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.tool-card__badge{position:absolute;top:5px;right:5px;display:flex;padding:3px;border-radius:6px;background:var(--tc-white);box-shadow:0 1px 2px color-mix(in srgb,var(--tc-ink) 18%,transparent)}.tool-card__body{grid-area:body;display:flex;flex-direction:column;gap:2px;min-width:0}.tool-card__title{margin:0;color:var(--tc-heading);font-size:17px;font-weight:600;letter-spacing:normal;line-height:1.35}.tool-card__summary{color:var(--tc-ink-secondary);font-size:15px;line-height:1.45}.tool-card__action{grid-area:action;display:inline-flex;align-items:center;gap:7px;color:var(--tc-brand-dark);font-size:14px;font-weight:500;white-space:nowrap}@container tool-card (min-width: 560px){.tool-card__inner{grid-template-columns:168px minmax(0,1fr) auto;grid-template-areas:"preview body action";align-items:center;gap:0 18px;padding:10px 22px 10px 10px}.tool-card__action{font-size:15px}}@container tool-card (max-width: 280px){.tool-card__inner{grid-template-columns:minmax(0,1fr);grid-template-areas:"preview" "body" "action";gap:12px;padding:10px 10px 16px}.tool-card__action,.tool-card__body{padding-inline:6px}}@container tool-cards (min-width: 464px){@container tool-card (max-width: 339px){.tool-card__inner{grid-template-columns:minmax(0,1fr);grid-template-areas:"preview" "body" "action";gap:12px;padding:10px 10px 16px}.tool-card__action,.tool-card__body{padding-inline:6px}}}@media (hover:hover){.tool-card:hover{border-color:color-mix(in srgb,var(--tc-brand) 45%,transparent);box-shadow:0 6px 18px color-mix(in srgb,var(--tc-ink) 7%,transparent)}}.tool-card:is(:hover,:focus-visible) .studio-link-arrow__shaft{opacity:1;transform:scaleX(1)}.tool-card:is(:hover,:focus-visible) .studio-link-arrow__head{transform:translateX(2.5px)}@media (prefers-reduced-motion:reduce){.tool-card{transition:none}}