/* Poklon kartica: isti izgled na sajtu i na slici za mejl. Veličine u cqw, pa se kartica skalira sa širinom. */
.igr-gc { --gc-a: #289595; --gc-b: #fcb150; --gc-c: #fc9a98; --gc-ink: #1f7f7f; --gc-navy: #1d2a5c;
  position: relative; container-type: inline-size; aspect-ratio: 1.6; overflow: hidden; border-radius: 22px; background: #fffaf2;
  box-shadow: 0 24px 40px -22px rgb(29 42 92 / 0.45), inset 0 0 0 1px rgb(29 42 92 / 0.06); color: var(--gc-navy); font-family: "Nunito", system-ui, sans-serif; }
.igr-gc--sun   { --gc-a: #fcb150; --gc-b: #fc7a78; --gc-c: #9fd8d2; --gc-ink: #d0841b; }
.igr-gc--teal  { --gc-a: #289595; --gc-b: #fcb150; --gc-c: #fc9a98; --gc-ink: #1f7f7f; }
.igr-gc--coral { --gc-a: #fc7a78; --gc-b: #9fd8d2; --gc-c: #fcb150; --gc-ink: #e0504e; }
.igr-gc--lilac { --gc-a: #8f86e8; --gc-b: #fcb150; --gc-c: #9fd8d2; --gc-ink: #5b51c4; }
.igr-gc--navy  { --gc-a: #1d2a5c; --gc-b: #fcb150; --gc-c: #fc7a78; --gc-ink: #1d2a5c; }
.igr-gc__blob { position: absolute; display: block; border-radius: 58% 42% 55% 45% / 50% 60% 40% 50%; }
.igr-gc__blob--tl { left: -9cqw; top: -11cqw; width: 26cqw; height: 22cqw; background: var(--gc-c); opacity: 0.55; }
.igr-gc__blob--tr { right: -10cqw; top: -14cqw; width: 40cqw; height: 32cqw; background: var(--gc-a); opacity: 0.9; border-radius: 45% 55% 40% 60% / 55% 45% 60% 40%; }
.igr-gc__blob--bl { left: -12cqw; bottom: -16cqw; width: 42cqw; height: 30cqw; background: var(--gc-b); opacity: 0.55; }
.igr-gc__blob--br { right: -8cqw; bottom: -12cqw; width: 30cqw; height: 24cqw; background: var(--gc-b); opacity: 0.85; border-radius: 60% 40% 50% 50% / 45% 55% 45% 55%; }
.igr-gc__logo { position: absolute; left: 7cqw; top: 8cqw; width: 34cqw; height: auto; }
.igr-gc__body { position: absolute; left: 7cqw; top: 25cqw; display: flex; flex-direction: column; gap: 1.4cqw; }
.igr-gc__title { font: 800 7.6cqw/1 "Baloo 2", ui-rounded, sans-serif; color: var(--gc-navy); letter-spacing: -0.01em; }
.igr-gc__tag { display: flex; align-items: center; gap: 1.6cqw; font-size: 2.2cqw; font-weight: 800; letter-spacing: 0.32em; color: var(--gc-navy); opacity: 0.8; }
.igr-gc__tag i { width: 1.4cqw; height: 1.4cqw; border-radius: 50%; background: var(--gc-a); }
.igr-gc__tag i + i, .igr-gc__tag i:last-of-type { background: var(--gc-b); }
.igr-gc__tag i:first-of-type { background: #289595; }
.igr-gc__tag i:last-of-type { background: #fc7a78; }
.igr-gc__amount { margin-top: 2.6cqw; font: 800 10cqw/1 "Baloo 2", ui-rounded, sans-serif; color: var(--gc-ink); }
.igr-gc__gift { position: absolute; right: 10cqw; top: 27cqw; width: 21cqw; }
.igr-gc__gift svg { display: block; width: 100%; height: auto; }
.igr-gc__gift .g-box { fill: var(--gc-a); }
.igr-gc__gift .g-lid { fill: var(--gc-a); filter: brightness(0.92); }
.igr-gc--navy .igr-gc__gift .g-box, .igr-gc--navy .igr-gc__gift .g-lid { fill: #289595; }
.igr-gc__gift .g-rib { fill: #fc7a78; }
.igr-gc--coral .igr-gc__gift .g-rib { fill: #fcb150; }
.igr-gc__gift .g-bow { fill: #fcb150; }
.igr-gc--sun .igr-gc__gift .g-bow, .igr-gc--lilac .igr-gc__gift .g-bow { fill: #fc7a78; }
.igr-gc__heart { position: absolute; left: 52cqw; bottom: 9cqw; width: 4.2cqw; }
.igr-gc__heart svg { display: block; width: 100%; fill: none; stroke: #fc7a78; stroke-width: 2.4; }
.igr-gc__to { position: absolute; left: 7cqw; bottom: 6.5cqw; font-size: 2.6cqw; font-weight: 800; color: var(--gc-navy); }
.igr-gc__code { position: absolute; right: 7cqw; bottom: 6.5cqw; padding: 0.8cqw 1.8cqw; border-radius: 1.6cqw; background: rgb(255 255 255 / 0.85); font: 700 2.4cqw/1 ui-monospace, monospace; letter-spacing: 0.08em; color: var(--gc-navy); }
.gc-preview .igr-gc { transition: box-shadow 0.2s; }
.gc-preview .igr-gc * { transition: background-color 0.3s, fill 0.3s, color 0.3s; }
.gc-mini-card { width: 260px; flex-shrink: 0; }
.gc-mini-card .igr-gc { border-radius: 16px; }
@media (max-width: 640px) { .gc-mini-card { width: 100%; max-width: 320px; } }