.meeting-gallery { padding: 2rem 1rem; color: #10384f; scroll-margin-top: 115px; }
.gallery-heading, .gallery-viewer-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.gallery-heading h2 { margin: 0 0 1rem; }
.gallery-heading img { flex: 0 0 72px; object-fit: contain; }
.gallery-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 1.5rem; }
.gallery-filters button { font: inherit; font-size: .95rem; cursor: pointer; border-radius: 999px; border: 1px solid #aacbdc; background: #fff; color: #0b4f7a; padding: .55rem 1rem; }
.gallery-filters button[aria-pressed="true"] { background: #0b4f7a; color: #fff; }
.meeting-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .75rem; }
.meeting-card { display: flex; flex-direction: column; text-align: left; width: 100%; min-width: 0; padding: 0; border: 1px solid #bed7e1; border-radius: 18px; overflow: hidden; background: #fff; color: #10384f; font: inherit; cursor: pointer; box-shadow: 0 8px 24px #0b4f7a0a; }
.meeting-picture { aspect-ratio: 1; width: 100%; flex: none; position: relative; background: #e5f3f8; overflow: hidden; }
.meeting-picture img { width: 100%; height: 100%; display: block; object-fit: contain; transition: transform .2s ease; }
.meeting-picture--portrait { aspect-ratio: 1; }
.meeting-picture--portrait img { object-fit: contain; }
.meeting-card:hover .meeting-picture--portrait img { transform: none; }
.meeting-card:hover { border-color: #24749a; }
.meeting-label { display: block; padding: .55rem .6rem; overflow-wrap: anywhere; }
.meeting-label strong { display: block; font-size: .85rem; line-height: 1.4; }
.meeting-label small { color: #5d7483; font-size: .75rem; }
.meeting-play { position: absolute; inset: auto .75rem .75rem auto; padding: .2rem .7rem; border-radius: 999px; color: white; background: #0b4f7a; font-size: .85rem; }
.gallery-viewer { box-sizing: border-box; width: min(960px, calc(100% - 24px)); max-height: calc(100dvh - 24px); border: 0; border-radius: 20px; padding: 1rem; background: #f7fbfd; color: #10384f; overflow-y: auto; }
.gallery-viewer::backdrop { background: #07293ee6; }
.gallery-viewer h2 { font: 600 1.15rem/1.4 "El Messiri", sans-serif; margin: 0; overflow-wrap: anywhere; }
.gallery-viewer p { margin: .7rem 0; min-height: 1.5rem; overflow-wrap: anywhere; }
.gallery-stage { display: grid; place-items: center; height: min(58dvh, 580px); background: #e8f2f7; margin-top: .75rem; border-radius: 8px; overflow: hidden; }
.gallery-stage img, .gallery-stage video { display: block; max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.gallery-tool { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid #bbd7e5; border-radius: 50%; background: #fff; color: #0b4f7a; font: 1.6rem/1 sans-serif; cursor: pointer; }
.gallery-tool:disabled { opacity: .4; cursor: default; }
.meeting-card:focus-visible, .gallery-tool:focus-visible, .gallery-filters button:focus-visible { outline: 3px solid #d8734a; outline-offset: 3px; }
body.gallery-open { overflow: hidden; }
[hidden] { display: none !important; }
@media(max-width: 900px) { .meeting-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media(max-width: 700px) { .meeting-grid { gap: .5rem; } .meeting-gallery { padding-inline: 0; scroll-margin-top: 170px; } .meeting-label { padding: .45rem; } .meeting-label strong { font-size: .8rem; } }
@media(prefers-reduced-motion: reduce) { .meeting-picture img { transition: none; } }