
:where(#osl-ban,#osl-ban *){box-sizing:border-box;margin:0;padding:0}
#osl-ban{--ink:#0A0A0A;--copper:#B86B1D;--copper-d:#9C5811;--copper-l:#DB9540;--slate:#2C3A45;--bg:#F4F5F8;--dark:#17191E;
  max-width:1200px;margin:48px auto;padding:0 20px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.oslb-card{display:flex;align-items:stretch;background:var(--bg);border-radius:18px;overflow:hidden;box-shadow:0 14px 40px rgba(23,25,30,.10);border:1px solid #E3E6EB}
.oslb-date{flex:0 0 240px;background:var(--dark);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px 16px}
.oslb-date small{font-size:13px;font-weight:700;letter-spacing:.24em;color:var(--copper-l)}
.oslb-date .d{font-family:Georgia,"Times New Roman",serif;font-size:74px;line-height:1;margin-top:6px}
.oslb-date .w{font-size:24px;font-weight:700;letter-spacing:.18em;margin-top:10px}
.oslb-date .h{font-size:16px;color:#C9CDD3;margin-top:4px}
.oslb-main{position:relative;flex:1;display:flex;align-items:center;gap:32px;padding:32px 40px;overflow:hidden}
.oslb-main::before{content:"";position:absolute;right:0;top:0;bottom:0;width:45%;background:var(--oslb-img) 50% 12%/cover no-repeat;opacity:.45;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 70%);mask-image:linear-gradient(90deg,transparent 0,#000 70%)}
.oslb-main>*{position:relative}
.oslb-txt{flex:1}
.oslb-eb{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--copper)}
.oslb-eb::before{content:"";width:28px;height:2px;background:var(--copper)}
.oslb-h{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:44px;line-height:1.05;color:var(--ink);margin-top:10px;letter-spacing:-.01em}
.oslb-h span{display:block;font-size:20px;color:var(--slate);margin-bottom:2px}
.oslb-claim{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:22px;color:var(--copper);margin-top:6px}
.oslb-act{display:flex;flex-direction:column;align-items:center;gap:10px;flex:0 0 auto}
.oslb-cta{display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:12px;background:linear-gradient(180deg,var(--copper),var(--copper-d));
  color:#fff!important;text-decoration:none!important;font-size:18px;font-weight:700;white-space:nowrap;box-shadow:0 10px 24px rgba(156,88,17,.3)}
.oslb-offer{font-size:13px;font-weight:700;color:var(--copper)}
@media (max-width:820px){
  .oslb-card{flex-direction:column}
  .oslb-date{flex:none;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:baseline;gap:2px 12px;padding:18px 22px;text-align:left}
  .oslb-date small{width:100%;font-size:11px}
  .oslb-date .d{font-size:50px}.oslb-date .w{font-size:20px;margin-top:0}.oslb-date .h{font-size:15px;margin-top:0}
  .oslb-main{flex-direction:column;align-items:stretch;gap:20px;padding:22px}
  .oslb-main::before{width:65%;opacity:.3}
  .oslb-h{font-size:38px}.oslb-claim{font-size:20px}
  .oslb-cta{justify-content:center;width:100%}
  .oslb-act{align-items:stretch;text-align:center}
}


:where(#osl-pop,#osl-pop *){box-sizing:border-box;margin:0;padding:0}
#osl-pop{--ink:#0A0A0A;--copper:#B86B1D;--copper-d:#9C5811;--copper-l:#DB9540;--slate:#2C3A45;--bg:#F4F5F8;--dark:#17191E;
  position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:24px;
  background:rgba(10,12,16,.55);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
#osl-pop.osl-open{display:flex;animation:osl-fade .25s ease}
@keyframes osl-fade{from{opacity:0}to{opacity:1}}
.osl-card{position:relative;display:flex;width:100%;max-width:860px;min-height:440px;background:var(--bg);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.35);animation:osl-up .3s ease}
@keyframes osl-up{from{transform:translateY(16px)}to{transform:none}}
.osl-date{flex:0 0 290px;background:var(--dark);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px 20px}
.osl-date small{font-size:15px;font-weight:700;letter-spacing:.24em;color:var(--copper-l)}
.osl-date .osl-d{font-family:Georgia,"Times New Roman",serif;font-size:92px;line-height:1;margin-top:8px;letter-spacing:-.01em}
.osl-date .osl-w{font-size:28px;font-weight:700;letter-spacing:.18em;margin-top:12px}
.osl-date .osl-h{font-size:18px;color:#C9CDD3;margin-top:6px}
.osl-date .osl-loc{font-size:14px;color:#9AA0A8;margin-top:2px}
.osl-main{position:relative;flex:1;padding:44px 44px 40px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.osl-main::before{content:"";position:absolute;right:-40px;top:0;bottom:0;width:62%;background:var(--osl-img) 50% 10%/cover no-repeat;opacity:.55;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 60%);mask-image:linear-gradient(90deg,transparent 0,#000 60%)}
.osl-main>*{position:relative}
.osl-eb{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--copper)}
.osl-eb::before{content:"";width:32px;height:2px;background:var(--copper)}
.osl-pre{font-family:Georgia,"Times New Roman",serif;font-size:24px;color:var(--slate);margin-top:18px;line-height:1}
.osl-h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:58px;line-height:1.02;color:var(--ink);letter-spacing:-.015em;margin-top:4px}
.osl-claim{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:23px;color:var(--copper);margin-top:8px}
.osl-prog{font-size:16px;color:var(--slate);margin-top:16px;line-height:1.5;font-weight:500;max-width:440px}
.osl-cta{display:inline-flex;align-self:flex-start;align-items:center;gap:10px;margin-top:24px;padding:16px 26px;border-radius:12px;
  background:linear-gradient(180deg,var(--copper),var(--copper-d));color:#fff!important;text-decoration:none!important;font-size:18px;font-weight:700;
  box-shadow:0 10px 24px rgba(156,88,17,.3);transition:transform .15s ease,box-shadow .15s ease}
.osl-cta:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(156,88,17,.38)}
.osl-offer{margin-top:12px;font-size:14px;font-weight:700;color:var(--copper);letter-spacing:.02em}
.osl-x{position:absolute;top:12px;right:12px;z-index:2;width:40px;height:40px;border:0;border-radius:50%;background:rgba(23,25,30,.08);color:var(--ink);
  font-size:22px;line-height:40px;text-align:center;cursor:pointer}
.osl-x:hover{background:rgba(23,25,30,.16)}

/* ---------- Handy: Bottom-Sheet ---------- */
@media (max-width:640px){
  #osl-pop{align-items:flex-end;padding:0}
  .osl-card{flex-direction:column;max-width:none;min-height:0;border-radius:20px 20px 0 0;max-height:82vh;overflow-y:auto;animation:osl-sheet .3s ease}
  @keyframes osl-sheet{from{transform:translateY(40px)}to{transform:none}}
  .osl-date{flex:none;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:baseline;gap:4px 12px;padding:22px 64px 18px 22px;text-align:left}
  .osl-date small{width:100%;font-size:12px}
  .osl-date .osl-d{font-size:56px;margin-top:2px}
  .osl-date .osl-w{font-size:22px;margin-top:0}
  .osl-date .osl-h{font-size:16px;margin-top:0}
  .osl-date .osl-loc{display:none}
  .osl-main{padding:24px 22px 28px}
  .osl-main::before{width:70%;opacity:.35}
  .osl-pre{font-size:20px;margin-top:14px}
  .osl-h1{font-size:44px}
  .osl-claim{font-size:21px}
  .osl-prog{font-size:15px;margin-top:14px}
  .osl-cta{align-self:stretch;justify-content:center;font-size:18px;padding:17px 20px;margin-top:20px}
  .osl-offer{text-align:center}
  .osl-x{top:14px;right:14px;background:rgba(255,255,255,.14);color:#fff}
}

/* Integration: zugänglicher Dialog, kompakte Handy-Ansicht, wenig Bewegung. */
#osl-pop[hidden]{display:none!important}
#osl-ban[hidden]{display:none!important}
#osl-pop{z-index:9000}
#osl-pop .osl-card{max-height:calc(100dvh - 48px);overflow-y:auto}
#osl-pop .osl-x:focus-visible,#osl-pop .osl-cta:focus-visible,#osl-ban .oslb-cta:focus-visible{outline:3px solid #DB9540;outline-offset:4px}
@media(max-width:640px){#osl-pop .osl-card{max-height:82dvh}#osl-pop .osl-date{padding:16px 64px 14px 22px}#osl-pop .osl-date .osl-d{font-size:44px}#osl-pop .osl-main{padding:18px 22px 22px}#osl-pop .osl-pre{margin-top:8px}#osl-pop .osl-h1{font-size:clamp(30px,8.5vw,44px)}#osl-pop .osl-prog{font-size:14px;margin-top:10px}#osl-pop .osl-claim{font-size:19px}#osl-pop .osl-cta{margin-top:16px;padding:14px 20px}#osl-pop .osl-offer{font-size:12px}}
@media(prefers-reduced-motion:reduce){#osl-pop,#osl-pop .osl-card{animation:none!important}#osl-pop .osl-cta{transition:none}}
