/* ======================================================================
   MALDITOS BASTARDOS · PUBLIC VISUAL SYSTEM V11
   Global visual layer for the public website only.
   Loaded after styles.css / public-banners.css so it can safely override UI.
   ====================================================================== */

:root {
  --mb-v11-bg: #020304;
  --mb-v11-bg-2: #050708;
  --mb-v11-surface: rgba(7, 9, 10, 0.82);
  --mb-v11-surface-strong: rgba(5, 7, 8, 0.95);
  --mb-v11-surface-soft: rgba(255, 255, 255, 0.014);
  --mb-v11-line: rgba(255, 255, 255, 0.065);
  --mb-v11-line-soft: rgba(255, 255, 255, 0.035);
  --mb-v11-orange: #ff8000;
  --mb-v11-orange-hi: #ff9d3d;
  --mb-v11-orange-deep: #d86100;
  --mb-v11-text: #f3f5f6;
  --mb-v11-muted: #899298;
  --mb-v11-dim: #5b6469;
  --mb-v11-green: #67e9a6;
  --mb-v11-red: #ff6a6a;
  --mb-v11-blue: #8f99ff;
  --mb-v11-shadow: 0 28px 80px rgba(0, 0, 0, 0.36);
  --mb-v11-shadow-soft: 0 18px 48px rgba(0, 0, 0, 0.24);
  --mb-v11-radius: 16px;
}

/* ----------------------------------------------------------------------
   GLOBAL ATMOSPHERE
   ---------------------------------------------------------------------- */

body.mb-v11 {
  color: var(--mb-v11-text);
  background:
    radial-gradient(circle at 50% -12%, rgba(255, 128, 0, 0.08), transparent 27%),
    radial-gradient(circle at 10% 42%, rgba(255, 128, 0, 0.025), transparent 27%),
    radial-gradient(circle at 90% 72%, rgba(255, 128, 0, 0.02), transparent 25%),
    linear-gradient(145deg, #020304 0%, #060809 48%, #020304 100%) !important;
  font-family: "Rajdhani", "Segoe UI", system-ui, sans-serif;
  scrollbar-color: rgba(255, 128, 0, 0.52) #050607;
}

body.mb-v11::-webkit-scrollbar {
  width: 10px;
}

body.mb-v11::-webkit-scrollbar-track {
  background: #050607;
}

body.mb-v11::-webkit-scrollbar-thumb {
  border: 2px solid #050607;
  border-radius: 999px;
  background: linear-gradient(180deg, #ff9d3d, #c95d00);
}

body.mb-v11::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -10;
  pointer-events: none;
  opacity: 0.22;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.012) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.012) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.7) 60%, transparent 96%);
}

body.mb-v11::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99990;
  pointer-events: none;
  opacity: 0.22;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,.012) 0,
    rgba(255,255,255,.012) 1px,
    transparent 1px,
    transparent 5px
  );
  background-size: 100% 5px;
  mix-blend-mode: soft-light;
}

body.mb-v11 .page-shell,
body.mb-v11 .discord-layout-page,
body.mb-v11 .privacy-layout,
body.mb-v11 .events-page-shell,
body.mb-v11 .contact-page-shell,
body.mb-v11 .shop-page-shell,
body.mb-v11 .rules-page-shell {
  position: relative;
  z-index: 1;
  background: transparent !important;
}

.mb-v11-atmosphere {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.mb-v11-atmosphere::before,
.mb-v11-atmosphere::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(110px);
  opacity: .1;
}

.mb-v11-atmosphere::before {
  width: 36rem;
  height: 36rem;
  left: -19rem;
  top: 18vh;
  background: var(--mb-v11-orange);
}

.mb-v11-atmosphere::after {
  width: 34rem;
  height: 34rem;
  right: -20rem;
  top: 58vh;
  background: #ff6a00;
  opacity: .055;
}

.mb-v11-scan-beam {
  position: absolute;
  left: 0;
  right: 0;
  top: -20vh;
  height: 16vh;
  opacity: 0;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(255,128,0,.018),
    rgba(255,128,0,.055),
    transparent
  );
  animation: mbV11GlobalScan 8s ease-in-out 1.5s infinite;
}

.mb-v11-spark {
  position: absolute;
  left: var(--x);
  top: 105vh;
  width: var(--s);
  height: calc(var(--s) * 2.6);
  border-radius: 999px;
  opacity: 0;
  background: linear-gradient(to top, transparent, rgba(255,151,54,.8));
  box-shadow: 0 0 8px rgba(255,128,0,.25);
  transform: rotate(var(--r));
  animation: mbV11SparkRise var(--d) linear var(--delay) infinite;
}

body.mb-v11-paused .mb-v11-spark,
body.mb-v11-paused .mb-v11-scan-beam,
body.mb-v11-paused .mb-v11-hero-orb {
  animation-play-state: paused !important;
}

/* ----------------------------------------------------------------------
   HEADER / NAVIGATION
   ---------------------------------------------------------------------- */

body.mb-v11 .site-header {
  min-height: 72px;
  border-bottom: 1px solid rgba(255, 128, 0, 0.10) !important;
  background:
    linear-gradient(180deg, rgba(7, 9, 10, .95), rgba(4, 5, 6, .90)) !important;
  box-shadow:
    0 14px 40px rgba(0,0,0,.26),
    inset 0 -1px rgba(255,255,255,.015) !important;
  backdrop-filter: blur(20px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(120%) !important;
  transition:
    min-height .28s ease,
    background .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

body.mb-v11 .site-header::before {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 1px;
  pointer-events: none;
  opacity: .45;
  background: linear-gradient(90deg, transparent 4%, rgba(255,128,0,.34) 28%, rgba(255,128,0,.08) 50%, rgba(255,128,0,.34) 72%, transparent 96%);
}

body.mb-v11 .site-header.mb-v11-header-scrolled {
  border-bottom-color: rgba(255, 128, 0, 0.18) !important;
  background: rgba(3, 5, 6, .965) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.36) !important;
}

body.mb-v11 .header-inner {
  min-height: 72px;
  transition: min-height .28s ease;
}

body.mb-v11 .site-header.mb-v11-header-scrolled .header-inner {
  min-height: 64px;
}

body.mb-v11 .brand {
  gap: 13px;
  transform: none;
}

body.mb-v11 .brand-logo {
  width: 60px;
  height: 60px;
  filter:
    drop-shadow(0 10px 18px rgba(0,0,0,.36))
    drop-shadow(0 0 12px rgba(255,128,0,.075));
  transition: transform .3s cubic-bezier(.22,.8,.23,1), filter .3s ease;
}

body.mb-v11 .brand:hover .brand-logo {
  transform: translateY(-1px) scale(1.035);
  filter:
    drop-shadow(0 12px 20px rgba(0,0,0,.42))
    drop-shadow(0 0 18px rgba(255,128,0,.15));
}

body.mb-v11 .brand-text {
  gap: 2px;
  font-family: "Oswald", sans-serif;
  font-size: 1.04rem;
  font-weight: 650;
  letter-spacing: .085em;
  line-height: .92;
}

body.mb-v11 .brand-text span:last-child {
  color: var(--mb-v11-orange-hi);
  text-shadow: 0 0 16px rgba(255,128,0,.16);
}

body.mb-v11 .main-nav {
  gap: clamp(16px, 1.45vw, 25px);
}

body.mb-v11 .main-nav a,
body.mb-v11 .nav-item > a {
  min-height: 72px;
  padding: 0 2px;
  color: rgba(238,242,244,.66);
  font-size: .91rem;
  font-weight: 600;
  letter-spacing: .09em;
  transition: color .2s ease, text-shadow .2s ease;
}

body.mb-v11 .site-header.mb-v11-header-scrolled .main-nav a,
body.mb-v11 .site-header.mb-v11-header-scrolled .nav-item > a {
  min-height: 64px;
}

body.mb-v11 .main-nav a:hover,
body.mb-v11 .main-nav a.active,
body.mb-v11 .nav-item > a:hover,
body.mb-v11 .nav-item > a.active,
body.mb-v11 .nav-dropdown:hover > a {
  color: #fff;
  text-shadow: 0 0 16px rgba(255,128,0,.18);
}

body.mb-v11 .main-nav a::after,
body.mb-v11 .nav-item > a::after {
  bottom: 10px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--mb-v11-orange), transparent);
  box-shadow: 0 0 14px rgba(255,128,0,.34);
}

