/* Zwei Werbeformate mit einem Taktgeber. Nie gleichzeitig, jedes mit Kreuz,
   jedes hoechstens einmal in 24 Stunden. */
.fnl[hidden]{display:none!important}

/* ---------- A: Karte in der Bildschirmmitte ---------- */
.fnl-modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px;
  background:rgba(7,19,13,.72);opacity:0;transition:opacity .2s ease}
.fnl-modal.is-on{opacity:1}
.fnl-modal__card{position:relative;width:100%;max-width:520px;background:var(--paper,#f6f7ee);
  border-radius:14px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45);
  transform:translateY(14px) scale(.985);transition:transform .24s cubic-bezier(.2,.8,.25,1)}
.fnl-modal.is-on .fnl-modal__card{transform:none}
.fnl-modal__art{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.fnl-x{position:absolute;top:10px;right:10px;z-index:2;width:38px;height:38px;display:grid;place-items:center;
  border:0;border-radius:50%;background:rgba(7,19,13,.68);color:#fff;font-size:20px;line-height:1;cursor:pointer}
.fnl-x:hover{background:rgba(7,19,13,.88)}
.fnl-modal__body{padding:22px 24px 24px}
.fnl-badge{display:inline-block;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
  font-weight:700;color:#3d4d44;background:var(--mint,#bdebd0);padding:5px 10px;border-radius:999px}
.fnl-modal__body h2{margin:12px 0 8px;font-size:1.72rem;line-height:1.12;letter-spacing:-.02em;color:var(--ink,#07130d)}
.fnl-modal__body p{margin:0 0 16px;font-size:.95rem;line-height:1.55;color:#42504a}
.fnl-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:54px;
  background:var(--lime,#d7ff45);color:var(--ink,#07130d);border-radius:8px;font-weight:800;
  font-size:.98rem;letter-spacing:.01em;text-decoration:none}
.fnl-cta:hover{filter:brightness(1.05)}
.fnl-no{display:block;width:100%;margin-top:10px;padding:10px;border:0;background:none;cursor:pointer;
  font:inherit;font-size:.83rem;color:#59655e;text-decoration:underline;text-underline-offset:3px}
.fnl-no:hover{color:var(--ink,#07130d)}
.fnl-fine{margin:14px 0 0;font-size:.7rem;line-height:1.55;color:#6b7771}
.fnl-fine a{text-decoration:underline;text-underline-offset:2px}

/* ---------- B: Karte in der Ecke ---------- */
.fnl-slide{position:fixed;right:18px;bottom:18px;z-index:115;width:min(372px,calc(100vw - 32px));
  display:flex;gap:12px;padding:12px;background:var(--ink,#07130d);color:#eaf3ec;border-radius:12px;
  box-shadow:0 22px 50px rgba(0,0,0,.4);transform:translateY(18px);opacity:0;
  transition:transform .26s cubic-bezier(.2,.8,.25,1),opacity .2s}
.fnl-slide.is-on{transform:none;opacity:1}
.fnl-slide__art{flex:none;width:92px;height:92px;border-radius:8px;object-fit:cover}
.fnl-slide__body{min-width:0;display:flex;flex-direction:column;gap:6px}
.fnl-slide__kicker{font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;color:var(--lime,#d7ff45);font-weight:700}
.fnl-slide__body strong{font-size:.95rem;line-height:1.25}
.fnl-slide__body p{margin:0;font-size:.78rem;line-height:1.45;color:#b9c8bf}
.fnl-slide__cta{align-self:flex-start;margin-top:2px;padding:9px 15px;border-radius:7px;
  background:var(--lime,#d7ff45);color:var(--ink,#07130d);font-weight:800;font-size:.8rem;text-decoration:none}
.fnl-slide__cta:hover{filter:brightness(1.05)}
.fnl-slide .fnl-x{top:6px;right:6px;width:28px;height:28px;font-size:16px;background:rgba(255,255,255,.14)}
.fnl-slide .fnl-x:hover{background:rgba(255,255,255,.26)}

@media(max-width:560px){
  .fnl-slide{left:10px;right:10px;bottom:10px;width:auto;padding:11px}
  .fnl-slide__art{width:74px;height:74px}
  .fnl-modal__body{padding:18px 18px 20px}
  .fnl-modal__body h2{font-size:1.46rem}
}
/* Die Leiste unten gehoert dem Mobil-Skript; die Ecke weicht ihr aus. */
@media(max-width:900px){.fnl-slide{bottom:calc(10px + var(--mobilebar-h,68px))}}
@media(prefers-reduced-motion:reduce){.fnl-modal,.fnl-modal__card,.fnl-slide{transition:none}}
