/* GetFocus · Events (hub /events + Events template) · page stylesheet v1.0.3
   Loaded AFTER gf-webinar-1.0.2.css, which carries the shared gf-pod-* / gf-web-* head rules.
   Class layer lives in Webflow Styles (gf-evt-*). This file holds only what a class cannot:
   fonts, hovers, runtime states, script-rendered blocks, placeholders and breakpoints.
   Source: handoff/events/webflow/gf-event.css */
[class*="gf-evt-"] { font-family: var(--_getfocus---display); box-sizing: border-box; }
.gf-evt-badge, .gf-evt-tile-m, .gf-evt-tile-d, .gf-evt-card-cta, .gf-evt-spk-role, .gf-evt-res-label,
.gf-evt-pill, .gf-evt-ag-time, .gf-evt-init, .gf-evt-book-item { font-family: var(--_getfocus---mono); }
.gf-evt-book-item { font-size: 13px; letter-spacing: .04em; }
.gf-evt-card-title, .gf-evt-h2 { text-wrap: balance; }

/* hovers */
.gf-evt-card:hover { transform: translateY(-4px); }
.gf-evt-card:hover .gf-evt-card-title { color: #4756FF; }
.gf-evt-book-btn:hover { background-color: #4756FF; color: #FFFFFF; }
.gf-pod-featured[data-evt-feat]:hover .gf-web-feat-cal { border-color: #FFFFFF; }

/* upcoming badge + no-photo placeholder (GetFocus mark on the tint) */
.gf-evt-badge.is-up { background-color: #5DECFF; border-color: #5DECFF; color: #101920; }
.gf-evt-card-media.is-noimg, [data-evt-feat] .gf-pod-featured-media.is-noimg, .gf-evt-tile-photo.is-noimg {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%234756FF'%3E%3Crect x='9' y='0' width='6' height='6' rx='1'/%3E%3Crect x='0' y='9' width='6' height='6' rx='1'/%3E%3Crect x='18' y='9' width='6' height='6' rx='1'/%3E%3Crect x='9' y='18' width='6' height='6' rx='1'/%3E%3C/g%3E%3Crect x='9' y='9' width='6' height='6' rx='1' fill='%238993FF'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 56px; }
[data-evt-feat] .gf-pod-featured-media.is-noimg { background-size: 120px; }
.gf-evt-card-media.is-past { background-color: #ECECEC; }
[data-evt-feat] .gf-pod-featured-media { position: relative; }

/* hub filter pills (built by script) */
.gf-evt-filter { padding: 8px 16px; border-radius: 999px; border: 1px solid #D2D2D2; background: #FFFFFF; color: #64696D;
  font-family: var(--_getfocus---display); font-size: 14px; line-height: 1.4; cursor: pointer; transition: border-color 180ms, color 180ms, background-color 180ms; }
.gf-evt-filter:hover { border-color: #101920; color: #101920; }
.gf-evt-filter.is-active { background-color: #101920; border-color: #101920; color: #FFFFFF; }
.gf-evt-empty { grid-column: 1 / -1; padding: 40px 0; font-size: 16px; color: #64696D; }

/* template state (body class set by gf-event.js from the Status field) */
.gf-evt-is-past .gf-evt-recap { display: flex; }
.gf-pod-ehero[data-evt-root] .gf-web-hero-grid, .gf-pod-ehero[data-evt-root] .gf-evt-recap { text-align: left; }

/* who's there (dark rows, same as webinar speakers) */
.gf-evt-init { flex: none; width: 56px; height: 56px; border-radius: 999px; background-color: #E8EAFF; color: #4756FF; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.gf-evt-spk .gf-evt-init { width: 64px; height: 64px; border-radius: 12px; }

/* recap mosaic: first tile spans both rows; the script sets data-n to the photo count */
.gf-evt-tile-photo:first-child { grid-row: span 2; border-radius: 24px; }
.gf-evt-mosaic[data-n="1"] { grid-template-columns: 1fr; grid-template-rows: 1fr; }
.gf-evt-mosaic[data-n="1"] .gf-evt-tile-photo:first-child { grid-row: auto; }
.gf-evt-mosaic[data-n="2"] { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr; }
.gf-evt-mosaic[data-n="2"] .gf-evt-tile-photo:first-child { grid-row: auto; }
.gf-evt-mosaic[data-n="3"] { grid-template-columns: 2fr 1fr; }
.gf-evt-mosaic[data-n="4"] .gf-evt-tile-photo:nth-child(4) { grid-column: span 2; }

/* talk recording in the mosaic slot (script-built when there are no photos) */
.gf-evt-video { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 24px; overflow: hidden; background-color: #283036; }
.gf-evt-video-img, .gf-evt-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.gf-evt-video-play { position: absolute; left: 50%; top: 50%; width: 88px; height: 88px; margin: -44px 0 0 -44px; border: 0; border-radius: 999px; background-color: #5DECFF; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background-color 180ms; }
.gf-evt-video-play::before { content: ""; border-style: solid; border-color: transparent transparent transparent #101920; border-width: 14px 0 14px 23px; margin-left: 6px; }
.gf-evt-video-play:hover { background-color: #FFFFFF; }
.gf-evt-video-play:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 3px; }
@media screen and (max-width: 767px) { .gf-evt-video { border-radius: 16px; } .gf-evt-video-play { width: 64px; height: 64px; margin: -32px 0 0 -32px; } .gf-evt-video-play::before { border-width: 11px 0 11px 18px; } }

/* recap numbers + resources (rendered from the CMS text fields) */
.gf-evt-num { display: flex; flex-direction: column; gap: 6px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.15); }
.gf-evt-num-v { font-family: var(--_getfocus---display); font-size: 44px; line-height: 1; letter-spacing: -.03em; color: #FFFFFF; }
.gf-evt-num-l { font-size: 14px; line-height: 1.4; color: rgba(255,255,255,.6); }
.gf-evt-pill { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3);
  color: #FFFFFF; font-size: 12px; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; transition: background-color 180ms, border-color 180ms; }
.gf-evt-pill:hover { background-color: rgba(255,255,255,.1); border-color: rgba(255,255,255,.6); color: #FFFFFF; }
.gf-evt-pill svg { flex: none; }

/* agenda (sidebar) */
.gf-evt-ag { display: flex; gap: 14px; align-items: baseline; padding: 16px 20px; border-bottom: 1px solid #ECECEC; }
.gf-evt-ag:last-child { border-bottom: 0; }
.gf-evt-ag.is-link { text-decoration: none; transition: background-color 180ms; }
.gf-evt-ag.is-link:hover { background-color: #F5F5F5; }
.gf-evt-ag.is-link:hover .gf-evt-ag-title { color: #4756FF; }
.gf-evt-ag-time { flex: none; width: 64px; font-size: 12px; line-height: 1.45; color: #4756FF; }
.gf-evt-ag-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gf-evt-ag-title { font-size: 15px; line-height: 1.45; color: #363D43; }
.gf-evt-ag-where { font-size: 13px; line-height: 1.4; color: #ADAEB0; }

/* Collection List wrappers must not break the grids */
.gf-evt-grid .w-dyn-list, .gf-evt-grid .w-dyn-items, .gf-evt-spk-grid .w-dyn-list, .gf-evt-spk-grid .w-dyn-items { display: contents; }
.gf-evt-grid .w-dyn-empty, .gf-evt-spk-grid .w-dyn-empty { display: none; }
.gf-evt-grid .w-dyn-item, .gf-evt-spk-grid .w-dyn-item { display: flex; flex-direction: column; }
.gf-evt-grid .w-dyn-item > .gf-evt-card { flex: 1 1 auto; }
.gf-evt-spk-grid .w-dyn-item:only-child { grid-column: 1 / -1; }
[data-evt-news-form] form, .gf-pod-news [data-evt-news-form] { width: 100%; margin: 0; }

/* gallery + lightbox (script-built) */
.gf-evt-gal { padding: 0 0 128px; background-color: #FFFFFF; }
.gf-evt-gal-inner { max-width: 1440px; margin: 0 auto; padding: 0 48px; display: flex; flex-direction: column; gap: 32px; }
.gf-evt-gal-head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; }
.gf-evt-gal-count { font-family: var(--_getfocus---mono); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: #64696D; }
.gf-evt-gal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 260px; gap: 16px; }
.gf-evt-gal-item { position: relative; padding: 0; border: 0; border-radius: 16px; overflow: hidden; background-color: #ECECEC; cursor: zoom-in; }
.gf-evt-gal-item:first-child { grid-column: span 2; grid-row: span 2; border-radius: 24px; }
.gf-evt-gal-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 600ms cubic-bezier(0.16,1,0.3,1); }
.gf-evt-gal-item:hover img { transform: scale(1.03); }
.gf-evt-gal-item:focus-visible { outline: 2px solid #4756FF; outline-offset: 3px; }
.gf-evt-lb { position: fixed; inset: 0; z-index: 10000; background: rgba(16,25,32,.94); display: flex; align-items: center; justify-content: center; padding: 56px 72px; }
.gf-evt-lb-fig { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; gap: 14px; }
.gf-evt-lb-fig img { max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; border-radius: 12px; }
.gf-evt-lb-fig figcaption { display: flex; justify-content: space-between; gap: 24px; font-family: var(--_getfocus---display); font-size: 15px; color: rgba(255,255,255,.8); }
.gf-evt-lb-n { font-family: var(--_getfocus---mono); font-size: 13px; letter-spacing: .06em; color: rgba(255,255,255,.5); }
.gf-evt-lb-x, .gf-evt-lb-prev, .gf-evt-lb-next { position: absolute; border: 0; background: rgba(255,255,255,.1); color: #FFFFFF; border-radius: 999px; width: 48px; height: 48px; cursor: pointer; font-size: 28px; line-height: 1; transition: background-color 180ms; }
.gf-evt-lb-x:hover, .gf-evt-lb-prev:hover, .gf-evt-lb-next:hover { background: rgba(255,255,255,.22); }
.gf-evt-lb-x { top: 20px; right: 20px; }
.gf-evt-lb-prev { left: 16px; top: 50%; margin-top: -24px; }
.gf-evt-lb-next { right: 16px; top: 50%; margin-top: -24px; }
.gf-evt-lb-prev::before, .gf-evt-lb-next::before { content: ""; display: inline-block; width: 10px; height: 10px; border-left: 2px solid #FFF; border-bottom: 2px solid #FFF; transform: rotate(45deg); margin-left: 4px; }
.gf-evt-lb-next::before { transform: rotate(-135deg); margin-left: -4px; }

/* breakpoints */
@media screen and (max-width: 991px) {
  .gf-evt-list { padding-top: 152px; padding-bottom: 96px; }
  .gf-evt-grid { grid-template-columns: 1fr 1fr; }
}
@media screen and (max-width: 767px) {
  .gf-evt-list { padding-bottom: 84px; }
  .gf-evt-list-inner { padding-left: 24px; padding-right: 24px; gap: 32px; }
  .gf-evt-grid, .gf-evt-spk-grid, .gf-evt-nums { grid-template-columns: 1fr; }
  .gf-evt-mosaic, .gf-evt-mosaic[data-n] { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 150px; aspect-ratio: auto; }
  .gf-evt-mosaic .gf-evt-tile-photo:first-child { grid-column: span 2; grid-row: span 2; }
  .gf-evt-mosaic[data-n="1"] .gf-evt-tile-photo:first-child { grid-row: span 2; }
  .gf-evt-num-v { font-size: 36px; }
  .gf-evt-gal { padding-bottom: 84px; }
  .gf-evt-gal-inner { padding: 0 24px; gap: 24px; }
  .gf-evt-gal-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 150px; gap: 10px; }
  .gf-evt-gal-item { grid-column: auto !important; }
  .gf-evt-gal-item:first-child { grid-column: span 2 !important; }
  .gf-evt-lb { padding: 56px 12px; }
  .gf-evt-lb-prev, .gf-evt-lb-next { top: auto; bottom: 16px; margin-top: 0; }
}
@media screen and (max-width: 479px) {
  .gf-evt-list-head { align-items: flex-start; }
}
