/* Black Week (resources/views/black-friday.blade.php und resources/views/black-friday/*). Präfix bf-. Stil B2:
   schwarz mit gelbem Lichtschein, Countdown ohne Kacheln (große gelbe Ziffern mit Doppelpunkten). */
.bf-page{--bf-black:#000;--bf-card:#0d0d0d;--bf-line:#262626;--bf-mute:#9a9a9a;--bf-glow:rgba(255,204,2,.35);font-family:var(--ui-font)}

/* Hero */
.bf-hero{color:#fff;padding:64px 0 60px;overflow:hidden;
  background:radial-gradient(560px 340px at 85% 35%,rgba(255,204,2,.30),transparent 70%),radial-gradient(400px 260px at 5% 110%,rgba(255,204,2,.10),transparent 70%),var(--bf-black)}
.bf-hero h1{margin:0 0 12px;font-size:inherit;line-height:1;letter-spacing:0}
.bf-hero-title{display:block;font-weight:800;font-size:clamp(2.6rem,1.6rem + 4.5vw,4rem);letter-spacing:-.025em;color:#fff}
.bf-hero-title em{font-style:normal;color:var(--ui-y);text-shadow:0 0 28px rgba(255,204,2,.45)}
.bf-hero-claim{display:block;font-weight:600;font-size:clamp(1.15rem,1rem + .6vw,1.4rem);line-height:1.3;color:#e2e2e2;margin-top:14px}
.bf-hero-period{font-size:.9rem;font-weight:500;color:var(--ui-y);margin:0 0 18px}
.bf-hero-lead{color:#b5b5b5;font-size:1rem;line-height:1.6;max-width:560px;margin:0 0 26px}
.bf-hero-lead b{color:#fff}
.bf-hero-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.bf-btn-glow{box-shadow:0 8px 28px var(--bf-glow)}
.bf-btn-ghost{display:inline-flex;align-items:baseline;flex-wrap:wrap;font-weight:600;padding:.55rem 1.1rem;border-radius:10px;color:#fff;border:1px solid #444;text-decoration:none;transition:border-color .15s ease,color .15s ease}
.bf-btn-ghost:hover,.bf-btn-ghost:focus-visible{color:var(--ui-y);border-color:var(--ui-y)}
.bf-btn-vat{margin-left:.35em;font-size:.72rem;font-weight:400;color:var(--bf-mute)}
.bf-btn-ghost:focus-visible{outline:2px solid var(--ui-y);outline-offset:2px}

/* Countdown, Stil 2. Server: <time> mit Klartext. countdown.js baut daraus
   <span data-unit="days"><b>01</b><small>Tage</small></span><span class="bf-countdown-sep">:</span>… */
.bf-countdown-label{font-size:.75rem;color:var(--bf-mute);text-transform:uppercase;letter-spacing:.12em;margin:0 0 10px}
.bf-countdown{display:flex;align-items:flex-start;gap:6px;margin:0 0 30px;font-size:1.1rem;font-weight:600;color:var(--ui-y)}
.bf-countdown [data-unit]{display:block;min-width:72px;text-align:center}
.bf-countdown [data-unit] b{display:block;font-weight:800;font-size:3.5rem;line-height:1;color:var(--ui-y);font-variant-numeric:tabular-nums;letter-spacing:-.02em;text-shadow:0 0 30px var(--bf-glow)}
.bf-countdown [data-unit] small{display:block;margin-top:6px;font-size:.7rem;font-weight:400;color:var(--bf-mute)}
.bf-countdown-sep{font-size:2.75rem;font-weight:300;line-height:1;color:#5a4a00}
.bf-countdown-done{font-size:1.1rem;font-weight:600;color:var(--ui-y);margin:0 0 30px}

/* Schwarzer Abschnitt mit den verdeckten Specials */
.bf-dark{background:var(--bf-black);color:#fff;padding:56px 0 64px;scroll-margin-top:80px}
.bf-dark h2{font-weight:700;color:#fff;margin:0 0 6px}
.bf-sub{color:var(--bf-mute);margin:0 0 26px}
.bf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bf-mystery{position:relative;border-radius:14px;padding:22px;background:var(--bf-card);border:1px solid var(--bf-line);overflow:hidden;min-height:230px;display:flex;flex-direction:column}
.bf-mystery--highlight{background:linear-gradient(var(--bf-card),var(--bf-card)) padding-box,linear-gradient(140deg,var(--ui-y),rgba(255,204,2,.1) 60%,var(--ui-y)) border-box;border-color:transparent;box-shadow:0 0 50px rgba(255,204,2,.12)}
.bf-mystery h3{font-size:1.1rem;font-weight:700;color:#fff;margin:0 0 14px}
.bf-mystery-blur{filter:blur(6px);user-select:none;-webkit-user-select:none;color:#ddd;font-size:.85rem;line-height:1.9;max-width:15em;margin:0}
.bf-mystery-price{margin-top:auto;padding-top:14px}
.bf-mystery-price b{display:block;font-size:2.1rem;font-weight:800;color:var(--ui-y);letter-spacing:.05em;line-height:1.1}
.bf-mystery-price span{display:block;margin-top:6px;font-size:.75rem;color:var(--bf-mute)}

/* Bonus (nur laut Config) */
.bf-bonus{margin-top:24px;display:flex;align-items:center;gap:16px;padding:16px 20px;border-radius:14px;color:#e2e2e2;
  background:radial-gradient(260px 120px at 0% 50%,rgba(255,204,2,.16),transparent 70%),var(--bf-card);border:1px solid var(--bf-line)}
.bf-bonus-icon{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--ui-y);color:#000;box-shadow:0 0 24px var(--bf-glow)}
.bf-bonus p{margin:0}
.bf-bonus b{display:block;color:#fff}
.bf-bonus span{color:var(--bf-mute);font-size:.85rem}

/* Live-Angebote (offers.blade.php) */
.bf-grid{align-items:stretch}
.bf-loading{margin:0}
.bf-offer{position:relative;border-radius:14px;padding:22px;background:var(--bf-card);border:1px solid var(--bf-line);color:#fff;display:flex;flex-direction:column}
.bf-offer--highlight{background:linear-gradient(var(--bf-card),var(--bf-card)) padding-box,linear-gradient(140deg,var(--ui-y),rgba(255,204,2,.1) 60%,var(--ui-y)) border-box;border-color:transparent;box-shadow:0 0 60px rgba(255,204,2,.18);transform:translateY(-6px)}
.bf-offer h3{font-size:1.4rem;font-weight:800;color:#fff;margin:0 0 14px}
.bf-offer-specs{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;font-size:.85rem;margin:0 0 18px}
.bf-offer-specs dt{color:var(--bf-mute);font-weight:400}
.bf-offer-specs dd{margin:0;font-weight:600}
.bf-offer-price{margin-top:auto;font-size:.85rem;color:var(--bf-mute)}
.bf-offer-price b{font-size:2.4rem;font-weight:800;letter-spacing:-.02em;color:var(--ui-y);text-shadow:0 0 24px rgba(255,204,2,.3)}
.bf-offer-price small{display:block;font-size:.75rem}
.bf-offer-act,.bf-offer-stamp-wrap{margin-top:14px;display:flex;justify-content:flex-end;min-height:42px}
.bf-offer-act[hidden]{display:none}
.bf-offer--out>:not(.bf-offer-stamp-wrap){opacity:.5}
.bf-offer--out .bf-offer-stamp-wrap{position:absolute;inset:0;margin:0;display:grid;place-items:center;pointer-events:none}
.bf-offer-stamp{transform:rotate(-10deg);border:3px solid #fff;color:#fff;font-weight:800;font-size:1.4rem;padding:6px 16px;border-radius:6px;letter-spacing:.08em;text-transform:uppercase;background:rgba(0,0,0,.6)}
.bf-soldout{padding-bottom:0}

/* Reguläre VPS */
.bf-regular-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px}
.bf-regular-head h2{font-weight:700;color:var(--ui-text);margin:0 0 6px}
.bf-classes{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0;padding:0;list-style:none}
.bf-classes a{display:block;border:1px solid var(--ui-line);border-radius:10px;padding:10px 14px;background:var(--ui-card);color:var(--ui-text);text-decoration:none;transition:border-color .15s ease}
.bf-classes a:hover,.bf-classes a:focus-visible{border-color:var(--ui-y)}
.bf-classes b{display:block;font-weight:600}
.bf-classes span{display:block;font-size:.75rem;color:var(--ui-mute)}

@media (max-width:767.98px){
  .bf-hero{padding:44px 0 48px}
  .bf-grid{grid-template-columns:1fr}
  .bf-mystery{min-height:0}
  .bf-offer--highlight{transform:none}
  .bf-countdown{gap:2px}
  .bf-countdown [data-unit]{min-width:0;flex:1}
  .bf-countdown [data-unit] b{font-size:2.3rem}
  .bf-countdown-sep{font-size:1.8rem}
  .bf-classes li{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){.bf-btn-ghost,.bf-classes a{transition:none}}