/* SHP Core card/grid/media/date patterns, isolated and adapted for GR Components. */
.grcmp { --grcmp-gap: 2rem; --grcmp-radius: .8rem; --grcmp-accent: currentColor; }
.grcmp *, .grcmp *::before, .grcmp *::after { box-sizing: border-box; }
.grcmp [hidden] { display: none !important; }
.grcmp .grcmp-section + .grcmp-section { margin-top: 3rem; }
.grcmp .grcmp-wildcard { margin-bottom: 3rem; }
.grcmp .grcmp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--grcmp-gap); }
.grcmp .grcmp-section--hero .grcmp-grid { grid-template-columns: minmax(0, 1fr); }
.grcmp .grcmp-card { min-width: 0; }
.grcmp .grcmp-slide { margin: 0; }
.grcmp .grcmp-slide + .grcmp-slide { margin-top: 1rem; }
.grcmp .grcmp-slide[hidden] + .grcmp-slide { margin-top: 0; }
.grcmp .grcmp-media__frame { overflow: hidden; border-radius: var(--grcmp-radius); aspect-ratio: 4 / 3; background: rgba(0,0,0,.06); }
.grcmp .grcmp-media__image { display: block; width: 100%; height: 100%; object-fit: cover; }
.grcmp .grcmp-media__video { display: block; width: 100%; height: 100%; object-fit: contain; }
.grcmp .grcmp-credit { font-size: .75rem; line-height: 1.4; margin-top: .4rem; opacity: .8; }
.grcmp .grcmp-media__controls { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; margin: .5rem 0; }
.grcmp .grcmp-media__controls button { min-width: 44px; min-height: 44px; cursor: pointer; color: inherit; background: transparent; border: 1px solid currentColor; border-radius: 50%; }
.grcmp .grcmp-card__body { padding-top: 1rem; }
.grcmp .grcmp-card__title { margin: 0 0 .75rem; }
.grcmp .grcmp-card__text > :first-child { margin-top: 0; }
.grcmp .grcmp-card__text { overflow-wrap: anywhere; }
.grcmp .grcmp-more { display: inline-block; margin-top: .8rem; }
.grcmp .grcmp-date { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; padding: 1rem 0; border-bottom: 1px solid currentColor; }
.grcmp .grcmp-button { display: inline-flex; align-items: center; padding: .6rem 1rem; min-height: 44px; border: 1px solid currentColor; border-radius: .35rem; }
.grcmp .grcmp-editor-note { padding: .6rem; border: 1px dashed currentColor; font-size: .85rem; }
.grcmp a:focus-visible, .grcmp button:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
@media (max-width: 767px) { .grcmp .grcmp-grid, .grcmp .grcmp-section--hero .grcmp-grid { grid-template-columns: 1fr; } }

.grcmp .grcmp-dates--compact { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
@media (max-width: 767px) { .grcmp .grcmp-dates--compact { flex-direction: column; align-items: flex-start; } }