/* Pop-up promocional de entrada. Paleta própria (marinho + dourado da capa), igual nos temas claro e escuro. */
.promo{--p-navy:#14213A;--p-navy2:#1C2D52;--p-deep:#0C1428;--p-gold:#D6B160;--p-gold-l:#F0D79C;--p-gold-d:#9C762B;--p-ink:#F4EFE4;
  position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:16px;
  padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));
  font-family:var(--sans,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif)}
.promo[hidden]{display:none}
html.promo-lock{overflow:hidden}

.promo-backdrop{position:absolute;inset:0;background:rgba(6,10,22,.74);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity .3s ease}
.promo-card{position:relative;width:100%;max-width:460px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;
  color:var(--p-ink);text-align:center;border-radius:22px;border:1px solid rgba(214,177,96,.5);
  background:radial-gradient(120% 70% at 50% -10%,rgba(214,177,96,.22),transparent 60%),linear-gradient(165deg,var(--p-navy2) 0%,var(--p-navy) 52%,var(--p-deep) 100%);
  box-shadow:0 0 0 6px rgba(20,33,58,.55),0 30px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08);
  opacity:0;transform:translateY(18px) scale(.96);transition:opacity .32s ease,transform .38s cubic-bezier(.2,.8,.2,1)}
.promo-card:focus{outline:none}
.promo.is-open .promo-backdrop{opacity:1}
.promo.is-open .promo-card{opacity:1;transform:none}
.promo-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,transparent,var(--p-gold),var(--p-gold-l),var(--p-gold),transparent)}

.promo-in{padding:34px 24px 22px}
.promo-x{position:absolute;top:10px;right:10px;width:44px;height:44px;display:grid;place-items:center;padding:0;border-radius:50%;cursor:pointer;
  color:var(--p-ink);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);transition:background .2s,transform .2s}
.promo-x:hover{background:rgba(255,255,255,.16);transform:rotate(90deg)}
.promo-x svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}

.promo-title{margin:0 28px 0;font-family:var(--serif,Georgia,serif);font-weight:700;font-size:1.22rem;line-height:1.25;letter-spacing:.06em;color:var(--p-gold-l);text-wrap:balance}
.promo-ico{display:inline-block;margin-right:.3em;letter-spacing:0}
.promo-orn{display:flex;align-items:center;justify-content:center;gap:10px;margin:14px auto 18px;max-width:240px}
.promo-orn i{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(214,177,96,.8))}
.promo-orn i:last-child{background:linear-gradient(270deg,transparent,rgba(214,177,96,.8))}
.promo-orn b{width:7px;height:7px;background:var(--p-gold);transform:rotate(45deg)}

.promo-hero{display:flex;align-items:center;justify-content:center;gap:18px;margin:0 0 18px}
.promo-cover{width:104px;height:auto;border-radius:6px;box-shadow:0 14px 30px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.12);transform:rotate(-4deg)}
.promo-seal{position:relative;flex:none;width:122px;height:122px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:var(--p-navy);background:radial-gradient(circle at 32% 25%,#FFF1C9 0%,var(--p-gold) 42%,var(--p-gold-d) 100%);
  box-shadow:0 10px 28px rgba(0,0,0,.5),0 0 0 4px rgba(214,177,96,.28),0 0 40px rgba(214,177,96,.35);transform:rotate(-6deg);animation:promo-pulse 2.6s ease-in-out 1s infinite}
.promo-seal::after{content:"";position:absolute;inset:7px;border-radius:50%;border:1.5px dashed rgba(20,33,58,.55)}
.promo-seal b{font-family:var(--serif,Georgia,serif);font-size:2.7rem;line-height:1;font-weight:800;letter-spacing:-.02em}
.promo-seal span{margin-top:3px;font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}

.promo-lead{margin:0 auto 16px;max-width:34ch;font-size:1.05rem;line-height:1.5;color:var(--p-ink)}
.promo-lead strong{color:var(--p-gold-l)}
.promo-lead em{font-family:var(--serif,Georgia,serif);font-style:italic;font-weight:700;color:#fff}

.promo-x:focus-visible,.promo-skip:focus-visible{outline:3px solid #fff;outline-offset:3px}

.promo-coupon{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:0 auto;padding:14px 18px;border-radius:14px;border:2px dashed var(--p-gold);background:rgba(214,177,96,.12);box-shadow:inset 0 0 0 1px rgba(214,177,96,.18)}
.promo-coupon span{font-size:.95rem;font-weight:600;color:var(--p-ink)}
.promo-coupon b{font-family:var(--serif,Georgia,serif);font-size:1.9rem;line-height:1;font-weight:800;letter-spacing:.14em;color:var(--p-gold-l);text-shadow:0 0 18px rgba(214,177,96,.45);user-select:all}
.promo-use{margin:12px auto 0;max-width:34ch;font-size:.95rem;line-height:1.45;color:rgba(244,239,228,.88)}
.promo-skip{margin:6px 0 0;padding:10px 14px;background:none;border:0;color:rgba(244,239,228,.7);font:inherit;font-size:.9rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.promo-skip:hover{color:#fff}

@keyframes promo-pulse{0%,100%{transform:rotate(-6deg) scale(1)}50%{transform:rotate(-6deg) scale(1.05)}}

@media (min-width:520px){
  .promo-in{padding:40px 36px 26px}
  .promo-title{font-size:1.42rem}
  .promo-cover{width:128px}
  .promo-seal{width:140px;height:140px}
  .promo-seal b{font-size:3.1rem}
  .promo-hero{gap:26px}
}
@media (max-width:360px){
  .promo-in{padding:30px 16px 18px}
  .promo-title{font-size:1.08rem;margin:0 22px}
  .promo-cover{width:84px}
  .promo-seal{width:108px;height:108px}
  .promo-seal b{font-size:2.3rem}
  .promo-hero{gap:12px}
}
@media (max-height:520px){ .promo-hero{display:none} }
@media (prefers-reduced-motion:reduce){
  .promo-backdrop,.promo-card,.promo-x{transition:none}
  .promo-seal{animation:none}
}
