/* Round the photo itself, including when it is centered inside a taller gallery. */
html[data-shop-product238="actividan_travel"] .product-gallery .main-image {
  container-type: size;
}

html[data-shop-product238="actividan_travel"] .product-gallery .main-image > img {
  width: min(100cqw, calc(100cqh * var(--travel-photo-ratio, 0.75)));
  height: auto;
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  border-radius: inherit;
}

html[data-shop-product238="actividan_travel"] .product-gallery .thumbnail > img {
  border-radius: 7px;
}

/* Keep the original card layout; fit the Travel name on one line. */
html[data-shop-product238="actividan_travel"] .product-summary {
  container: travel-title240 / inline-size;
}

html[data-shop-product238="actividan_travel"] .product-heading-row :is(h1, h2) {
  font-size: 22px;
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -0.025em;
  white-space: nowrap;
}

html[data-shop-product238="actividan_travel"] .travel-title240-brand {
  font-weight: 700;
}

html[data-shop-product238="actividan_travel"] .travel-title240-variant {
  font-weight: 400;
}

html[data-shop-product238="actividan_travel"] .product-heading-row {
  gap: 12px;
}

html[data-shop-product238="actividan_travel"] .product-trust-row {
  row-gap: 6px;
}

html[data-shop-product238="actividan_travel"] .product-subtitle {
  margin-block: 10px;
}

/* On narrow cards give the title its full width and put actions beside the trust row. */
@container travel-title240 (max-width: 410px) {
  html[data-shop-product238="actividan_travel"] .product-heading-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  html[data-shop-product238="actividan_travel"] .product-heading-row > div:first-child {
    display: contents;
  }

  html[data-shop-product238="actividan_travel"] .product-heading-row :is(h1, h2) {
    grid-column: 1 / -1;
    font-size: clamp(16px, 7cqi, 22px);
  }

  html[data-shop-product238="actividan_travel"] .product-trust-row {
    grid-column: 1;
    grid-row: 2;
  }

  html[data-shop-product238="actividan_travel"] .product-action-buttons {
    grid-column: 2;
    grid-row: 2;
    flex-direction: row;
    align-self: start;
    width: max-content;
  }
}
