/* Home page video + patient gallery previews */
.hg-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 1.75rem;
}
@media (min-width: 640px) { .hg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .hg-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; } }

.hg-video,
.hg-patient {
    background: #fff;
    border: 1px solid rgba(4, 99, 250, 0.12);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
    transition: transform .25s ease, box-shadow .25s ease;
}
.hg-video:hover,
.hg-patient:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14); }

.hg-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #0b0f19; }
.hg-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.hg-video-title { font-size: 1.05rem; font-weight: 600; margin: 0; padding: 1rem 1.15rem 1.25rem; }

.hg-photo { position: relative; width: 100%; aspect-ratio: 4 / 3; background: #eef2f7; }
.hg-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hg-photo-empty { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 2.5rem; color: #9aa6b8; }
.hg-patient-body { padding: 1rem 1.15rem 1.35rem; }
.hg-patient-name { font-size: 1.1rem; font-weight: 700; margin: 0 0 .5rem; }
.hg-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .6rem; }
.hg-chip {
    display: inline-flex; align-items: center; gap: .35rem;
    font-size: .8rem; padding: .25rem .6rem; border-radius: 999px;
    background: rgba(4, 99, 250, .08); color: #0463fa;
}
.hg-disease { font-weight: 600; color: #0f172a; margin-bottom: .4rem; }
.hg-note { font-size: .92rem; color: #55617a; margin: 0; }

.hg-empty { text-align: center; color: #6b7280; margin: 0; }
.hg-more { text-align: center; margin-top: 2rem; }

/*** International Fellowship ***/
.intl-fellow { background: var(--bs-light); }
.intl-card {
    height: 100%;
    padding: 26px 18px;
    text-align: center;
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,.06);
    transition: transform .25s ease, box-shadow .25s ease;
}
.intl-card:hover { transform: translateY(-6px); box-shadow: 0 16px 38px rgba(0,0,0,.12); }
.intl-flag {
    width: 68px;
    height: 44px;
    object-fit: cover;
    border-radius: 6px;
    box-shadow: 0 3px 10px rgba(0,0,0,.18);
    margin-bottom: 14px;
}
.intl-country { margin-bottom: 6px; font-size: 1.05rem; }
.intl-place { margin: 0; font-size: .9rem; color: #6c757d; }