/* [Codex] Card contract: share the height of every content row, with
   sizes kept beside the price. Desktop shares each visual row; mobile shares the whole rail.
   Intrinsic tracks adapt to long names, colour changes and font loading. */
@supports (grid-template-rows: subgrid) {
  .home-products,
  .catalog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-rows: auto;
    align-items: stretch;
    row-gap: 8px;
  }

  .home-products > .catalog-card[data-product-card],
  .catalog-grid > .catalog-card[data-product-card] {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 7;
    align-content: normal;
    row-gap: 8px;
    min-width: 0;
    margin: 0 0 36px;
  }

  .catalog-card .product-photo-gallery {
    grid-row: 1;
    align-self: start;
  }

  .catalog-card .catalog-body {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: 2 / span 6;
    align-content: normal;
    align-items: start;
    justify-items: stretch;
    row-gap: 8px;
    height: auto;
    padding: 0;
  }

  .catalog-card .card-colorline,
  .catalog-card h2,
  .catalog-card .catalog-collection,
  .catalog-card .catalog-desc,
  .catalog-card .catalog-price,
  .catalog-card .catalog-actions {
    height: auto;
    min-height: 0;
    margin: 0;
  }

  .catalog-card .card-colorline {
    width: 100%;
    align-items: flex-start;
    justify-content: flex-start;
  }

  .catalog-card .selected-color {
    min-height: 0;
    justify-content: flex-start;
  }

  .catalog-card .catalog-actions {
    align-self: start;
    align-items: center;
    justify-content: flex-start;
    padding: 0;
  }

  @media (max-width: 760px) {
    .home-products,
    .catalog-grid {
      grid-template-columns: none;
      grid-template-rows: repeat(7, auto);
      grid-auto-columns: min(82vw, 330px);
      grid-auto-flow: column;
      column-gap: 16px;
    }

    .home-products > .catalog-card[data-product-card],
    .catalog-grid > .catalog-card[data-product-card] {
      grid-row: 1 / -1;
      margin: 0;
    }
  }
}

/* [Codex] Short previews avoid empty tracks forced by editorial paragraphs. */
.catalog-card .card-colorline { gap: 3px; }
.catalog-card .selected-color { font-size: 12px; line-height: 1.35; }
.catalog-card .catalog-collection { font-size: 10px; line-height: 1.4; }
.catalog-card .catalog-desc { font-size: 14px; line-height: 1.4; text-wrap: wrap; }
.catalog-card .catalog-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 6px; line-height: 1.4; }
.catalog-card .catalog-price small { font-size: 11px; line-height: 1.4; }
.catalog-card .catalog-measure { margin-left: auto; white-space: nowrap; }
.catalog-card .catalog-actions { gap: 6px 12px; }
@media (max-width: 760px) {
 .catalog-card .catalog-desc { font-size: 15px; line-height: 1.4; }
 .catalog-card .catalog-price { font-size: 15px; }
 .catalog-card .catalog-actions .text-link { font-size: 13px; }
 .catalog-card .catalog-actions .button-primary { font-size: 11px; padding-inline: 12px; }
}
/* Gallery navigation overlays the photo, so single- and multi-view cards align. */
.catalog-card .product-photo-gallery { position: relative; }
.catalog-card .photo-gallery-controls { position: absolute; bottom: 10px; left: 10px; right: 10px; padding: 0; }
.catalog-card .photo-gallery-controls > span { background: #fbfaf7; border-radius: 999px; padding: 5px 9px; }

/* [Codex] Colours and both actions share the photo's centre; copy stays left. */
.catalog-card .card-colorline { align-items: center; text-align: center; }
.catalog-card .card-colorline .swatches { justify-content: center; }
.catalog-card .selected-color { justify-content: center; text-align: center; }
.catalog-card .catalog-actions { justify-content: center; }

/* [Codex] Editorial product cards: full-width photos and copy before colour controls. */
.catalog-card .product-photo-gallery{width:100%;margin:0}
.catalog-card h2{font:400 clamp(28px,2.7vw,40px)/1.12 var(--serif);letter-spacing:-.035em;padding-top:8px}
.catalog-card .catalog-desc{max-width:none}
.catalog-card .card-colorline{padding:12px 0 8px;justify-content:center}
.catalog-card .catalog-actions{flex-direction:row;flex-wrap:wrap;gap:10px 18px}
.catalog-card .catalog-actions .button-primary{font:500 14px/1.3 var(--sans);text-transform:none;letter-spacing:0;min-height:44px;padding:11px 20px}
.catalog-card .catalog-actions .text-link{font:400 13px/1.4 var(--sans);letter-spacing:0}
@media(max-width:760px){
 .catalog-card h2{font-size:30px}
 .catalog-card .catalog-actions .button-primary{font-size:13px;padding:11px 16px}
 .catalog-card .catalog-actions{gap:10px 14px}
}