/* generated by scripts/css-min.php from ../cashback.css — edit the source, never this file */
.vonnik-page > .vonnik-cb { margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; width: auto !important; max-width: none !important; } .vonnik-cb { color: var(--vonnik-ink); line-height: var(--vonnik-line-text); } .vonnik-cb :is(p, h1, h2, ol, figure) { margin: 0; } .vonnik-cb img { display: block; max-width: 100%; } .vonnik-cb .vcb-i { width: var(--vonnik-icon); height: var(--vonnik-icon); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; } .vonnik-cb .vcb-wrap { max-width: 1180px; margin: 0 auto; padding: 0 var(--vonnik-space-5); } .vonnik-cb .vcb-h { font-weight: var(--vonnik-weight-black); text-transform: uppercase; line-height: 1.05; letter-spacing: var(--vonnik-tracking-display); color: inherit; } .vonnik-cb .vcb-eyebrow { font-size: var(--vonnik-text-s); font-weight: var(--vonnik-weight-bold); text-transform: uppercase; letter-spacing: 0.06em; color: var(--vonnik-blue); } .vonnik-cb .button { display: flex; gap: var(--vonnik-icon-gap); } .vonnik-cb .vcb-signal { --theme-button-background-initial-color: var(--vonnik-yellow); --theme-button-background-hover-color: var(--vonnik-yellow); --theme-button-text-initial-color: var(--vonnik-on-signal); --theme-button-text-hover-color: var(--vonnik-on-signal); } .vonnik-cb .vcb-hero { position: relative; height: min(84svh, 720px); min-height: 560px; background: var(--vonnik-navy); overflow: hidden; color: var(--vonnik-on-action); } .vonnik-cb .vcb-hero__track { display: flex; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; } .vonnik-cb .vcb-hero__track::-webkit-scrollbar { display: none; } .vonnik-cb .vcb-hero__slide { flex: 0 0 100%; height: 100%; scroll-snap-align: start; position: relative; } .vonnik-cb .vcb-hero__slide img { width: 100%; height: 100%; object-fit: cover; object-position: var(--vonnik-cb-pos, 50% 50%); } .vonnik-cb .vcb-hero__tag { position: absolute; top: var(--vonnik-space-5); left: var(--vonnik-space-5); display: inline-flex; align-items: center; gap: var(--vonnik-space-2); background: var(--vonnik-overlay-strong); padding: var(--vonnik-space-2) var(--vonnik-space-4); border-radius: var(--vonnik-radius-sheet); font-size: var(--vonnik-text-s); font-weight: var(--vonnik-weight-bold); text-transform: uppercase; letter-spacing: 0.05em; } .vonnik-cb .vcb-hero__tag .vcb-i { width: 16px; height: 16px; } .vonnik-cb .vcb-hero__shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 30%, var(--vonnik-overlay-strong) 58%, var(--vonnik-navy) 100%); } .vonnik-cb .vcb-hero__copy { position: absolute; left: 0; right: 0; bottom: 0; pointer-events: none; } .vonnik-cb .vcb-hero__copy .vcb-wrap { padding-bottom: var(--vonnik-space-7); } .vonnik-cb .vcb-hero__copy a { pointer-events: auto; } .vonnik-cb .vcb-brand { display: flex; width: max-content; align-items: center; background: var(--vonnik-surface); border-radius: var(--vonnik-radius); padding: var(--vonnik-space-2) var(--vonnik-space-4); margin-bottom: var(--vonnik-space-4); box-shadow: var(--vonnik-shadow-float); } .vonnik-cb .vcb-brand img { height: 28px; width: auto; } .vonnik-cb .vcb-sticker { display: inline-block; background: var(--vonnik-yellow); color: var(--vonnik-on-signal); font-weight: var(--vonnik-weight-black); text-transform: uppercase; padding: var(--vonnik-space-3) var(--vonnik-space-4); border-radius: var(--vonnik-radius); transform: rotate(-2deg); font-size: var(--vonnik-text-l); letter-spacing: var(--vonnik-tracking-text); box-shadow: var(--vonnik-shadow-float); } .vonnik-cb .vcb-sticker b { font-size: var(--vonnik-text-xxl); letter-spacing: var(--vonnik-tracking-display); } .vonnik-cb .vcb-hero h1 { font-size: clamp(1.75rem, 0.9rem + 4.4vw, 4.25rem); margin: var(--vonnik-space-5) 0 var(--vonnik-space-3); color: var(--vonnik-on-action); } .vonnik-cb .vcb-hero__sub { color: var(--vonnik-ink-soft-inverse); font-size: var(--vonnik-text-l); margin-bottom: var(--vonnik-space-6); } .vonnik-cb .vcb-hero__nav { position: absolute; top: var(--vonnik-space-5); right: var(--vonnik-space-5); display: flex; align-items: center; gap: var(--vonnik-space-3); } .vonnik-cb .vcb-hero__nav button { width: var(--vonnik-control-tap); min-height: var(--vonnik-control-tap); padding: 0; border-radius: var(--vonnik-radius-round); border: 0; background: var(--vonnik-overlay-strong); color: var(--vonnik-on-action); display: grid; place-items: center; cursor: pointer; } .vonnik-cb .vcb-hero__nav .vcb-i { width: 20px; height: 20px; } .vonnik-cb .vcb-dots { display: flex; gap: var(--vonnik-space-2); margin-bottom: var(--vonnik-space-5); pointer-events: auto; } .vonnik-cb .vcb-dots { gap: 0; margin-left: calc(-1 * var(--vonnik-space-2)); } .vonnik-cb .vcb-dots button { display: grid; place-items: center; min-width: var(--vonnik-space-7); min-height: var(--vonnik-space-7); border: 0; padding: 0; background: transparent; cursor: pointer; } .vonnik-cb .vcb-dots button::before { content: ""; width: var(--vonnik-space-3); min-height: var(--vonnik-space-3); border-radius: var(--vonnik-radius-sheet); background: var(--vonnik-on-action); opacity: 0.45; transition: width var(--vonnik-motion-base) var(--vonnik-motion-ease); } .vonnik-cb .vcb-dots button[aria-current="true"]::before { width: var(--vonnik-space-7); background: var(--vonnik-yellow); opacity: 1; } .vonnik-cb .vcb-pick { padding: var(--vonnik-space-10) 0; background: var(--vonnik-grey-band); } .vonnik-cb .vcb-size { max-width: 420px; margin-bottom: var(--vonnik-space-7); } .vonnik-cb .vcb-size .vcb-eyebrow { display: block; margin-bottom: var(--vonnik-space-3); } .vonnik-cb .vcb-pick__title { font-size: var(--vonnik-text-display); margin: 0 0 var(--vonnik-space-6); } .vonnik-cb .vcb-card { background: var(--vonnik-surface); border-radius: var(--vonnik-radius); box-shadow: var(--vonnik-shadow-float); overflow: hidden; margin-top: var(--vonnik-space-3); } .vonnik-cb .vcb-card__top { padding: var(--vonnik-space-7) var(--vonnik-space-6) var(--vonnik-space-6); background: var(--vonnik-navy); color: var(--vonnik-on-action); } .vonnik-cb .vcb-card__size { font-size: var(--vonnik-text-s); font-weight: var(--vonnik-weight-bold); text-transform: uppercase; letter-spacing: 0.06em; color: var(--vonnik-ink-soft-inverse); } .vonnik-cb .vcb-card__pay { font-size: clamp(3rem, 2.3rem + 3vw, 4.5rem); font-weight: var(--vonnik-weight-black); line-height: 1; letter-spacing: -0.02em; margin: var(--vonnik-space-2) 0 var(--vonnik-space-4); } .vonnik-cb .vcb-card__pay small { font-size: var(--vonnik-text-xl); font-weight: var(--vonnik-weight-bold); letter-spacing: var(--vonnik-tracking-text); margin-left: var(--vonnik-space-2); color: var(--vonnik-ink-soft-inverse); } .vonnik-cb .vcb-card__math { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--vonnik-space-2) var(--vonnik-space-5); font-size: var(--vonnik-text-l); font-weight: var(--vonnik-weight-bold); color: var(--vonnik-on-action); } .vonnik-cb .vcb-card__math b { color: var(--vonnik-yellow); font-size: var(--vonnik-text-xl); font-weight: var(--vonnik-weight-black); } .vonnik-cb .vcb-card__body { padding: var(--vonnik-space-6); } .vonnik-cb .vcb-vs { display: grid; gap: var(--vonnik-space-4); margin-bottom: var(--vonnik-space-5); } .vonnik-cb .vcb-vs__row { display: grid; grid-template-columns: 112px 1fr; gap: var(--vonnik-space-5); align-items: center; } .vonnik-cb .vcb-vs__img { width: 112px; height: 84px; border-radius: var(--vonnik-radius); object-fit: cover; background: var(--vonnik-grey-card); } .vonnik-cb .vcb-vs__lbl { display: flex; justify-content: space-between; gap: var(--vonnik-space-3); font-size: var(--vonnik-text-s); margin-bottom: var(--vonnik-space-2); } .vonnik-cb .vcb-vs__lbl b { font-weight: var(--vonnik-weight-black); } .vonnik-cb .vcb-bar { height: 14px; border-radius: var(--vonnik-radius-sheet); background: var(--vonnik-grey-card); overflow: hidden; display: flex; } .vonnik-cb .vcb-bar span { display: block; width: var(--vonnik-cb-bar, 0); height: 100%; transition: width var(--vonnik-motion-base) var(--vonnik-motion-ease); } .vonnik-cb .vcb-bar__pay { background: var(--vonnik-blue); } .vonnik-cb .vcb-bar__back { background: repeating-linear-gradient(45deg, var(--vonnik-yellow) 0 6px, var(--vonnik-surface) 6px 12px); } .vonnik-cb .vcb-bar__dome { background: var(--vonnik-border-control); } .vonnik-cb .vcb-verdict { display: flex; gap: var(--vonnik-space-4); align-items: center; font-weight: var(--vonnik-weight-bold); margin-bottom: var(--vonnik-space-5); } .vonnik-cb .vcb-verdict.vonnik-notice--confirm { --vonnik-cb-win: color-mix(in srgb, var(--vonnik-green) 14%, var(--vonnik-surface)); background-color: var(--vonnik-cb-win); border-left-color: var(--vonnik-green); } .vonnik-cb .vcb-card .button { width: 100%; } .vonnik-cb .vcb-fine { font-size: var(--vonnik-text-xs); color: var(--vonnik-ink-soft); margin-top: var(--vonnik-space-4); text-align: center; } .vonnik-cb .vcb-steps { padding: 56px 0; } .vonnik-cb .vcb-steps__title { font-size: var(--vonnik-text-display); margin: var(--vonnik-space-3) 0 var(--vonnik-space-7); } .vonnik-cb .vcb-steps__list { list-style: none; padding: 0; display: grid; } .vonnik-cb .vcb-step { display: grid; grid-template-columns: 64px 1fr; gap: var(--vonnik-space-5); align-items: center; padding: var(--vonnik-space-3) 0; position: relative; margin: 0; } .vonnik-cb .vcb-step__ic { width: 64px; height: 64px; border-radius: var(--vonnik-radius-round); background: var(--vonnik-blue-soft); color: var(--vonnik-blue); display: grid; place-items: center; position: relative; z-index: var(--vonnik-layer-base); } .vonnik-cb .vcb-step__ic .vcb-i { width: 28px; height: 28px; } .vonnik-cb .vcb-step:last-child .vcb-step__ic { background: var(--vonnik-yellow); color: var(--vonnik-on-signal); } .vonnik-cb .vcb-step:not(:last-child)::after { content: ""; position: absolute; left: 31px; top: 64px; height: calc(100% - 44px); border-left: 2px dashed var(--vonnik-border); } .vonnik-cb .vcb-step__t { font-size: var(--vonnik-text-xl); font-weight: var(--vonnik-weight-black); text-transform: uppercase; line-height: var(--vonnik-line-tight); } .vonnik-cb .vcb-step__t a { color: inherit; text-decoration-thickness: 2px; text-underline-offset: 4px; } .vonnik-cb .vcb-dates { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--vonnik-space-3); margin-top: var(--vonnik-space-7); } .vonnik-cb .vcb-date { border-top: var(--vonnik-border-edge) solid var(--vonnik-navy); padding-top: var(--vonnik-space-4); } .vonnik-cb .vcb-date:last-child { border-color: var(--vonnik-yellow); } .vonnik-cb .vcb-date b { display: block; font-size: var(--vonnik-text-xxl); font-weight: var(--vonnik-weight-black); line-height: 1; } .vonnik-cb .vcb-date span { font-size: var(--vonnik-text-xs); text-transform: uppercase; font-weight: var(--vonnik-weight-bold); letter-spacing: 0.04em; color: var(--vonnik-ink-soft); } .vonnik-cb .vcb-facts { padding: 0 0 56px; } .vonnik-cb .vcb-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: var(--vonnik-space-4); } .vonnik-cb .vcb-tile { background: var(--vonnik-grey-card); border-radius: var(--vonnik-radius); padding: var(--vonnik-space-6) var(--vonnik-space-5); display: flex; flex-direction: column; gap: var(--vonnik-space-4); min-height: 150px; } .vonnik-cb .vcb-tile .vcb-i { color: var(--vonnik-blue); width: 28px; height: 28px; } .vonnik-cb .vcb-tile b { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem); font-weight: var(--vonnik-weight-black); line-height: 1; text-transform: uppercase; letter-spacing: var(--vonnik-tracking-display); } .vonnik-cb .vcb-tile span { font-size: var(--vonnik-text-s); color: var(--vonnik-ink-soft); line-height: 1.35; } .vonnik-cb .vcb-facts__no { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--vonnik-space-3) var(--vonnik-space-5); margin-top: var(--vonnik-space-4); font-size: var(--vonnik-text-s); color: var(--vonnik-ink-soft); } .vonnik-cb .vcb-facts__no a { display: inline-flex; align-items: center; gap: var(--vonnik-space-2); font-weight: var(--vonnik-weight-bold); color: var(--vonnik-blue); text-decoration: none; } .vonnik-cb .vcb-facts__no .vcb-i { width: 16px; height: 16px; } .vonnik-cb .vcb-close { position: relative; color: var(--vonnik-on-action); overflow: hidden; background: var(--vonnik-navy); } .vonnik-cb .vcb-close__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; } .vonnik-cb .vcb-close__shade { position: absolute; inset: 0; background: linear-gradient(180deg, var(--vonnik-overlay-strong), var(--vonnik-navy) 75%); opacity: 0.92; } .vonnik-cb .vcb-close .vcb-wrap { position: relative; padding-top: 64px; padding-bottom: 56px; } .vonnik-cb .vcb-close h2 { font-size: clamp(1.75rem, 0.9rem + 4.4vw, 4.25rem); margin: var(--vonnik-space-5) 0 var(--vonnik-space-3); color: var(--vonnik-on-action); } .vonnik-cb .vcb-close__date { font-size: var(--vonnik-text-xl); font-weight: var(--vonnik-weight-bold); color: var(--vonnik-yellow); text-transform: uppercase; margin-bottom: var(--vonnik-space-7); } .vonnik-cb .vcb-close__acts { display: grid; gap: var(--vonnik-space-4); max-width: 440px; } .vonnik-cb .vcb-close__mail { display: inline-flex; align-items: center; gap: var(--vonnik-space-3); margin-top: var(--vonnik-space-5); color: var(--vonnik-ink-soft-inverse); text-decoration: none; font-weight: var(--vonnik-weight-bold); } .vonnik-cb .vcb-close__who { margin-top: 36px; padding-top: var(--vonnik-space-6); border-top: var(--vonnik-border-hairline) solid var(--vonnik-line-inverse); font-size: var(--vonnik-text-s); color: var(--vonnik-ink-soft-inverse); display: flex; flex-wrap: wrap; gap: var(--vonnik-space-2) var(--vonnik-space-5); } .vonnik-cb .vcb-close__who b { color: var(--vonnik-on-action); } @media (max-width: 689.98px) { .vonnik-cb .vcb-vs__row { grid-template-columns: var(--vonnik-control-thumb) minmax(0, 1fr); gap: var(--vonnik-space-4); } .vonnik-cb .vcb-vs__img { width: var(--vonnik-control-thumb); height: var(--vonnik-control-thumb); } .vonnik-cb .vcb-vs__lbl { flex-wrap: wrap; column-gap: var(--vonnik-space-3); row-gap: 0; } .vonnik-cb .vcb-step__t { font-size: var(--vonnik-text-l); } .vonnik-cb .vcb-dates { grid-template-columns: minmax(0, 1fr); gap: 0; } .vonnik-cb .vcb-date { display: flex; justify-content: space-between; align-items: baseline; gap: var(--vonnik-space-4); padding: var(--vonnik-space-4) 0; border-top-width: var(--vonnik-border-hairline); } .vonnik-cb .vcb-date:first-child { border-top-width: var(--vonnik-border-edge); } .vonnik-cb .vcb-tiles { grid-template-columns: minmax(0, 1fr); gap: var(--vonnik-space-3); } .vonnik-cb .vcb-tile { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--vonnik-space-4); row-gap: var(--vonnik-space-1); align-items: center; min-height: 0; padding: var(--vonnik-space-5); } .vonnik-cb .vcb-tile .vcb-i { grid-row: span 2; } .vonnik-cb .vcb-tile span { margin-top: 0; } } @media (min-width: 690px) { .vonnik-cb .vcb-wrap { padding: 0 var(--vonnik-space-8); } .vonnik-cb :is(.vcb-hero__tag, .vcb-hero__nav) { left: var(--vonnik-space-8); } .vonnik-cb .vcb-hero__nav { left: auto; right: var(--vonnik-space-8); } .vonnik-cb .vcb-tiles { grid-template-columns: repeat(4, 1fr); } .vonnik-cb .vcb-close__acts { grid-template-columns: 1fr 1fr; max-width: 640px; } } @media (min-width: 1000px) { .vonnik-cb .vcb-hero { height: 680px; } .vonnik-cb .vcb-hero__copy .vcb-wrap { padding-bottom: 56px; } .vonnik-cb .vcb-hero__inner { max-width: 880px; } .vonnik-cb .vcb-hero__sub { font-size: var(--vonnik-text-xl); } .vonnik-cb .vcb-hero__copy .button { display: inline-flex; } .vonnik-cb .vcb-hero__nav { top: auto; bottom: 56px; right: max(var(--vonnik-space-8), calc((100vw - 1180px) / 2 + var(--vonnik-space-8))); } .vonnik-cb .vcb-hero__nav button { width: 52px; min-height: 52px; } .vonnik-cb .vcb-pick { padding: 80px 0; } .vonnik-cb .vcb-pick__grid { display: grid; grid-template-columns: 1fr 480px; gap: 56px; align-items: start; } .vonnik-cb .vcb-card { margin-top: 0; position: sticky; top: var(--vonnik-space-7); } .vonnik-cb .vcb-steps { padding: 88px 0; } .vonnik-cb .vcb-steps__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; } .vonnik-cb .vcb-steps__photo { border-radius: var(--vonnik-radius); overflow: hidden; aspect-ratio: 4 / 5; } .vonnik-cb .vcb-steps__photo img { width: 100%; height: 100%; object-fit: cover; object-position: var(--vonnik-cb-pos, 50% 50%); } .vonnik-cb .vcb-facts { padding-bottom: 88px; } .vonnik-cb .vcb-close .vcb-wrap { padding-top: 104px; padding-bottom: 88px; } } @media (max-width: 999.98px) { .vonnik-cb .vcb-steps__photo { display: none; } } @media (prefers-reduced-motion: reduce) { .vonnik-cb :is(.vcb-bar span, .vcb-dots button::before) { transition: none; } }