/* Greatlink Safaris responsive catalogue cards (v5).
   Separate from page/detail layout: applies only to public listing cards.
   Imported after responsive-hardening, and keyed to actual available space. */

/* Prevent content, images and long names from widening any listing grid. */
:is(.tours-results-grid,.hotel-results-grid,.destination-results-grid,
    .experience-catalog-grid,.holiday-deal-grid,.wildlife-grid,
    .public-grid,.blog-index-grid,.curated-journey-grid,.safari-experience-grid,
    .home-holiday-deal-grid,.market-package-grid,.market-destination-grid,
    .package-related-grid,.hotel-related-grid,.wildlife-destination-grid,
    .wildlife-safari-grid,.safari-big-five-grid) { min-width:0; }
:is(.tours-results-grid,.hotel-results-grid,.destination-results-grid,
    .experience-catalog-grid,.holiday-deal-grid,.wildlife-grid,
    .public-grid,.blog-index-grid,.curated-journey-grid,.safari-experience-grid,
    .home-holiday-deal-grid,.market-package-grid,.market-destination-grid,
    .package-related-grid,.hotel-related-grid,.wildlife-destination-grid,
    .wildlife-safari-grid,.safari-big-five-grid) > * { min-width:0; }

/* Safari/hotel pages include a filter sidebar. React to the width of the
   *result panel* rather than viewport: this prevents both overly-wide cards
   at 1024px and tiny cards at tablet sizes. */
.tours-results-panel,.hotel-results-panel {container-type:inline-size;container-name:listing-panel;min-width:0;}
.tours-results-grid,.tours-catalog-layout.is-simple .tours-results-grid,
.hotel-results-grid {grid-template-columns:minmax(0,1fr)!important;gap:clamp(14px,1.6vw,22px)!important;}
@container listing-panel (min-width:600px) {
  .tours-results-grid,.tours-catalog-layout.is-simple .tours-results-grid,
  .hotel-results-grid {grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@container listing-panel (min-width:980px) {
  .tours-catalog-layout.is-simple .tours-results-grid,.hotel-catalog-layout.is-simple .hotel-results-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@container listing-panel (min-width:1020px) {
  .tours-results-grid,.hotel-results-grid {grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
/* If only a single card fits, limit its actual width, not the page shell. */
@container listing-panel (max-width:599.98px) {
  .tours-results-grid > .tour-result-card,
  .hotel-results-grid > .hotel-result-card {width:100%;max-width:490px;margin-inline:auto;}
}

/* Catalogue pages without filter sidebars: sensible minimum card width
   automatically produces 1/2/3 columns based on *real available width*. */
.destination-results-grid,.holiday-deal-grid,.experience-catalog-grid,
.wildlife-grid,.public-grid,.blog-index-grid,
.curated-journey-grid,.safari-experience-grid,.home-holiday-deal-grid,
.market-package-grid,.market-destination-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))!important;
  gap:clamp(14px,1.6vw,22px)!important;
}
/* Keep the homepage's curated safari catalogue from inheriting its old
   featured-card asymmetry and single-column mobile overrides. */
.journey-grid.curated-journey-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,265px),1fr))!important;}

/* Related card sections are smaller: avoid enormous 1-card columns, but
   preserve room for the content on smaller devices. */
.package-related-grid,.hotel-related-grid,.wildlife-destination-grid,
.wildlife-safari-grid,.safari-big-five-grid {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,225px),1fr))!important;
  gap:clamp(12px,1.3vw,18px)!important;
}

/* Large lead cards in search results were overwhelming at in-between sizes.
   All catalogue cards have an even footprint instead of spanning columns. */
.destination-result-card:first-child,.blog-index-card.is-lead {
  grid-column:auto!important;
}
.blog-index-card.is-lead {
  display:flex!important;flex-direction:column!important;min-height:0!important;
}
.blog-index-card.is-lead .blog-index-card-media {
  width:100%!important;height:auto!important;min-height:0!important;
  aspect-ratio:16/10!important;
}
.blog-index-card.is-lead .blog-index-card-media img {width:100%!important;height:100%!important;object-fit:cover!important;}

/* Repeatable proportions across safaris, accommodation, destinations, deals,
   experiences and wildlife.  Explicit crop prevents huge landscape cards. */