body.mb-v11 .main-nav a.active::after,
body.mb-v11 .nav-item > a.active::after {
  width: 34px;
}

body.mb-v11 .nav-submenu {
  top: calc(100% + 2px);
  padding: 9px;
  border: 1px solid rgba(255,128,0,.15);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), transparent),
    rgba(5,7,8,.97);
  box-shadow: 0 24px 65px rgba(0,0,0,.44);
  backdrop-filter: blur(18px);
}

body.mb-v11 .nav-submenu a {
  min-height: 40px !important;
  padding: 0 13px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  font-size: .88rem;
}

body.mb-v11 .nav-submenu a:hover,
body.mb-v11 .nav-submenu a.active {
  border-color: rgba(255,128,0,.10);
  background: rgba(255,128,0,.05);
  color: var(--mb-v11-orange-hi);
}

body.mb-v11 .discord-cta {
  position: relative;
  overflow: hidden;
  min-height: 44px;
  border: 1px solid rgba(255,128,0,.28);
  border-radius: 9px;
  background:
    linear-gradient(180deg, rgba(255,128,0,.075), rgba(255,128,0,.025)),
    rgba(5,7,8,.88);
  color: #ffb36a;
  box-shadow:
    inset 0 1px rgba(255,255,255,.025),
    0 0 0 1px rgba(255,128,0,.025);
}

body.mb-v11 .discord-cta::before,
body.mb-v11 .btn::before {
  content: "";
  position: absolute;
  top: -30%;
  bottom: -30%;
  left: -45%;
  width: 25%;
  transform: skewX(-18deg);
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
}

body.mb-v11 .discord-cta:hover::before,
body.mb-v11 .btn:hover::before {
  opacity: 1;
  animation: mbV11ButtonSweep .72s ease forwards;
}

body.mb-v11 .discord-cta:hover {
  transform: translateY(-1px);
  border-color: rgba(255,128,0,.5);
  color: #ffd0a1;
  box-shadow: 0 10px 28px rgba(0,0,0,.2), 0 0 20px rgba(255,128,0,.06);
}

body.mb-v11 .menu-toggle {
  border: 1px solid rgba(255,128,0,.14);
  border-radius: 9px;
  background: rgba(255,255,255,.018);
}

body.mb-v11 .menu-toggle span {
  background: #dfe3e5;
}

/* ----------------------------------------------------------------------
   BUTTONS / INPUTS
   ---------------------------------------------------------------------- */

body.mb-v11 .btn {
  position: relative;
  overflow: hidden;
  min-height: 52px;
  border-radius: 10px;
  letter-spacing: .08em;
  font-family: "Oswald", sans-serif;
  font-size: .95rem;
  font-weight: 650;
  box-shadow: 0 13px 32px rgba(0,0,0,.22);
  transition:
    transform .22s cubic-bezier(.22,.8,.23,1),
    border-color .22s ease,
    box-shadow .22s ease,
    filter .22s ease;
}

body.mb-v11 .btn:hover {
  transform: translateY(-2px);
}

body.mb-v11 .btn-primary {
  border: 1px solid rgba(255,174,92,.36);
  background:
    linear-gradient(180deg, #ff9b38 0%, #f17800 56%, #c85600 100%) !important;
  color: #150a02 !important;
  text-shadow: 0 1px rgba(255,255,255,.12);
  box-shadow:
    0 14px 32px rgba(255,128,0,.10),
    inset 0 1px rgba(255,255,255,.22),
    inset 0 -1px rgba(0,0,0,.2);
}

body.mb-v11 .btn-primary:hover {
  filter: brightness(1.06);
  box-shadow:
    0 16px 38px rgba(255,128,0,.16),
    0 0 26px rgba(255,128,0,.08),
    inset 0 1px rgba(255,255,255,.26);
}

body.mb-v11 .btn-secondary {
  border: 1px solid rgba(255,255,255,.105) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.008)),
    rgba(6,8,9,.86) !important;
  color: #dce1e3;
}

body.mb-v11 .btn-secondary:hover {
  border-color: rgba(255,128,0,.32) !important;
  color: #fff;
  box-shadow: 0 13px 30px rgba(0,0,0,.24), 0 0 20px rgba(255,128,0,.04);
}

body.mb-v11 input,
body.mb-v11 textarea,
body.mb-v11 select {
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 10px !important;
  background: rgba(3,5,6,.76) !important;
  color: #edf0f1 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.012);
  outline: none;
  transition: border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

body.mb-v11 input:focus,
body.mb-v11 textarea:focus,
body.mb-v11 select:focus {
  border-color: rgba(255,128,0,.48) !important;
  background: rgba(3,5,6,.92) !important;
  box-shadow: 0 0 0 3px rgba(255,128,0,.055), 0 0 24px rgba(255,128,0,.025) !important;
}

body.mb-v11 input::placeholder,
body.mb-v11 textarea::placeholder {
  color: #5f686d !important;
}

/* ----------------------------------------------------------------------
   HERO SYSTEM
   ---------------------------------------------------------------------- */

body.mb-v11 .hero,
body.mb-v11 .server-hero-shell,
body.mb-v11 .staff-hero,
body.mb-v11 .discord-hero-page,
body.mb-v11 .shop-hero,
body.mb-v11 .rules-hero,
body.mb-v11 .contact-hero,
body.mb-v11 .application-hero,
body.mb-v11 .privacy-hero,
body.mb-v11 .events-hero,
body.mb-v11 .posts-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-bottom: 1px solid rgba(255,128,0,.075) !important;
  background-color: #030405 !important;
  box-shadow: inset 0 -70px 100px rgba(0,0,0,.25);
}

.mb-v11-hero-fx {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.mb-v11-hero-fx::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(1,2,3,.78) 0%, rgba(1,2,3,.36) 45%, rgba(1,2,3,.58) 100%),
    linear-gradient(180deg, rgba(2,3,4,.15) 0%, rgba(2,3,4,.15) 55%, #030405 105%);
}

.mb-v11-hero-fx::after {
  content: "";
  position: absolute;
  left: 4%;
  right: 4%;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,128,0,.34), transparent);
  box-shadow: 0 0 20px rgba(255,128,0,.1);
}

.mb-v11-hero-orb {
  position: absolute;
  width: 26rem;
  height: 26rem;
  right: -11rem;
  top: 16%;
  border-radius: 50%;
  opacity: .11;
  filter: blur(80px);
  background: var(--mb-v11-orange);
  transform: translate3d(var(--mb-parallax-x,0),var(--mb-parallax-y,0),0);
  transition: transform .25s ease-out;
  animation: mbV11OrbBreathe 5.5s ease-in-out infinite;
}

.mb-v11-hero-orb--left {
  width: 18rem;
  height: 18rem;
  left: -9rem;
  right: auto;
  top: 65%;
  opacity: .055;
}

body.mb-v11 .hero-grid,
body.mb-v11 .server-hero-inner,
body.mb-v11 .staff-hero__content,
body.mb-v11 .discord-hero-page__inner,
body.mb-v11 .shop-hero__inner,
body.mb-v11 .rules-hero__content,
body.mb-v11 .contact-hero__content,
body.mb-v11 .application-hero__content,
body.mb-v11 .privacy-hero__inner,
body.mb-v11 .events-hero__content,
body.mb-v11 .posts-hero__content {
  position: relative;
  z-index: 2;
}

body.mb-v11 .hero-copy,
body.mb-v11 .server-hero-copy,
body.mb-v11 .staff-hero__copy,
body.mb-v11 .discord-hero-page__content,
body.mb-v11 .shop-hero__content,
body.mb-v11 .rules-hero__copy,
body.mb-v11 .contact-hero__copy,
body.mb-v11 .privacy-hero__copy {
  filter: drop-shadow(0 18px 38px rgba(0,0,0,.18));
}

