.special-offer-v2__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid #F4CA35;
  background: #FFFFFF;
  flex-shrink: 0;
}
.special-offer-v2__icon img {
  width: 40px;
  height: 40px;
  -o-object-fit: contain;
  object-fit: contain;
  display: block;
}

/* =============================================================================
   Special Offer Section — Version 2  (.special-offer-section--v2)
   Appended after the existing special-offer-2.css (icon styles stay)

   Two sub-variants (same template, different ACF field):
   A) with $left_icon  → circular % icon + title | countdown | button
   B) with $badge      → yellow pill badge + title | countdown | button

   Desktop (both): white card, single horizontal row, noise background
   Mobile  (both): vertical centered stack, full-width button

   HTML:
   .special-offer-section.special-offer-section--v2.section
     .container
       .special-offer-v2__inner         ← horizontal flex card
         .special-offer-v2__left        ← icon/badge + content
           .special-offer-v2__icon      ← (variant A only)
           blockquote > p               ← (variant B only)
           .special-offer__content      ← h2/p title WYSIWYG
         .special-offer-v2__right       ← countdown + button
           .so-countdown.so-countdown--inline
           a.btn
   ============================================================================= */


/* =============================================================================
   SECTION BACKGROUND
   ============================================================================= */
.special-offer-section--v2 {
  background-color: #F4F5F3;
  background-image: url("../../images/background_noise_white.webp");
  background-repeat: repeat;
}


/* =============================================================================
   WHITE CARD  — the inner wrapper becomes a rounded white card
   ============================================================================= */
.special-offer-section--v2 .special-offer-v2__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  background-color: #FFFFFF;
  border-radius: 16px;
  padding: 42px 40px;
  box-shadow: 0 2px 24px 0 rgba(42, 62, 73, 0.07);
}


/* =============================================================================
   LEFT COLUMN — icon/badge + title
   ============================================================================= */
.special-offer-section--v2 .special-offer-v2__left {
  display: flex;
  align-items: center;
  gap: 32px;
  flex: 0 0 63%;
  min-width: 0;
}

/* --- Variant A: circular icon (already sized in base sass, just gap) --- */
.special-offer-section--v2 .special-offer-v2__icon {
  flex-shrink: 0;
  /* width/height/border already in special-offer-2.css compiled */
}

/* --- Variant B: badge pill (blockquote > p) --- */
.special-offer-section--v2 .special-offer-v2__left blockquote {
  margin: 0;
  flex-shrink: 0;
}

.special-offer-section--v2 .special-offer-v2__left blockquote p {
  margin: 0;
  padding: 8px 12px;
  background-color: #F4CA35;
  border: 2px solid #FDDE71;
  border-radius: 8px;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 14px;
  font-weight: 600;
  font-style: normal;
  line-height: normal;
  color: #2A3E49;
  white-space: nowrap;
}

/* --- Content (WYSIWYG): title text --- */
.special-offer-section--v2 .special-offer__content {
  min-width: 0;
}

/* h2/h3 inside content — main title */
.special-offer-section--v2 .special-offer__content h1,
.special-offer-section--v2 .special-offer__content h2,
.special-offer-section--v2 .special-offer__content h3 {
  font-family: "Montserrat", sans-serif;
  font-size: 32px;
  font-weight: 800;
  line-height: normal;
  color: #2A3E49;
  margin: 0;
}

/* Variant A: first line yellow ("Special offer:"), rest dark */
.special-offer-section--v2 .special-offer__content h2 span,
.special-offer-section--v2 .special-offer__content h3 span,
.special-offer-section--v2 .special-offer__content .so2-label {
  color: #F4CA35;
  display: block;
}

/* Paragraphs in content (if any) */
.special-offer-section--v2 .special-offer__content p {
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 15px;
  color: #53707F;
  margin: 4px 0 0;
}


/* =============================================================================
   RIGHT COLUMN — countdown + button
   ============================================================================= */
.special-offer-section--v2 .special-offer-v2__right {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-shrink: 0;
}

/* --- Inline countdown: "00d 00h 00m 00s" as a single text string --- */
.special-offer-section--v2 .so-countdown--inline {
  font-family: "Montserrat", sans-serif;
  font-size: 24px;
  font-weight: 800;
  line-height: normal;
  color: #2A3E49;
  white-space: nowrap;
}

