/* Oud-Beijerland.org V0.3.6.3.7 - global mobile listing refinement */
@media (max-width: 680px) {
  /* Mobile listing chooser directly below the global site header. */
  .listing-mobile-sections-v03637 {
    display:flex;
    gap:9px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:12px 14px 8px;
    margin:0 auto;
    max-width:100%;
    background:#f7f4ec;
    scroll-snap-type:x proximity;
  }
  .listing-mobile-sections-v03637::-webkit-scrollbar{display:none}
  .listing-mobile-sections-v03637 a {
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 17px;
    border:1px solid #d9e2da;
    border-radius:999px;
    background:#fff;
    color:#113d2f;
    text-decoration:none;
    font-weight:850;
    font-size:14px;
    white-space:nowrap;
    scroll-snap-align:start;
  }
  .listing-mobile-sections-v03637 a.active {
    border-color:#174c35;
    background:#174c35;
    color:#fff;
  }

  /* Keep long listing titles inside the mobile hero. */
  .content-hero.listing-hero-v0363,
  .agenda-hero.listing-hero-v0363 {
    min-height:318px !important;
    padding:28px 20px 30px !important;
    overflow:hidden !important;
  }
  .listing-hero-copy-v0363 {
    max-width:67% !important;
    padding-top:6px !important;
    position:relative;
    z-index:5;
  }
  .listing-hero-v0363 h1 {
    max-width:100%;
    margin-bottom:14px !important;
    font-size:clamp(32px,8.8vw,42px) !important;
    line-height:.98 !important;
    overflow-wrap:anywhere;
    hyphens:auto;
  }
  .listing-hero-sights-v0363 h1 {font-size:clamp(30px,8.2vw,38px) !important;letter-spacing:-.05em !important}
  .listing-hero-routes-v0363 h1 {font-size:clamp(32px,8.7vw,40px) !important}
  .listing-hero-v0363 p.listing-hero-intro-v0363 {font-size:14px !important;line-height:1.48 !important}

  /* Shared bottom-right art viewport. Per-category rules below refine the crop. */
  .listing-hero-v0363 .listing-hero-art-v0363 {
    position:absolute !important;
    top:auto !important;
    bottom:0 !important;
    right:-24px !important;
    width:57% !important;
    height:100% !important;
    overflow:hidden !important;
    display:flex !important;
    align-items:flex-end !important;
    justify-content:flex-end !important;
    pointer-events:none;
    z-index:3;
  }
  .listing-hero-v0363 .listing-hero-art-v0363 img {
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    filter:drop-shadow(-12px 12px 16px rgba(0,0,0,.21));
  }

  /* Routes: cycling mascot, strong upper-body crop and bottom alignment. */
  .listing-hero-routes-v0363 .listing-hero-art-v0363 {right:-31px !important;width:60% !important}
  .listing-hero-routes-v0363 .listing-hero-art-v0363 img {
    object-position:57% 15% !important;
    transform:scale(1.92) translateY(8%) !important;
    transform-origin:62% 18% !important;
  }

  /* Sights: telescope mascot, head/torso prominent instead of full figure. */
  .listing-hero-sights-v0363 .listing-hero-art-v0363 {right:-25px !important;width:59% !important}
  .listing-hero-sights-v0363 .listing-hero-art-v0363 img {
    object-position:53% 12% !important;
    transform:scale(1.82) translateY(8%) !important;
    transform-origin:58% 16% !important;
  }

  /* Restaurants: table/eating mascot; crop around face, food and upper torso. */
  .listing-hero-restaurants-v0363 .listing-hero-art-v0363 {right:-28px !important;width:60% !important}
  .listing-hero-restaurants-v0363 .listing-hero-art-v0363 img {
    object-position:57% 14% !important;
    transform:scale(1.72) translateY(8%) !important;
    transform-origin:60% 18% !important;
  }

  /* News: horn mascot, keep face + horn in view. */
  .listing-hero-news-v0363 .listing-hero-art-v0363 {right:-30px !important;width:61% !important}
  .listing-hero-news-v0363 .listing-hero-art-v0363 img {
    object-position:49% 12% !important;
    transform:scale(1.76) translateY(8%) !important;
    transform-origin:56% 16% !important;
  }

  /* Events: current event mascot; same visual family. */
  .listing-hero-events-v0363 .listing-hero-art-v0363 {right:-27px !important;width:58% !important}
  .listing-hero-events-v0363 .listing-hero-art-v0363 img {
    object-position:53% 10% !important;
    transform:scale(1.75) translateY(8%) !important;
    transform-origin:58% 16% !important;
  }

  /* Existing in-page subcategories become a single swipeable row. */
  .content-switch,
  .agenda-page .view-tabs {
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:9px !important;
    overflow-x:auto !important;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    scroll-snap-type:x proximity;
    padding:2px 2px 10px !important;
    margin-top:18px !important;
  }
  .content-switch::-webkit-scrollbar,
  .agenda-page .view-tabs::-webkit-scrollbar{display:none}
  .content-switch a,
  .agenda-page .view-tabs a {
    flex:0 0 auto !important;
    white-space:nowrap !important;
    min-height:46px;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    scroll-snap-align:start;
  }
}

@media (min-width: 681px) {
  .listing-mobile-sections-v03637 {display:none !important}
}