/* Optional compact presentation; the existing large stylesheet remains intact. */
.highlights-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.highlight-card__image { aspect-ratio: 3 / 2; }
.highlight-card__body { padding: 10px 12px; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 1.25rem minmax(4.5rem, 1fr) auto; gap: 10px; }
.highlight-card h3 { grid-column: 1 / -1; grid-row: 1; display: block; max-height: none; min-width: 0; font-size: 1rem; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: clip; }
.highlight-card__prices { grid-column: 2; grid-row: 2; display: grid; grid-template-columns: auto; grid-template-rows: 1rem minmax(2.8rem, 1fr); gap: 2px; justify-items: end; }
.highlight-card__prices .highlight-price { margin-left: auto; font-size: clamp(2.2rem, 17cqi, 3rem); grid-template-columns: auto 1.08em .35em; }
.highlight-card__prices .highlight-price::after { content: '€'; grid-column: 3; grid-row: 1 / 3; align-self: center; font-size: .42em; letter-spacing: 0; }
.highlight-card__prices .highlight-price--long { font-size: clamp(1.5rem, 11cqi, 2.1rem); }
.highlight-card__prices .highlight-previous { align-self: center; font-size: clamp(.8rem, 7cqi, 1.15rem); }
.highlight-card__footer { grid-column: 1 / -1; grid-row: 3; }
.highlight-validity { font-size: .68rem; }
.highlight-card__unit { font-size: .8rem; }
.highlight-alternative__body { padding: 10px 12px; gap: 6px; }
.highlight-alternative__body p, .highlight-alternative__body > span { font-size: .78rem; }
/* Complete rows with up to four existing institutional cards. */
.highlight-alternative__brand { display: grid; place-items: center; background: var(--green-soft); }
.highlight-alternative__brand img { width: 74%; height: auto; object-fit: contain; }
.highlights-grid[data-fill-desktop] .highlight-alternative { display: none; }
.weekly-copy { min-height: 280px; padding: 22px 28px; }
.weekly-copy h2 { font-size: clamp(1.4rem, 1.8vw, 1.8rem); }
.weekly-product { margin-top: 16px; padding-top: 14px; grid-template-rows: 1.2rem minmax(4.2rem, 1fr) auto; }
.weekly-product h3 { font-size: clamp(1.3rem, 1.8vw, 1.7rem); }
.weekly-price-group { grid-template-rows: 1.2rem minmax(4.2rem, 1fr); }
.weekly-price-group .highlight-price { font-size: 4.5rem; }
.weekly-price-group .highlight-price--long { font-size: 3rem; }
.weekly-image { min-height: 280px; }
@media (max-width: 1000px) { .highlights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .weekly-image { min-height: 0; height: clamp(180px, 54vw, 240px); }
  .weekly-copy { min-height: 0; padding: 20px; }
  .weekly-price-group .highlight-price { font-size: 3.5rem; }
  .weekly-price-group .highlight-price--long { font-size: 2.4rem; }
}
@media (max-width: 600px) { .highlights-grid { grid-template-columns: 1fr; } }

@media (min-width: 1201px) {
  .highlights-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
  .highlights-grid[data-fill-wide="1"] .highlight-alternative--1,
  .highlights-grid[data-fill-wide="2"] .highlight-alternative--1,
  .highlights-grid[data-fill-wide="3"] .highlight-alternative--1,
  .highlights-grid[data-fill-wide="4"] .highlight-alternative--1 { display: flex; }
  .highlights-grid[data-fill-wide="2"] .highlight-alternative--2,
  .highlights-grid[data-fill-wide="3"] .highlight-alternative--2,
  .highlights-grid[data-fill-wide="4"] .highlight-alternative--2 { display: flex; }
  .highlights-grid[data-fill-wide="3"] .highlight-alternative--3,
  .highlights-grid[data-fill-wide="4"] .highlight-alternative--3 { display: flex; }
  .highlights-grid[data-fill-wide="4"] .highlight-alternative--4 { display: flex; }
}

@media (min-width: 1001px) and (max-width: 1200px) {
  .highlights-grid[data-fill-desktop="1"] .highlight-alternative--1,
  .highlights-grid[data-fill-desktop="2"] .highlight-alternative--1,
  .highlights-grid[data-fill-desktop="3"] .highlight-alternative--1 { display: flex; }
  .highlights-grid[data-fill-desktop="2"] .highlight-alternative--2,
  .highlights-grid[data-fill-desktop="3"] .highlight-alternative--2 { display: flex; }
  .highlights-grid[data-fill-desktop="3"] .highlight-alternative--3 { display: flex; }
}

@media (min-width: 601px) and (max-width: 1000px) {
  .highlights-grid[data-fill-tablet="1"] .highlight-alternative--1 { display: flex; }
}