/* Make inner elements inherit text styles from the container */
.offers-widget,
.offers-widget *:where(:not(svg, svg *, img)) {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

/* Grid */
.offers-widget .offers-grid {
  display: grid;
  gap: var(--offers-gap, 24px);
}
.offers-widget.cols-1 .offers-grid {
  grid-template-columns: 1fr;
}
.offers-widget.cols-2 .offers-grid {
  grid-template-columns: repeat(2, 1fr);
}
.offers-widget.cols-3 .offers-grid {
  grid-template-columns: repeat(3, 1fr);
}
.offers-widget.cols-4 .offers-grid {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 1024px) {
  .offers-widget .offers-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 767px) {
  .offers-widget .offers-grid {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

/* Whole card as link */
.offer-card--link {
  display: block;
  text-decoration: none !important;
  color: inherit;
  cursor: pointer;
  border: 2px solid var(--e-global-color-accent);
}

/* Card */
.offer-card {
  border-radius: 12px;
  padding: 6px;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  cursor: pointer;
  transition: 0.2s;
}
.offer-card:hover,
.offer-card:focus-visible {
  box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px,
    rgba(23, 232, 130, 0.4) 0px 0px 8px 0px,
    rgba(23, 232, 130, 0.4) 0px 0px 12px 0px,
    rgba(23, 232, 130, 0.4) 0px 0px 8px 0px,
    rgba(23, 232, 130, 0.4) 0px 0px 0px 0px;
}

/* Image container */
.offer-card__media {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 12px 12px 0 0;
  background: var(--e-global-color-primary);
}
.offer-card__img {
  width: 100%;
  height: 100% !important;
  object-fit: contain;
  display: block;
}

/* Text (title uses heading/secondary typography) */
.offer-card__title {
  margin: 0 0 6px;
  font-size: var(--e-global-typography-accent-font-size);
  font-weight: var(--e-global-typography-accent-font-weight);
  color: var(--e-global-color-3e4dfe7);
  text-align: start;

  font-family: var(--e-global-typography-accent-font-family);
  /* keep responsive sizing but allow Elementor to override via globals */
}
@media (max-width: 720px) {
  .offer-card__title {
    font-size: 1rem;
  }
}

/* Static "Read more →" line */
.offer-card__moreline {
  max-height: 40px;
  text-align: end;
  font-weight: 700;
  font-family: var(--e-global-typography-text-font-family);
  font-size: 16px;
  font-weight: var(--e-global-typography-text-font-weight);
  color: var(--e-global-color-text);
  text-decoration: underline;
  align-items: flex-end;
}
.offer-card--link:where(:hover, :focus-visible) .offer-card__moreline {
  color: var(--e-global-color-accent);
}

.offer-card__arrow {
  transition: transform 0.2s ease;
}
@media (max-width: 720px) {
  .offer-card__moreline {
    font-size: 0.75rem;
  }
}

/* Description */
.offer-card__desc {
  font-size: 0.9rem;
  line-height: 1.4;
  color: var(--e-global-color-text, inherit);
  text-align: center;
  margin: 0;
}

/* Legacy CTA */
.offer-card__cta {
  display: none !important;
}