/* Voucher selector: desktop spread and mobile product cards. */
#offers {
  --voucher-navy: #061f49;
  --voucher-green: #008445;
  --voucher-muted: #8c949e;
  --voucher-gutter: 4.7vw;
  max-width: none;
  padding: 32px 3vw 0 var(--voucher-gutter);
  margin: 0;
  background: #f6f6f5;
  color: var(--voucher-navy);
  font-family: Arial, Helvetica, sans-serif;
}
#offers .vsel {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 22px 3.1vw;
  align-items: stretch;
}
#offers .vsel-left, #offers .vsel-right { display: contents; }
#offers .vsel-intro { grid-column: 1 / 6; grid-row: 1; padding-bottom: 4px; }
#offers .vsel-eyebrow { color: #8992a0; font-size: clamp(10px, .8vw, 16px); letter-spacing: .28em; margin: 0 0 18px; }
#offers .vsel-intro h2 { font-size: clamp(36px, 3.72vw, 76px); line-height: .94; letter-spacing: -.055em; font-weight: 800; color: var(--voucher-navy); margin: 0 0 18px; }
#offers #vselMobileHeading { display: none; }
#offers .vsel-intro p { font-size: clamp(15px, 1.3vw, 26px); line-height: 1.22; color: var(--voucher-navy); }
#offers .vsel-tabs { grid-column: 6 / -1; grid-row: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; align-self: start; margin-top: 20px; border: 1px solid #e9e9e9; border-radius: 7px; background: #fff; overflow: hidden; }
#offers .vsel-tab { position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 1.5vw; row-gap: 10px; padding: 2vw 2.3vw 1.7vw; border: 0; border-radius: 0; background: #fff; box-shadow: none; color: var(--voucher-navy); }
#offers .vsel-tab + .vsel-tab::before { content: ''; position: absolute; inset: 18% auto 18% 0; width: 1px; background: #e8eaeb; }
#offers .vsel-tab--active { background: #f1f8f3; box-shadow: inset 0 0 0 1px #3a9c68, inset 0 -6px 0 var(--voucher-green); }
#offers .vsel-tab--active::before { display: none; }
#offers .vt-icon { grid-row: 1 / 3; width: clamp(25px, 2.45vw, 48px); height: clamp(25px, 2.45vw, 48px); margin: 0; color: var(--voucher-navy); align-self: start; }
#offers .vsel-tab--active .vt-icon { color: var(--voucher-green); }
#offers .vt-size { font-size: clamp(22px, 2vw, 40px); line-height: 1; margin: 0; color: var(--voucher-navy); }
#offers .vt-pr { gap: 1vw; flex-wrap: nowrap; white-space: nowrap; }
#offers .vt-pr b { color: var(--voucher-navy); font-size: clamp(13px, 1.17vw, 23px); }
#offers .vt-pr del { color: var(--voucher-muted); font-size: clamp(12px, 1vw, 20px); }
#offers .vsel-photo-bg { display: block; grid-column: 1 / 9; grid-row: 2; margin-left: calc(-1 * var(--voucher-gutter)); min-height: 440px; border-radius: 0; box-shadow: none; background: url('assets/woqod-voucher-station.png') center / cover no-repeat; }
#offers .vsel-detail-card { grid-column: 9 / -1; grid-row: 2; background: transparent; border-radius: 0; overflow: visible; box-shadow: none; }
#offers .vsd-inner { padding: 0 0 24px; }
#offers .vsd-kicker { margin: 0 0 18px; font-size: clamp(10px, .8vw, 16px); letter-spacing: .28em; font-weight: 700; color: #8b93a0; }
#offers .vsd-name { margin: 0 0 12px; font-size: clamp(28px, 3vw, 61px); letter-spacing: -.055em; line-height: 1.05; font-weight: 800; color: var(--voucher-navy); }
#offers .vsd-desc { margin: 0 0 24px; font-size: clamp(15px, 1.3vw, 26px); line-height: 1.25; color: var(--voucher-navy); }
#offers .vsd-pricing { gap: 16px; margin-bottom: 8px; white-space: nowrap; }
#offers .vsd-price { font-size: clamp(36px, 3.6vw, 74px); line-height: 1; letter-spacing: -.05em; color: var(--voucher-navy); }
#offers .vsd-amount { font-size: 1.32em; }
#offers .vsd-price-sep { font-size: 2vw; color: #ccd0d4; }
#offers .vsd-old { font-size: clamp(18px, 1.7vw, 34px); color: #9199a3; }
#offers .vsd-saving { font-size: clamp(16px, 1.45vw, 29px); font-weight: 700; letter-spacing: -.03em; color: var(--voucher-green); margin-bottom: 26px; }
#offers .vsd-valid { border-top: 1px solid #e3e4e4; padding-top: 24px; gap: 12px; margin: 0 0 24px; font-size: clamp(12px, 1.03vw, 21px); flex-wrap: nowrap; white-space: nowrap; }
#offers .vsd-valid-label { color: var(--voucher-navy); font-weight: 400; }
#offers .vsd-vtag { gap: 7px; color: var(--voucher-navy); font-weight: 600; }
#offers .vsd-vtag svg { width: 22px; height: 25px; color: var(--voucher-navy); }
#offers .vsd-vsep { color: #ccd0d4; }
#offers .vsd-buy-btn { position: relative; border-radius: 5px; background: var(--voucher-green); min-height: 58px; height: 4vw; margin: 0 0 24px; font: 700 clamp(17px, 1.4vw, 28px)/1 Arial, sans-serif; }
#offers #vsdBuyArrow { position: absolute; right: 5%; font-size: 1.4em; font-weight: 400; }
#offers .vsd-foot { border: 0; padding: 0; gap: 15px; }
#offers .vsd-foot-icon { width: 27px; height: 27px; color: var(--voucher-navy); }
#offers .vsd-foot strong { color: var(--voucher-navy); font-size: clamp(12px, 1vw, 20px); line-height: 1.35; font-weight: 400; margin-bottom: 12px; }
#offers .vsd-foot p { color: #8b9297; font-size: clamp(12px, .95vw, 19px); line-height: 1.4; }
#offers .vsd-mobile-name, #offers .vsd-mobile-desc { display: none; }
#offers .vsd-photo-mobile, #offers .vsel-compact { display: none; }
#offers .offer-note { position: relative; margin: 0 -1.6vw; border: 1px solid #e6e8e8; border-radius: 8px; padding: 18px 22px; background: #fff; color: #89929e; box-shadow: none; }
#offers .offer-note p { color: #89929e; font-size: 13px; line-height: 1.5; }
#offers .vsel-tab:focus-visible, #offers .vcr:focus-visible { outline: 3px solid #0d6ba8; outline-offset: -3px; }
#offers #vsdBuyLabel { font: inherit; }
#offers .saving-mobile { display: none; }
@media (min-width: 761px) {
  #offers .vsel-intro h2 { line-height: .85; }
  #offers .vsel-tabs { margin-left: -2.5vw; width: calc(100% + 2.5vw); margin-top: 26px; }
  #offers .vsel-detail-card { transform: translateY(-24px); margin-bottom: -24px; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  #offers .vsel { column-gap: 22px; }
  #offers .vsel-intro { grid-column: 1 / 6; }
  #offers .vsel-photo-bg { grid-column: 1 / 8; min-height: 410px; }
  #offers .vsel-detail-card { grid-column: 8 / -1; }
  #offers .vsel-tab { padding: 22px 14px; column-gap: 10px; }
  #offers .vsd-valid { gap: 7px; }
  #offers .vsd-vtag { gap: 3px; }
  #offers .vsd-vtag svg { width: 17px; }
}
@media (max-width: 760px) {
  #offers { padding: 20px 18px 0; --voucher-gutter: 18px; }
  #offers .vsel { display: flex; flex-direction: column; gap: 14px; }
  #offers .vsel-intro { padding: 0 0 4px; }
  #offers .vsel-eyebrow { font-size: 9px; letter-spacing: .28em; margin-bottom: 10px; }
  #offers #vsel-h2 { display: none; }
  #offers #vselMobileHeading { display: block; font-size: clamp(26px, 6.85vw, 49px); line-height: 1.05; letter-spacing: -.045em; margin-bottom: 8px; }
  #offers .vsel-intro p { font-size: clamp(14px, 3.55vw, 25px); line-height: 1.3; }
  #offers .vsel-tabs { margin: 0; width: 100%; flex: none; border-radius: 7px; }
  #offers .vsel-tab { padding: 14px 8px 13px; column-gap: 8px; row-gap: 7px; min-width: 0; }
  #offers .vsel-tab--active { box-shadow: inset 0 0 0 1px #3a9c68, inset 0 -3px 0 var(--voucher-green); }
  #offers .vt-icon { width: clamp(18px, 4vw, 28px); height: clamp(20px, 4.5vw, 32px); }
  #offers .vt-size { font-size: clamp(16px, 3.8vw, 27px); letter-spacing: -.04em; }
  #offers .vt-pr { gap: 6px; }
  #offers .vt-pr b { font-size: clamp(10px, 2.4vw, 17px); }
  #offers .vt-pr del { font-size: clamp(9px, 2.1vw, 15px); }
  #offers .vsel-photo-bg { display: none; }
  #offers .vsel-detail-card { background: #fff; padding: 10px; border: 1px solid #9dccb5; border-radius: 7px; overflow: hidden; }
  #offers .vsd-photo-mobile { display: block; height: auto; min-height: 0; aspect-ratio: 2.35; border-radius: 6px; background: url('assets/woqod-voucher-station.png') center / cover no-repeat; }
  #offers .vsd-inner { display: grid; padding: 12px 1px 3px; grid-template-areas: 'kicker' 'name' 'desc' 'valid' 'pricing' 'saving' 'buy' 'foot'; }
  #offers .vsd-kicker { display: block; grid-area: kicker; font-size: clamp(8px, 2vw, 14px); letter-spacing: .24em; margin: 0 0 8px; }
  #offers .vsd-name, #offers .vsd-desc { display: none; }
  #offers .vsd-mobile-name { display: block; grid-area: name; font-size: clamp(23px, 5.5vw, 39px); font-weight: 700; letter-spacing: -.04em; line-height: 1.1; margin: 0 0 6px; color: #07354a; }
  #offers .vsd-mobile-desc { display: block; grid-area: desc; font-size: clamp(15px, 3.55vw, 25px); color: #92999c; margin: 0 0 12px; line-height: 1.2; }
  #offers .vsd-valid { grid-area: valid; border: 0; padding: 0; margin-bottom: 12px; gap: 12px; justify-content: flex-start; }
  #offers .vsd-valid-label, #offers .vsd-vsep { display: none; }
  #offers .vsd-vtag { padding: 9px 10px; gap: 7px; border: 1px solid #e6eeea; border-radius: 3px; background: #f0f6f2; color: #547268; font-size: clamp(11px, 2.85vw, 20px); font-weight: 700; }
  #offers .vsd-vtag svg { width: 16px; height: 18px; color: #2dac70; }
  #offers .vsd-pricing { grid-area: pricing; gap: 14px; margin-bottom: 8px; }
  #offers .vsd-price { font-size: clamp(33px, 8vw, 56px); color: #07354a; line-height: 1; }
  #offers .vsd-currency { font-size: .46em; letter-spacing: -.03em; color: #17a65d; }
  #offers .vsd-amount { font-size: 1.32em; }
  #offers .vsd-price-sep { display: none; }
  #offers .vsd-old { font-size: clamp(14px, 3.4vw, 24px); }
  #offers .vsd-saving { grid-area: saving; padding-top: 9px; border-top: 1px solid #e2e4e5; margin: 0 0 13px; font-size: clamp(13px, 3.15vw, 22px); font-weight: 700; }
  #offers .saving-desktop { display: none; }
  #offers .saving-mobile { display: inline; }
  #offers .saving-mobile > span { color: #92999f; font-weight: 400; }
  #offers .saving-mobile > span:last-child { margin-left: 6px; }
  #offers .vsd-buy-btn { grid-area: buy; min-height: 0; height: clamp(40px, 10.5vw, 74px); font-size: clamp(15px, 3.5vw, 25px); margin-bottom: 14px; background: #07354a; border-radius: 5px; }
  #offers .vsd-foot { grid-area: foot; gap: 10px; }
  #offers .vsd-foot-icon { width: 19px; height: 19px; }
  #offers .vsd-foot strong { display: none; }
  #offers .vsd-foot p { font-size: clamp(11px, 2.7vw, 19px); line-height: 1.35; }
  #offers .vsel-compact { display: flex; flex-direction: column; gap: 9px; }
  #offers .vcr { border: 1px solid #e7e9e9; border-radius: 6px; padding: 10px; gap: 12px; min-height: 58px; box-shadow: 0 1px 2px #00000003; }
  #offers .vcr-icon { width: 38px; height: 38px; border-radius: 6px; color: #67a2b7; background: #eef7fa; }
  #offers .vcr[data-vol='60'] .vcr-icon { color: #9cb84a; background: #f5f9e7; }
  #offers .vcr-info { min-width: 0; flex: 1; }
  #offers .vcr-name { font-size: clamp(12px, 3.2vw, 22px); font-weight: 700; color: var(--voucher-navy); white-space: nowrap; }
  #offers .vcr-sub { font-size: clamp(10px, 2.6vw, 18px); color: #969da2; white-space: nowrap; }
  #offers .vcr-price { display: flex; align-items: baseline; gap: 5px; white-space: nowrap; }
  #offers .vcr-price b { font-size: clamp(20px, 4.8vw, 34px); color: var(--voucher-navy); letter-spacing: -.04em; }
  #offers .vcr-price b small { font-size: .5em; color: #15a15b; }
  #offers .vcr-price del { font-size: clamp(9px, 2.2vw, 15px); color: #9aa1a7; }
  #offers .vcr-chev { display: block; transform: rotate(90deg); font-size: 24px; line-height: 1; color: #8f999e; }
  #offers .offer-note { margin: 14px 0 0; border: 0; padding: 9px 0 18px; background: transparent; }
  #offers .offer-note > span { display: none; }
  #offers .offer-note p { font-size: 11px; line-height: 1.5; }
}
@media (max-width: 370px) {
  #offers { padding-inline: 12px; }
  #offers .vsel-tab { column-gap: 5px; padding-inline: 6px; }
  #offers .vt-pr { gap: 3px; }
  #offers .vcr { gap: 7px; padding: 8px; }
  #offers .vcr-icon { width: 30px; height: 34px; }
  #offers .vsd-valid { gap: 7px; }
  #offers .vsd-vtag { padding: 8px; gap: 5px; }
}