/* Selos promocionais — 4 conceitos. Visível só o do tema ativo (body.theme-vN). */
.promo { display:none; }
.disp-pct { font-family: var(--font-display); font-weight: 800; line-height:.9; }

.promo--hero  { position:absolute; z-index:2; right:24%; top:24%; }
.promo--offer { position:relative; }

/* V1 maior no hero (desktop) */
@media (min-width:1100px){
  .promo--hero.v1 { width:238px; height:238px; }
  .promo--hero.v1 .disc { width:188px; height:188px; }
  .promo--hero.v1 .pct  { font-size:3.6rem; }
  .promo--hero.v1 .l1   { font-size:11px; }
  .promo--hero.v1 .mini { font-size:11px; padding:3px 11px; }
}

body.theme-v1 .promo.v1,
body.theme-v2 .promo.v2,
body.theme-v3 .promo.v3,
body.theme-v4 .promo.v4 { display:flex; }

/* ===== V1 — Starburst (pulsa) ===== */
.v1 { width:178px; height:178px; align-items:center; justify-content:center; transform: rotate(-6deg); }
.promo--hero.v1 { animation: promoPulse 2.4s var(--ease-in-out) infinite; }
.promo--offer.v1 { width:200px; height:200px; }
.v1::before { content:""; position:absolute; inset:0; border-radius:50%;
  background: repeating-conic-gradient(#3B82D6 0 7deg, transparent 7deg 17deg);
  filter: drop-shadow(0 6px 16px rgba(30,95,190,.5)); }
.v1 .disc { position:relative; width:140px; height:140px; border-radius:50%;
  background: linear-gradient(135deg,#2F7BE0,#154A9B); color:#fff;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  box-shadow: inset 0 2px 8px rgba(255,255,255,.25), 0 0 0 4px var(--steel-950); }
.promo--offer.v1 .disc { width:160px; height:160px; box-shadow: inset 0 2px 8px rgba(255,255,255,.25), 0 0 0 4px var(--steel-800); }
.v1 .pct { font-size:2.7rem; }
.v1 .l1 { font-family: var(--font-mono); font-size:9.5px; letter-spacing:.1em; margin-top:1px; }
.v1 .mini { margin-top:5px; font-family: var(--font-display); font-weight:700; font-size:10px; background:#fff; color:#154A9B; border-radius:999px; padding:2px 9px; text-transform:uppercase; }
@keyframes promoPulse { 0%,100%{ transform: rotate(-6deg) scale(1); } 50%{ transform: rotate(-6deg) scale(1.05); } }

/* ===== V2 — Spark Amber ===== */
.v2 { width:170px; height:170px; border-radius:50%; transform: rotate(-8deg);
  background: radial-gradient(circle at 35% 28%, #FFE39E, #F2A93B 46%, #C9842B 100%);
  border:4px solid #FFE9B8; box-shadow: 0 12px 34px rgba(201,132,43,.55);
  flex-direction:column; align-items:center; justify-content:center; text-align:center; color:#3A2A0B; }
.promo--offer.v2 { width:196px; height:196px; }
.v2 .pct { font-size:2.9rem; }
.v2 .l1 { font-family: var(--font-display); font-weight:700; font-size:12px; line-height:1.05; margin-top:2px; text-transform:uppercase; }

/* ===== V3 — Selo metal ===== */
.v3 { width:174px; height:174px; border-radius:50%; transform: rotate(-4deg);
  background: radial-gradient(circle at 32% 26%, #EEF0F2, #AEB4BB 38%, #5A6675 78%, #2B3947 100%);
  box-shadow: inset 0 3px 10px rgba(255,255,255,.6), inset 0 -10px 18px rgba(0,0,0,.45), 0 12px 30px rgba(0,0,0,.5);
  align-items:center; justify-content:center; }
.promo--offer.v3 { width:196px; height:196px; }
.v3::before { content:""; position:absolute; inset:12px; border-radius:50%; border:2px dashed rgba(27,38,55,.35); }
.v3 .in { text-align:center; color:#1B2637; text-shadow:0 1px 0 rgba(255,255,255,.6); }
.v3 .pct { font-size:2.7rem; }
.v3 .l1 { font-family: var(--font-mono); font-size:9.5px; letter-spacing:.12em; }

/* ===== V4 — Etiqueta / tag ===== */
.v4 { transform: rotate(-7deg); width:200px;
  background: linear-gradient(135deg,#2F7BE0,#154A9B); color:#fff;
  padding:18px 20px 18px 40px; border-radius:10px;
  clip-path: polygon(18px 0, 100% 0, 100% 100%, 18px 100%, 0 50%);
  box-shadow: 0 12px 30px rgba(30,95,190,.45);
  flex-direction:column; align-items:flex-start; }
.promo--offer.v4 { width:230px; }
.v4::before { content:""; position:absolute; left:13px; top:50%; width:11px; height:11px; border-radius:50%;
  background: var(--steel-950); transform: translateY(-50%); box-shadow: inset 0 0 0 2px rgba(255,255,255,.4); }
.promo--offer.v4::before { background: var(--steel-900); }
.v4 .pct { font-size:2.5rem; }
.v4 .l1 { font-family: var(--font-mono); font-size:10px; letter-spacing:.08em; margin-top:2px; }
.v4 .mini { display:inline-block; margin-top:6px; font-family: var(--font-display); font-weight:700; font-size:10px; border:1px solid rgba(255,255,255,.6); border-radius:999px; padding:2px 9px; text-transform:uppercase; }

/* esconde o selo do hero no mobile (a tarja do topo carrega a oferta) */
@media (max-width:700px){ .promo--hero { display:none !important; } }