:is(.tour-result-media,.hotel-result-media,.destination-result-media,
    .destination-result-card:first-child .destination-result-media,
    .holiday-deal-card-image,.experience-catalog-card-media,
    .wildlife-card-media,.journey-card-media,.journey-media,
    .safari-experience-media,.home-holiday-deal-media,.market-package-media,
    .blog-index-card-media,.package-related-media,.hotel-related-media,
    .public-card .public-media) {
  display:block;
  width:100%;height:auto!important;min-height:0!important;
  aspect-ratio:16/10!important;max-height:265px;
  overflow:hidden;
}
:is(.tour-result-media,.hotel-result-media,.destination-result-media,
    .holiday-deal-card-image,.experience-catalog-card-media,.wildlife-card-media,
    .journey-card-media,.safari-experience-media,.home-holiday-deal-media,
    .market-package-media,.blog-index-card-media,.package-related-media,
    .hotel-related-media,.public-card .public-media) img {
  display:block; width:100%!important; height:100%!important;object-fit:cover!important;
}
/* Media placeholders are decorative but should fill the same sized crop. */
.tour-result-image-placeholder,.hotel-result-image-placeholder,
.destination-result-placeholder,.holiday-deal-card-placeholder,
.experience-catalog-card-placeholder,.home-holiday-deal-placeholder {
  width:100%;height:100%;
}


/* Safari quotation buttons need their own row on 280–400px cards; a flex
   price row plus two buttons previously pushed outside the card at tablets. */
.tour-result-footer {flex-wrap:wrap;gap:12px;}
.tour-result-actions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;}
.tour-result-actions a {width:100%;min-width:0;justify-content:center;text-align:center;}
.tour-result-actions a:only-child {grid-column:1 / -1;}
.hotel-result-footer {flex-wrap:wrap;gap:12px;}

/* Consistent card internals for long descriptions and action rows. */
:is(.tour-result-card,.hotel-result-card,.destination-result-card,
    .holiday-deal-card,.experience-catalog-card,.wildlife-card,
    .curated-journey-card,.safari-experience-card,.home-holiday-deal-card,
    .market-package-card,.blog-index-card) {min-width:0;max-width:100%;}
:is(.tour-result-card,.hotel-result-card,.destination-result-card,
    .holiday-deal-card,.experience-catalog-card,.curated-journey-card,
    .safari-experience-card,.home-holiday-deal-card,.market-package-card,
    .blog-index-card) :is(h2,h3,p) {overflow-wrap:break-word;}
:is(.tour-result-body,.hotel-result-body,.destination-result-body,
    .holiday-deal-card-body,.experience-catalog-card-body,
    .curated-card-body,.home-holiday-deal-body) {min-width:0;}

/* Text content remains legible without making one card much taller. */
.tour-result-card p,.hotel-result-card p,.destination-result-body>p,
.experience-catalog-card-body>p,.market-package-card p,
.curated-journey-card p,.wildlife-card p {
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;
  overflow:hidden;min-height:0;
}

/* A single result or narrow screen must not turn into a 700px-wide card. */
@media (min-width:480px) and (max-width:620px) {
  :is(.destination-results-grid,.holiday-deal-grid,.experience-catalog-grid,
      .wildlife-grid,.public-grid,.blog-index-grid,
      .curated-journey-grid,.safari-experience-grid,.home-holiday-deal-grid,
      .market-package-grid,.market-destination-grid) > :is(article,a) {
    max-width:490px;width:100%;margin-inline:auto;
  }
}
@media (max-width:619.98px) {
  .tours-results-grid,.hotel-results-grid,.destination-results-grid,
  .holiday-deal-grid,.experience-catalog-grid,.wildlife-grid,.public-grid,
  .blog-index-grid,.curated-journey-grid,.safari-experience-grid,
  .home-holiday-deal-grid,.market-package-grid,.market-destination-grid,
  .package-related-grid,.hotel-related-grid,.wildlife-destination-grid,
  .wildlife-safari-grid,.safari-big-five-grid {
    grid-template-columns:minmax(0,1fr)!important;
  }
  /* Large phones / portrait tablets get compact cards centered in the page. */
  :is(.destination-results-grid,.holiday-deal-grid,.experience-catalog-grid,
      .wildlife-grid,.public-grid,.blog-index-grid,.curated-journey-grid,
      .safari-experience-grid,.home-holiday-deal-grid,.market-package-grid,
      .market-destination-grid) > :is(article,a) {
    width:100%;max-width:490px;margin-inline:auto;
  }
  .tour-result-body,.hotel-result-body,.holiday-deal-card-body,
  .destination-result-body,.experience-catalog-card-body {padding:16px!important;}
  .tour-result-footer,.hotel-result-footer {flex-wrap:wrap;gap:12px;}
  .tour-result-actions {flex-wrap:wrap;}
  .blog-index-card.is-lead .blog-index-card-body {padding:18px!important;}
}
@media (max-width:380px) {
  .tour-result-actions {display:grid;grid-template-columns:1fr!important;width:100%;}
  .tour-result-actions a {width:100%;justify-content:center;}
}

@media (prefers-reduced-motion:reduce) {
  :is(.tour-result-card,.hotel-result-card,.destination-result-card,
      .holiday-deal-card,.wildlife-card,.curated-journey-card) {transition:none!important;}
}