/* Desktop offer cards — same layout as mobile */

#ofertas .offer-grid {
  display: flex !important;
  flex-direction: column;
  gap: 1.25rem;
  background: transparent !important;
  border: 0 !important;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}

#ofertas .offer-card--premium {
  order: -1;
}

#ofertas .offer-card {
  border-radius: 16px;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.08), 0 12px 28px -8px rgb(15 20 25 / 0.12);
  border: 1px solid hsl(36 14% 86%);
  overflow: visible;
}

#ofertas .offer-card--premium {
  border-color: hsl(345 42% 26%);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 16px 32px -8px hsl(345 42% 26% / 0.28);
  outline: 2px solid hsl(40 72% 50% / 0.5);
  outline-offset: 2px;
}

#ofertas .offer-badge {
  top: -14px;
  font-size: 10px;
  letter-spacing: 0.14em;
}

#ofertas .offer-price {
  font-size: 2.75rem;
  line-height: 1;
}

#ofertas .offer-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  min-width: 20px;
  min-height: 20px;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 1px;
  margin-right: 0.125rem;
}

#ofertas .offer-card li.flex {
  align-items: flex-start;
  gap: 1rem !important;
}

#ofertas .offer-card li.flex > span:first-child:not(.offer-check) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  min-width: 1.25rem;
  flex-shrink: 0;
  margin-right: 0.125rem;
}

#ofertas .offer-card--premium .offer-check {
  background: hsl(40 72% 50% / 0.18);
}

#ofertas .offer-card--essencial .offer-check {
  background: hsl(12 70% 52% / 0.12);
}

@media (min-width: 768px) {
  #ofertas .offer-grid {
    max-width: 560px;
    margin-top: 2rem;
  }

  #ofertas .offer-card {
    padding: 2rem 2.25rem !important;
  }
}

/* Hero and section CTAs (not offer cards) — offer-cta excluded entirely */

#root a.group.inline-flex.items-center:not(.offer-cta) {
  border-radius: 10px !important;
  font-weight: 600;
  letter-spacing: 0.1em !important;
  box-shadow: 0 4px 16px hsl(345 42% 26% / 0.18);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}

#root a.group.inline-flex.items-center:not(.offer-cta):hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px hsl(345 42% 26% / 0.24);
}

#root a.group.inline-flex.items-center:not(.offer-cta).bg-forest,
#root a.group.inline-flex.items-center:not(.offer-cta)[class*="bg-forest"] {
  background: linear-gradient(135deg, hsl(345 42% 26%), hsl(345 36% 32%)) !important;
}

#root a.group.inline-flex.items-center:not(.offer-cta).bg-forest:hover,
#root a.group.inline-flex.items-center:not(.offer-cta)[class*="bg-forest"]:hover {
  background: linear-gradient(135deg, hsl(12 70% 52%), hsl(12 70% 46%)) !important;
}

#root a.group.inline-flex.items-center:not(.offer-cta).bg-ink,
#root a.group.inline-flex.items-center:not(.offer-cta)[class*="bg-ink"] {
  background: linear-gradient(135deg, hsl(230 30% 10%), hsl(230 24% 16%)) !important;
  box-shadow: 0 4px 16px hsl(230 30% 10% / 0.22);
}

#root a.group.inline-flex.items-center:not(.offer-cta).bg-ink:hover,
#root a.group.inline-flex.items-center:not(.offer-cta)[class*="bg-ink"]:hover,
#root a.group.inline-flex.items-center:not(.offer-cta).bg-cream:hover,
#root a.group.inline-flex.items-center:not(.offer-cta)[class*="bg-cream"]:hover {
  background: linear-gradient(135deg, hsl(40 72% 50%), hsl(40 68% 44%)) !important;
  color: hsl(230 30% 10%) !important;
  box-shadow: 0 8px 22px hsl(40 72% 50% / 0.28);
}

#root a.group.inline-flex.items-center:not(.offer-cta).bg-cream,
#root a.group.inline-flex.items-center:not(.offer-cta)[class*="bg-cream"] {
  border: 1px solid hsl(36 14% 86%);
  box-shadow: 0 3px 12px hsl(15 20 25 / 0.07);
}

