/* =====================================================================
   Bewertungen24 · promo-popup.css
   Exit-Intent + Zeit-getriggertes Rabatt-Popup (AKTION15 = 15%).
   Design-Sprache: Ink (near-black navy) + einzelner Amber-Akzent,
   Space Grotesk Display. Passend zu home.css / landing.css.
   ===================================================================== */

.bbpop-overlay{
  position:fixed;inset:0;z-index:99999;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  background:rgba(6,9,16,.72);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  opacity:0;visibility:hidden;
  transition:opacity .32s cubic-bezier(.22,.61,.36,1),visibility .32s;
}
.bbpop-overlay.bbpop-open{opacity:1;visibility:visible}

.bbpop-modal{
  position:relative;
  width:100%;max-width:440px;
  background:linear-gradient(180deg,#141a2b 0%,#0b0f1a 100%);
  color:#f4f2ec;
  border:1px solid rgba(255,255,255,.10);
  border-radius:24px;
  box-shadow:0 2px 4px rgba(0,0,0,.4),0 50px 90px -30px rgba(0,0,0,.75);
  padding:38px 34px 30px;
  text-align:center;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  transform:translateY(16px) scale(.97);
  transition:transform .34s cubic-bezier(.22,.61,.36,1);
}
.bbpop-overlay.bbpop-open .bbpop-modal{transform:translateY(0) scale(1)}

.bbpop-close{
  position:absolute;top:14px;right:14px;
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;line-height:1;color:#9aa1b8;
  background:rgba(255,255,255,.06);
  transition:background .2s,color .2s;
}
.bbpop-close:hover{background:rgba(255,255,255,.12);color:#f4f2ec}
.bbpop-close:focus-visible{outline:2px solid #00B67A;outline-offset:2px}

.bbpop-gift{font-size:44px;line-height:1;margin-bottom:14px;display:block}

.bbpop-head{
  font-family:"Space Grotesk",-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;
  font-weight:700;letter-spacing:-.02em;line-height:1.12;
  font-size:1.62rem;margin:0 0 12px;
  background:linear-gradient(92deg,#efb057 0%,#00B67A 45%,#00875C 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:#00B67A;
}
.bbpop-sub{
  font-size:.98rem;line-height:1.55;color:#c8cde0;
  margin:0 auto 22px;max-width:340px;
}

.bbpop-code{
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  margin:0 auto 8px;max-width:300px;
  padding:14px 18px;
  border:2px dashed rgba(232,163,61,.55);
  border-radius:14px;
  background:rgba(232,163,61,.08);
  cursor:pointer;
  transition:border-color .2s,background .2s,transform .12s;
}
.bbpop-code:hover{border-color:#00B67A;background:rgba(232,163,61,.14)}
.bbpop-code:active{transform:scale(.98)}
.bbpop-code:focus-visible{outline:2px solid #00B67A;outline-offset:2px}
.bbpop-code-value{
  font-family:"Space Grotesk",monospace;
  font-weight:700;font-size:1.35rem;letter-spacing:.12em;
  color:#f4f2ec;
}
.bbpop-code-icon{font-size:1.05rem;opacity:.85}
.bbpop-copyhint{
  font-size:.8rem;color:#9aa1b8;margin:0 0 22px;
  transition:color .2s;
}
.bbpop-copyhint.bbpop-copied{color:#5fce93;font-weight:600}

.bbpop-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  width:100%;
  font-family:"Space Grotesk",-apple-system,sans-serif;
  font-weight:600;font-size:1.05rem;letter-spacing:-.01em;
  color:#241703;
  background:#00B67A;
  border-radius:14px;
  padding:15px 22px;
  box-shadow:0 12px 28px -10px rgba(201,130,31,.6);
  transition:background .2s,transform .18s,box-shadow .2s;
}
.bbpop-cta:hover{background:#efb057;transform:translateY(-2px);box-shadow:0 22px 40px -14px rgba(201,130,31,.62)}
.bbpop-cta:active{transform:translateY(0)}
.bbpop-cta:focus-visible{outline:2px solid #f4f2ec;outline-offset:2px}
.bbpop-cta .bbpop-arw{transition:transform .3s cubic-bezier(.22,.61,.36,1)}
.bbpop-cta:hover .bbpop-arw{transform:translateX(4px)}

.bbpop-fine{
  font-size:.76rem;line-height:1.5;color:#7f869d;
  margin:16px auto 0;max-width:320px;
}

@media (max-width:480px){
  .bbpop-modal{padding:32px 22px 26px;border-radius:20px}
  .bbpop-head{font-size:1.42rem}
  .bbpop-gift{font-size:38px}
}
@media (prefers-reduced-motion:reduce){
  .bbpop-overlay,.bbpop-modal,.bbpop-cta,.bbpop-code{transition:none}
  .bbpop-overlay.bbpop-open .bbpop-modal{transform:none}
}