/* Grid columns and breakpoints come exclusively from layout/grid.css. */
.orly-cards { background: var(--orly-cards-background, transparent); padding-block: var(--section-space-40); }
.orly-cards--mb-20 { margin-block-end: var(--section-space-20); }
.orly-cards__header { display: flex; flex-direction: column; gap: var(--space-20); overflow-wrap: anywhere; }
.orly-cards__header + .orly-cards__grid { margin-block-start: var(--space-40); }
.orly-cards--align-center .orly-cards__header { text-align: center; }
.orly-cards--align-right .orly-cards__header { text-align: right; }
.orly-cards__header > * { margin: 0; }
.orly-cards .orly-cards__title { font-size: var(--orly-title-size, var(--font-size-h2)); line-height: var(--orly-title-line-height, 1.2); color: var(--orly-cards-title, var(--color-text-primary)); }
.orly-cards .orly-cards__text { font-size: var(--orly-text-size, var(--font-size-body)); color: var(--orly-cards-text, var(--color-text-primary)); }
.orly-cards .orly-cards__eyebrow { font-size: var(--orly-eyebrow-size, 0.875rem); font-weight: var(--font-weight-semibold); color: var(--orly-cards-eyebrow, var(--color-text-primary)); }
.orly-cards__grid { gap: var(--space-40); align-items: stretch; }
.orly-card { display: flex; flex-direction: column; min-width: 0; background: var(--orly-card-background, var(--color-surface)); color: var(--orly-card-text, var(--color-text-primary)); border: 1px solid var(--orly-card-border, var(--color-border)); border-radius: var(--orly-card-radius, var(--radius-medium)); box-shadow: var(--orly-card-shadow, none); overflow-wrap: anywhere; }
.orly-card__media { aspect-ratio: 16 / 9; border-start-start-radius: inherit; border-start-end-radius: inherit; overflow: hidden; }
.orly-card .orly-card__image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--orly-card-focal, 50% 50%); }
.orly-card__body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: var(--space-20); min-width: 0; padding: var(--space-25); }
.orly-card__body > * { margin: 0; max-width: 100%; }
.orly-card .orly-card__title { font-size: var(--font-size-h3); color: inherit; }
.orly-card .orly-card__text { font-size: var(--font-size-body); color: inherit; }
.orly-card .orly-card__eyebrow { font-size: 0.875rem; font-weight: var(--font-weight-semibold); color: inherit; }
.orly-card .orly-card__cta { margin-block-start: auto; }
.orly-card__cta .orly-button { max-width: 100%; white-space: normal; }