.special-offer-section--v2 .so-countdown--inline span {
  color: #2A3E49;
}

/* --- Button --- */
.special-offer-section--v2 .special-offer-v2__right .btn {
  white-space: nowrap;
  height: 48px;
  padding: 12px 24px;
  font-size: 16px;
  font-weight: 700;
}


/* =============================================================================
   RESPONSIVE — Tablet  (≤ 1024px)
   Compress title size and card padding
   ============================================================================= */
@media (max-width: 1024px) {
  .special-offer-section--v2 .special-offer-v2__inner {
    padding: 20px 24px;
    gap: 24px;
  }

  .special-offer-section--v2 .special-offer__content h1,
  .special-offer-section--v2 .special-offer__content h2,
  .special-offer-section--v2 .special-offer__content h3 {
    font-size: 24px;
  }

  .special-offer-section--v2 .so-countdown--inline {
    font-size: 18px;
  }

  .special-offer-section--v2 .special-offer-v2__right .btn {
    padding: 12px 18px;
    font-size: 14px;
  }
}


/* =============================================================================
   RESPONSIVE — Tablet portrait  (≤ 768px)
   Right column wraps below left
   ============================================================================= */
@media (max-width: 768px) {
  .special-offer-section--v2 {
    background-color: #FFFFFF;
    background-repeat: repeat;
  }
  .special-offer-section--v2 .special-offer-v2__inner {
    flex-wrap: wrap;
    gap: 20px;
  }

  .special-offer-section--v2 .special-offer-v2__right {
    width: 100%;
    justify-content: space-between;
  }

  .special-offer-section--v2 .special-offer-v2__right .btn {
    flex-shrink: 0;
  }
}


/* =============================================================================
   RESPONSIVE — Mobile  (≤ 576px)
   Vertical centered stack — matches both mobile PDFs (Frame_787 & Frame_791)
   icon/badge → title → countdown → button (full width)
   ============================================================================= */