body.mb-v11 .hero h1,
body.mb-v11 .server-hero-copy h1,
body.mb-v11 .staff-hero h1,
body.mb-v11 .discord-hero-page__content h1,
body.mb-v11 .shop-hero h1,
body.mb-v11 .rules-hero h1,
body.mb-v11 .contact-hero h1,
body.mb-v11 .application-hero h1,
body.mb-v11 .privacy-hero h1,
body.mb-v11 .events-hero h1,
body.mb-v11 .posts-hero h1 {
  color: #f4f6f7;
  font-family: "Bebas Neue", "Oswald", sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: .015em !important;
  line-height: .92 !important;
  text-shadow:
    0 16px 36px rgba(0,0,0,.46),
    0 0 26px rgba(255,128,0,.035);
}

body.mb-v11 .hero h1 span:last-child,
body.mb-v11 .server-hero-copy h1 span:last-child,
body.mb-v11 .staff-hero h1 span:last-child,
body.mb-v11 .discord-hero-page__content h1 span:last-child,
body.mb-v11 .shop-hero h1 span:last-child,
body.mb-v11 .rules-hero h1 span:last-child,
body.mb-v11 .contact-hero h1 span:last-child,
body.mb-v11 .application-hero h1 span:last-child,
body.mb-v11 .privacy-hero h1 span:last-child {
  color: var(--mb-v11-orange-hi) !important;
  text-shadow: 0 0 26px rgba(255,128,0,.12), 0 14px 32px rgba(0,0,0,.34);
}

body.mb-v11 .eyebrow,
body.mb-v11 .section-kicker,
body.mb-v11 .server-kicker,
body.mb-v11 .staff-hero__kicker,
body.mb-v11 .discord-hero-page__kicker,
body.mb-v11 .shop-hero__kicker,
body.mb-v11 .rules-hero__kicker,
body.mb-v11 .contact-hero__kicker,
body.mb-v11 .privacy-kicker,
body.mb-v11 .events-hero__kicker,
body.mb-v11 .home-events-panel__kicker {
  color: var(--mb-v11-orange-hi) !important;
  font-family: "Oswald", sans-serif;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-shadow: 0 0 14px rgba(255,128,0,.09);
}

body.mb-v11 .hero-text,
body.mb-v11 .server-description,
body.mb-v11 .discord-hero-page__lead,
body.mb-v11 .shop-hero__lead,
body.mb-v11 .rules-hero__lead,
body.mb-v11 .contact-hero__lead,
body.mb-v11 .privacy-lead,
body.mb-v11 .events-hero__lead,
body.mb-v11 .application-hero p {
  color: #a0a8ad !important;
}

/* ----------------------------------------------------------------------
   SECTION TITLES
   ---------------------------------------------------------------------- */

body.mb-v11 .section-title,
body.mb-v11 .staff-section-title h2,
body.mb-v11 .discord-section-heading h2,
body.mb-v11 .shop-section-heading h2,
body.mb-v11 .contact-section-heading h2,
body.mb-v11 .application-section-heading h2,
body.mb-v11 .privacy-section > h2,
body.mb-v11 .home-events-panel__title,
body.mb-v11 .server-features-title,
body.mb-v11 .rules-section h2 {
  color: #edf0f2;
  font-family: "Oswald", sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
  text-shadow: 0 12px 30px rgba(0,0,0,.28);
}

body.mb-v11 .section-title span,
body.mb-v11 .staff-section-title span,
body.mb-v11 .shop-section-heading span,
body.mb-v11 .contact-section-heading span {
  color: var(--mb-v11-orange-hi) !important;
}

/* ----------------------------------------------------------------------
   GLOBAL SECTION SEPARATION
   ---------------------------------------------------------------------- */

body.mb-v11 main > section:not(:first-child) {
  position: relative;
}

body.mb-v11 main > section:not(:first-child)::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 5%;
  right: 5%;
  top: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.055) 25%, rgba(255,128,0,.07) 50%, rgba(255,255,255,.055) 75%, transparent);
}

body.mb-v11 .servers-section,
body.mb-v11 .reasons-section,
body.mb-v11 .discord-section,
body.mb-v11 .home-events-section,
body.mb-v11 .home-posts-section,
body.mb-v11 .home-shop-section,
body.mb-v11 .server-features,
body.mb-v11 .public-server-events-panel,
body.mb-v11 .public-server-posts-panel,
body.mb-v11 .public-server-shop-panel,
body.mb-v11 .public-server-rules-panel,
body.mb-v11 .staff-section,
body.mb-v11 .discord-benefits,
body.mb-v11 .discord-preview,
body.mb-v11 .discord-final-cta,
body.mb-v11 .shop-categories,
body.mb-v11 .shop-products,
body.mb-v11 .shop-benefits,
body.mb-v11 .shop-faq,
body.mb-v11 .rules-section,
body.mb-v11 .contact-section,
body.mb-v11 .application-requirements,
body.mb-v11 .application-warning,
body.mb-v11 .application-form-section,
body.mb-v11 .application-faq,
body.mb-v11 .privacy-content,
body.mb-v11 .events-listing-section,
body.mb-v11 .posts-listing-section,
body.mb-v11 .post-detail-related {
  background-color: transparent !important;
}

/* ----------------------------------------------------------------------
   V11 SURFACES / CARDS
   JavaScript marks all supported cards with data-mb-v11-surface.
   ---------------------------------------------------------------------- */

body.mb-v11 [data-mb-v11-surface] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: var(--mb-v11-radius) !important;
  background-color: rgba(6,8,9,.82) !important;
  box-shadow:
    0 22px 60px rgba(0,0,0,.22),
    inset 0 1px rgba(255,255,255,.018) !important;
  transition:
    transform .28s cubic-bezier(.22,.8,.23,1),
    border-color .28s ease,
    box-shadow .28s ease,
    filter .28s ease !important;
}

body.mb-v11 [data-mb-v11-surface]::after {
  content: "";
  position: absolute;
  z-index: 10;
  top: 0;
  left: -55%;
  width: 25%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.03), rgba(255,128,0,.025), transparent);
}

body.mb-v11 [data-mb-v11-surface]:hover {
  transform: translateY(-4px);
  border-color: rgba(255,128,0,.18) !important;
  box-shadow:
    0 30px 74px rgba(0,0,0,.3),
    0 0 0 1px rgba(255,128,0,.02),
    0 0 30px rgba(255,128,0,.035),
    inset 0 1px rgba(255,255,255,.024) !important;
}

body.mb-v11 [data-mb-v11-surface]:hover::after {
  opacity: 1;
  animation: mbV11CardSweep .82s ease forwards;
}

/* Preserve hero server cards with imagery while adding V11 treatment */
body.mb-v11 .server-card[data-mb-v11-surface],
body.mb-v11 .shop-product-card[data-mb-v11-surface],
body.mb-v11 .staff-member-card[data-mb-v11-surface],
body.mb-v11 .home-event-card[data-mb-v11-surface] {
  background-color: rgba(5,7,8,.70) !important;
  border-color: rgba(255,255,255,.07) !important;
}

body.mb-v11 .server-card[data-mb-v11-surface]::before,
body.mb-v11 .shop-product-card[data-mb-v11-surface]::before,
body.mb-v11 .staff-member-card[data-mb-v11-surface]::before,
body.mb-v11 .home-event-card[data-mb-v11-surface]::before {
  opacity: .9;
}

body.mb-v11 .reason-icon,
body.mb-v11 .server-feature-icon,
body.mb-v11 .discord-benefit-card__icon,
body.mb-v11 .staff-value-card__icon,
body.mb-v11 .contact-card__icon,
body.mb-v11 .application-requirement-card__icon,
body.mb-v11 .rules-card__icon,
body.mb-v11 .shop-benefit-item__icon,
body.mb-v11 .hero-highlight-icon {
  border: 1px solid rgba(255,128,0,.13) !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(255,128,0,.09), transparent 70%),
    rgba(255,255,255,.012) !important;
  color: var(--mb-v11-orange-hi) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.02), 0 0 20px rgba(255,128,0,.025);
}

