.offer-card {
  --product-scale: 1;
  --product-x: 0;
  --product-y: 0;
  --store-scale: 1;
  --store-x: 0;
  --store-y: 0;
  container: offer-card / inline-size;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  color: #061a30;
  background: #fff;
  border: clamp(1px, .35cqi, 2px) solid #061a30;
  border-radius: clamp(12px, 3cqi, 20px);
  box-shadow: 0 1.8cqi 4.8cqi rgba(5, 26, 48, .15), 0 0 0 1px rgba(5, 26, 48, .04);
  font-family: var(--font-display);
  isolation: isolate;
  user-select: none;
}

.offer-card__top {
  min-height: 15.3cqi;
  padding: 2.05cqi 3.8cqi;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--ao-yellow);
}
.offer-card__brand { width: 42.6cqi; max-height: 9.2cqi; object-fit: contain; object-position: left center; }
.offer-card__meli { width: 30.9cqi; max-height: 8.9cqi; object-fit: contain; object-position: right center; }

.offer-card__body {
  min-height: 0;
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 2.94cqi;
  padding: 2.35cqi 3.53cqi 1.18cqi;
  background: #fff;
}
.offer-card__details { min-width: 0; display: flex; flex-direction: column; justify-content: space-between; }
.offer-card__rating-row { min-height: 3.2cqi; display: flex; align-items: center; gap: .88cqi; color: #64748b; font-size: 1.9cqi; font-weight: 650; white-space: nowrap; }
.offer-card__rating-row > strong { color: #061a30; font-size: 2.65cqi; font-weight: 800; }
.offer-card__separator { color: #cbd5e1; margin-inline: .44cqi; }
.offer-card__stars { display: flex; align-items: center; gap: .3cqi; }
.offer-card__stars svg { width: 2.5cqi; height: 2.5cqi; }

.offer-card__price-line { min-height: 7cqi; display: flex; align-items: center; gap: 1.76cqi; margin-block-start: .3cqi; }
.offer-card__old-price { color: #64748b; font-size: 3.82cqi; font-weight: 700; letter-spacing: -.07cqi; text-decoration: line-through; }
.offer-card__discount { padding: .74cqi 2.35cqi; color: #fff; background: #ff5500; border-radius: 1.47cqi; box-shadow: 0 .45cqi 1.47cqi rgba(255, 85, 0, .35); font-size: 3.53cqi; font-weight: 800; letter-spacing: -.04cqi; white-space: nowrap; }
.offer-card__price { display: block; margin-block-start: -.88cqi; overflow: hidden; color: #061a30; font-size: 12.05cqi; font-weight: 900; line-height: .92; letter-spacing: -.44cqi; white-space: nowrap; }
.offer-card__savings { align-self: flex-start; min-height: 4.5cqi; display: inline-flex; align-items: center; gap: 1.18cqi; margin-block-start: .3cqi; padding: .59cqi 2.05cqi .59cqi .88cqi; color: #00873a; background: #edfcf2; border: clamp(1px, .22cqi, 1.5px) solid #00a650; border-radius: 99px; font-size: 2.5cqi; white-space: nowrap; }
.offer-card__savings > span { width: 3.24cqi; aspect-ratio: 1; display: grid; place-items: center; color: #fff; background: #00a650; border-radius: 50%; font-size: 2.05cqi; font-weight: 900; }

.offer-card__copy { min-height: 12.2cqi; display: flex; flex-direction: column; justify-content: center; margin-block-start: .88cqi; overflow: hidden; }
.offer-card__copy h3 { margin: 0; display: -webkit-box; overflow: hidden; color: #061a30; font-size: 3.82cqi; font-weight: 800; line-height: 1.15; letter-spacing: -.07cqi; word-break: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.offer-card__copy p { margin: .3cqi 0 0; overflow: hidden; color: #64748b; font-size: 2.2cqi; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }

.offer-card__store { min-height: 11.5cqi; display: flex; align-items: center; gap: 1.76cqi; margin-block-start: .88cqi; padding: 1.47cqi 1.76cqi; overflow: hidden; background: #f8fafc; border: clamp(1px, .22cqi, 1.5px) solid #e2e8f0; border-radius: 2.65cqi; box-shadow: 0 .3cqi 1.18cqi rgba(0, 0, 0, .04); }
.offer-card__avatar { width: 7.94cqi; height: 7.94cqi; flex: 0 0 auto; position: relative; display: grid; place-items: center; overflow: visible; cursor: default; }
.offer-card__avatar::before { content: ""; position: absolute; inset: 0; overflow: hidden; background: #0f172a; border: .3cqi solid #e2e8f0; border-radius: 50%; }
.offer-card__avatar-fallback { position: relative; z-index: 1; padding: .3cqi .59cqi; color: #ffd000; border: .22cqi solid #ffd000; border-radius: .44cqi; font-size: 1.62cqi; font-weight: 900; letter-spacing: .07cqi; }
.offer-card__store-image { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; transform: translate(calc(var(--store-x) * 100%), calc(var(--store-y) * 100%)) scale(var(--store-scale)); transform-origin: center; }
.offer-card__check { position: absolute; z-index: 3; inset-block-end: -.3cqi; inset-inline-end: -.3cqi; width: 2.65cqi; height: 2.65cqi; display: grid; place-items: center; color: #fff; background: #00a650; border: .3cqi solid #fff; border-radius: 50%; }
.offer-card__check svg { width: 1.62cqi; height: 1.62cqi; fill: currentColor; }
.offer-card__store-copy { min-width: 0; display: flex; flex: 1; flex-direction: column; gap: .15cqi; line-height: 1.1; }
.offer-card__store-copy > strong { overflow: hidden; font-size: 2.13cqi; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.offer-card__store-copy > span { color: #475569; font-size: 1.76cqi; font-weight: 600; }
.offer-card__verified { display: flex; align-items: center; gap: .59cqi; color: #475569 !important; }
.offer-card__verified svg { width: 2.05cqi; height: 2.05cqi; flex: 0 0 auto; fill: #0070f3; }
.offer-card__store-copy small { color: #64748b; font-size: 1.62cqi; font-weight: 600; }

.offer-card__visual { min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 1.47cqi; }
.offer-card__photo { width: 100%; min-height: 0; flex: 1; position: relative; overflow: hidden; display: grid; place-items: center; background: #f8fafc; border: clamp(1px, .22cqi, 1.5px) solid #e2e8f0; border-radius: 3.53cqi; box-shadow: 0 .59cqi 2.35cqi rgba(0, 0, 0, .05); cursor: default; }
.offer-card__product-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transform: translate(calc(var(--product-x) * 100%), calc(var(--product-y) * 100%)) scale(var(--product-scale)); transform-origin: center; pointer-events: none; }
.offer-card__photo-placeholder { display: grid; place-items: center; gap: .88cqi; padding: 2.94cqi; color: #94a3b8; text-align: center; font-size: 6.18cqi; }
.offer-card__photo-placeholder small { color: #64748b; font-size: 1.98cqi; font-weight: 700; }
.offer-card__shipping { position: absolute; z-index: 4; inset-block-start: 1.47cqi; inset-inline-end: 1.47cqi; display: flex; align-items: center; gap: 1.18cqi; padding: .88cqi 1.76cqi; color: #fff; background: #061a30; border-radius: 1.76cqi; box-shadow: 0 .59cqi 1.76cqi rgba(0, 0, 0, .25); line-height: 1; pointer-events: none; }
.offer-card__truck { width: 3.24cqi; height: 3.24cqi; flex: 0 0 auto; fill: currentColor; }
.offer-card__shipping > span { display: flex; flex-direction: column; }
.offer-card__shipping strong { font-size: 1.62cqi; font-style: normal; font-weight: 900; letter-spacing: .04cqi; white-space: nowrap; }
.offer-card__shipping em { color: #00e676; font-style: normal; }
.offer-card__shipping small { margin-block-start: .3cqi; color: #e2e8f0; font-size: 1.4cqi; font-weight: 600; }
.offer-card__meli-bottom { width: 84%; height: 10.3cqi; object-fit: contain; }

.offer-card__footer { min-height: 12.65cqi; display: grid; grid-template-columns: 1.25fr .75fr; align-items: center; gap: 2.05cqi; padding: 1.18cqi 3.53cqi 2.65cqi; background: #fff; }
.offer-card__cta { min-width: 0; min-height: 8.82cqi; display: flex; align-items: center; justify-content: space-between; gap: 1.47cqi; padding: 1.47cqi 2.65cqi; color: #fff; background: linear-gradient(180deg, #011931, #061a30); border-radius: 2.94cqi; box-shadow: 0 .88cqi 2.35cqi rgba(1, 25, 49, .35); }
.offer-card__cta strong { flex: 1; font-size: 3.68cqi; font-weight: 900; letter-spacing: -.07cqi; white-space: nowrap; }
.offer-card__tag { width: 4.7cqi; height: 4.7cqi; flex: 0 0 auto; fill: currentColor; transform: rotate(-10deg); }
.offer-card__external { width: 5.3cqi; height: 5.3cqi; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.offer-card__trust { min-width: 0; min-height: 8.82cqi; display: flex; align-items: center; gap: 1.47cqi; padding: 1.47cqi 2.05cqi; color: #00a650; background: #f8fafc; border: clamp(1px, .22cqi, 1.5px) solid #e2e8f0; border-radius: 2.65cqi; box-shadow: 0 .3cqi 1.18cqi rgba(0, 0, 0, .04); }
.offer-card__shield { width: 4.12cqi; height: 4.12cqi; flex: 0 0 auto; fill: currentColor; }
.offer-card__trust > span { min-width: 0; display: flex; flex-direction: column; line-height: 1.1; }
.offer-card__trust strong { font-size: 1.91cqi; font-weight: 900; white-space: nowrap; }
.offer-card__trust small { color: #64748b; font-size: 1.47cqi; font-weight: 600; white-space: nowrap; }

.offer-card__link { position: absolute; z-index: 10; inset: 0; border-radius: inherit; cursor: pointer; }
.offer-card__link:focus-visible { outline: clamp(2px, .55cqi, 4px) solid var(--ao-orange); outline-offset: clamp(-5px, -.75cqi, -2px); }

.offer-card--editable .offer-card__photo,
.offer-card--editable .offer-card__avatar { z-index: 11; cursor: grab; touch-action: none; }
.offer-card--editable .offer-card__photo:active,
.offer-card--editable .offer-card__avatar:active { cursor: grabbing; }
.is-hidden { display: none !important; }

@media (hover: hover) and (pointer: fine) {
  .offers-grid .offer-card:not(.offer-card--editable) { transition: transform .2s ease, box-shadow .2s ease; }
  .offers-grid .offer-card:not(.offer-card--editable):hover { transform: translateY(-4px) scale(1.025); box-shadow: 0 2.6cqi 6cqi rgba(5, 26, 48, .22), 0 0 0 1px rgba(5, 26, 48, .04); }
}

@media (prefers-reduced-motion: reduce) {
  .offers-grid .offer-card:not(.offer-card--editable) { transition: none; }
  .offers-grid .offer-card:not(.offer-card--editable):hover { transform: none; }
}
