/* ==========================================================================
   Ilustrações dos prêmios, desenhadas em CSS (sem imagens: só as logos são arquivo).
   ========================================================================== */

/* Boleto com folha de trás · formatura quitada (1º e 2º) */
.bill { position: relative; width: 300px; height: 190px; flex: none; }
.bill::before { /* folha de trás */
  content: ""; position: absolute; inset: 0; border-radius: 12px;
  background: var(--text-soft); transform: translate(10px, -10px) rotate(7deg);
}
.bill__sheet {
  position: absolute; inset: 0; display: flex; flex-direction: column; gap: 12px;
  padding: 24px; border-radius: 12px; background: var(--paper);
  transform: rotate(-4deg); box-shadow: 0 22px 44px rgba(0, 0, 0, .35);
}
.bill__sheet i { display: block; height: 9px; border-radius: 4px; background: var(--muted); }
.bill__sheet i:first-child { width: 55%; height: 12px; background: var(--ink); }
.bill__sheet i:nth-child(2) { width: 85%; }
.bill__sheet i:nth-child(3) { width: 70%; }
.bill__sheet b {
  display: block; margin-top: auto; height: 46px;
  background: repeating-linear-gradient(90deg, var(--ink) 0 3px, transparent 3px 6px, var(--ink) 6px 7px, transparent 7px 10px);
}
.bill--sm { width: 228px; height: 146px; }
.bill--sm .bill__sheet { gap: 9px; padding: 18px; }
.bill--sm .bill__sheet b { height: 34px; }
.prize__ill .stamp { position: absolute; right: 22px; top: 22px; z-index: 1; background: var(--graphite); transform: rotate(12deg); }

/* Calendário com 12 meses pagos · 1 ano de mensalidade */
.cal {
  width: 240px; display: flex; flex-direction: column; gap: 8px; padding: 12px;
  border-radius: 12px; background: var(--paper); color: var(--ink);
  transform: rotate(-3deg); box-shadow: 0 22px 44px rgba(0, 0, 0, .5);
}
.cal__head { display: flex; justify-content: space-between; font-family: var(--f-mono); font-weight: 700; font-size: 11px; text-transform: uppercase; }
.cal__head span:last-child { padding: 0 5px; border-radius: 4px; background: var(--accent); }
.cal__grid {
  list-style: none; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px;
  font-family: var(--f-mono); font-weight: 700; font-size: 10px; text-align: center; text-transform: uppercase;
}
.cal__grid li { height: 34px; line-height: 34px; border-radius: 6px; background: var(--accent); }

/* Convites em leque · 3 convites extras */
.invite { position: relative; width: 250px; height: 150px; }
.invite__back, .invite__card { position: absolute; left: 10px; top: 22px; width: 220px; height: 106px; border-radius: 12px; }
.invite__back--1 { background: #3A3A3A; transform: rotate(-14deg) translate(-12px, 0); }
.invite__back--2 { background: var(--text-soft); transform: rotate(-5deg); }
.invite__card {
  display: flex; overflow: hidden; background: var(--paper); color: var(--ink);
  transform: rotate(5deg) translate(8px, 4px); box-shadow: 0 22px 44px rgba(0, 0, 0, .45);
}
.invite__main {
  flex: 1; display: flex; flex-direction: column; justify-content: space-between;
  padding: 14px; border-right: 2px dashed var(--muted);
}
.invite__main small { font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.invite__main b { font-stretch: var(--stretch-condensed); font-weight: 900; font-size: 28px; line-height: .9; text-transform: uppercase; }
.invite__stub {
  display: grid; place-items: center; width: 46px; background: var(--accent);
  font-family: var(--f-mono); font-weight: 700; font-size: 17px;
}

/* Cartão de embarque · Comunidade 1% */
.pass {
  width: 286px; height: 136px; display: flex; overflow: hidden;
  border-radius: 14px; background: var(--paper); color: var(--ink);
  transform: rotate(3deg); box-shadow: 0 22px 44px rgba(0, 0, 0, .5);
}
.pass__main { flex: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 15px 16px; }
.pass__main small { font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.pass__route {
  display: flex; align-items: center; gap: 8px;
  font-stretch: var(--stretch-condensed); font-weight: 900; font-size: 44px; line-height: .9;
}
.pass__route svg { width: 28px; height: 16px; fill: none; stroke: var(--accent); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.pass__stub { position: relative; width: 56px; background: var(--accent); border-left: 3px dashed var(--ink); }
.pass__stub::after {
  content: ""; position: absolute; inset: 18px 19px;
  background: repeating-linear-gradient(0deg, var(--ink) 0 3px, transparent 3px 6px, var(--ink) 6px 7px, transparent 7px 10px);
}

/* Celular com acesso vitalício · MEDsimple */
.phone {
  width: 138px; height: 184px; padding: 14px 12px; border-radius: 24px;
  border: 5px solid #3A3A3A; background: var(--paper); color: var(--ink);
  transform: rotate(-5deg); box-shadow: 0 22px 44px rgba(0, 0, 0, .5);
}
.phone__screen { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; }
.phone__screen::before { content: ""; width: 38px; height: 5px; border-radius: 3px; background: var(--muted); }
.phone__inf { width: 76px; height: 38px; fill: none; stroke: var(--accent); stroke-width: 6; stroke-linecap: round; overflow: visible; }
.phone__screen small { font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; line-height: 1.3; text-align: center; text-transform: uppercase; }

/* Bilhete do Curso MEDEletro · MEDGRUPO (classe .voucher mantida; grafia oficial: MEDEletro) */
.voucher {
  width: 272px; height: 146px; display: flex; overflow: hidden;
  border-radius: 14px; background: var(--paper); color: var(--ink);
  transform: rotate(-3deg); box-shadow: 0 22px 44px rgba(0, 0, 0, .5);
}
.voucher__main { flex: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 14px 16px; }
.voucher__main small { font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.voucher__main b { font-stretch: var(--stretch-condensed); font-weight: 900; font-size: 64px; line-height: .8; }
/* MEDEletro (9 letras) não cabe nos 64px pensados para "100%": a área útil é ~188px.
   46px deixa folga antes do canhoto. min-width: 0 impede o texto de alargar a caixa e ser cortado. */
.voucher__main { min-width: 0; }
.voucher__main .voucher__curso { font-size: 46px; line-height: .9; }
.voucher__stub {
  position: relative; width: 52px; background: var(--accent); border-left: 3px dashed var(--ink);
  -webkit-mask: radial-gradient(8px at 0 50%, #0000 98%, #000); mask: radial-gradient(8px at 0 50%, #0000 98%, #000);
}

/* Leque do hero (telas largas): os três prêmios gerais como cartas */
.fan { position: relative; width: 420px; height: 440px; }
.fan__item { position: absolute; }
.fan__item--bill { left: 30px; top: 30px; z-index: 2; }
.fan__item--cal { right: 0; top: 196px; z-index: 3; }
.fan__item--invite { left: 0; top: 270px; z-index: 1; }
.fan__item--bill .bill { transform: rotate(-6deg); }
.fan__item--cal .cal { transform: rotate(7deg); }
.fan__item--invite .invite { transform: rotate(-4deg); }
.fan__stamp { position: absolute; right: 6px; top: 6px; z-index: 4; font-size: 20px; background: var(--ink); }