.delivery-pickup__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.delivery-pickup__number {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 56px;
  line-height: 110%;
  color: #2A3E49;
}
.delivery-pickup--dark .delivery-pickup__number {
  color: #FFFFFF;
}

.delivery-pickup__label {
  font-family: "IBM Plex Sans", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 140%;
  color: #53707F;
}
.delivery-pickup--dark .delivery-pickup__label {
  color: #F4F5F3;
}

/* =============================================================================
   Delivery & Pickup — KPI cards section
   Appended after the existing delivery-pickup.css
   (number/label colors already compiled in sass; adding layout + card chrome)

   Versions: .delivery-pickup--dark | .delivery-pickup--light

   HTML:
   .delivery-pickup.section.delivery-pickup--[dark|light]
     .container
       .delivery-pickup__grid
         .delivery-pickup__card     (×N)
           .delivery-pickup__icon   ← yellow circle + img 40×40
           .delivery-pickup__info
             span.delivery-pickup__number  ← "7,533"
             span.delivery-pickup__label   ← "Satisfied customers"

   Desktop: 3-column equal grid
   Mobile:  1 column stacked
   ============================================================================= */


/* =============================================================================
   SECTION BACKGROUNDS
   ============================================================================= */

/* Dark */
.delivery-pickup--dark {
  background-color: #2A3E49;
  background-image: url("../../images/background_big_blue_2.webp");
  background-size: cover;
  background-repeat: no-repeat;
}

/* Light */
.delivery-pickup--light {
  background-color: #F4F5F3;
  background-image: url("../../images/background_noise_white.webp");
  background-repeat: repeat;
  background-size: contain;
}


/* =============================================================================
   GRID
   ============================================================================= */
.delivery-pickup__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}


/* =============================================================================
   CARD  — base (shared chrome)
   ============================================================================= */
.delivery-pickup__card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  border-radius: 12px;
  padding: 32px 24px;
  box-sizing: border-box;
}

