/**
 * RDPW — front-page-specific styles (loads after rdpw.css).
 *
 * About Us two-column (team left / about text right) on MOBILE: stacked
 * full personnel cards + double-padded nested text boxes are far too heavy
 * on phones. Team collapses to compact avatar rows; the about text drops
 * the nested 27px+27px text-box padding (the "indent") and the justified
 * alignment that stretches words at narrow widths.
 */

@media (max-width: 767px) {
  /* About text: full width, left-aligned */
  body.home .gdlr-core-pbf-wrapper:has(.gdlr-core-personnel-item) .gdlr-core-text-box-item {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.home .gdlr-core-pbf-wrapper:has(.gdlr-core-personnel-item) .gdlr-core-text-box-item p {
    text-align: left !important;
  }

  /* Team: compact rows — 56px circular avatar, name + role beside it */
  body.home .gdlr-core-personnel-item .gdlr-core-item-list {
    margin-bottom: 12px !important;
    padding: 0 !important;
    width: 100% !important;
    float: none !important;
  }

  body.home .gdlr-core-personnel-item .gdlr-core-personnel-list {
    display: flex !important;
    align-items: center !important;
    gap: 14px;
    background: #fff;
    border-radius: 10px;
    padding: 10px 12px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  }

  body.home .gdlr-core-personnel-item .gdlr-core-personnel-list-image {
    flex: none !important;
    width: 56px !important;
    height: 56px !important;
    max-width: 56px !important;
    padding: 0 !important; /* kills the aspect-ratio padding-top hack */
    border-radius: 50% !important;
    overflow: hidden !important;
    margin: 0 !important;
    float: none !important;
  }

  body.home .gdlr-core-personnel-item .gdlr-core-personnel-list-image a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
  }

  body.home .gdlr-core-personnel-item .gdlr-core-personnel-list-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    position: static !important;
  }

  body.home .gdlr-core-personnel-item .gdlr-core-personnel-list-content-wrap {
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }

  body.home .gdlr-core-personnel-item .gdlr-core-personnel-list-title {
    font-size: 15px !important;
    margin: 0 0 2px !important;
    letter-spacing: 0.04em !important;
  }

  body.home .gdlr-core-personnel-item .gdlr-core-personnel-list-position {
    font-size: 12.5px !important;
    margin: 0 !important;
  }
}

/* ==========================================================================
   Desktop alignment: one shared left/right content edge (the 51px heading
   line). The homepage had five different left edges — base container 24px,
   standard headings at 24+27, sections wrapped in an extra container-inner
   at +27 more (headings at 78), tile bands pulled to 41 by negative rvpdlr
   margins, and the carousel + Featured Images gallery at the raw 24 edge.
   ========================================================================== */

@media (min-width: 768px) {
  /* Double-indented sections (Workshop Type band, Team/About): drop the
     extra inner-wrapper margin so their headings land on the 51px line. */
  body.home .gdlr-core-pbf-wrapper-container-inner {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Tile bands: negative gutters pulled tiles 10px past the heading line. */
  body.home [id="DestinationListing"] .gdlr-core-item-rvpdlr {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Upcoming Workshops carousel: inset the band to the heading line (the
     viewport's -20px margin is cancelled by its 20px padding, so card
     edges land exactly on 51px). */
  body.home .rdpw-carousel-holder,
  body.home .tourmaster-tour-item.tourmaster-item-pdlr {
    padding-left: 27px !important;
    padding-right: 27px !important;
  }

  /* Featured Images: 17px (not 27) — the masonry's own 10px gutters make up
     the difference, putting outer image edges on the 51px line. */
  body.home .gdlr-core-gallery-item {
    padding-left: 17px !important;
    padding-right: 17px !important;
  }
}

/* About column: the text lives in a text-box NESTED inside another text-box,
   so it carried a second 27px indent the heading doesn't have. */
@media (min-width: 768px) {
  body.home .gdlr-core-pbf-wrapper:has(.gdlr-core-personnel-item) .gdlr-core-text-box-item .gdlr-core-text-box-item {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* ==========================================================================
   Featured Images — mobile swipeable strip.
   Desktop keeps the masonry (mixed aspect ratios break the theme's carousel
   there). On phones the 27-image absolute-positioned masonry stacked into
   ~7,300px of scroll; instead: one horizontal photo strip, fixed 230px
   height with natural widths (mixed ratios coexist), scroll-snap, and a
   width cap so a sliver of the next image always shows.
   ========================================================================== */

@media (max-width: 767px) {
  body.home .gdlr-core-gallery-item .gdlr-core-gallery-item-holder {
    display: flex !important;
    height: auto !important; /* beats the masonry's inline height */
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    gap: 10px;
    padding-bottom: 6px;
  }

  body.home .gdlr-core-gallery-item .gdlr-core-item-list {
    position: static !important; /* releases the masonry's inline top/left */
    flex: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    scroll-snap-align: start;
  }

  body.home .gdlr-core-gallery-item .gdlr-core-media-image {
    margin: 0 !important;
  }

  body.home .gdlr-core-gallery-item .gdlr-core-item-list img {
    height: 230px !important;
    width: auto !important;
    max-width: 80vw !important; /* guarantees the next-image peek */
    object-fit: cover;
    display: block;
    border-radius: 6px;
  }

  /* No lightbox on the mobile strip — images are already near full width,
     and the library's touch handling fights the horizontal swipe. Touches
     fall through to the scroll container. */
  body.home .gdlr-core-gallery-item .gdlr-core-item-list a {
    pointer-events: none;
  }
}

/* Featured Images (desktop masonry): title overlays in sentence case (the
   source titles are stored properly-cased; uppercase was pure CSS), and a
   20px vertical gutter to match the existing 20px horizontal one. */
body.home .gdlr-core-gallery-item .gdlr-core-image-overlay-title {
  text-transform: none !important;
  letter-spacing: 0.03em !important;
}

body.home .gdlr-core-gallery-item .gdlr-core-item-list {
  margin-bottom: 20px !important;
}
