.floral-offer-slots {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  list-style: none;
  margin: 18px 0 14px;
  padding: 0;
}
.floral-offer-slot {
  min-width: 0;
  padding: 8px 5px 10px;
  border: 1px dashed #a99678;
  border-radius: 10px;
  background: #fffdf980;
  text-align: center;
}
.floral-offer-slot.is-filled { border-style: solid; background: var(--porcelain); }
.floral-offer-free { border-color: var(--cherry); background: #ffe1d5; }
.floral-offer-free.is-filled { border: 2px solid var(--cherry); padding: 7px 4px 9px; background: #ffe1d5; }
.floral-offer-marker { display: block; font-size: 11px; font-weight: 700; }
.floral-offer-free .floral-offer-marker { color: var(--cherry); }
.floral-offer-image { display: grid; place-items: center; aspect-ratio: 1; margin: 7px 0; }
.floral-offer-image img { width: 100%; height: 100%; object-fit: contain; border-radius: 7px; }
.floral-offer-image [hidden] { display: none; }
.floral-offer-image > span { font-size: 28px; font-weight: 400; color: #917454; }
.floral-offer-name { display: block; font-size: 12px; line-height: 1.3; overflow-wrap: anywhere; }
.floral-offer-progress { height: 5px; overflow: hidden; border-radius: 5px; background: #dcca9e; }
.floral-offer-progress > span { display: block; height: 100%; width: 0; background: var(--cherry); }
.floral-offer .floral-offer-status { font-size: 14px; font-weight: 600; line-height: 1.5; }
.floral-offer .small-note { font-size: 12px; line-height: 1.5; }
.floral-offer .text-link { display: inline-block; margin-top: 12px; font-size: 14px; }
@media (max-width: 400px) {
  .floral-offer { padding: 16px; }
  .floral-offer-slots { gap: 6px; }
  .floral-offer-slot { padding-inline: 3px; }
  .floral-offer-free.is-filled { padding-inline: 2px; }
  .floral-offer-name { font-size: 11px; }
}