/* Dark card */
.delivery-pickup--dark .delivery-pickup__card {
  background-color: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

/* Light card */
.delivery-pickup--light .delivery-pickup__card {
  background-color: #FFFFFF;
  border: 1px solid rgba(202, 207, 215, 0.5);
  box-shadow: 0 2px 16px 0 rgba(42, 62, 73, 0.06);
}


/* =============================================================================
   ICON  — yellow filled circle
   ============================================================================= */
.delivery-pickup__icon {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.delivery-pickup__icon img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  display: block;
}

/* Larger icon on mobile (PDF: big yellow circle) */


/* =============================================================================
   INFO  — already has flex column + gap from sass
   Boost number size to match PDF
   ============================================================================= */
.delivery-pickup__number {
  font-size: 56px; /* override sass 36px to match PDF large KPI */
}

.delivery-pickup--dark .delivery-pickup__number {
  color: #FFFFFF;
}

.delivery-pickup--light .delivery-pickup__number {
  color: #2A3E49;
}

.delivery-pickup--dark .delivery-pickup__label {
  color: #F4F5F3;
}

.delivery-pickup--light .delivery-pickup__label {
  color: #53707F;
}


/* =============================================================================
   RESPONSIVE — Tablet  (≤ 1024px)
   ============================================================================= */
@media (max-width: 1024px) {
  .delivery-pickup__grid {
    gap: 16px;
  }

  .delivery-pickup__card {
    padding: 20px;
    gap: 16px;
  }

  .delivery-pickup__number {
    font-size: 34px;
  }

  .delivery-pickup__icon {
    width: 56px;
    height: 56px;
  }

  .delivery-pickup__icon img {
    width: 80px;
    height: 80px;
  }
}


/* =============================================================================
   RESPONSIVE — Mobile  (≤ 768px)
   1 column, bigger icon + number to match mobile PDF
   ============================================================================= */
@media (max-width: 768px) {
  .delivery-pickup__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .delivery-pickup__card {
    padding: 32px 20px;
    gap: 20px;
  }

  /* Mobile PDF: big yellow circle */
  .delivery-pickup__icon {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
  }

  .delivery-pickup__icon img {
    width: 80px;
    height: 80px;
  }

  .delivery-pickup__number {
    font-size: 56px;
  }

  .delivery-pickup__label {
    font-size: 18px;
  }

  .delivery-pickup__info {
    gap: 0;
  }
}
/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRlbGl2ZXJ5LXBpY2t1cC5zYXNzIiwiZGVsaXZlcnktcGlja3VwLmNzcyIsIkQ6L0xvY2FsV1AvZmVuY2luZ3NwZWNpYWxpc3RzL2FwcC9wdWJsaWMvd3AtY29udGVudC90aGVtZXMvZmVuY2luZ3NwZWNpYWxpc3RzL2Fzc2V0cy9zYXNzL3Rvb2xzL3ZhcnMuc2FzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFQTtFQUNJLGFBQUE7RUFDQSxzQkFBQTtFQUNBLFFBQUE7QUNESjs7QURHQTtFQUNJLHFDRVJXO0VGU1gsZ0JBQUE7RUFDQSxlQUFBO0VBQ0EsaUJBQUE7RUFDQSxjRUxZO0FES2hCO0FERUk7RUFDSSxjRVRBO0FEU1I7O0FERUE7RUFDSSx3Q0VqQmE7RUZrQmIsZ0JBQUE7RUFDQSxlQUFBO0VBQ0EsaUJBQUE7RUFDQSxjRWRVO0FEZWQ7QURDSTtFQUNJLGNFZE07QURlZCIsImZpbGUiOiJkZWxpdmVyeS1waWNrdXAuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiQHVzZSBcIi4uL3Rvb2xzL3ZhcnNcIlxyXG5cclxuLmRlbGl2ZXJ5LXBpY2t1cF9faW5mb1xyXG4gICAgZGlzcGxheTogZmxleFxyXG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtblxyXG4gICAgZ2FwOiA0cHhcclxuXHJcbi5kZWxpdmVyeS1waWNrdXBfX251bWJlclxyXG4gICAgZm9udC1mYW1pbHk6IHZhcnMuJHByaW1hcnktZm9udFxyXG4gICAgZm9udC13ZWlnaHQ6IDgwMFxyXG4gICAgZm9udC1zaXplOiAzNnB4XHJcbiAgICBsaW5lLWhlaWdodDogMTEwJVxyXG4gICAgY29sb3I6IHZhcnMuJGNoYXJjb2FsX2JsdWVcclxuXHJcbiAgICAuZGVsaXZlcnktcGlja3VwLS1kYXJrICZcclxuICAgICAgICBjb2xvcjogdmFycy4kd2hpdGVcclxuXHJcbi5kZWxpdmVyeS1waWNrdXBfX2xhYmVsXHJcbiAgICBmb250LWZhbWlseTogdmFycy4kc2Vjb25kYXJ5LWZvbnRcclxuICAgIGZvbnQtd2VpZ2h0OiA0MDBcclxuICAgIGZvbnQtc2l6ZTogMTRweFxyXG4gICAgbGluZS1oZWlnaHQ6IDE1MCVcclxuICAgIGNvbG9yOiB2YXJzLiRzdG9ybXlfYmx1ZVxyXG5cclxuICAgIC5kZWxpdmVyeS1waWNrdXAtLWRhcmsgJlxyXG4gICAgICAgIGNvbG9yOiB2YXJzLiRsaWdodF9zbGF0ZVxyXG4iLCIuZGVsaXZlcnktcGlja3VwX19pbmZvIHtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgZ2FwOiA0cHg7XG59XG5cbi5kZWxpdmVyeS1waWNrdXBfX251bWJlciB7XG4gIGZvbnQtZmFtaWx5OiBcIk1vbnRzZXJyYXRcIiwgc2Fucy1zZXJpZjtcbiAgZm9udC13ZWlnaHQ6IDgwMDtcbiAgZm9udC1zaXplOiAzNnB4O1xuICBsaW5lLWhlaWdodDogMTEwJTtcbiAgY29sb3I6ICMyQTNFNDk7XG59XG4uZGVsaXZlcnktcGlja3VwLS1kYXJrIC5kZWxpdmVyeS1waWNrdXBfX251bWJlciB7XG4gIGNvbG9yOiAjRkZGRkZGO1xufVxuXG4uZGVsaXZlcnktcGlja3VwX19sYWJlbCB7XG4gIGZvbnQtZmFtaWx5OiBcIklCTSBQbGV4IFNhbnNcIiwgc2Fucy1zZXJpZjtcbiAgZm9udC13ZWlnaHQ6IDQwMDtcbiAgZm9udC1zaXplOiAxNHB4O1xuICBsaW5lLWhlaWdodDogMTUwJTtcbiAgY29sb3I6ICM1MzcwN0Y7XG59XG4uZGVsaXZlcnktcGlja3VwLS1kYXJrIC5kZWxpdmVyeS1waWNrdXBfX2xhYmVsIHtcbiAgY29sb3I6ICNDQUNGRDc7XG59IiwiJHByaW1hcnktZm9udDogXCJNb250c2VycmF0XCIsIHNhbnMtc2VyaWZcbiRzZWNvbmRhcnktZm9udDogXCJJQk0gUGxleCBTYW5zXCIsIHNhbnMtc2VyaWZcblxuXG4vL2NvbG9yc1xuJGJsYWNrOiAjMDAwMDAwXG4kd2hpdGU6ICNGRkZGRkZcbiRjaGFyY29hbF9ibHVlOiAjMkEzRTQ5XG4kc3Rvcm15X2JsdWU6ICM1MzcwN0ZcbiRnb2xkZW5feWVsbG93OiAjRjRDQTM1XG4kZGlydHlfd2hpdGU6ICNGNEY1RjNcbiRsaWdodF9zbGF0ZTogI0NBQ0ZEN1xuJGVtZXJhbGQ6ICMyRTdEMzJcbiR3YXJtX3llbGxvdzogI0UzQUEwRlxuJHB1cmVfcmVkOiAjRDMyRjJGXG4kbGlnaHRfcmVkOiAjRDMyRjJGXG4kbGlnaHRfeWVsbG93OiAjRkRERTcxXG5cblxuXG5cbi8vY29udGFpbmVyXG4kY29udGFpbmVyLXBhZGRpbmc6IDE2cHhcbiRjb250YWluZXItd2lkdGg6IGNhbGMoMTI4MHB4ICsgMiAqICN7JGNvbnRhaW5lci1wYWRkaW5nfSkiXX0= */