body.mb-v11 .reason-icon svg,
body.mb-v11 .server-feature-icon svg,
body.mb-v11 .discord-benefit-card__icon svg,
body.mb-v11 .staff-value-card__icon svg,
body.mb-v11 .contact-card__icon svg,
body.mb-v11 .rules-card__icon svg,
body.mb-v11 .hero-highlight-icon svg {
  fill: currentColor;
}

/* Home hero highlights */
body.mb-v11 .hero-highlights {
  gap: 10px;
}

body.mb-v11 .hero-highlights article {
  min-height: 102px;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-radius: 12px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.016), transparent),
    rgba(5,7,8,.48) !important;
  backdrop-filter: blur(9px);
  box-shadow: inset 0 1px rgba(255,255,255,.018);
}

body.mb-v11 .hero-highlights article:hover {
  border-color: rgba(255,128,0,.16) !important;
  background: rgba(7,9,10,.65) !important;
  transform: translateY(-3px);
}

/* Server cards */
body.mb-v11 .server-card {
  border-radius: 18px !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.34) !important;
}

body.mb-v11 .server-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(180deg, transparent 45%, rgba(2,3,4,.86) 100%);
}

body.mb-v11 .server-card-copy,
body.mb-v11 .server-label {
  position: relative;
  z-index: 3;
}

body.mb-v11 .server-card-title {
  color: #fff;
  font-family: "Oswald", sans-serif;
  letter-spacing: .01em;
  text-shadow: 0 10px 25px rgba(0,0,0,.45);
}

body.mb-v11 .server-card-subtitle,
body.mb-v11 .server-card-meta {
  color: #a1aaaf !important;
}

body.mb-v11 .server-card-features .public-server-feature,
body.mb-v11 .public-server-feature {
  border: 1px solid rgba(255,128,0,.10) !important;
  border-radius: 999px !important;
  background: rgba(255,128,0,.035) !important;
  color: #c6cdd0 !important;
}

/* Status badges */
body.mb-v11 .public-server-status,
body.mb-v11 .event-status-badge,
body.mb-v11 .home-event-card__badge,
body.mb-v11 .event-featured-badge {
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.02), 0 7px 20px rgba(0,0,0,.16);
  backdrop-filter: blur(10px);
}

body.mb-v11 .public-server-status--online,
body.mb-v11 .event-status-badge--live {
  color: var(--mb-v11-green) !important;
  border-color: rgba(103,233,166,.16) !important;
  background: rgba(103,233,166,.04) !important;
  box-shadow: 0 0 18px rgba(103,233,166,.035);
}

/* Metrics */
body.mb-v11 .metrics-bar {
  border: 1px solid rgba(255,128,0,.10) !important;
  border-radius: 15px !important;
  background:
    linear-gradient(90deg, rgba(255,128,0,.024), transparent 48%),
    rgba(5,7,8,.74) !important;
  box-shadow: var(--mb-v11-shadow-soft);
}

body.mb-v11 .metrics-bar strong {
  color: #fff;
  text-shadow: 0 0 18px rgba(255,128,0,.07);
}

/* Home Discord panel */
body.mb-v11 .discord-panel {
  overflow: hidden;
  border: 1px solid rgba(255,128,0,.13) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 82% 20%, rgba(255,128,0,.06), transparent 31%),
    linear-gradient(180deg, rgba(255,255,255,.014), transparent),
    rgba(5,7,8,.82) !important;
  box-shadow: var(--mb-v11-shadow) !important;
}

/* Legal/privacy cards */
body.mb-v11 .privacy-card {
  color: #bec5c9;
}

body.mb-v11 .privacy-card h2,
body.mb-v11 .privacy-card h3,
body.mb-v11 .rules-card h3,
body.mb-v11 .contact-card h3,
body.mb-v11 .staff-value-card h3,
body.mb-v11 .discord-benefit-card h3,
body.mb-v11 .shop-faq-card h3 {
  color: #eef1f2 !important;
}

body.mb-v11 .privacy-card a {
  color: var(--mb-v11-orange-hi) !important;
}

/* Game/server details */
body.mb-v11 .public-server-detail-grid,
body.mb-v11 .server-features,
body.mb-v11 .public-server-posts-box,
body.mb-v11 .public-server-shop-box,
body.mb-v11 .public-server-rules {
  position: relative;
}

body.mb-v11 .public-server-detail-item {
  min-height: 82px;
}

body.mb-v11 .public-server-detail-item span,
body.mb-v11 .public-server-detail-item small {
  color: var(--mb-v11-dim) !important;
}

body.mb-v11 .public-server-detail-item strong {
  color: #e6eaec !important;
}

body.mb-v11 .server-feature {
  min-height: 120px;
}

/* Shop */
body.mb-v11 .shop-product-card {
  box-shadow: 0 25px 70px rgba(0,0,0,.28) !important;
}

body.mb-v11 .shop-product-card__art {
  overflow: hidden;
  border-bottom: 1px solid rgba(255,255,255,.05) !important;
  background-color: #07090a !important;
}

body.mb-v11 .shop-product-card__art img {
  transition: transform .6s cubic-bezier(.22,.8,.23,1), filter .6s ease;
}

body.mb-v11 .shop-product-card:hover .shop-product-card__art img {
  transform: scale(1.045);
  filter: contrast(1.04) saturate(1.03);
}

body.mb-v11 .shop-product-card__body h3,
body.mb-v11 .shop-product-card__footer strong {
  color: #f1f3f4 !important;
}

/* Discord page */
body.mb-v11 .discord-benefit-card,
body.mb-v11 .discord-post,
body.mb-v11 .discord-mockup {
  border-color: rgba(255,255,255,.06) !important;
  background-color: rgba(6,8,9,.76) !important;
}

body.mb-v11 .discord-section-heading > span {
  background: linear-gradient(90deg, transparent, rgba(255,128,0,.36), transparent) !important;
}

/* Forms / application */
body.mb-v11 .application-field label,
body.mb-v11 .application-field legend,
body.mb-v11 .contact-form label {
  color: #d8dddf !important;
}

body.mb-v11 .application-fieldset,
body.mb-v11 .application-form,
body.mb-v11 .contact-form {
  border-color: rgba(255,128,0,.09) !important;
  background: rgba(5,7,8,.58) !important;
}

/* ----------------------------------------------------------------------
   FOOTER
   ---------------------------------------------------------------------- */

body.mb-v11 .site-footer {
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(255,128,0,.10) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,128,0,.04), transparent 36%),
    linear-gradient(180deg, rgba(4,6,7,.98), #020304) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.012);
}

body.mb-v11 .site-footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 6%;
  right: 6%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,128,0,.28), transparent) !important;
  box-shadow: 0 0 18px rgba(255,128,0,.08);
}

body.mb-v11 .site-footer h2 {
  color: #edf0f2 !important;
  font-family: "Oswald", sans-serif;
}

body.mb-v11 .site-footer p,
body.mb-v11 .site-footer li,
body.mb-v11 .site-footer a {
  color: #747d82 !important;
}

body.mb-v11 .site-footer a:hover {
  color: var(--mb-v11-orange-hi) !important;
}

body.mb-v11 .footer-bottom {
  border-top-color: rgba(255,255,255,.045) !important;
  color: #525b60 !important;
}

/* ----------------------------------------------------------------------
   SCROLL REVEAL / PAGE MOTION
   ---------------------------------------------------------------------- */

body.mb-v11 .mb-v11-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity .72s ease var(--mb-v11-delay, 0s),
    transform .72s cubic-bezier(.22,.8,.23,1) var(--mb-v11-delay, 0s);
}

body.mb-v11 .mb-v11-reveal.mb-v11-visible {
  opacity: 1;
  transform: translateY(0);
}

body.mb-v11 .mb-v11-reveal-left {
  opacity: 0;
  transform: translateX(-24px);
  transition:
    opacity .72s ease var(--mb-v11-delay, 0s),
    transform .72s cubic-bezier(.22,.8,.23,1) var(--mb-v11-delay, 0s);
}

body.mb-v11 .mb-v11-reveal-left.mb-v11-visible {
  opacity: 1;
  transform: translateX(0);
}