#root a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex > span {
  font-size: 0.75rem;
}

@media (min-width: 768px) {
  #root a.group.inline-flex.items-center:not(.offer-cta) {
    padding: 0.875rem 1.75rem !important;
    min-height: 48px;
  }

  #root a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex > span {
    font-size: 0.8125rem;
  }

  #root section.bg-forest a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex > span {
    font-size: 1rem;
    letter-spacing: 0.1em !important;
  }

  #root section.bg-forest a.group.inline-flex.items-center:not(.offer-cta) {
    padding: 0.875rem 1.625rem !important;
    min-height: 48px !important;
  }
}

@media (max-width: 767px) {
  /* Hero (primeira dobra) — compacto, não full width */
  #root .min-h-screen > section.relative.overflow-hidden .flex.flex-wrap.items-center.justify-center.lg\:justify-start > a.group.inline-flex.items-center:not(.offer-cta) {
    width: auto !important;
    max-width: 100%;
    align-self: center;
    padding: 0.875rem 1.625rem !important;
    min-height: 48px !important;
    box-shadow: 0 3px 12px hsl(345 42% 26% / 0.15) !important;
  }

  #root .min-h-screen > section.relative.overflow-hidden .flex.flex-wrap.items-center.justify-center.lg\:justify-start > a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex > span {
    font-size: 1rem;
    letter-spacing: 0.1em !important;
  }

  #root .min-h-screen > section.relative.overflow-hidden .flex.flex-wrap.items-center.justify-center.lg\:justify-start > a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex svg {
    width: 0.875rem !important;
    height: 0.875rem !important;
    min-width: 0.875rem !important;
    min-height: 0.875rem !important;
    max-width: 0.875rem !important;
    max-height: 0.875rem !important;
  }

  /* Seção "Congelar não significa abrir mão do sabor." — mesmo tamanho do hero */
  #root section.bg-forest a.group.inline-flex.items-center:not(.offer-cta) {
    width: auto !important;
    max-width: 100%;
    align-self: flex-start;
    padding: 0.875rem 1.625rem !important;
    min-height: 48px !important;
    box-shadow: 0 3px 12px hsl(345 42% 26% / 0.15) !important;
  }

  #root section.bg-forest a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex > span {
    font-size: 1rem;
    letter-spacing: 0.1em !important;
  }

  #root section.bg-forest a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex svg {
    width: 0.875rem !important;
    height: 0.875rem !important;
    min-width: 0.875rem !important;
    min-height: 0.875rem !important;
    max-width: 0.875rem !important;
    max-height: 0.875rem !important;
  }

  /* Demais seções (não oferta) */
  #root a.group.inline-flex.items-center:not(.offer-cta) {
    width: auto !important;
    max-width: 100%;
    padding: 0.75rem 1.375rem !important;
    min-height: 44px !important;
    box-shadow: 0 4px 14px hsl(345 42% 26% / 0.16) !important;
  }

  #root a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex > span {
    font-size: 0.8125rem;
    letter-spacing: 0.1em !important;
  }

  #root a.group.inline-flex.items-center:not(.offer-cta) > span.inline-flex svg {
    width: 0.8125rem !important;
    height: 0.8125rem !important;
    min-width: 0.8125rem !important;
    min-height: 0.8125rem !important;
    max-width: 0.8125rem !important;
    max-height: 0.8125rem !important;
  }

  #root section:not(.relative.overflow-hidden) .group.inline-flex.items-center:not(.offer-cta) {
    padding: 0.75rem 1.375rem !important;
    min-height: 44px !important;
  }
}

/* Premium accents */

#root .min-h-screen .bg-terracotta.text-cream {
  background: linear-gradient(135deg, hsl(12 70% 52%), hsl(40 72% 50%)) !important;
}

#root section.bg-forest {
  background: linear-gradient(160deg, hsl(345 44% 22%), hsl(345 36% 30%)) !important;
}
