/* Brandub only: shared studio tokens and components remain unchanged. */
.brandub .brandub-hero { display:grid; grid-template-columns:1fr 1.05fr; gap:var(--sp-12); align-items:center; }
.brandub .brandub-hero > * { min-width:0; }
.brandub .brandub-lead { font-size:1.15rem; color:var(--text-secondary); margin:var(--sp-5) 0 var(--sp-8); }
.brandub .brandub-actions { display:flex; flex-wrap:wrap; gap:var(--sp-3); margin:var(--sp-6) 0; }
.brandub .brandub-note { color:var(--text-secondary); font-size:.9rem; }
.brandub .brandub-board { width:100%; height:auto; border-radius:var(--radius-md); box-shadow:var(--shadow-lg); }
.brandub figcaption { color:var(--text-secondary); font-size:.85rem; margin-top:var(--sp-4); }
.brandub .brandub-features { margin-top:var(--sp-12); }
.brandub .brandub-piece { width:88px; height:88px; margin-bottom:var(--sp-5); }
.brandub .brandub-copy { max-width:70ch; }
.brandub .brandub-copy p + p { margin-top:var(--sp-4); }
.brandub .brandub-download { display:flex; flex-direction:column; align-items:flex-start; gap:var(--sp-4); }
.brandub .brandub-download .btn[disabled] { cursor:default; opacity:1; color:var(--text-secondary); transform:none; }
.brandub .brandub-unavailable { border:1px solid var(--border-card); border-radius:var(--radius-lg); padding:var(--sp-8); background:var(--bg-card); }
.brandub .brandub-facts { display:flex; flex-wrap:wrap; gap:var(--sp-6); margin:var(--sp-6) 0; }
.brandub .brandub-facts dt { color:var(--text-secondary); font-size:.85rem; }
.brandub .brandub-facts dd { font-weight:600; }
.brandub .brandub-rules { margin:var(--sp-5) 0; }
.brandub .brandub-skip { position:fixed; top:0; left:var(--sp-5); z-index:200; transform:translateY(-150%); }
.brandub .brandub-skip:focus { transform:translateY(0); }
.brandub--main {
  background-color:#141616;
  /* Owner's corrected WebP, used unchanged with its own colours. */
  background-image:url('/assets/img/brandub/sw-02-512.webp');
  background-repeat:repeat;
  background-size:115.2px 115.2px;
  background-attachment:fixed;
}
.brandub--main .nav,
.brandub--main .footer { background-color:rgba(8, 9, 15, .92); }
.brandub--main main > .section { background:transparent; }
@media (prefers-reduced-motion:reduce) {
  .brandub .card.is-hidden { opacity:1; transform:none; }
}
@media (max-width:800px) {
  .brandub .brandub-hero { grid-template-columns:1fr; gap:var(--sp-8); }
  .brandub .brandub-hero figure { max-width:560px; }
}
@media (max-width:400px) {
  .brandub .brandub-unavailable { padding:var(--sp-5); }
  .brandub .brandub-actions .btn { width:100%; }
}

.brandub .brandub-hero figure { margin:0; width:100%; }