@media (max-width: 576px) {
  .special-offer-section--v2 .special-offer-v2__inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 32px 20px;
    gap: 32px;
    border-radius: 0; /* edge-to-edge on mobile */
    box-shadow: none;
    background-color: transparent; /* let section bg show through */
  }

  /* Left col: stack icon/badge above title, center them */
  .special-offer-section--v2 .special-offer-v2__left {
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
  }

  /* Variant A: bigger icon on mobile */
  .special-offer-section--v2 .special-offer-v2__icon {
    width: 80px;
    height: 80px;
  }

  .special-offer-section--v2 .special-offer-v2__icon img {
    width: 52px;
    height: 52px;
  }

  /* Variant A: yellow label line in title */
  .special-offer-section--v2 .special-offer__content h2 span,
  .special-offer-section--v2 .special-offer__content h3 span,
  .special-offer-section--v2 .special-offer__content .so2-label {
    font-size: 28px;
  }

  /* Title bigger on mobile (matches PDF large heading) */
  .special-offer-section--v2 .special-offer__content h1,
  .special-offer-section--v2 .special-offer__content h2,
  .special-offer-section--v2 .special-offer__content h3 {
    font-size: 36px;
    text-align: center;
  }

  /* Right col: stack countdown above button */
  .special-offer-section--v2 .special-offer-v2__right {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
  }

  /* Countdown bigger on mobile */
  .special-offer-section--v2 .so-countdown--inline {
    font-size: 24px;
    font-weight: 800;
  }

  /* Button full width */
  .special-offer-section--v2 .special-offer-v2__right .btn {
    width: 100%;
    height: 48px;
    font-size: 16px;
    padding: 14px 24px;
  }

  /* Variant B badge pill: centered */
  .special-offer-section--v2 .special-offer-v2__left blockquote p {
    font-size: 14px;
    padding: 8px 16px;
  }
}
/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNwZWNpYWwtb2ZmZXItMi5zYXNzIiwiRDovTG9jYWxXUC9mZW5jaW5nc3BlY2lhbGlzdHMvYXBwL3B1YmxpYy93cC1jb250ZW50L3RoZW1lcy9mZW5jaW5nc3BlY2lhbGlzdHMvYXNzZXRzL3Nhc3MvdG9vbHMvdmFycy5zYXNzIiwic3BlY2lhbC1vZmZlci0yLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFQTtFQUNJLGFBQUE7RUFDQSxtQkFBQTtFQUNBLHVCQUFBO0VBQ0EsV0FBQTtFQUNBLFlBQUE7RUFDQSxrQkFBQTtFQUNBLHlCQUFBO0VBQ0EsbUJDSkk7RURLSixjQUFBO0FFREo7QUZHSTtFQUNJLFdBQUE7RUFDQSxZQUFBO0VBQ0Esc0JBQUE7S0FBQSxtQkFBQTtFQUNBLGNBQUE7QUVEUiIsImZpbGUiOiJzcGVjaWFsLW9mZmVyLTIuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiQHVzZSBcIi4uL3Rvb2xzL3ZhcnNcIlxyXG5cclxuLnNwZWNpYWwtb2ZmZXItdjJfX2ljb25cclxuICAgIGRpc3BsYXk6IGZsZXhcclxuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXJcclxuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyXHJcbiAgICB3aWR0aDogNTZweFxyXG4gICAgaGVpZ2h0OiA1NnB4XHJcbiAgICBib3JkZXItcmFkaXVzOiA1MCVcclxuICAgIGJvcmRlcjogMnB4IHNvbGlkIHZhcnMuJGdvbGRlbl95ZWxsb3dcclxuICAgIGJhY2tncm91bmQ6IHZhcnMuJHdoaXRlXHJcbiAgICBmbGV4LXNocmluazogMFxyXG5cclxuICAgIGltZ1xyXG4gICAgICAgIHdpZHRoOiA0MHB4XHJcbiAgICAgICAgaGVpZ2h0OiA0MHB4XHJcbiAgICAgICAgb2JqZWN0LWZpdDogY29udGFpblxyXG4gICAgICAgIGRpc3BsYXk6IGJsb2NrXHJcbiIsIiRwcmltYXJ5LWZvbnQ6IFwiTW9udHNlcnJhdFwiLCBzYW5zLXNlcmlmXG4kc2Vjb25kYXJ5LWZvbnQ6IFwiSUJNIFBsZXggU2Fuc1wiLCBzYW5zLXNlcmlmXG5cblxuLy9jb2xvcnNcbiRibGFjazogIzAwMDAwMFxuJHdoaXRlOiAjRkZGRkZGXG4kY2hhcmNvYWxfYmx1ZTogIzJBM0U0OVxuJHN0b3JteV9ibHVlOiAjNTM3MDdGXG4kZ29sZGVuX3llbGxvdzogI0Y0Q0EzNVxuJGRpcnR5X3doaXRlOiAjRjRGNUYzXG4kbGlnaHRfc2xhdGU6ICNDQUNGRDdcbiRlbWVyYWxkOiAjMkU3RDMyXG4kd2FybV95ZWxsb3c6ICNFM0FBMEZcbiRwdXJlX3JlZDogI0QzMkYyRlxuJGxpZ2h0X3JlZDogI0QzMkYyRlxuJGxpZ2h0X3llbGxvdzogI0ZEREU3MVxuXG5cblxuXG4vL2NvbnRhaW5lclxuJGNvbnRhaW5lci1wYWRkaW5nOiAxNnB4XG4kY29udGFpbmVyLXdpZHRoOiBjYWxjKDEyODBweCArIDIgKiAjeyRjb250YWluZXItcGFkZGluZ30pIiwiLnNwZWNpYWwtb2ZmZXItdjJfX2ljb24ge1xuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgd2lkdGg6IDU2cHg7XG4gIGhlaWdodDogNTZweDtcbiAgYm9yZGVyLXJhZGl1czogNTAlO1xuICBib3JkZXI6IDJweCBzb2xpZCAjRjRDQTM1O1xuICBiYWNrZ3JvdW5kOiAjRkZGRkZGO1xuICBmbGV4LXNocmluazogMDtcbn1cbi5zcGVjaWFsLW9mZmVyLXYyX19pY29uIGltZyB7XG4gIHdpZHRoOiA0MHB4O1xuICBoZWlnaHQ6IDQwcHg7XG4gIG9iamVjdC1maXQ6IGNvbnRhaW47XG4gIGRpc3BsYXk6IGJsb2NrO1xufSJdfQ== */