body.mb-v11 .mb-v11-reveal-right {
  opacity: 0;
  transform: translateX(24px);
  transition:
    opacity .72s ease var(--mb-v11-delay, 0s),
    transform .72s cubic-bezier(.22,.8,.23,1) var(--mb-v11-delay, 0s);
}

body.mb-v11 .mb-v11-reveal-right.mb-v11-visible {
  opacity: 1;
  transform: translateX(0);
}

/* ----------------------------------------------------------------------
   ANIMATIONS
   ---------------------------------------------------------------------- */

@keyframes mbV11GlobalScan {
  0% { top: -20vh; opacity: 0; }
  8% { opacity: .52; }
  36% { opacity: .2; }
  55%, 100% { top: 108vh; opacity: 0; }
}

@keyframes mbV11SparkRise {
  0% { transform: translate3d(0,0,0) rotate(var(--r)); opacity: 0; }
  8% { opacity: .2; }
  76% { opacity: .08; }
  100% { transform: translate3d(var(--drift),-122vh,0) rotate(var(--r)); opacity: 0; }
}

@keyframes mbV11ButtonSweep {
  from { left: -45%; }
  to { left: 125%; }
}

@keyframes mbV11CardSweep {
  from { left: -55%; }
  to { left: 130%; }
}

@keyframes mbV11OrbBreathe {
  0%,100% { opacity: .075; transform: scale(.96) translate3d(var(--mb-parallax-x,0),var(--mb-parallax-y,0),0); }
  50% { opacity: .13; transform: scale(1.05) translate3d(var(--mb-parallax-x,0),var(--mb-parallax-y,0),0); }
}



/* ----------------------------------------------------------------------
   RESPONSIVE
   ---------------------------------------------------------------------- */

@media (max-width: 1100px) {
  body.mb-v11 .main-nav {
    gap: 15px;
    margin-right: 18px;
  }

  body.mb-v11 .main-nav a,
  body.mb-v11 .nav-item > a {
    font-size: .84rem;
  }
}

@media (max-width: 900px) {
  body.mb-v11 .site-header,
  body.mb-v11 .header-inner,
  body.mb-v11 .site-header.mb-v11-header-scrolled .header-inner {
    min-height: 64px;
  }

  body.mb-v11 .brand-logo {
    width: 52px;
    height: 52px;
  }

  body.mb-v11 .main-nav {
    background:
      radial-gradient(circle at 50% 0%, rgba(255,128,0,.055), transparent 28%),
      rgba(3,5,6,.985) !important;
    border-top: 1px solid rgba(255,128,0,.09);
    backdrop-filter: blur(18px);
  }

  body.mb-v11 .main-nav a,
  body.mb-v11 .nav-item > a,
  body.mb-v11 .site-header.mb-v11-header-scrolled .main-nav a,
  body.mb-v11 .site-header.mb-v11-header-scrolled .nav-item > a {
    min-height: 48px;
  }
}

@media (max-width: 640px) {
  body.mb-v11::after {
    opacity: .13;
  }

  .mb-v11-atmosphere::before,
  .mb-v11-atmosphere::after {
    opacity: .05;
  }

  .mb-v11-spark:nth-of-type(n+8) {
    display: none;
  }

  body.mb-v11 [data-mb-v11-surface]:hover {
    transform: none;
  }

  body.mb-v11 .btn {
    min-height: 49px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.mb-v11 *,
  body.mb-v11 *::before,
  body.mb-v11 *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }

  body.mb-v11 .mb-v11-reveal,
  body.mb-v11 .mb-v11-reveal-left,
  body.mb-v11 .mb-v11-reveal-right {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ----------------------------------------------------------------------
   ADDITIONAL V11 PUBLIC MODULES
   ---------------------------------------------------------------------- */

body.mb-v11 .public-post-card,
body.mb-v11 .post-detail-card,
body.mb-v11 .shop-category-card,
body.mb-v11 .founder-card,
body.mb-v11 .discord-stats-card,
body.mb-v11 .contact-form-card,
body.mb-v11 .rules-hero__panel,
body.mb-v11 .privacy-hero__card,
body.mb-v11 .application-hero__notice,
body.mb-v11 .shop-hero-badge {
  border-color: rgba(255,255,255,.06) !important;
  background-color: rgba(6,8,9,.78) !important;
  box-shadow: 0 22px 60px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.018) !important;
}

body.mb-v11 .public-post-card__media,
body.mb-v11 .post-detail-cover,
body.mb-v11 .staff-member-card__media,
body.mb-v11 .founder-card__media {
  overflow: hidden;
  background-color: #060809 !important;
}

body.mb-v11 .public-post-card__media img,
body.mb-v11 .post-detail-cover img,
body.mb-v11 .staff-member-card img,
body.mb-v11 .founder-card img {
  transition: transform .65s cubic-bezier(.22,.8,.23,1), filter .65s ease;
}

body.mb-v11 .public-post-card:hover .public-post-card__media img,
body.mb-v11 .staff-member-card:hover img,
body.mb-v11 .founder-card:hover img {
  transform: scale(1.035);
  filter: contrast(1.04) saturate(1.04);
}

body.mb-v11 .public-post-card__title,
body.mb-v11 .post-detail-card h1,
body.mb-v11 .post-detail-card h2,
body.mb-v11 .shop-category-card h3,
body.mb-v11 .founder-card h3,
body.mb-v11 .discord-stats-card strong {
  color: #eef1f2 !important;
  text-shadow: 0 9px 24px rgba(0,0,0,.22);
}

body.mb-v11 .public-post-card__category-badge,
body.mb-v11 .public-post-card__tag,
body.mb-v11 .shop-product-card__badge,
body.mb-v11 .event-date-tag {
  border: 1px solid rgba(255,128,0,.10) !important;
  border-radius: 999px !important;
  background: rgba(255,128,0,.035) !important;
  color: #c7ced2 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.014);
}

body.mb-v11 .contact-form-card,
body.mb-v11 .application-form-section form {
  backdrop-filter: blur(10px);
}

body.mb-v11 .rules-hero__panel,
body.mb-v11 .privacy-hero__card,
body.mb-v11 .application-hero__notice {
  backdrop-filter: blur(13px);
  border-color: rgba(255,128,0,.13) !important;
  background:
    radial-gradient(circle at 90% 10%, rgba(255,128,0,.05), transparent 34%),
    rgba(5,7,8,.76) !important;
}

body.mb-v11 .social-chip {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.012) !important;
  color: #747d82 !important;
  transition: transform .2s ease, border-color .2s ease, color .2s ease, background .2s ease;
}

body.mb-v11 .social-chip:hover {
  transform: translateY(-2px);
  border-color: rgba(255,128,0,.2) !important;
  background: rgba(255,128,0,.035) !important;
  color: #dfe3e5 !important;
}

body.mb-v11 .social-chip__icon {
  color: var(--mb-v11-orange-hi) !important;
}

/* Technical side-line treatment for major hero copy blocks */
body.mb-v11 .hero-copy,
body.mb-v11 .server-hero-copy,
body.mb-v11 .staff-hero__copy,
body.mb-v11 .discord-hero-page__content,
body.mb-v11 .shop-hero__content,
body.mb-v11 .rules-hero__copy,
body.mb-v11 .contact-hero__copy,
body.mb-v11 .privacy-hero__copy {
  position: relative;
}

body.mb-v11 .hero-copy::before,
body.mb-v11 .server-hero-copy::before,
body.mb-v11 .staff-hero__copy::before,
body.mb-v11 .discord-hero-page__content::before,
body.mb-v11 .shop-hero__content::before,
body.mb-v11 .rules-hero__copy::before,
body.mb-v11 .contact-hero__copy::before,
body.mb-v11 .privacy-hero__copy::before {
  content: "";
  position: absolute;
  left: -22px;
  top: 6%;
  width: 2px;
  height: 88%;
  border-radius: 999px;
  background: linear-gradient(to bottom, transparent, rgba(255,128,0,.48), rgba(255,128,0,.07), transparent);
  box-shadow: 0 0 14px rgba(255,128,0,.08);
}

