@import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;600;700&display=swap");

:root {
  --font: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html {
  -webkit-text-size-adjust: 100%;
}

body,
button,
input,
select,
textarea {
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.brand-text {
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.12;
}

.desktop-nav a,
.desktop-nav .nav-label,
.bottom-nav a,
.bottom-nav .nav-label {
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
}

.desktop-nav a {
  font-size: 13px;
}

.desktop-nav .nav-icon,
.bottom-nav .nav-icon {
  width: 24px;
  height: 24px;
}

.nav-icon svg {
  stroke-width: 2;
}

h1 {
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 600;
  line-height: 1.06;
  letter-spacing: 0;
}

h2 {
  font-size: clamp(23px, 3vw, 32px);
  font-weight: 600;
  line-height: 1.14;
  letter-spacing: 0;
}

h3 {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.32;
}

p {
  font-size: 15px;
  line-height: 1.65;
}

.hero-lede,
.hero p {
  font-size: clamp(16px, 2vw, 18px);
  line-height: 1.55;
}

.eyebrow,
.fact-label,
.card-kicker,
.product-badge,
.section-link,
.card-link,
.contact-line strong,
.detail strong,
.hours-row strong,
.cookie-button,
.cookie-option-name {
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
}

.eyebrow,
.fact-label,
.card-kicker,
.product-badge {
  font-size: 12px;
}

.fact-value,
.contact-line,
.hours-row,
.detail p {
  font-size: 14.5px;
  line-height: 1.55;
}

.button,
.section-link,
.card-link,
.product-order-link,
.cookie-button {
  min-height: 40px;
  padding-inline: 14px;
  font-size: 13px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
}

.action-card h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.28;
}

.action-card p {
  font-size: 14.5px;
  line-height: 1.55;
}

.product-name,
.product-card h3 {
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.34;
  letter-spacing: 0;
}

.product-price,
.sale-price {
  font-size: 17px;
  font-weight: 600;
}

.product-brand,
.product-category,
.product-meta,
.orig-price {
  font-size: 12px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}

.product-fallback {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
}

.product-media {
  background: linear-gradient(180deg, #f6f9fc 0%, #edf3f7 100%);
}

.product-media img,
.product-fallback img {
  box-sizing: border-box;
  padding: clamp(6px, 1.4vw, 10px);
  background: transparent;
  filter: drop-shadow(0 12px 16px rgba(24, 43, 70, 0.14));
}

.product-circle img {
  box-sizing: border-box;
  padding: 0;
  background: transparent;
}

body.deals-page .sale-grid {
  align-items: stretch;
}

body.deals-page .product-card:not(.combo-card) {
  height: 100%;
}

body.deals-page .product-card:not(.combo-card) .card-strip {
  margin-top: auto;
}

.sale-card-top {
  --deal-image-frame-h: 198px;
  --deal-image-pad-x: 16px;
  --deal-image-pad-y: 14px;
  height: var(--deal-image-frame-h);
  padding: 0 !important;
  background: #f6fafb !important;
}

.sale-card-top .product-halo {
  display: none !important;
}

.sale-card-top .product-circle {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0;
  box-sizing: border-box;
  padding: var(--deal-image-pad-y) var(--deal-image-pad-x);
  overflow: hidden;
}

.sale-card-top .product-circle img {
  width: auto;
  height: calc(var(--deal-image-frame-h) - (var(--deal-image-pad-y) * 2)) !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain;
  transform: scale(1);
  transform-origin: center center;
}

.product-card.image-wide .sale-card-top {
  --deal-image-frame-h: 96px;
  --deal-image-pad-x: 14px;
  --deal-image-pad-y: 10px;
}

.product-card.image-wide .product-circle {
  align-items: center;
}

.product-card.image-wide .product-circle img {
  width: 100%;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: fill;
  transform: scale(1);
}

.product-card.image-tall .sale-card-top {
  --deal-image-frame-h: 220px;
  --deal-image-pad-x: 22px;
  --deal-image-pad-y: 14px;
}

.product-card.image-tall .product-circle img {
  transform: scale(1);
}

.product-card.image-balanced .product-circle img {
  transform: scale(1);
}

.combo-slide {
  background: rgba(245, 248, 252, 0.96) !important;
}

.combo-slide img {
  box-sizing: border-box;
  padding: 0 !important;
  background: transparent !important;
}

.cta-band h2 {
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 600;
}

.cta-band p {
  font-size: 15px;
}

.store-copy h2,
.section-title h2,
.info-panel h3,
.cookie-banner-title,
.cookie-panel-title {
  font-weight: 600;
  letter-spacing: 0;
}

.store-photo figcaption {
  font-size: 12.5px;
  font-weight: 600;
}

.order-float {
  display: none;
}

.deals-title {
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 600;
  letter-spacing: 0;
}

.subtitle,
.flyer-link,
.deal-tab,
.deal-count,
.sidebar-filter h3,
.filter-chip,
.badge-sale,
.sale-date,
.filter-fab,
.sheet-btn {
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
}

.flyer-link,
.filter-fab,
.sheet-btn {
  font-size: 13px;
}

.deal-tab,
.badge-sale,
.sale-date {
  font-size: 12px;
}

.deal-count {
  font-size: 11px;
}

.filter-chip {
  font-size: 14px;
}

.sale-grid .product-name {
  font-size: 18px;
  line-height: 1.28;
}

@media (min-width: 821px) and (max-width: 1100px) {
  .brand-text {
    display: inline-block;
    font-size: 14px;
  }

  .nav-wrap {
    gap: 12px;
  }
}

@media (max-width: 820px) {
  .brand {
    max-width: calc(100vw - 28px);
  }

  .brand-text {
    display: inline-block;
    font-size: 15px;
  }

  h1 {
    font-size: clamp(30px, 8vw, 42px);
    line-height: 1.08;
  }

  h2 {
    font-size: clamp(22px, 6vw, 28px);
  }

  .bottom-nav a {
    font-size: 10.5px;
    font-weight: 600;
  }
}

@media (max-width: 430px) {
  h1 {
    font-size: 34px;
  }

  .hero-lede,
  .hero p {
    font-size: 15.5px;
  }

  .product-name,
  .product-card h3 {
    font-size: 13.5px;
    line-height: 1.3;
  }

  .product-price {
    font-size: 16.5px;
  }
}