/* ============================================================================
   The Cube 3.0 — Verfügbarkeitskalender (Airbnb-iCal). Eigenständig gestyltes
   Widget (.vb-), damit es auf Startseite und Landingpages identisch aussieht.
   ========================================================================== */
.vb{
  --vb-surface:#141416; --vb-surface-2:#1b1b1f; --vb-line:rgba(255,255,255,.10); --vb-line-2:rgba(255,255,255,.16);
  --vb-ink:#fff; --vb-text:rgba(255,255,255,.82); --vb-muted:rgba(255,255,255,.46);
  --vb-gold:#c9a875; --vb-gold-2:#e2c48b; --vb-gold-soft:rgba(201,168,117,.14);
  font-family:'Inter',system-ui,-apple-system,sans-serif; color:var(--vb-text);
  max-width:760px; margin:0 auto;
}
.vb *{box-sizing:border-box}
.vb-card{background:var(--vb-surface);border:1px solid var(--vb-line);border-radius:10px;padding:clamp(16px,3vw,24px)}

.vb-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.vb-range{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(19px,3.4vw,24px);font-weight:600;color:var(--vb-ink);letter-spacing:.01em}
.vb-nav{width:38px;height:38px;flex:none;border:1px solid var(--vb-line-2);background:none;border-radius:8px;color:var(--vb-text);
  font-size:20px;line-height:1;cursor:pointer;transition:.15s;display:flex;align-items:center;justify-content:center}
.vb-nav:hover{border-color:var(--vb-gold);color:var(--vb-ink)}
.vb-nav[disabled]{opacity:.3;cursor:not-allowed;border-color:var(--vb-line)}

.vb-months{display:grid;grid-template-columns:1fr;gap:26px}
@media(min-width:720px){.vb-months{grid-template-columns:1fr 1fr;gap:30px}}
.vb-wd{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:8px}
.vb-wd span{text-align:center;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--vb-muted)}
.vb-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.vb-d{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;border-radius:7px;font-size:13.5px;font-variant-numeric:tabular-nums}
.vb-d--empty{background:none}
.vb-d--free{background:var(--vb-surface-2);color:var(--vb-ink);border:1px solid var(--vb-line)}
.vb-d--free:hover{border-color:var(--vb-gold);color:var(--vb-gold-2)}
.vb-d--blocked{background:rgba(255,255,255,.03);color:var(--vb-muted)}
.vb-d--blocked::after{content:"";position:absolute;left:22%;right:22%;top:50%;height:1.5px;background:var(--vb-muted);transform:rotate(-18deg);opacity:.7}
.vb-d--past{color:rgba(255,255,255,.22)}
.vb-d--today{outline:1.5px solid var(--vb-gold);outline-offset:-1.5px}

.vb-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;font-size:12.5px;color:var(--vb-muted)}
.vb-legend span{display:inline-flex;align-items:center;gap:7px}
.vb-key{width:14px;height:14px;border-radius:4px;flex:none}
.vb-key--free{background:var(--vb-surface-2);border:1px solid var(--vb-line-2)}
.vb-key--blocked{background:rgba(255,255,255,.03);position:relative}
.vb-key--blocked::after{content:"";position:absolute;left:2px;right:2px;top:50%;height:1.5px;background:var(--vb-muted);transform:rotate(-18deg)}
.vb-key--today{background:none;outline:1.5px solid var(--vb-gold);outline-offset:-1.5px}

.vb-sync{margin-top:12px;font-size:11.5px;color:var(--vb-muted);display:flex;align-items:center;gap:6px}
.vb-sync svg{width:13px;height:13px;color:var(--vb-gold);opacity:.85}
.vb-msg{padding:40px 16px;text-align:center;color:var(--vb-muted);font-size:14px}

.vb-cta{margin-top:20px;text-align:center}
.vb-cta a{display:inline-flex;align-items:center;gap:8px;background:var(--vb-gold);color:#0a0a0a;font-weight:600;font-size:14px;
  text-decoration:none;padding:12px 24px;border-radius:3px;transition:.15s}
.vb-cta a:hover{background:var(--vb-gold-2)}

@media(prefers-reduced-motion:reduce){.vb *{transition:none!important}}