@media (max-width: 720px) {
  body.mb-v11 .hero-copy::before,
  body.mb-v11 .server-hero-copy::before,
  body.mb-v11 .staff-hero__copy::before,
  body.mb-v11 .discord-hero-page__content::before,
  body.mb-v11 .shop-hero__content::before,
  body.mb-v11 .rules-hero__copy::before,
  body.mb-v11 .contact-hero__copy::before,
  body.mb-v11 .privacy-hero__copy::before {
    display: none;
  }
}


/* ======================================================================
   V11.1 · HOME SERVER CARDS HOTFIX
   - Restores absolute content/footer positioning overridden by V11 surfaces.
   - Keeps artwork clipped inside each card.
   - Enlarges the home servers kicker.
   ====================================================================== */

body.mb-v11.home-page .servers-section .section-kicker {
  font-size: clamp(1rem, 1.15vw, 1.16rem) !important;
  font-weight: 700 !important;
  letter-spacing: .17em !important;
  line-height: 1.2 !important;
  margin-bottom: 10px !important;
}

body.mb-v11.home-page .servers-section .server-card {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate;
  background-clip: padding-box !important;
  contain: paint;
}

body.mb-v11.home-page .servers-section .server-card-copy {
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  top: 18px !important;
  z-index: 4 !important;
}

body.mb-v11.home-page .servers-section .server-label {
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  top: auto !important;
  bottom: 14px !important;
  z-index: 5 !important;
  min-height: 48px;
  margin: 0 !important;
  transform: none !important;
}

body.mb-v11.home-page .servers-section .server-card::after {
  inset: 0 !important;
  border-radius: inherit !important;
  overflow: hidden;
  z-index: 1;
}

body.mb-v11.home-page .servers-section .server-card-link {
  z-index: 8;
}

body.mb-v11.home-page .servers-section .server-logo-img {
  display: block;
  max-width: 88%;
  max-height: 42px;
  margin: 0 auto;
  object-fit: contain;
}

body.mb-v11.home-page .servers-section .server-logo-scum {
  max-width: 74%;
  max-height: 34px;
}

@media (max-width: 980px) {
  body.mb-v11.home-page .servers-section .server-card-copy {
    left: 16px !important;
    right: 16px !important;
  }
}

@media (max-width: 720px) {
  body.mb-v11.home-page .servers-section .section-kicker {
    font-size: .95rem !important;
  }

  body.mb-v11.home-page .servers-section .server-label {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
  }
}

/* ======================================================================
   V11.3 · HOME SERVER CARDS HOVER STABLE
   - Avoids hover enter/leave oscillation near the card bottom edge.
   - The card no longer translates away from the pointer.
   - Keeps a subtle scale, glow, logo-footer lift and cinematic sweep.
   - Removes the full-card CSS filter to reduce GPU work/jank.
   ====================================================================== */

body.mb-v11.home-page .servers-section .server-card {
  transform-origin: center center;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: auto;
  transition:
    transform .30s cubic-bezier(.22,.8,.23,1),
    border-color .26s ease,
    box-shadow .30s ease !important;
}

/*
 * Do NOT translate the card on hover.
 * Moving it upward can move the bottom edge away from the pointer and create
 * a hover enter/leave loop. Scaling up keeps the hit area under the cursor.
 */
@media (hover:hover) and (pointer:fine) {
  body.mb-v11.home-page .servers-section .server-card.mb-v11-reveal.mb-v11-visible:hover,
  body.mb-v11.home-page .servers-section .server-card[data-mb-v11-surface]:hover {
    transform: translateZ(0) scale(1.014) !important;
    border-color: rgba(255,128,0,.32) !important;
    filter: none !important;
    box-shadow:
      0 27px 58px rgba(0,0,0,.38),
      0 0 0 1px rgba(255,128,0,.04),
      0 0 28px rgba(255,128,0,.07),
      inset 0 1px rgba(255,255,255,.03) !important;
  }

  body.mb-v11.home-page .servers-section .server-card .server-label {
    transition:
      transform .30s cubic-bezier(.22,.8,.23,1),
      border-color .26s ease,
      background-color .26s ease,
      box-shadow .30s ease !important;
  }

  body.mb-v11.home-page .servers-section .server-card:hover .server-label {
    transform: translate3d(0,-2px,0) !important;
    border-color: rgba(255,128,0,.24) !important;
    background-color: rgba(5,6,7,.95) !important;
    box-shadow:
      0 -10px 24px rgba(0,0,0,.17),
      inset 0 1px rgba(255,255,255,.026),
      0 0 20px rgba(255,128,0,.035) !important;
  }

  body.mb-v11.home-page .servers-section .server-card .server-logo-img {
    transition: transform .30s cubic-bezier(.22,.8,.23,1), filter .30s ease;
  }

  body.mb-v11.home-page .servers-section .server-card:hover .server-logo-img {
    transform: translateZ(0) scale(1.025);
    filter: brightness(1.06);
  }
}

/* Touch/mobile: never leave a sticky hover transform behind. */
@media (hover:none), (pointer:coarse), (max-width:640px) {
  body.mb-v11.home-page .servers-section .server-card.mb-v11-reveal.mb-v11-visible:hover,
  body.mb-v11.home-page .servers-section .server-card[data-mb-v11-surface]:hover {
    transform: none !important;
    filter: none !important;
  }

  body.mb-v11.home-page .servers-section .server-card:hover .server-label,
  body.mb-v11.home-page .servers-section .server-card:hover .server-logo-img {
    transform: none !important;
    filter: none !important;
  }
}

/* ======================================================================
   V11.4 · HOME SERVER CARDS · DEDICATED CINEMATIC REFLECTION
   The generic V11 sweep uses ::after, but server cards already use ::after
   for their image darkening overlay. A real child layer avoids that conflict.
   ====================================================================== */

body.mb-v11.home-page .servers-section .server-card > .mb-v11-server-sweep {
  position: absolute;
  z-index: 7;
  top: -12%;
  left: -42%;
  width: 28%;
  height: 124%;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(0,0,0) skewX(-18deg);
  transform-origin: center;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,.018) 18%,
    rgba(255,255,255,.105) 44%,
    rgba(255,154,50,.075) 55%,
    rgba(255,255,255,.032) 69%,
    transparent 100%
  );
  filter: blur(.25px);
  will-change: transform, opacity;
}

@media (hover:hover) and (pointer:fine) {
  body.mb-v11.home-page .servers-section .server-card:hover > .mb-v11-server-sweep {
    animation: mbV11ServerReflection .92s cubic-bezier(.22,.8,.23,1) forwards;
  }
}

@keyframes mbV11ServerReflection {
  0% {
    opacity: 0;
    transform: translate3d(0,0,0) skewX(-18deg);
  }
  12% {
    opacity: .35;
  }
  35% {
    opacity: .78;
  }
  78% {
    opacity: .48;
  }
  100% {
    opacity: 0;
    transform: translate3d(610%,0,0) skewX(-18deg);
  }
}

@media (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce) {
  body.mb-v11.home-page .servers-section .server-card > .mb-v11-server-sweep {
    display: none !important;
  }
}



/* ======================================================================
   V11.5 · STAFF · HERO CONTAINMENT + MEMBER IMAGE RESTORE
   Staff cards use ::after as their actual artwork layer. The generic V11
   card sweep also uses ::after, so on Staff it was replacing/hiding the
   member image. Restore the artwork pseudo-element and use a dedicated
   real child for the cinematic sweep instead.
   ====================================================================== */

/* Restore the Staff card artwork layer that exists in styles.css. */
body.mb-v11.staff-theme .staff-member-card[data-mb-v11-surface]::after {
  content: "" !important;
  position: absolute !important;
  z-index: 0 !important;
  top: 1px !important;
  right: 1px !important;
  bottom: 1px !important;
  left: 1px !important;
  width: auto !important;
  height: auto !important;
  border-radius: 17px !important;
  opacity: 1 !important;
  pointer-events: none !important;
  transform: none !important;
  animation: none !important;
  background-image: var(--staff-card-image) !important;
  background-position: var(--staff-card-pos, center center) !important;
  background-size: var(--staff-card-size, cover) !important;
  background-repeat: no-repeat !important;
}

