/* Reset border-style to prevent Tailwind preflight FOUC (black borders during CSS load) */
.brand-whisperer-shortcode,
.brand-whisperer-shortcode *,
.brand-whisperer-shortcode *::before,
.brand-whisperer-shortcode *::after,
.brand-whisperer-page-shell,
.brand-whisperer-page-shell *,
.brand-whisperer-tool-shell,
.brand-whisperer-tool-shell * {
  box-sizing: border-box;
  border-style: none;
  border-width: 0;
  outline: none;
}

.brand-whisperer-shortcode {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 22px 0 26px;
  font-family: inherit;
  color: inherit;
}

.brand-whisperer-shortcode img {
  max-width: none;
}

.brand-whisperer-shortcode .brand-whisperer-page-shell {
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
  padding: 0 22px;
}

.brand-whisperer-shortcode .brand-whisperer-hero-title {
  margin: 0 0 18px;
  font-family: var(--e-global-typography-db53970-font-family), Inter, Arial, sans-serif;
  font-size: var(--e-global-typography-db53970-font-size, 2rem);
  font-weight: var(--e-global-typography-db53970-font-weight, 700);
  line-height: var(--e-global-typography-db53970-line-height, 1.2);
  letter-spacing: var(--e-global-typography-db53970-letter-spacing, normal);
  color: #1F3453 !important;
  text-align: center !important;
}

.brand-whisperer-shortcode .brand-whisperer-tool-shell {
  width: 100%;
  max-width: 1312px;
  margin: 0 auto;
  border-radius: 32px;
  overflow: hidden;
  border: 1px solid rgba(214, 221, 239, 0.98);
  background: #ffffff;
  box-shadow:
    0 0 0 1px rgba(239, 242, 251, 0.7),
    0 18px 50px rgba(104, 120, 173, 0.12),
    0 6px 18px rgba(15, 23, 42, 0.04);
}

.brand-whisperer-shortcode-error {
  padding: 16px;
  border: 1px solid #f0b8b8;
  background: #fff4f4;
  color: #7a1f1f;
  border-radius: 8px;
}