/* ACME menuBar presets — 15 designs from ACMEv14 (lib/site-design-config.ts).
 *
 * Each preset is activated by `body.acme-mb-<id>` class, applied by
 * site-design-loader.js based on cookie/localStorage value.
 * The skin's menu chrome (.acme-eyebrow, .am, .am-header, .am-brand, etc.)
 * inherits these CSS variables so layout structure stays the same — only
 * colors, fonts, and a few accents change.
 *
 * Default (acme-original) — already styled by AcmeMega.css; no override here.
 */

/* ============================================================
 * acme-original  — light nav + black utility bar + ACME blue accent
 * (No-op: this is the default style; .acme-eyebrow + .am inherit baseline.)
 * ============================================================ */

/* DNN PersonaBar is the small DNN rail/logo seen only after admin login.
   Guest pages remain flush, but logged-in pages reserve the rail width so
   the PersonaBar does not cover the utility bar or site logo. */
body[class*="acme-mb-"] {
  padding-left: 0 !important;
}
body[class*="acme-mb-"]:not(.personabar-visible):not(.acme-personabar-visible) {
  margin-left: 0 !important;
}

/* top-modern from ACME_TopmenuBar: compact white command bar with centered pill nav */
body.acme-mb-top-modern {
  --am-primary: #111111;
  --am-primary-fg: #ffffff;
  --acme-eyebrow-preset-fg: rgba(255,255,255,0.86);
  --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif;
  --acme-menu-main-height: 68px;
  --acme-menu-control-height: 40px;
  --acme-menu-control-radius: 999px;
  --acme-menu-nav-gap: 2px;
}
body.acme-mb-top-modern .acme-eyebrow {
  background: #2d3748;
  color: rgba(255,255,255,0.86);
  border-top: 2px solid #0b0b0b;
  border-bottom: 0;
}
body.acme-mb-top-modern .am-header,
body.acme-mb-top-modern .am-sticky {
  background: #ffffff;
  border-bottom: 1px solid rgba(15,23,42,0.08);
  box-shadow: 0 1px 0 rgba(15,23,42,0.04);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.acme-mb-top-modern .am-header-inner {
  position: relative;
  height: 68px;
  max-width: 1280px;
  padding: 0 20px 0 76px;
  gap: 22px;
  font-family: "Inter", "Geist", system-ui, sans-serif;
  font-weight: 500;
}
body.acme-mb-top-modern .am-header-inner::before {
  content: "";
  position: absolute;
  left: 28px;
  top: 50%;
  width: 18px;
  height: 12px;
  transform: translateY(-50%);
  background:
    linear-gradient(#111111,#111111) 0 0/13px 1.5px no-repeat,
    linear-gradient(#111111,#111111) 0 50%/18px 1.5px no-repeat,
    linear-gradient(#111111,#111111) 0 100%/9px 1.5px no-repeat;
  border-radius: 2px;
}
body.acme-mb-top-modern .am-brand {
  gap: 9px;
  min-width: 154px;
  color: #111111;
  text-decoration: none;
}
body.acme-mb-top-modern .am-brand::before {
  content: "A";
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  border-radius: 10px;
  background: #ef3f42;
  color: #ffffff;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 10px 24px rgba(239,63,66,0.24);
}
body.acme-mb-top-modern .am-brand-name,
body.acme-mb-top-modern .am-brand-suffix {
  font-size: 0;
  letter-spacing: 0;
}
body.acme-mb-top-modern .am-brand-name::after {
  content: "Acme";
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #111111;
}
body.acme-mb-top-modern .am-brand-suffix::after {
  content: "Corp";
  font-size: 18px;
  font-weight: 400;
  letter-spacing: -0.03em;
  color: #636363;
}
body.acme-mb-top-modern .am-nav {
  align-self: center;
  flex: 0 0 auto;
  height: 48px;
  gap: 2px;
  padding: 4px;
  border-radius: 999px;
  background: #f4f3f2;
}
body.acme-mb-top-modern .am-nav-item {
  align-self: center;
  height: 40px;
}
body.acme-mb-top-modern .am-nav-link {
  height: 40px;
  color: #5f6368;
  border-radius: 999px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
}
body.acme-mb-top-modern .am-nav-link::after {
  display: none;
}
body.acme-mb-top-modern .am-nav-link:hover,
body.acme-mb-top-modern .am-nav-item.am-expanded > .am-nav-link {
  color: #111111;
  background: #ffffff;
  box-shadow: 0 3px 10px rgba(15,23,42,0.08);
}
body.acme-mb-top-modern .am-search {
  flex: 0 0 auto;
  width: 42px;
  max-width: 42px;
  margin-left: auto;
  margin-right: 4px;
}
body.acme-mb-top-modern .am-search-inner,
body.acme-mb-top-modern .am-search-input {
  width: 42px;
}
body.acme-mb-top-modern .am-search-input {
  height: 42px;
  padding: 0;
  border-radius: 999px;
  color: transparent;
  caret-color: #111111;
  background: #ffffff;
  border-color: transparent;
  box-shadow: none;
}
body.acme-mb-top-modern .am-search-input::placeholder {
  color: transparent;
}
body.acme-mb-top-modern .am-search-ico {
  left: 50%;
  color: #111111;
  transform: translate(-50%, -50%);
}
body.acme-mb-top-modern .am-actions {
  gap: 16px;
  margin-left: 0;
}
body.acme-mb-top-modern .am-action-btn {
  color: #111111;
  border-radius: 999px;
  background: transparent;
}
body.acme-mb-top-modern .am-cart-badge {
  background: #e60000;
  color: #ffffff;
}

body.acme-mb-top-minimal .acme-eyebrow { background: #ffffff; color: #6b7280; border-bottom: 1px solid rgba(15,23,42,0.08); }
body.acme-mb-top-minimal .am-header,
body.acme-mb-top-minimal .am-sticky { background: #ffffff; border-bottom: 1px solid rgba(15,23,42,0.08); }
body.acme-mb-top-minimal .am-header-inner { height: 56px; max-width: 1180px; font-family: "Inter", "Geist", system-ui, sans-serif; font-weight: 500; }
body.acme-mb-top-minimal .am-brand-name,
body.acme-mb-top-minimal .am-brand-suffix { font-size: 15px; letter-spacing: 0.14em; text-transform: uppercase; }
body.acme-mb-top-minimal .am-nav { gap: 26px; }
body.acme-mb-top-minimal .am-nav-link { color: #6b7280; padding: 6px 0; font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; }
body.acme-mb-top-minimal .am-nav-link:hover,
body.acme-mb-top-minimal .am-nav-item.am-expanded > .am-nav-link { color: #111111; }
body.acme-mb-top-minimal .am-search-input { height: 34px; background: transparent; border-color: rgba(15,23,42,0.12); }
body.acme-mb-top-minimal .am-action-btn { color: #4b5563; }
body.acme-mb-top-minimal .am-cart-badge { background: #111111; color: #ffffff; }
body.acme-mb-top-minimal { --am-primary: #111111; --am-primary-fg: #ffffff; }

body.acme-mb-top-bold .acme-eyebrow { background: #000000; color: rgba(255,255,255,0.82); text-transform: uppercase; letter-spacing: 0.04em; }
body.acme-mb-top-bold .am-header,
body.acme-mb-top-bold .am-sticky { background: #111111; border-bottom: 4px solid #df0000; }
body.acme-mb-top-bold .am-header-inner { height: 80px; font-family: "Inter", "Geist", system-ui, sans-serif; font-weight: 800; }
body.acme-mb-top-bold .am-brand-name,
body.acme-mb-top-bold .am-brand-suffix,
body.acme-mb-top-bold .am-nav-link { color: #ffffff; text-transform: uppercase; letter-spacing: 0.06em; }
body.acme-mb-top-bold .am-nav-link { padding: 10px 14px; color: rgba(255,255,255,0.72); }
body.acme-mb-top-bold .am-nav-link:hover,
body.acme-mb-top-bold .am-nav-item.am-expanded > .am-nav-link { color: #ffffff; background: rgba(255,255,255,0.10); }
body.acme-mb-top-bold .am-search-input { height: 42px; background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.18); color: #ffffff; }
body.acme-mb-top-bold .am-search-input::placeholder { color: rgba(255,255,255,0.56); }
body.acme-mb-top-bold .am-action-btn { color: #ffffff; }
body.acme-mb-top-bold .am-cart-badge { background: #df0000; color: #ffffff; }
body.acme-mb-top-bold { --am-primary: #df0000; --am-primary-fg: #ffffff; }

/* top-elegant from ACME_elegant: centered brand with split desktop nav */
body.acme-mb-top-elegant .acme-eyebrow { background: #0f0a09; color: rgba(255,255,255,0.88); }
body.acme-mb-top-elegant .am-header,
body.acme-mb-top-elegant .am-sticky { background: #ffffff; border-bottom: 1px solid rgba(15,10,9,0.10); box-shadow: 0 1px 0 rgba(15,10,9,0.04); }
body.acme-mb-top-elegant .am-header { position: relative; min-height: 122px; }
body.acme-mb-top-elegant .am-header::before {
  content: "Free shipping on orders over $100";
  position: absolute;
  left: max(48px, calc((100vw - 1280px) / 2));
  right: max(48px, calc((100vw - 1280px) / 2));
  top: 0;
  height: 40px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(15,10,9,0.08);
  color: #5f5a54;
  font: 500 12px/1 "Inter", "Geist", system-ui, sans-serif;
  pointer-events: none;
}
body.acme-mb-top-elegant .am-header::after {
  content: "Find a Store   |   Help   |   My Account";
  position: absolute;
  right: max(48px, calc((100vw - 1280px) / 2));
  top: 0;
  height: 40px;
  display: flex;
  align-items: center;
  color: #5f5a54;
  font: 500 12px/1 "Inter", "Geist", system-ui, sans-serif;
  white-space: pre;
  pointer-events: none;
}
body.acme-mb-top-elegant .am-header-inner { height: 82px; position: relative; font-family: "Inter", "Geist", system-ui, sans-serif; font-weight: 500; }
body.acme-mb-top-elegant .am-brand-name { font-family: "Playfair Display", Georgia, serif; font-weight: 500; letter-spacing: 0.04em; color: #0f0a09; }
body.acme-mb-top-elegant .am-brand-suffix { font-family: "Inter", "Geist", system-ui, sans-serif; font-size: 0; font-weight: 500; letter-spacing: 0.30em; text-transform: uppercase; color: #8a8178; }
body.acme-mb-top-elegant .am-brand-suffix::after { content: "SINCE 1990"; font-size: 0.62rem; }
body.acme-mb-top-elegant .am-nav-link { color: #5f5a54; padding: 6px 0; font-size: 14px; font-weight: 500; letter-spacing: 0; }
body.acme-mb-top-elegant .am-nav-link:hover,
body.acme-mb-top-elegant .am-nav-item.am-expanded > .am-nav-link { color: #0f0a09; }
body.acme-mb-top-elegant .am-nav-link::after { bottom: -8px; left: 0; right: 0; height: 1px; background: #0f0a09; }
body.acme-mb-top-elegant .am-search-input { background: #ffffff; border-color: rgba(15,10,9,0.14); color: #0f0a09; }
body.acme-mb-top-elegant .am-search-input::placeholder { color: transparent; }
body.acme-mb-top-elegant { --am-primary: #b59a6a; --am-primary-fg: #0f0a09; }

@media (min-width: 1024px) {
  body.acme-mb-top-elegant .am-header-inner { top: 40px; }
  body.acme-mb-top-elegant .am-header-inner { justify-content: center; gap: 0; }
  body.acme-mb-top-elegant .am-brand {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    min-width: 176px;
    justify-content: center;
    text-align: center;
    transform: translate(-50%, -50%);
  }
  body.acme-mb-top-elegant .am-brand:not(.am-brand-logo) {
    flex-direction: column;
    gap: 2px;
  }
  body.acme-mb-top-elegant .am .am-brand-img {
    height: 46px !important;
    max-width: 176px;
  }
  body.acme-mb-top-elegant .am-nav {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 32px !important;
    margin: 0;
    padding: 0 84px 0 100px;
    pointer-events: none;
  }
  body.acme-mb-top-elegant .am-nav-item {
    pointer-events: auto;
  }
  /* Split the nav into two edge-aligned groups so the centered brand sits in
     the empty gap between them. `auto` absorbs all free space and adapts to
     any nav width; the old fixed 220px gap was too small, so wider navs ran
     their right-hand items straight under the absolutely-centered brand. */
  body.acme-mb-top-elegant .am-nav > .am-nav-item:nth-child(4) {
    margin-right: auto;
  }
  body.acme-mb-top-elegant .am-search {
    position: absolute;
    right: 16px;
    top: 50%;
    z-index: 4;
    width: 42px;
    max-width: 42px;
    margin: 0;
    flex: none;
    transform: translateY(-50%);
  }
  body.acme-mb-top-elegant .am-search-inner {
    width: 42px;
  }
  body.acme-mb-top-elegant .am-search-ico {
    left: 50%;
    color: #5f5a54;
    transform: translate(-50%, -50%);
  }
  body.acme-mb-top-elegant .am-search-input {
    width: 42px;
    height: 42px;
    padding: 0;
    color: transparent;
    cursor: pointer;
  }
}

/* top-elegant — mobile/tablet (<1024px): the desktop two-row chrome (122px
   header + "Free shipping"/"Find a Store" promo bars) does not fit a phone.
   The promo bars are absolutely positioned and overlap; the centered-brand
   layout is desktop-only. Collapse to a clean single row: drop the promo
   bars, shrink the header, keep the wordmark centred above the hamburger. */
@media (max-width: 1023px) {
  body.acme-mb-top-elegant .am-header { min-height: 0; }
  body.acme-mb-top-elegant .am-header::before,
  body.acme-mb-top-elegant .am-header::after { content: none; }
  body.acme-mb-top-elegant .am-header-inner { height: 64px; }
  body.acme-mb-top-elegant .am-brand {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    flex-direction: column;
    gap: 0;
    text-align: center;
    z-index: 2;
  }
}

/* ============================================================
 * corporate-dark — slate-900 header + gold accents
 * ============================================================ */
body.acme-mb-corporate-dark .acme-eyebrow { background: #1e293b; color: rgba(248,250,252,0.85); }
body.acme-mb-corporate-dark .am-header,
body.acme-mb-corporate-dark .am-sticky { background: #0f172a; border-bottom: 1px solid rgba(212,175,55,0.20); }
body.acme-mb-corporate-dark .am-header-inner { color: #f8fafc; }
body.acme-mb-corporate-dark .am-brand-name,
body.acme-mb-corporate-dark .am-brand-suffix,
body.acme-mb-corporate-dark .am-nav-link { color: #f8fafc; }
body.acme-mb-corporate-dark .am-nav-link:hover { color: #d4af37; }
body.acme-mb-corporate-dark .am-nav-item.am-expanded > .am-nav-link { color: #d4af37; }
body.acme-mb-corporate-dark .am-search-input { background: rgba(248,250,252,0.05); color: #f8fafc; border-color: rgba(212,175,55,0.30); }
body.acme-mb-corporate-dark .am-action-btn { color: #f8fafc; }
body.acme-mb-corporate-dark .am-cart-badge { background: #d4af37; color: #0f172a; }
body.acme-mb-corporate-dark { --am-primary: #d4af37; --am-primary-fg: #0f172a; }

/* ============================================================
 * corporate-light — white header + Lora serif + navy accents
 * ============================================================ */
body.acme-mb-corporate-light .acme-eyebrow { background: #f1f5f9; color: #1e3a5f; }
body.acme-mb-corporate-light .acme-eyebrow-link { color: #1e3a5f; }
body.acme-mb-corporate-light .am-header,
body.acme-mb-corporate-light .am-sticky { background: #ffffff; border-bottom: 2px solid #1e3a5f; }
body.acme-mb-corporate-light .am-brand-name,
body.acme-mb-corporate-light .am-brand-suffix,
body.acme-mb-corporate-light .am-nav-link { color: #1e3a5f; font-family: "Lora", Georgia, serif; font-weight: 600; }
body.acme-mb-corporate-light .am-nav-link:hover { color: #1e3a5f; opacity: 0.7; }
body.acme-mb-corporate-light { --am-primary: #1e3a5f; --am-primary-fg: #ffffff; }

/* ============================================================
 * ecommerce-minimal — neutral light + utility bar
 * ============================================================ */
body.acme-mb-ecommerce-minimal .acme-eyebrow { background: #f2f0ec; color: #171717; }
body.acme-mb-ecommerce-minimal .am-header,
body.acme-mb-ecommerce-minimal .am-sticky { background: #fafafa; border-bottom: none; }
body.acme-mb-ecommerce-minimal .am-header-inner { height: 64px; font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 400; }
body.acme-mb-ecommerce-minimal .am-brand-name,
body.acme-mb-ecommerce-minimal .am-brand-suffix,
body.acme-mb-ecommerce-minimal .am-nav-link { color: #171717; }
body.acme-mb-ecommerce-minimal { --am-primary: #171717; --am-primary-fg: #ffffff; }

/* ============================================================
 * ecommerce-luxury — black header + Playfair Display + gold accent
 * ============================================================ */
body.acme-mb-ecommerce-luxury .acme-eyebrow { background: #1a1a1a; color: rgba(255,255,255,0.85); font-family: "Playfair Display", Georgia, serif; letter-spacing: 0.05em; text-transform: uppercase; font-size: 11px; }
body.acme-mb-ecommerce-luxury .am-header,
body.acme-mb-ecommerce-luxury .am-sticky { background: #000000; border-bottom: 1px solid rgba(201,169,98,0.30); }
body.acme-mb-ecommerce-luxury .am-header-inner { height: 88px; font-family: "Playfair Display", Georgia, serif; font-weight: 400; letter-spacing: 0.08em; }
body.acme-mb-ecommerce-luxury .am-brand-name,
body.acme-mb-ecommerce-luxury .am-brand-suffix,
body.acme-mb-ecommerce-luxury .am-nav-link { color: #ffffff; text-transform: uppercase; font-size: 13px; }
body.acme-mb-ecommerce-luxury .am-nav-link:hover { color: #c9a962; }
body.acme-mb-ecommerce-luxury { --am-primary: #c9a962; --am-primary-fg: #000000; }

/* ============================================================
 * saas-gradient — purple gradient header + Plus Jakarta + emerald accent
 * ============================================================ */
body.acme-mb-saas-gradient .acme-eyebrow { background: #151229; color: rgba(255,255,255,0.88); }
body.acme-mb-saas-gradient .am-header,
body.acme-mb-saas-gradient .am-sticky { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border-bottom: none; }
body.acme-mb-saas-gradient .am-header-inner { height: 68px; font-family: "Plus Jakarta Sans", "Inter", sans-serif; font-weight: 500; }
body.acme-mb-saas-gradient .am-brand-name,
body.acme-mb-saas-gradient .am-brand-suffix,
body.acme-mb-saas-gradient .am-nav-link { color: #ffffff; }
body.acme-mb-saas-gradient .am-nav-link:hover { color: #10b981; }
body.acme-mb-saas-gradient { --am-primary: #10b981; --am-primary-fg: #ffffff; }

/* ============================================================
 * saas-dark — zinc-950 header + JetBrains Mono + cyan accent
 * ============================================================ */
body.acme-mb-saas-dark .acme-eyebrow { background: #18181b; color: rgba(250,250,250,0.85); font-family: "JetBrains Mono", "Courier New", monospace; font-size: 11px; }
body.acme-mb-saas-dark .am-header,
body.acme-mb-saas-dark .am-sticky { background: #09090b; border-bottom: 1px solid #27272a; }
body.acme-mb-saas-dark .am-header-inner { height: 64px; font-family: "JetBrains Mono", "Courier New", monospace; font-weight: 500; }
body.acme-mb-saas-dark .am-brand-name,
body.acme-mb-saas-dark .am-brand-suffix,
body.acme-mb-saas-dark .am-nav-link { color: #fafafa; }
body.acme-mb-saas-dark .am-nav-link:hover { color: #22d3ee; }
body.acme-mb-saas-dark { --am-primary: #22d3ee; --am-primary-fg: #09090b; }

/* ============================================================
 * agency-bold — cream bg + Archivo Black + 4px black rule + red accent
 * ============================================================ */
body.acme-mb-agency-bold .acme-eyebrow { background: #1a1a1a; color: #f5f5f0; font-family: "Archivo Black", "Inter", sans-serif; text-transform: uppercase; letter-spacing: 0.04em; font-size: 11px; }
body.acme-mb-agency-bold .am-header,
body.acme-mb-agency-bold .am-sticky { background: #f5f5f0; border-bottom: 4px solid #1a1a1a; }
body.acme-mb-agency-bold .am-header-inner { height: 96px; font-family: "Archivo Black", "Inter", sans-serif; font-weight: 400; text-transform: uppercase; }
body.acme-mb-agency-bold .am-brand-name,
body.acme-mb-agency-bold .am-brand-suffix,
body.acme-mb-agency-bold .am-nav-link { color: #1a1a1a; letter-spacing: -0.02em; }
body.acme-mb-agency-bold .am-nav-link:hover { color: #ff4d4d; }
body.acme-mb-agency-bold { --am-primary: #ff4d4d; --am-primary-fg: #ffffff; }

/* ============================================================
 * agency-glass — translucent header + DM Sans + indigo + backdrop-blur
 * ============================================================ */
body.acme-mb-agency-glass .acme-eyebrow { background: rgba(15,23,42,0.88); color: #ffffff; font-family: "DM Sans", "Inter", sans-serif; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
body.acme-mb-agency-glass .am-header,
body.acme-mb-agency-glass .am-sticky { background: rgba(255,255,255,0.70); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid rgba(99,102,241,0.20); }
body.acme-mb-agency-glass .am-header-inner { height: 72px; font-family: "DM Sans", "Inter", sans-serif; font-weight: 500; }
body.acme-mb-agency-glass .am-brand-name,
body.acme-mb-agency-glass .am-brand-suffix,
body.acme-mb-agency-glass .am-nav-link { color: #0f172a; }
body.acme-mb-agency-glass .am-nav-link:hover { color: #6366f1; }
body.acme-mb-agency-glass { --am-primary: #6366f1; --am-primary-fg: #ffffff; }

/* ============================================================
 * healthcare-trust — white header + Source Sans + thick blue rule
 * ============================================================ */
body.acme-mb-healthcare-trust .acme-eyebrow { background: #1e40af; color: #ffffff; }
body.acme-mb-healthcare-trust .acme-eyebrow-link { color: #ffffff; }
body.acme-mb-healthcare-trust .am-header,
body.acme-mb-healthcare-trust .am-sticky { background: #ffffff; border-bottom: 3px solid #1e40af; }
body.acme-mb-healthcare-trust .am-header-inner { height: 76px; font-family: "Source Sans Pro", "Inter", sans-serif; font-weight: 600; }
body.acme-mb-healthcare-trust .am-brand-name,
body.acme-mb-healthcare-trust .am-brand-suffix,
body.acme-mb-healthcare-trust .am-nav-link { color: #1e40af; }
body.acme-mb-healthcare-trust { --am-primary: #1e40af; --am-primary-fg: #ffffff; }

/* ============================================================
 * finance-premium — deep green + Merriweather + emerald accent
 * ============================================================ */
body.acme-mb-finance-premium .acme-eyebrow { background: #083b32; color: rgba(255,255,255,0.85); font-family: "Merriweather", Georgia, serif; }
body.acme-mb-finance-premium .am-header,
body.acme-mb-finance-premium .am-sticky { background: #0c4a3e; border-bottom: 1px solid rgba(52,211,153,0.30); }
body.acme-mb-finance-premium .am-header-inner { height: 80px; font-family: "Merriweather", Georgia, serif; font-weight: 400; }
body.acme-mb-finance-premium .am-brand-name,
body.acme-mb-finance-premium .am-brand-suffix,
body.acme-mb-finance-premium .am-nav-link { color: #ffffff; }
body.acme-mb-finance-premium .am-nav-link:hover { color: #34d399; }
body.acme-mb-finance-premium { --am-primary: #34d399; --am-primary-fg: #0c4a3e; }

/* ============================================================
 * media-modern — white header + red utility bar + Roboto Condensed
 * ============================================================ */
body.acme-mb-media-modern .acme-eyebrow { background: #dc2626; color: #ffffff; font-family: "Roboto Condensed", "Inter", sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
body.acme-mb-media-modern .am-header,
body.acme-mb-media-modern .am-sticky { background: #ffffff; border-bottom: 1px solid #e5e7eb; }
body.acme-mb-media-modern .am-header-inner { height: 60px; font-family: "Roboto Condensed", "Inter", sans-serif; font-weight: 700; text-transform: uppercase; }
body.acme-mb-media-modern .am-brand-name,
body.acme-mb-media-modern .am-brand-suffix,
body.acme-mb-media-modern .am-nav-link { color: #111827; letter-spacing: 0.03em; }
body.acme-mb-media-modern .am-nav-link:hover { color: #dc2626; }
body.acme-mb-media-modern { --am-primary: #dc2626; --am-primary-fg: #ffffff; }

/* ============================================================
 * education-academic — indigo-950 header + EB Garamond + gold rule
 * ============================================================ */
body.acme-mb-education-academic .acme-eyebrow { background: #312e81; color: rgba(255,255,255,0.85); font-family: "EB Garamond", Georgia, serif; }
body.acme-mb-education-academic .am-header,
body.acme-mb-education-academic .am-sticky { background: #1e1b4b; border-bottom: 2px solid #fbbf24; }
body.acme-mb-education-academic .am-header-inner { height: 72px; font-family: "EB Garamond", Georgia, serif; font-weight: 500; }
body.acme-mb-education-academic .am-brand-name,
body.acme-mb-education-academic .am-brand-suffix,
body.acme-mb-education-academic .am-nav-link { color: #ffffff; font-style: italic; }
body.acme-mb-education-academic .am-nav-link:hover { color: #fbbf24; }
body.acme-mb-education-academic { --am-primary: #fbbf24; --am-primary-fg: #1e1b4b; }

/* ============================================================
 * real-estate — photographic background + Montserrat + amber accent
 * ============================================================ */
body.acme-mb-real-estate .acme-eyebrow { background: rgba(0,0,0,0.80); color: #ffffff; font-family: "Montserrat", "Inter", sans-serif; font-weight: 600; }
body.acme-mb-real-estate .am-header,
body.acme-mb-real-estate .am-sticky { background-color: transparent; background-image: linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.55)), url('https://images.unsplash.com/photo-1560518883-ce09059eeffa?w=1920&h=200&fit=crop'); background-size: cover; background-position: center; border-bottom: none; }
body.acme-mb-real-estate .am-header-inner { height: 84px; font-family: "Montserrat", "Inter", sans-serif; font-weight: 600; }
body.acme-mb-real-estate .am-brand-name,
body.acme-mb-real-estate .am-brand-suffix,
body.acme-mb-real-estate .am-nav-link { color: #ffffff; text-shadow: 0 1px 4px rgba(0,0,0,0.50); }
body.acme-mb-real-estate .am-nav-link:hover { color: #f59e0b; }
body.acme-mb-real-estate { --am-primary: #f59e0b; --am-primary-fg: #ffffff; }

/* ============================================================
 * restaurant-elegant — stone-900 + Cormorant Garamond + amber accent
 * ============================================================ */
body.acme-mb-restaurant-elegant .acme-eyebrow { background: #292524; color: #fef3c7; font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; letter-spacing: 0.05em; }
body.acme-mb-restaurant-elegant .am-header,
body.acme-mb-restaurant-elegant .am-sticky { background: #1c1917; border-bottom: 1px solid rgba(217,119,6,0.40); }
body.acme-mb-restaurant-elegant .am-header-inner { height: 88px; font-family: "Cormorant Garamond", Georgia, serif; font-weight: 500; letter-spacing: 0.08em; }
body.acme-mb-restaurant-elegant .am-brand-name,
body.acme-mb-restaurant-elegant .am-brand-suffix,
body.acme-mb-restaurant-elegant .am-nav-link { color: #fef3c7; text-transform: uppercase; font-size: 13px; }
body.acme-mb-restaurant-elegant .am-nav-link:hover { color: #d97706; }
body.acme-mb-restaurant-elegant { --am-primary: #d97706; --am-primary-fg: #1c1917; }

/* ============================================================
 * parchment — warm editorial header for the Grain Texture preset
 * ============================================================ */
body.acme-mb-parchment .acme-eyebrow { background: #34251c; color: #fffaf0; }
body.acme-mb-parchment .am-header,
body.acme-mb-parchment .am-sticky { background: #fbf7ef; border-bottom: 1px solid #e7ded3; }
body.acme-mb-parchment .am-header-inner { height: 80px; font-family: "Inter", "Segoe UI", sans-serif; font-weight: 500; letter-spacing: 0; }
body.acme-mb-parchment .am-brand-name,
body.acme-mb-parchment .am-brand-suffix,
body.acme-mb-parchment .am-nav-link { color: #3a2b24; }
body.acme-mb-parchment .am-nav-link:hover { color: #9a6a44; }
body.acme-mb-parchment { --am-primary: #9a6a44; --am-primary-fg: #fffaf0; }
/* Shared preset guards. The base skin intentionally uses high-specificity
   !important rules for DNN link safety, so preset utility bars need matching
   specificity or their text can disappear on light/dark variants. */
body.acme-mb-acme-original { --acme-eyebrow-preset-fg: #faf8f5; --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif; }
body.acme-mb-top-modern { --acme-eyebrow-preset-fg: rgba(255,255,255,0.88); --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif; }
body.acme-mb-top-minimal { --acme-eyebrow-preset-fg: #6b7280; --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif; }
body.acme-mb-top-bold { --acme-eyebrow-preset-fg: rgba(255,255,255,0.82); --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif; }
body.acme-mb-top-elegant { --acme-eyebrow-preset-fg: rgba(255,255,255,0.88); --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif; }
body.acme-mb-corporate-dark { --acme-eyebrow-preset-fg: rgba(248,250,252,0.85); --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif; }
body.acme-mb-corporate-light { --acme-eyebrow-preset-fg: #1e3a5f; --acme-menubar-font: "Lora", Georgia, serif; }
body.acme-mb-ecommerce-minimal { --acme-eyebrow-preset-fg: #171717; --acme-menubar-font: "Helvetica Neue", Arial, sans-serif; }
body.acme-mb-ecommerce-luxury { --acme-eyebrow-preset-fg: rgba(255,255,255,0.85); --acme-menubar-font: "Playfair Display", Georgia, serif; }
body.acme-mb-saas-gradient { --acme-eyebrow-preset-fg: rgba(255,255,255,0.88); --acme-menubar-font: "Plus Jakarta Sans", "Inter", sans-serif; }
body.acme-mb-saas-dark { --acme-eyebrow-preset-fg: rgba(250,250,250,0.85); --acme-menubar-font: "JetBrains Mono", "Courier New", monospace; }
body.acme-mb-agency-bold { --acme-eyebrow-preset-fg: #f5f5f0; --acme-menubar-font: "Archivo Black", "Inter", sans-serif; }
body.acme-mb-agency-glass { --acme-eyebrow-preset-fg: #ffffff; --acme-menubar-font: "DM Sans", "Inter", sans-serif; }
body.acme-mb-healthcare-trust { --acme-eyebrow-preset-fg: #ffffff; --acme-menubar-font: "Source Sans 3", "Source Sans Pro", "Inter", sans-serif; }
body.acme-mb-finance-premium { --acme-eyebrow-preset-fg: rgba(255,255,255,0.85); --acme-menubar-font: "Merriweather", Georgia, serif; }
body.acme-mb-media-modern { --acme-eyebrow-preset-fg: #ffffff; --acme-menubar-font: "Roboto Condensed", "Inter", sans-serif; }
body.acme-mb-education-academic { --acme-eyebrow-preset-fg: rgba(255,255,255,0.85); --acme-menubar-font: "EB Garamond", Georgia, serif; }
body.acme-mb-real-estate { --acme-eyebrow-preset-fg: #ffffff; --acme-menubar-font: "Montserrat", "Inter", sans-serif; }
body.acme-mb-restaurant-elegant { --acme-eyebrow-preset-fg: #fef3c7; --acme-menubar-font: "Cormorant Garamond", Georgia, serif; }
body.acme-mb-parchment { --acme-eyebrow-preset-fg: #fffaf0; --acme-menubar-font: "Inter", "Segoe UI", sans-serif; }

body[class*="acme-mb-"] .acme-eyebrow,
body[class*="acme-mb-"] .acme-eyebrow .acme-eyebrow-link,
body[class*="acme-mb-"] .acme-eyebrow .acme-eyebrow-auth a,
body[class*="acme-mb-"] .acme-eyebrow .acme-eyebrow-auth span,
body[class*="acme-mb-"] .acme-eyebrow-cell,
body[class*="acme-mb-"] .acme-eyebrow-sep {
  color: var(--acme-eyebrow-preset-fg, #faf8f5) !important;
}

body[class*="acme-mb-"] .am-header-inner,
body[class*="acme-mb-"] .am-nav-link,
body[class*="acme-mb-"] .am-search-input,
body[class*="acme-mb-"] .am-action-btn {
  font-family: var(--acme-menu-font-family, var(--acme-menubar-font, "Geist", system-ui, sans-serif));
}

body[class*="acme-mb-"] .acme-eyebrow {
  min-height: var(--acme-menu-utility-height, 44px);
}

body[class*="acme-mb-"] .acme-eyebrow-inner {
  min-height: var(--acme-menu-utility-height, 44px);
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-family: var(--acme-menu-font-family, var(--acme-menubar-font, "Geist", system-ui, sans-serif));
  font-size: var(--acme-menu-utility-font-size, max(11px, calc(var(--acme-menu-font-size, 14px) - 2px)));
}

body[class*="acme-mb-"] .am-header-inner {
  height: var(--acme-menu-main-height, 80px) !important;
}

body[class*="acme-mb-"] .am-nav-link {
  height: 100%;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: var(--acme-menu-font-size, 14px);
  font-weight: var(--acme-menu-font-weight, 500);
  letter-spacing: var(--acme-menu-letter-spacing, 0px);
  text-transform: var(--acme-menu-text-transform, inherit);
}

body[class*="acme-mb-"] .am-nav {
  gap: var(--acme-menu-nav-gap, 0px);
}

body[class*="acme-mb-"] .am .am-brand-img {
  height: calc(40px * var(--acme-menu-logo-scale, 1)) !important;
}

body[class*="acme-mb-"] .am-search-input {
  height: var(--acme-menu-control-height, min(44px, calc(var(--acme-menu-main-height, 72px) * 0.58)));
  border-radius: var(--acme-menu-control-radius, 999px);
  font-size: var(--acme-menu-font-size, 14px);
}

body[class*="acme-mb-"] .am-action-btn {
  width: var(--acme-menu-control-height, min(42px, calc(var(--acme-menu-main-height, 72px) * 0.58)));
  height: var(--acme-menu-control-height, min(42px, calc(var(--acme-menu-main-height, 72px) * 0.58)));
  border-radius: min(var(--acme-menu-control-radius, 999px), 14px);
}

body.acme-mb-corporate-dark {
  --am-fg: #f8fafc;
  --am-card: #0f172a;
  --am-muted: rgba(248,250,252,0.12);
  --am-muted-30: rgba(248,250,252,0.08);
  --am-muted-fg: rgba(248,250,252,0.62);
  --am-border: rgba(212,175,55,0.25);
}

body.acme-mb-ecommerce-luxury {
  --am-fg: #ffffff;
  --am-card: #000000;
  --am-muted: rgba(255,255,255,0.12);
  --am-muted-30: rgba(255,255,255,0.08);
  --am-muted-fg: rgba(255,255,255,0.62);
  --am-border: rgba(201,169,98,0.32);
}

body.acme-mb-saas-dark {
  --am-fg: #fafafa;
  --am-card: #09090b;
  --am-muted: rgba(250,250,250,0.12);
  --am-muted-30: rgba(250,250,250,0.08);
  --am-muted-fg: rgba(250,250,250,0.55);
  --am-border: #27272a;
}

body.acme-mb-finance-premium {
  --am-fg: #ffffff;
  --am-card: #0c4a3e;
  --am-muted: rgba(255,255,255,0.12);
  --am-muted-30: rgba(255,255,255,0.08);
  --am-muted-fg: rgba(255,255,255,0.62);
  --am-border: rgba(52,211,153,0.30);
}

body.acme-mb-education-academic {
  --am-fg: #ffffff;
  --am-card: #1e1b4b;
  --am-muted: rgba(255,255,255,0.12);
  --am-muted-30: rgba(255,255,255,0.08);
  --am-muted-fg: rgba(255,255,255,0.62);
  --am-border: rgba(251,191,36,0.30);
}

body.acme-mb-real-estate {
  --am-fg: #ffffff;
  --am-muted: rgba(255,255,255,0.12);
  --am-muted-30: rgba(255,255,255,0.08);
  --am-muted-fg: rgba(255,255,255,0.70);
  --am-border: rgba(255,255,255,0.25);
}

body.acme-mb-restaurant-elegant {
  --am-fg: #fef3c7;
  --am-card: #1c1917;
  --am-muted: rgba(254,243,199,0.12);
  --am-muted-30: rgba(254,243,199,0.08);
  --am-muted-fg: rgba(254,243,199,0.65);
  --am-border: rgba(217,119,6,0.40);
}

body.acme-mb-parchment {
  --am-fg: #3a2b24;
  --am-card: #fbf7ef;
  --am-muted: rgba(154,106,68,0.12);
  --am-muted-30: rgba(154,106,68,0.08);
  --am-muted-fg: rgba(58,43,36,0.58);
  --am-border: #ded3c5;
}

/* Keep theme chrome expressive while preserving readable menu panels.
   Several presets use light-on-dark variables for the top menu bar. The
   mega/dropdown surface stays neutral and inherits only the preset accent. */
body[class*="acme-mb-"] .am-mega,
body[class*="acme-mb-"] .am-dd,
body[class*="acme-mb-"] .am-drawer {
  --am-fg: #0f0a09;
  --am-card: #ffffff;
  --am-muted: #f3f1ec;
  --am-muted-30: rgba(243,241,236,0.56);
  --am-muted-fg: #5b5352;
  --am-border: #dfdeda;
  --am-border-50: rgba(223,222,218,0.72);
  color: var(--am-fg);
}

body.acme-mb-corporate-dark .am-brand:has(.am-brand-img),
body.acme-mb-ecommerce-luxury .am-brand:has(.am-brand-img),
body.acme-mb-saas-dark .am-brand:has(.am-brand-img),
body.acme-mb-finance-premium .am-brand:has(.am-brand-img),
body.acme-mb-education-academic .am-brand:has(.am-brand-img),
body.acme-mb-real-estate .am-brand:has(.am-brand-img),
body.acme-mb-restaurant-elegant .am-brand:has(.am-brand-img) {
  padding: 6px 10px;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(0,0,0,0.16);
}

body.acme-mb-corporate-dark .am-search-input,
body.acme-mb-ecommerce-luxury .am-search-input,
body.acme-mb-saas-dark .am-search-input,
body.acme-mb-finance-premium .am-search-input,
body.acme-mb-education-academic .am-search-input,
body.acme-mb-real-estate .am-search-input,
body.acme-mb-restaurant-elegant .am-search-input,
body.acme-mb-parchment .am-search-input {
  background: var(--am-muted-30);
  border-color: var(--am-border);
  color: var(--am-fg);
}

body.acme-mb-corporate-dark .am-search-input::placeholder,
body.acme-mb-ecommerce-luxury .am-search-input::placeholder,
body.acme-mb-saas-dark .am-search-input::placeholder,
body.acme-mb-finance-premium .am-search-input::placeholder,
body.acme-mb-education-academic .am-search-input::placeholder,
body.acme-mb-real-estate .am-search-input::placeholder,
body.acme-mb-restaurant-elegant .am-search-input::placeholder,
body.acme-mb-corporate-dark .am-search-ico,
body.acme-mb-ecommerce-luxury .am-search-ico,
body.acme-mb-saas-dark .am-search-ico,
body.acme-mb-finance-premium .am-search-ico,
body.acme-mb-education-academic .am-search-ico,
body.acme-mb-real-estate .am-search-ico,
body.acme-mb-restaurant-elegant .am-search-ico,
body.acme-mb-parchment .am-search-ico {
  color: var(--am-muted-fg);
}


/* ─── German — Bauhaus minimalist (ACMEV30 menuStyle 'german') ───
   Systematic & functional: bold primary accent line atop the bar, a thick
   2px ink rule beneath, sharp (0-radius) corners, uppercase wide-tracked
   nav, monospace eyebrow. */
body.acme-mb-german {
  --am-primary: #df0000;
  --am-primary-fg: #ffffff;
  --acme-eyebrow-preset-fg: rgba(255,255,255,0.88);
  --acme-menubar-font: "Inter", "Geist", system-ui, sans-serif;
  --acme-menu-main-height: 80px;
  --acme-menu-control-height: 40px;
  --acme-menu-control-radius: 0px;
  --acme-menu-nav-gap: 6px;
}
body.acme-mb-german .acme-eyebrow,
body.acme-mb-german .am-eyebrow {
  background: #111111;
  color: rgba(255,255,255,0.88);
  font-family: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border: 0;
}
body.acme-mb-german .am-header,
body.acme-mb-german .am-sticky {
  background: #ffffff;
  border-top: 3px solid var(--am-primary);
  border-bottom: 2px solid #111111;
  box-shadow: none;
}
body.acme-mb-german .am-header-inner { height: 80px; max-width: 1280px; }
body.acme-mb-german .am-brand-name,
body.acme-mb-german .am-brand-suffix {
  text-transform: uppercase; letter-spacing: -0.03em; font-weight: 800;
}
body.acme-mb-german .am-nav-link {
  text-transform: uppercase; letter-spacing: 0.12em; font-weight: 600; font-size: 13px; border-radius: 0;
}
body.acme-mb-german .am-header .am-cta,
body.acme-mb-german .am-header button,
body.acme-mb-german .am-header input,
body.acme-mb-german .am-search { border-radius: 0 !important; }

/* ============================================================
 * fixed-wide — explicit fixed-width 1280px container with full-bleed
 * bar background + a clean drop shadow under the bar. The "standard"
 * fixed-width treatment, useful as a comparison reference.
 * ============================================================ */
body.acme-mb-fixed-wide {
  --am-primary: #111111;
  --am-primary-fg: #ffffff;
  --acme-eyebrow-preset-fg: rgba(255,255,255,0.86);
  --acme-menubar-font: "Inter","Geist",system-ui,sans-serif;
  --acme-menu-main-height: 72px;
}
body.acme-mb-fixed-wide .acme-eyebrow {
  background: #1f2937;
  color: rgba(255,255,255,0.86);
}
body.acme-mb-fixed-wide .am-header,
body.acme-mb-fixed-wide .am-sticky {
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(15,23,42,0.07);
  border-bottom: 1px solid rgba(15,23,42,0.06);
}
body.acme-mb-fixed-wide .am-header-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 32px;
  height: 72px;
}
body.acme-mb-fixed-wide .am-brand-name,
body.acme-mb-fixed-wide .am-brand-suffix { letter-spacing: -0.02em; }

/* ============================================================
 * fixed-narrow — entire menu bar inside a floating 1080px CARD
 * (rounded, soft shadow, 14px gap from page top). The bar background
 * is NOT full-bleed — the page color shows around the card.
 * ============================================================ */
body.acme-mb-fixed-narrow {
  --am-primary: #df0000;
  --am-primary-fg: #ffffff;
  --acme-eyebrow-preset-fg: rgba(255,255,255,0.86);
  --acme-menubar-font: "Inter","Geist",system-ui,sans-serif;
  --acme-menu-main-height: 60px;
}
body.acme-mb-fixed-narrow .acme-eyebrow {
  background: #111827;
  color: rgba(255,255,255,0.86);
}
body.acme-mb-fixed-narrow .am-header,
body.acme-mb-fixed-narrow .am-sticky {
  background: transparent !important;
  box-shadow: none !important;
  padding: 14px 0 6px;
}
body.acme-mb-fixed-narrow .am-header-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 8px 22px;
  height: 60px;
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 14px 36px rgba(15,23,42,0.14), 0 1px 0 rgba(15,23,42,0.04);
  border: 1px solid rgba(15,23,42,0.06);
}
body.acme-mb-fixed-narrow .am-nav-link { font-weight: 600; }

/* ───────────────────────────────────────────────────────────────────
 * top-centered-acmev35 — port of ACMEV35 "centered + logo scroll-zoom"
 *
 * Bridges the body-class preset selector to the existing .am-variant-top-centered
 * rules in AcmeMega.css. The site-design-loader applies body.acme-mb-* on
 * preset change; this rule cascades those styles to the .am element so the
 * layout switches without needing a separate JS class toggle.
 *
 * The AcmeMega.css block (lines 1576+) handles the actual layout:
 *   - 112px tall header collapses to 64px on .am-scrolled
 *   - Eyebrow fades out on scroll (max-height: 0)
 *   - Logo + tagline absolutely centered, shrink 2.25rem -> 1.25rem on scroll
 *   - Nav splits visually around the centered logo
 * ─────────────────────────────────────────────────────────────────── */
body.acme-mb-top-centered-acmev35 .am {
  /* Apply the V35 variant styles by inheriting the existing .am-variant-top-centered
     rules — keep them in AcmeMega.css as the source of truth. */
}
body.acme-mb-top-centered-acmev35 .am-eyebrow {
  transition: max-height 500ms ease, opacity 500ms ease;
  max-height: 40px;
  opacity: 1;
  overflow: hidden;
}
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-eyebrow {
  max-height: 0; opacity: 0; border-bottom: 0;
}
/* User feedback 2026-05-26: do NOT enlarge the whole top bar — keep the menubar
   at normal compact height and let the centered logo OVERLAP above/below the
   bar for visual balance. Only the logo grows, not the chrome. */
body.acme-mb-top-centered-acmev35 .am-header-inner {
  position: relative;
  height: 64px !important;           /* normal compact bar — same as scrolled */
  overflow: visible !important;      /* let the oversized logo spill vertically */
  transition: none;
}
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-header-inner {
  height: 64px !important;           /* unchanged — bar is always compact */
}
/* The .am-header / .am-sticky wrappers also need overflow:visible. */
body.acme-mb-top-centered-acmev35 .am-header,
body.acme-mb-top-centered-acmev35 .am-sticky { overflow: visible !important; }

body.acme-mb-top-centered-acmev35 .am-logo,
body.acme-mb-top-centered-acmev35 .am-brand {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  flex-direction: column;
  align-items: center;
  gap: 2px;
  transition: transform 500ms ease, font-size 500ms ease;
  z-index: 5;                        /* above nav so it can overlap */
  pointer-events: auto;
}
/* Oversized logo (3rem ≈ ~48px tall) overflows the 64px bar by ~20px above
   + below = balanced overlap. Shrinks back to 1.5rem on scroll. */
body.acme-mb-top-centered-acmev35 .am-logo-mark,
body.acme-mb-top-centered-acmev35 .am-brand-name {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
  transition: font-size 500ms ease, transform 500ms ease;
}
/* IMG brand logos: grow the image so it overlaps above/below the 64px bar.
   100px == 64px bar + 18px above + 18px below = balanced overlap. */
body.acme-mb-top-centered-acmev35 .am-brand img,
body.acme-mb-top-centered-acmev35 .am-logo img,
body.acme-mb-top-centered-acmev35 .am-brand svg,
body.acme-mb-top-centered-acmev35 .am-logo svg {
  height: 100px !important;
  max-height: 100px !important;
  width: auto !important;
  transition: height 500ms ease;
}
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-brand img,
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-logo img,
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-brand svg,
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-logo svg {
  height: 48px !important;
  max-height: 48px !important;
}
/* Carve out horizontal space around the centered logo so the left/right nav
   visually splits with breathing room (the absolute logo doesn't reserve
   space in flex flow). Negative margin on the inner container makes the
   nav columns push to the edges. */
body.acme-mb-top-centered-acmev35 .am-nav { padding: 0 80px; }
body.acme-mb-top-centered-acmev35 .am-logo-corp,
body.acme-mb-top-centered-acmev35 .am-brand-suffix {
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--am-muted-fg);
  transition: opacity 500ms ease, max-height 500ms ease, font-size 500ms ease;
  max-height: 1.5rem;
  opacity: 0.85;
}
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-logo-mark,
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-brand-name {
  font-size: 1.5rem;                 /* slightly larger than original — still fits inside bar */
}
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-logo-corp,
body.acme-mb-top-centered-acmev35 .am-sticky.am-scrolled .am-brand-suffix {
  opacity: 0; max-height: 0; font-size: 0;
}

/* ───────────────────────────────────────────────────────────────────
 * Brand-logo override (2026-05-26): when the menu's .am-brand has a
 * real image logo (am-brand-logo class is added by the runtime when
 * cfg.brand.logo OR window.__acmeMegaBrandLogo is set), suppress the
 * preset's hardcoded letter-A ::before badges and ::after wordmark
 * decorations. Each preset paints its own brand square + "Acme" text
 * for sites that don't have their own logo; once the portal supplies
 * one, those decorations become duplicate visual noise.
 * ─────────────────────────────────────────────────────────────────── */
body[class*="acme-mb-"] .am-brand.am-brand-logo::before,
body[class*="acme-mb-"] .am-brand.am-brand-logo::after { content: none !important; display: none !important; background: none !important; }
body[class*="acme-mb-"] .am-brand.am-brand-logo .am-brand-name::before,
body[class*="acme-mb-"] .am-brand.am-brand-logo .am-brand-name::after,
body[class*="acme-mb-"] .am-brand.am-brand-logo .am-brand-suffix::before,
body[class*="acme-mb-"] .am-brand.am-brand-logo .am-brand-suffix::after { content: none !important; display: none !important; }
/* The runtime hides text spans when an image logo is present, but
   some presets force them visible — keep them collapsed. */
body[class*="acme-mb-"] .am-brand.am-brand-logo .am-brand-name,
body[class*="acme-mb-"] .am-brand.am-brand-logo .am-brand-suffix { display: none !important; }