/* Gecko Bayern – member cards / Variante 1 */
.geckos-page .member-card{display:block;padding:14px;overflow:hidden}
.geckos-page .member-card .collection-thumb{width:100%;aspect-ratio:16/9;padding:0;margin:0 0 14px;border-radius:10px;background:#071219}
.geckos-page .member-card .collection-thumb img{width:100%;height:100%;display:block;object-fit:contain}
.geckos-page .member-card .collection-thumb{position:relative}
.gallery-trigger{position:absolute;right:10px;bottom:10px;display:flex;align-items:center;gap:5px;padding:7px 10px;border:1px solid rgba(255,255,255,.5);border-radius:9px;background:rgba(5,18,25,.82);color:#fff;font-size:.8rem;cursor:pointer}
.gallery-trigger:focus-visible,.gallery-arrow:focus-visible,.gallery-close:focus-visible{outline:2px solid #9bd3f4;outline-offset:2px}
.vehicle-gallery-dialog{position:fixed;inset:0;max-width:min(96vw,1200px);max-height:94vh;width:100%;padding:38px 12px 16px;border:1px solid rgba(255,255,255,.2);border-radius:14px;background:#0b171d;color:#fff}
.vehicle-gallery-dialog::backdrop{background:rgba(0,0,0,.88)}
.gallery-close{position:absolute;top:4px;right:12px;border:0;background:transparent;color:#fff;font-size:2rem;cursor:pointer}
.gallery-frame{display:flex;align-items:center;justify-content:center;gap:8px}
.gallery-frame img{min-width:0;max-width:calc(100% - 76px);max-height:75vh;object-fit:contain}
.gallery-arrow{flex:0 0 30px;border:0;background:transparent;color:#fff;font-size:2.5rem;cursor:pointer}
.gallery-caption{text-align:center;margin:12px 0 0;font-size:.9rem;color:#c5d1d7}
.geckos-page .member-card .collection-content{width:100%}
.geckos-page .member-card .collection-content h3{display:flex;align-items:center;gap:9px;margin:0 0 9px;font-size:1.28rem;line-height:1.2}
.geckos-page .member-card .collection-content h3 .pill{flex:0 0 auto}
.geckos-page .member-card .member-identity{margin:7px 0 11px}
.geckos-page .member-card .collection-content p{max-width:760px;margin:8px 0 0;color:#acb8bd;line-height:1.5}
.geckos-page .member-card .distance-badge{margin-top:9px;font-size:.76rem}
.geckos-page .member-card .collection-actions{display:flex;align-items:center;justify-content:flex-start;gap:28px;margin-top:10px;padding:0}
.geckos-page .member-card .collection-actions .btn{position:relative;min-height:0;padding:5px 0 4px;border:0;border-bottom:1px solid rgba(120,191,232,.32);border-radius:0;background:transparent;color:#c4ced2;font-size:.76rem;font-weight:500;letter-spacing:.015em;box-shadow:none;transition:color .18s ease,border-color .18s ease}
.geckos-page .member-card .collection-actions .btn:hover,.geckos-page .member-card .collection-actions .btn:focus-visible{color:var(--blue2);border-bottom-color:rgba(157,216,246,.72);background:transparent}
.geckos-page .member-owner-list{display:grid;gap:10px;margin-top:7px}
.geckos-page .member-owner{padding-top:10px;border-top:1px solid rgba(255,255,255,.07)}
.geckos-page .member-owner:first-child{padding-top:0;border-top:0}
.geckos-page .member-owner .member-identity{margin:0 0 7px}
.geckos-page .member-owner-comment{margin:4px 0 0!important}
.geckos-page .member-owner-links{display:flex;flex-wrap:wrap;gap:22px;margin-top:7px}
.geckos-page .member-owner-links a{padding:3px 0;border-bottom:1px solid rgba(120,191,232,.32);color:#c4ced2;font-size:.72rem;text-decoration:none}
.geckos-page .member-owner-links a:hover,.geckos-page .member-owner-links a:focus-visible{color:var(--blue2);border-bottom-color:rgba(157,216,246,.72)}
.geckos-page .member-map-link{margin-left:4px;color:#83959e;font-size:.9em;font-weight:500;text-decoration:none;white-space:nowrap;transition:color .18s ease}
.geckos-page .member-map-link:hover,.geckos-page .member-map-link:focus-visible{color:var(--blue2)}

/* Guest hint directly below the hero copy. */
.geckos-page .gecko-login-hint{max-width:760px;margin:10px 0 0;color:#bcc8cd;font-size:.84rem;line-height:1.5}
.geckos-page .gecko-login-hint a{color:var(--blue2);font-weight:650;border-bottom:1px solid rgba(157,216,246,.35)}

/* Gecko filters deliberately use the same visual system as Events/Locations/Roads,
   but only search + distance are needed here. */
.geckos-page .gecko-filter-bar{grid-template-columns:minmax(220px,1.15fr) minmax(340px,1fr)}

/* Driver photo: tap/click once to enlarge, again to shrink. */
.geckos-page .member-avatar[data-expandable]{cursor:zoom-in;transition:width .2s ease,height .2s ease,flex-basis .2s ease,border-radius .2s ease,box-shadow .2s ease;outline:none}
.geckos-page .member-avatar[data-expandable]:focus-visible{box-shadow:0 0 0 3px rgba(157,216,246,.28)}
.geckos-page .member-avatar[data-expandable].is-expanded{width:138px;height:138px;flex-basis:138px;border-radius:16px;cursor:zoom-out;box-shadow:0 12px 32px rgba(0,0,0,.38)}
.geckos-page .member-avatar[data-expandable].is-expanded img{object-fit:cover}

/* Desktop: compact two-column overview instead of oversized full-width cards. */
@media(min-width:900px){
  .geckos-page [data-members]{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
    align-items:start;
  }
  .geckos-page .member-card{padding:12px}
  .geckos-page .member-card .collection-thumb{margin-bottom:12px}
  .geckos-page .member-card .collection-content h3{font-size:1.08rem;margin-bottom:8px}
  .geckos-page .member-card .member-avatar{width:40px;height:40px;flex-basis:40px}
  .geckos-page .member-card .member-avatar[data-expandable].is-expanded{width:148px;height:148px;flex-basis:148px}
  .geckos-page .member-card .member-name{font-size:.86rem}
  .geckos-page .member-card .member-city{font-size:.73rem}
  .geckos-page .member-card .collection-content p{font-size:.82rem;line-height:1.45}
}

/* Phone/tablet: horizontal card rail with snap-to-card swiping. */
@media(max-width:899px){
  .geckos-page [data-members]{
    display:flex;
    gap:12px;
    overflow-x:auto;
    overflow-y:visible;
    scroll-snap-type:x mandatory;
    scroll-padding-left:20px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:2px 20px 10px;
    margin-left:-20px;
    margin-right:-20px;
  }
  .geckos-page [data-members]::-webkit-scrollbar{display:none}
  .geckos-page .member-card{flex:0 0 min(82vw,420px);scroll-snap-align:start;scroll-snap-stop:always}
}

@media(max-width:620px){
  .geckos-page .gecko-filter-bar{grid-template-columns:minmax(105px,.85fr) minmax(180px,1.15fr)}
  .geckos-page .gecko-filter-bar .explore-filter-block{min-width:0}
  .geckos-page .gecko-filter-bar .explore-radius-options{gap:3px}
  .geckos-page .gecko-filter-bar .explore-radius-options button{padding-left:2px;padding-right:2px}
}

@media(max-width:650px){
  .geckos-page .gecko-login-hint{margin-top:8px;font-size:.79rem}

  .geckos-page .member-card{padding:11px}
  .geckos-page .member-card .collection-thumb{width:100%;aspect-ratio:16/9;margin-bottom:12px;border-radius:9px}
  .geckos-page .member-card .collection-thumb img{object-fit:cover}
  .geckos-page .member-card .collection-content h3{margin-bottom:8px;font-size:1.12rem}
  .geckos-page .member-card .member-identity{gap:10px;margin:7px 0 10px;align-items:flex-start}
  .geckos-page .member-card .member-avatar{width:42px;height:42px;flex-basis:42px}
  .geckos-page .member-card .member-avatar[data-expandable].is-expanded{width:126px;height:126px;flex-basis:126px}
  .geckos-page .member-card .member-name{font-size:.88rem}
  .geckos-page .member-card .member-city{font-size:.75rem}
  .geckos-page .member-card .collection-content p{margin-top:7px;font-size:.82rem;line-height:1.48}
  .geckos-page .member-card .distance-badge{margin-top:8px;font-size:.72rem}
  .geckos-page .member-card .collection-actions{gap:24px;margin-top:9px}
  .geckos-page .member-card .collection-actions .btn{padding:4px 0 3px;font-size:.72rem}
  .geckos-page .member-owner-list{gap:9px}
  .geckos-page .member-owner{padding-top:9px}
  .geckos-page .member-owner-links{gap:18px}
}