body.mb-v11.staff-theme .staff-member-card--dynamic[data-mb-v11-surface]::after {
  background-position: center 22% !important;
}

body.mb-v11.staff-theme .staff-member-card--has-image[data-mb-v11-surface]::after {
  top: 18px !important;
  right: 18px !important;
  bottom: 18px !important;
  left: 18px !important;
  border-radius: 14px !important;
  background-color: #050404 !important;
  background-position: center center !important;
  background-size: contain !important;
}

/* Preserve legacy placeholder artwork when no uploaded image exists. */
body.mb-v11.staff-theme .staff-member-card--placeholder[data-mb-v11-surface]::after {
  background:
    linear-gradient(180deg, rgba(10,8,7,.16), rgba(10,8,7,.78)),
    radial-gradient(circle at 50% 18%, rgba(255,128,0,.18), transparent 28%),
    linear-gradient(135deg, rgba(255,128,0,.12), rgba(0,0,0,.08)) !important;
}

body.mb-v11.staff-theme .staff-member-card--admin.staff-member-card--placeholder[data-mb-v11-surface]::after {
  background:
    linear-gradient(180deg, rgba(10,8,7,.18), rgba(10,8,7,.82)),
    radial-gradient(circle at 50% 18%, rgba(255,128,0,.22), transparent 26%),
    linear-gradient(135deg, rgba(255,128,0,.16), rgba(58,13,0,.14) 42%, rgba(0,0,0,.08)),
    url("../img/hero-bg-mb-gaming-v2.png") center center/cover no-repeat !important;
}

body.mb-v11.staff-theme .staff-member-card--moderator.staff-member-card--placeholder[data-mb-v11-surface]::after {
  background:
    linear-gradient(180deg, rgba(10,8,7,.18), rgba(10,8,7,.82)),
    radial-gradient(circle at 50% 18%, rgba(255,128,0,.18), transparent 28%),
    linear-gradient(135deg, rgba(255,128,0,.14), rgba(24,24,24,.12) 46%, rgba(0,0,0,.1)),
    url("../img/scum-hero-official.png") center center/cover no-repeat !important;
}

/* Do not animate the artwork pseudo-element itself on hover. */
body.mb-v11.staff-theme .staff-member-card[data-mb-v11-surface]:hover::after {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

/* Dedicated V11 reflection for Staff cards. */
body.mb-v11.staff-theme .staff-member-card > .mb-v11-staff-sweep {
  position: absolute;
  z-index: 5;
  top: -12%;
  left: -42%;
  width: 28%;
  height: 124%;
  opacity: 0;
  pointer-events: none;
  transform: skewX(-18deg);
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,.018) 22%,
    rgba(255,255,255,.085) 48%,
    rgba(255,128,0,.055) 58%,
    transparent 100%
  );
  filter: blur(.2px);
}

@media (hover:hover) and (pointer:fine) {
  body.mb-v11.staff-theme .staff-member-card:hover > .mb-v11-staff-sweep {
    opacity: 1;
    animation: mbV11StaffSweep .88s cubic-bezier(.22,.8,.23,1) forwards;
  }
}

@keyframes mbV11StaffSweep {
  0%   { left: -42%; opacity: 0; }
  14%  { opacity: .78; }
  78%  { opacity: .45; }
  100% { left: 118%; opacity: 0; }
}

/* Uploaded founder art must remain fully contained inside the founder card. */
body.mb-v11.staff-theme .founder-card--has-image .founder-card__art {
  overflow: hidden !important;
  background-position: center center !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}

@media (max-width: 760px) {
  body.mb-v11.staff-theme .staff-hero {
    min-height: auto !important;
    padding-top: 94px !important;
    padding-bottom: 42px !important;
    background-position: center top !important;
  }

  body.mb-v11.staff-theme .staff-hero__content {
    min-height: 0 !important;
  }
}

/* ======================================================================
   V11.15 · STAFF + POSTULACION · DISCORD HERO PARITY
   Staff and Postulacion now use the same typography, color hierarchy,
   backdrop treatment, spacing and V11 hero language as discord.html.
   ====================================================================== */

/* ----------------------------------------------------------------------
   HERO GEOMETRY — same proportions as Discord
   ---------------------------------------------------------------------- */
body.mb-v11.staff-theme .staff-hero,
body.mb-v11.application-theme .application-hero {
  position: relative !important;
  overflow: hidden !important;
  min-height: clamp(700px, 92vh, 980px) !important;
  padding: clamp(118px, 14vh, 156px) 0 clamp(72px, 10vh, 108px) !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  isolation: isolate !important;
}

/* Old page-specific overlays are replaced by the Discord-style backdrop. */
body.mb-v11.staff-theme .staff-hero::before,
body.mb-v11.staff-theme .staff-hero::after,
body.mb-v11.application-theme .application-hero::before,
body.mb-v11.application-theme .application-hero::after {
  display: none !important;
}

/* ----------------------------------------------------------------------
   BACKDROP — same gradients, orange ambience and particle treatment
   used by discord.html.
   ---------------------------------------------------------------------- */
body.mb-v11.staff-theme .staff-hero__backdrop,
body.mb-v11.application-theme .application-hero__backdrop {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background:
    linear-gradient(
      90deg,
      rgba(6,5,5,.94) 0%,
      rgba(6,5,5,.74) 38%,
      rgba(6,5,5,.30) 68%,
      rgba(6,5,5,.58) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,.12) 0%,
      rgba(0,0,0,.48) 100%
    ),
    url("../img/hero-bg-mb-gaming-v2.png") center right/cover no-repeat !important;
  filter: none !important;
  transform: none !important;
}

body.mb-v11.staff-theme .staff-hero__backdrop::before,
body.mb-v11.staff-theme .staff-hero__backdrop::after,
body.mb-v11.application-theme .application-hero__backdrop::before,
body.mb-v11.application-theme .application-hero__backdrop::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}

body.mb-v11.staff-theme .staff-hero__backdrop::before,
body.mb-v11.application-theme .application-hero__backdrop::before {
  background:
    radial-gradient(circle at 78% 32%, rgba(255,128,0,.20), transparent 20%),
    radial-gradient(circle at 86% 74%, rgba(255,128,0,.14), transparent 22%) !important;
}

body.mb-v11.staff-theme .staff-hero__backdrop::after,
body.mb-v11.application-theme .application-hero__backdrop::after {
  opacity: .42 !important;
  background-image:
    radial-gradient(circle, rgba(255,128,0,.55) 0 1.2px, transparent 1.2px),
    radial-gradient(circle, rgba(255,173,92,.38) 0 .9px, transparent .9px) !important;
  background-size: 180px 180px, 240px 240px !important;
  background-position: 0 0, 90px 70px !important;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.95), rgba(0,0,0,.35)) !important;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.95), rgba(0,0,0,.35)) !important;
}

/* Dynamic hero images preserve Discord's exact overlay language. */
body.mb-v11.staff-theme .staff-hero__backdrop.is-banner-loaded,
body.mb-v11.application-theme .application-hero__backdrop.is-banner-loaded {
  background-image:
    linear-gradient(
      90deg,
      rgba(6,5,5,.94) 0%,
      rgba(6,5,5,.74) 38%,
      rgba(6,5,5,.30) 68%,
      rgba(6,5,5,.58) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,.12) 0%,
      rgba(0,0,0,.48) 100%
    ),
    var(--mb-banner-image) !important;
  background-position: 0 0, 0 0, center right !important;
  background-size: auto, auto, cover !important;
  background-repeat: no-repeat !important;
}

/* ----------------------------------------------------------------------
   CONTENT SHELL — same width and stacking model as Discord.
   ---------------------------------------------------------------------- */
body.mb-v11.staff-theme .staff-hero__inner,
body.mb-v11.application-theme .application-hero__inner {
  position: relative !important;
  z-index: 2 !important;
  width: min(100% - clamp(32px, 5vw, 88px), 1660px) !important;
  margin-inline: auto !important;
}

/* V11 FX remains behind content, exactly like Discord. */
body.mb-v11.staff-theme .staff-hero > .mb-v11-hero-fx,
body.mb-v11.application-theme .application-hero > .mb-v11-hero-fx {
  z-index: 0 !important;
}

/* ----------------------------------------------------------------------
   TYPOGRAPHY — Discord hierarchy.
   ---------------------------------------------------------------------- */
body.mb-v11.staff-theme .staff-kicker,
body.mb-v11.application-theme .application-kicker {
  margin: 0 0 12px !important;
  color: var(--mb-v11-orange-hi) !important;
  font-family: "Oswald", sans-serif !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
  letter-spacing: .16em !important;
  line-height: 1.35 !important;
  text-transform: uppercase !important;
  text-shadow: 0 0 14px rgba(255,128,0,.09) !important;
  transform: none !important;
}

/* Staff: one-line title, same white Discord title language. */
body.mb-v11.staff-theme .staff-hero h1 {
  margin: 0 !important;
  color: #f3efea !important;
  font-family: "Bebas Neue", "Oswald", sans-serif !important;
  font-size: clamp(4.6rem, 8vw, 7.9rem) !important;
  font-weight: 400 !important;
  line-height: .92 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
  text-shadow:
    0 16px 36px rgba(0,0,0,.46),
    0 0 26px rgba(255,128,0,.035) !important;
  transform: none !important;
}

/* Postulacion: exact Discord two-line white/orange hierarchy. */
body.mb-v11.application-theme .application-hero h1 {
  margin: 0 !important;
  display: grid !important;
  gap: 6px !important;
  font-family: "Bebas Neue", "Oswald", sans-serif !important;
  font-weight: 400 !important;
  line-height: .92 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
}

body.mb-v11.application-theme .application-hero h1 span:first-child {
  color: #f3efea !important;
  font-size: clamp(4.6rem, 8vw, 7.9rem) !important;
  letter-spacing: .03em !important;
  text-shadow: 0 16px 36px rgba(0,0,0,.46) !important;
}

body.mb-v11.application-theme .application-hero h1 span:last-child {
  color: var(--mb-v11-orange-hi) !important;
  font-size: clamp(4.9rem, 8.7vw, 8.6rem) !important;
  letter-spacing: .03em !important;
  text-shadow:
    0 18px 40px rgba(255,128,0,.18),
    0 14px 32px rgba(0,0,0,.34) !important;
}

body.mb-v11.staff-theme .staff-lead,
body.mb-v11.application-theme .application-lead {
  max-width: 640px !important;
  margin: 18px 0 0 !important;
  color: rgba(255,245,236,.84) !important;
  font-size: clamp(1.1rem, 1.2vw, 1.24rem) !important;
  line-height: 1.72 !important;
  transform: none !important;
}

/* ----------------------------------------------------------------------
   STAFF CONTENT — keep its own information, but with Discord spacing.
   ---------------------------------------------------------------------- */
body.mb-v11.staff-theme .staff-hero__inner {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

body.mb-v11.staff-theme .staff-hero__content {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  min-height: 0 !important;
  max-width: 740px !important;
  margin: 0 !important;
}

body.mb-v11.staff-theme .staff-hero__copy {
  max-width: 740px !important;
}

body.mb-v11.staff-theme .staff-values {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  margin-top: clamp(42px, 6vh, 66px) !important;
  gap: clamp(14px, 1.6vw, 22px) !important;
}

body.mb-v11.staff-theme .staff-value-card {
  min-height: 0 !important;
  padding: 20px 22px !important;
  border: 1px solid rgba(255,128,0,.13) !important;
  border-radius: 18px !important;
  background: rgba(7,8,9,.72) !important;
  box-shadow:
    0 20px 46px rgba(0,0,0,.26),
    inset 0 1px rgba(255,255,255,.018) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}

body.mb-v11.staff-theme .staff-value-card h2 {
  color: var(--mb-v11-orange-hi) !important;
  font-family: "Oswald", sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: .035em !important;
}

body.mb-v11.staff-theme .staff-value-card p {
  color: #90989d !important;
}

/* ----------------------------------------------------------------------
   POSTULACION CONTENT — same hero language, preserving the notice.
   ---------------------------------------------------------------------- */
body.mb-v11.application-theme .application-hero__inner {
  display: grid !important;
  align-items: center !important;
}

body.mb-v11.application-theme .application-hero__content {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0,740px) minmax(280px,390px) !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: clamp(42px, 7vw, 110px) !important;
}

body.mb-v11.application-theme .application-hero__copy {
  max-width: 740px !important;
}

body.mb-v11.application-theme .application-hero__notice {
  padding: 26px 28px !important;
  border: 1px solid rgba(255,128,0,.14) !important;
  border-radius: 18px !important;
  background: rgba(7,8,9,.76) !important;
  box-shadow:
    0 22px 50px rgba(0,0,0,.3),
    inset 0 1px rgba(255,255,255,.018) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}

body.mb-v11.application-theme .application-hero__notice h2 {
  color: var(--mb-v11-orange-hi) !important;
  font-family: "Oswald", sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: .045em !important;
}

body.mb-v11.application-theme .application-hero__notice p {
  color: #90989d !important;
  line-height: 1.65 !important;
}

/* ----------------------------------------------------------------------
   RESPONSIVE — mirrors Discord's mobile hero behavior.
   ---------------------------------------------------------------------- */
@media (max-width: 900px) {
  body.mb-v11.application-theme .application-hero__content {
    grid-template-columns: 1fr !important;
  }

  body.mb-v11.application-theme .application-hero__notice {
    max-width: 560px !important;
  }
}

@media (max-width: 760px) {
  body.mb-v11.staff-theme .staff-hero,
  body.mb-v11.application-theme .application-hero {
    min-height: auto !important;
    padding: 108px 0 64px !important;
  }

  body.mb-v11.staff-theme .staff-hero__inner,
  body.mb-v11.application-theme .application-hero__inner {
    width: min(100% - 36px, 100%) !important;
  }

  body.mb-v11.staff-theme .staff-hero__backdrop,
  body.mb-v11.application-theme .application-hero__backdrop {
    background:
      linear-gradient(
        180deg,
        rgba(6,5,5,.90) 0%,
        rgba(6,5,5,.68) 45%,
        rgba(6,5,5,.88) 100%
      ),
      url("../img/hero-bg-mb-gaming-v2.png") center right/cover no-repeat !important;
  }

  body.mb-v11.staff-theme .staff-hero__backdrop.is-banner-loaded,
  body.mb-v11.application-theme .application-hero__backdrop.is-banner-loaded {
    background-image:
      linear-gradient(
        180deg,
        rgba(6,5,5,.90) 0%,
        rgba(6,5,5,.68) 45%,
        rgba(6,5,5,.88) 100%
      ),
      var(--mb-banner-image) !important;
    background-position: 0 0, center top !important;
    background-size: auto, cover !important;
  }

  body.mb-v11.staff-theme .staff-hero h1,
  body.mb-v11.application-theme .application-hero h1 span:first-child {
    font-size: clamp(3.8rem, 15vw, 5.3rem) !important;
  }

  body.mb-v11.application-theme .application-hero h1 span:last-child {
    font-size: clamp(4rem, 15.8vw, 5.6rem) !important;
  }

  body.mb-v11.staff-theme .staff-lead,
  body.mb-v11.application-theme .application-lead {
    font-size: 1rem !important;
  }

  body.mb-v11.staff-theme .staff-values {
    grid-template-columns: 1fr !important;
    margin-top: 32px !important;
  }
}


/* ======================================================================
   V11.16 · BRAND COLORS
   MALDITOS = white / BASTARDOS = official #FF8000.
   ====================================================================== */
body.mb-v11 .site-header .brand-text span:first-child,
body.mb-v11 .site-footer .brand-text span:first-child {
  color: #f3f5f6 !important;
  text-shadow: 0 0 14px rgba(255,255,255,.025) !important;
}

body.mb-v11 .site-header .brand-text span:last-child,
body.mb-v11 .site-footer .brand-text span:last-child {
  color: #ff8000 !important;
  text-shadow: 0 0 16px rgba(255,128,0,.16) !important;
}