/* ==========================================================================
   Bennett Financials internal-page design system
   Loaded on every approved non-home marketing page.
   ========================================================================== */

body.bf-nh.bf-experience-v3 {
  --nh-ink: #0b0a12;
  --nh-ink-soft: #201843;
  --nh-violet: #6d35e8;
  --nh-violet-bright: #9b72f6;
  --nh-paper: #ffffff;
  --nh-wash: #f7f6fb;
  --nh-wash-strong: #f0edf8;
  --nh-line: rgba(24, 19, 44, 0.12);
  --nh-muted: #595565;
  --nh-dark-copy: rgba(255, 255, 255, 0.76);
  --nh-shadow: 0 18px 46px rgba(32, 18, 72, 0.09);
  overflow-x: clip;
  color: var(--nh-ink);
  background: var(--nh-paper);
}

body.bf-nh.bf-experience-v3 :where(.bf-container, .std-container) {
  width: min(100% - 64px, 1200px);
  max-width: 1200px;
  margin-inline: auto;
}

body.bf-nh.bf-experience-v3 [data-bf-section]::after {
  display: none !important;
  content: none !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-composed-section,
  .bf-section,
  .bf-problem,
  .bf-problem-dark,
  .bf-proof-section,
  .bf-cases,
  .bf-stats-bar,
  .bf-about-cta,
  .bf-cta
) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-composed-section,
  .bf-section,
  .bf-problem,
  .bf-problem-dark,
  .bf-proof-section,
  .bf-cases,
  .bf-about-cta,
  .bf-cta
) {
  padding-block: clamp(68px, 5.6vw, 82px) !important;
}

body.bf-nh.bf-experience-v3 :where(.bf-section--white, .bf-problem, .bf-cases) {
  background: var(--nh-paper) !important;
}

body.bf-nh.bf-experience-v3 :where(.bf-section--cream, .bf-section--gray) {
  background: var(--nh-wash) !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-section--dark,
  .bf-problem-dark,
  .bf-problem--dark,
  .bf-tp-problem,
  .bf-catch,
  .bf-stats-section,
  .bf-proof-section
) {
  color: #ffffff;
  background:
    radial-gradient(circle at 16% 110%, rgba(109, 53, 232, 0.38), transparent 34%),
    linear-gradient(135deg, #0b0a12, #201843) !important;
}

body.bf-nh.bf-experience-v3 .bf-eyebrow {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  margin-bottom: 16px;
  color: var(--nh-violet) !important;
  border-color: rgba(109, 53, 232, 0.2) !important;
  background: rgba(109, 53, 232, 0.055) !important;
  letter-spacing: 0.13em;
}

body.bf-nh.bf-experience-v3 :where(.bf-section--dark, .bf-problem-dark, .bf-problem--dark, .bf-tp-problem, .bf-catch, .bf-stats-section, .bf-proof-section) .bf-eyebrow {
  color: #ddd2ff !important;
  border-color: rgba(196, 181, 253, 0.3) !important;
  background: rgba(109, 53, 232, 0.18) !important;
}

/* Standard split heroes --------------------------------------------------- */

body.bf-nh.bf-experience-v3 :where(.bf-hero, .bf-svc-hero) {
  min-height: 0 !important;
  padding: clamp(56px, 5vw, 68px) 0 54px !important;
}

body.bf-site-v2.bf-nh.bf-experience-v3 .bf-hero {
  min-height: 0 !important;
  padding: clamp(56px, 5vw, 68px) 0 54px !important;
}

body.bf-site-v2.bf-nh.bf-experience-v3 .bf-hero__trust {
  margin-top: 42px !important;
  padding-top: 20px !important;
}

body.bf-nh.bf-experience-v3 .bf-hero {
  color: var(--nh-ink);
  background:
    radial-gradient(circle at 76% 14%, rgba(109, 53, 232, 0.13), transparent 31%),
    linear-gradient(180deg, #ffffff, #fbfaff) !important;
}

body.bf-nh.bf-experience-v3 .bf-hero__orb {
  display: none;
}

body.bf-nh.bf-experience-v3 .bf-hero__inner {
  display: flex !important;
  grid-template-columns: none !important;
  gap: clamp(48px, 6vw, 84px) !important;
  padding: 0 !important;
  align-items: center;
}

body.bf-nh.bf-experience-v3 .bf-hero__left {
  width: min(49%, 570px);
  max-width: 570px !important;
  padding: 0 !important;
  flex: 0 1 570px;
  text-align: left;
}

body.bf-nh.bf-experience-v3 .bf-hero__right {
  width: auto;
  min-width: 0;
  flex: 1 1 0;
  border-radius: 22px !important;
  box-shadow: var(--nh-shadow);
}

body.bf-nh.bf-experience-v3 .bf-hero__inner > :last-child:not(.bf-hero__left) {
  width: auto;
  min-width: 0;
  flex: 1 1 0;
}

body.bf-nh.bf-experience-v3 .bf-hero__inner > :last-child:not(.bf-hero__left) > video {
  display: block;
  width: 100% !important;
  height: 480px !important;
  object-fit: cover;
}

body.bf-nh.bf-experience-v3 .bf-hero__ctas {
  justify-content: flex-start !important;
}

/* Funnel heroes intentionally use a centered, single-column VSL composition.
   Restore that contract after the shared split-hero rules claim .bf-hero. */
body.bf-template-funnel.bf-nh.bf-experience-v3 .bf-hero__inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  max-width: 800px;
  margin-inline: auto;
  gap: 0 !important;
  text-align: center;
}

body.bf-template-funnel.bf-nh.bf-experience-v3 .bf-hero__left {
  width: 100%;
  max-width: none !important;
  flex: none;
  text-align: center;
}

body.bf-template-funnel.bf-nh.bf-experience-v3 .bf-hero__ctas {
  justify-content: center !important;
}

body.bf-template-funnel.bf-nh.bf-experience-v3 .bf-hero__inner > :last-child:not(.bf-hero__left) {
  width: 100%;
  min-width: 0;
  flex: none;
}

body.bf-nh.bf-experience-v3 .bf-page-hero {
  min-height: 0 !important;
  padding-block: clamp(72px, 7vw, 96px) !important;
  background:
    radial-gradient(circle at 72% 10%, rgba(109, 53, 232, 0.13), transparent 30%),
    linear-gradient(180deg, #ffffff, #f8f6ff) !important;
}

/* Company pages ----------------------------------------------------------- */

body.bf-template-company.bf-nh .bf-about-hero {
  min-height: 0 !important;
  padding-block: clamp(80px, 8vw, 112px) !important;
  background:
    radial-gradient(circle at 74% 18%, rgba(109, 53, 232, 0.11), transparent 28%),
    linear-gradient(180deg, #ffffff, #f8f6ff) !important;
}

body.bf-template-company.bf-nh .bf-founder {
  padding-block: clamp(72px, 6vw, 90px) !important;
  background: #ffffff !important;
}

body.bf-template-company.bf-nh .bf-founder__grid {
  gap: clamp(48px, 6vw, 80px) !important;
  align-items: center;
}

body.bf-template-company.bf-nh .bf-founder__photo {
  overflow: hidden;
  border-radius: 20px !important;
  box-shadow: var(--nh-shadow);
}

/* Editorial, proof and legal pages --------------------------------------- */

body.bf-template-article.bf-nh .bf-editorial-hero {
  min-height: 0 !important;
  padding-block: clamp(76px, 7vw, 104px) !important;
}

body.bf-template-article.bf-nh .bf-editorial-hero__inner {
  width: min(100% - 64px, 1120px);
  margin-inline: auto;
}

body.bf-template-article.bf-nh .bf-editorial-shell {
  width: min(100% - 64px, 1120px);
  gap: clamp(42px, 5vw, 72px);
  margin-inline: auto;
  padding-block: clamp(64px, 5vw, 80px);
}

body.bf-template-article.bf-nh .bf-editorial-content {
  min-width: 0;
}

body.bf-template-article.bf-nh .bf-editorial-toc {
  border: 1px solid var(--nh-line);
  border-radius: 14px;
  background: var(--nh-wash);
  box-shadow: none;
}

body.bf-template-article.bf-nh .bf-editorial-content :where(blockquote, .bf-editorial-callout) {
  border-radius: 14px;
  box-shadow: none;
}

/* Framework page foundation --------------------------------------------- */

body.bf-template-framework.bf-nh :where(
  .std-hero,
  .std-proof,
  .std-numbers,
  .std-calc-section,
  .std-ba,
  .std-install,
  .std-included,
  .std-industries,
  .std-faq,
  .std-cta
) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-block: clamp(68px, 5.6vw, 82px) !important;
  border-radius: 0 !important;
}

body.bf-template-framework.bf-nh .std-hero {
  min-height: 620px !important;
  color: var(--nh-ink) !important;
  background:
    radial-gradient(circle at 76% 18%, rgba(109, 53, 232, 0.2), transparent 32%),
    linear-gradient(180deg, #ffffff, #f2edff) !important;
}

body.bf-template-framework.bf-nh .std-hero :where(h1, p, span) {
  color: inherit;
}

body.bf-template-framework.bf-nh .std-proof,
body.bf-template-framework.bf-nh .std-calc-section,
body.bf-template-framework.bf-nh .std-install,
body.bf-template-framework.bf-nh .std-industries {
  background: #ffffff !important;
}

body.bf-template-framework.bf-nh .std-numbers,
body.bf-template-framework.bf-nh .std-ba,
body.bf-template-framework.bf-nh .std-included,
body.bf-template-framework.bf-nh .std-faq {
  background: var(--nh-wash) !important;
}

body.bf-template-framework.bf-nh .std-cta {
  color: #ffffff;
  background:
    radial-gradient(circle at 78% 12%, rgba(155, 114, 246, 0.25), transparent 30%),
    linear-gradient(135deg, #0b0a12, #201843) !important;
}

/* Typography and section rhythm ----------------------------------------- */

body.bf-nh.bf-experience-v3:not(.bf-template-article):not(.bf-template-framework) :where(
  .bf-hero .bf-h1,
  .bf-svc-hero h1,
  .bf-about-hero h1
) {
  max-width: 16ch;
  color: var(--nh-ink) !important;
  font-size: clamp(2.65rem, 3.8vw, 3.25rem) !important;
  line-height: 1.03 !important;
  letter-spacing: -0.052em !important;
  text-wrap: balance;
}

body.bf-nh.bf-experience-v3:not(.bf-template-article):not(.bf-template-framework) .bf-page-hero h1 {
  max-width: 18ch;
  margin-inline: auto;
  color: var(--nh-ink) !important;
  font-size: clamp(2.65rem, 3.8vw, 3.25rem) !important;
  line-height: 1.03 !important;
  letter-spacing: -0.052em !important;
  text-wrap: balance;
}

body.bf-nh.bf-experience-v3:not(.bf-template-article):not(.bf-template-framework) section h2 {
  max-width: 22ch;
  color: var(--nh-ink-soft);
  font-size: clamp(1.8rem, 2.5vw, 2.25rem) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.045em !important;
  text-wrap: balance;
}

body.bf-nh.bf-experience-v3 :where(.bf-section--dark, .bf-problem-dark, .bf-problem--dark, .bf-tp-problem, .bf-catch, .bf-stats-section, .bf-proof-section, .bf-cta) h2 {
  color: #ffffff !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-hero__sub,
  .bf-page-hero__sub,
  .bf-section__header--center .bf-body-lg
) {
  max-width: 62ch;
  color: var(--nh-muted) !important;
  font-size: 1.04rem !important;
  line-height: 1.68 !important;
}

body.bf-nh.bf-experience-v3 .bf-section__header--center {
  max-width: 840px;
  margin: 0 auto 34px !important;
}

body.bf-nh.bf-experience-v3 .bf-section__header--center h2 {
  margin-inline: auto;
}

body.bf-nh.bf-experience-v3 :where(.bf-section--dark, .bf-problem-dark, .bf-problem--dark, .bf-tp-problem, .bf-catch, .bf-stats-section, .bf-proof-section, .bf-cta) p {
  color: var(--nh-dark-copy);
}

body.bf-template-article.bf-nh .bf-editorial-hero h1 {
  max-width: 19ch;
  color: #ffffff !important;
  font-size: clamp(2.75rem, 3.85vw, 3.3rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.055em !important;
  text-wrap: balance;
}

body.bf-template-article.bf-variant-legal .bf-editorial-hero h1,
body.bf-template-article.bf-variant-media .bf-editorial-hero h1 {
  max-width: 21ch;
  font-size: clamp(2.75rem, 3.85vw, 3.3rem) !important;
}

body.bf-template-article.bf-nh .bf-editorial-content h2 {
  margin-top: 2.1em;
  color: var(--nh-ink-soft);
  font-size: clamp(1.7rem, 2.35vw, 2.1rem) !important;
  line-height: 1.16 !important;
  letter-spacing: -0.035em !important;
}

body.bf-template-article.bf-nh #bf-faq h2 {
  max-width: 22ch;
  color: var(--nh-ink-soft);
  font-size: clamp(1.8rem, 2.5vw, 2.25rem) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.045em !important;
  text-wrap: balance;
}

body.bf-template-article.bf-nh .bf-editorial-content h3 {
  color: var(--nh-ink);
  font-size: clamp(1.25rem, 1.8vw, 1.55rem) !important;
  line-height: 1.25;
}

body.bf-template-article.bf-nh .bf-editorial-content :where(p, li) {
  color: var(--nh-muted);
  font-size: 1rem;
  line-height: 1.78;
}

/* Rebuilt framework hero: no grid, no overlap, one clear reading path. */

body.bf-template-framework.bf-nh .std-hero {
  display: flex;
  min-height: 0 !important;
  align-items: center;
}

body.bf-template-framework.bf-nh .std-hero__canvas,
body.bf-template-framework.bf-nh .std-hero__orb,
body.bf-template-framework.bf-nh .std-hero__scroll {
  display: none !important;
}

body.bf-template-framework.bf-nh .std-hero__inner {
  display: flex !important;
  position: relative;
  width: 100%;
  max-width: 1200px;
  min-height: 0 !important;
  margin-inline: auto;
  padding: 0 560px 0 0 !important;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

body.bf-template-framework.bf-nh .std-hero__badge {
  position: static !important;
  margin-bottom: 22px;
  color: var(--nh-violet) !important;
  border-color: rgba(109, 53, 232, 0.2) !important;
  background: rgba(109, 53, 232, 0.07) !important;
}

body.bf-template-framework.bf-nh .std-hero__title {
  position: static !important;
  max-width: 14ch;
  margin: 0 0 22px !important;
  color: var(--nh-ink) !important;
  font-size: clamp(2.9rem, 3.8vw, 3.3rem) !important;
  line-height: 1.01 !important;
  letter-spacing: -0.06em !important;
  text-align: left !important;
}

body.bf-template-framework.bf-nh .std-hero__title .std-big {
  display: inline !important;
  color: var(--nh-violet) !important;
  font: inherit !important;
}

body.bf-template-framework.bf-nh .std-hero__sub {
  position: static !important;
  max-width: 60ch;
  margin: 0 0 28px !important;
  color: var(--nh-muted) !important;
  font-size: 1.08rem !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

body.bf-template-framework.bf-nh .std-hero__sub strong {
  color: var(--nh-ink) !important;
}

body.bf-template-framework.bf-nh .std-hero__ctas {
  position: static !important;
  display: flex !important;
  margin: 0 0 36px !important;
  justify-content: flex-start !important;
}

body.bf-template-framework.bf-nh .std-stack {
  position: absolute !important;
  inset: 24px 0 auto auto !important;
  width: 520px;
  margin: 0 !important;
  padding: 24px !important;
  border: 1px solid var(--nh-line) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: var(--nh-shadow) !important;
}

body.bf-template-framework.bf-nh .std-btn--dark-primary {
  color: #ffffff !important;
  border-color: var(--nh-ink) !important;
  background: var(--nh-ink) !important;
}

body.bf-template-framework.bf-nh .std-btn--dark-ghost {
  color: var(--nh-ink) !important;
  border-color: var(--nh-line) !important;
  background: #ffffff !important;
}

body.bf-template-framework.bf-nh section h2 {
  max-width: 22ch;
  color: var(--nh-ink-soft);
  font-size: clamp(1.8rem, 2.5vw, 2.25rem) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.045em !important;
  text-wrap: balance;
}

/* Card and data composition --------------------------------------------- */

body.bf-nh.bf-experience-v3 :where(
  .bf-card,
  .bf-pain-card,
  .bf-system-card,
  .bf-standard__card,
  .bf-steps-card,
  .bf-signal__card,
  .bf-contact-card,
  .bf-adv__card,
  .bf-tp-problem__card,
  .bf-whofit__card,
  .bf-page-hero__price-card
) {
  min-width: 0;
  height: auto;
  border: 1px solid var(--nh-line) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-card,
  .bf-pain-card,
  .bf-system-card,
  .bf-standard__card,
  .bf-steps-card,
  .bf-signal__card,
  .bf-contact-card,
  .bf-adv__card
) {
  padding: clamp(20px, 2vw, 26px) !important;
}

/* Number chips made otherwise identical cards feel like a process diagram.
   The content labels already carry the hierarchy, so remove the decoration. */
body.bf-nh.bf-experience-v3 :where(
  .bf-standard__card-num,
  .bf-steps-card__num,
  .bf-phase__marker
) {
  display: none !important;
}

/* Hiding the phase marker must also remove the grid track that owned it.
   Otherwise every industry teaching card keeps a blank 56px column plus gap. */
body.bf-nh.bf-experience-v3 .bf-phase {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
}

body.bf-nh.bf-experience-v3 .bf-phase > div:last-child {
  min-width: 0;
  height: auto !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-pain-grid,
  .bf-system-grid,
  .bf-standard__grid,
  .bf-steps-grid,
  .bf-signal__grid
) {
  gap: clamp(14px, 1.7vw, 22px) !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-card__icon,
  .bf-pain-card__icon,
  .bf-system-card__icon,
  .bf-signal__card-icon,
  .bf-steps-card__num
) {
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  color: var(--nh-violet) !important;
  border-radius: 12px;
  background: rgba(109, 53, 232, 0.085) !important;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-card__title,
  .bf-pain-card__title,
  .bf-steps-card__title,
  .bf-signal__card-title
) {
  color: var(--nh-ink) !important;
  line-height: 1.28;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-card__desc,
  .bf-system-card__desc,
  .bf-steps-card__desc,
  .bf-signal__card-text
) {
  color: var(--nh-muted) !important;
  font-size: 0.95rem;
  line-height: 1.65;
}

body.bf-nh.bf-experience-v3 .bf-system-card--highlight {
  border-top: 3px solid var(--nh-violet) !important;
  background:
    linear-gradient(180deg, rgba(109, 53, 232, 0.05), #ffffff 42%) !important;
}

/* The shared white-card treatment is correct on light sections, but these
   system cards are authored for dark 60-15-15 sections with light copy/icons. */
body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.065) !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card:hover {
  border-color: rgba(196, 181, 253, 0.42) !important;
  background: rgba(255, 255, 255, 0.095) !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card--highlight {
  border-color: rgba(155, 114, 246, 0.48) !important;
  border-top-color: var(--nh-violet-bright) !important;
  background:
    linear-gradient(145deg, rgba(109, 53, 232, 0.3), rgba(255, 255, 255, 0.075)) !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card__icon {
  color: #ddd2ff !important;
  border-color: rgba(196, 181, 253, 0.24) !important;
  background: rgba(109, 53, 232, 0.22) !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card__icon svg {
  stroke: currentColor !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card__num {
  color: #ffffff !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card__label {
  color: rgba(255, 255, 255, 0.72) !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card__desc {
  color: rgba(255, 255, 255, 0.68) !important;
}

body.bf-nh.bf-experience-v3 .bf-problem-dark .bf-system-card__bar {
  background: rgba(255, 255, 255, 0.12) !important;
}

body.bf-nh.bf-experience-v3 .bf-proof-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 !important;
  max-width: 1040px;
  margin-inline: auto;
  overflow: visible !important;
  border-block: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.bf-nh.bf-experience-v3 .bf-proof-card {
  min-width: 0;
  padding: 28px !important;
  border: 0 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.bf-nh.bf-experience-v3 .bf-proof-card:last-child {
  border-right: 0 !important;
}

body.bf-nh.bf-experience-v3 .bf-proof-card__num {
  color: #c4b5fd !important;
  font-size: clamp(2.35rem, 4vw, 3.65rem) !important;
  line-height: 1;
}

body.bf-nh.bf-experience-v3 .bf-proof-card__label {
  color: var(--nh-dark-copy) !important;
}

/* Proof is more credible as a measured band than as three floating boxes. */
body.bf-nh.bf-experience-v3 .bf-stats-dark__grid {
  gap: 0 !important;
  margin-top: 38px !important;
  border-block: 1px solid rgba(255, 255, 255, 0.16);
}

body.bf-nh.bf-experience-v3 .bf-stats-dark__item,
body.bf-nh.bf-experience-v3 .bf-stats-dark__item:first-child,
body.bf-nh.bf-experience-v3 .bf-stats-dark__item:last-child {
  min-width: 0;
  padding: 26px 28px !important;
  border: 0 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.16) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.bf-nh.bf-experience-v3 .bf-stats-dark__item:last-child {
  border-right: 0 !important;
}

body.bf-nh.bf-experience-v3 .bf-stats-dark__num {
  color: #ffffff !important;
  font-size: clamp(2.25rem, 3.4vw, 3.05rem) !important;
}

body.bf-nh.bf-experience-v3 .bf-stats-dark__label {
  color: var(--nh-dark-copy) !important;
}

body.bf-nh.bf-experience-v3 .bf-cases__card {
  display: flex !important;
  height: auto !important;
  min-height: 420px !important;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--nh-line) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 34px rgba(32, 18, 72, 0.07) !important;
}

body.bf-nh.bf-experience-v3 .bf-cases__thumb {
  min-height: 190px;
  flex: 0 0 190px;
}

body.bf-nh.bf-experience-v3 .bf-cases__info {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 22px !important;
}

body.bf-nh.bf-experience-v3 .bf-cases__bottom {
  margin-top: auto;
}

/* Industry proof rails use legacy .bf-cases markup, but should read as the
   same compact case-study system as the homepage rather than 720px slides. */
body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) {
  --nh-case-gutter: max(22px, calc((100vw - 1180px) / 2 + 22px));
  overflow: hidden;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 42px !important;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__header {
  min-width: 0;
  margin: 0 !important;
  flex: 1 1 auto;
  text-align: left;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__arrows {
  display: flex;
  gap: 10px;
  flex: none;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__arrow {
  display: inline-flex;
  width: 50px;
  height: 50px;
  align-items: center;
  justify-content: center;
  color: var(--nh-ink);
  border: 1px solid var(--nh-line) !important;
  border-radius: 100px;
  background: #ffffff;
  box-shadow: 0 6px 18px -12px rgba(30, 16, 74, 0.4);
  transition:
    transform 0.2s,
    border-color 0.2s,
    color 0.2s,
    box-shadow 0.2s;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__arrow:hover {
  color: var(--nh-violet);
  border-color: var(--nh-violet) !important;
  box-shadow: 0 14px 30px -14px rgba(109, 53, 232, 0.5);
  transform: translateY(-2px);
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__arrow:active {
  transform: translateY(0);
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__arrow:disabled {
  color: var(--nh-muted);
  border-color: var(--nh-line) !important;
  box-shadow: none;
  opacity: 0.3;
  cursor: default;
  transform: none;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__arrow svg {
  width: 20px;
  height: 20px;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__scroller {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-padding-inline: var(--nh-case-gutter);
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  -webkit-mask-image:
    linear-gradient(
      90deg,
      transparent 0,
      #000 calc(var(--nh-case-gutter) - 8px),
      #000 calc(100% - var(--nh-case-gutter) + 8px),
      transparent 100%
    );
  mask-image:
    linear-gradient(
      90deg,
      transparent 0,
      #000 calc(var(--nh-case-gutter) - 8px),
      #000 calc(100% - var(--nh-case-gutter) + 8px),
      transparent 100%
    );
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__scroller::-webkit-scrollbar {
  display: none;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__track {
  display: flex !important;
  width: max-content;
  gap: 22px !important;
  padding: 14px var(--nh-case-gutter) 34px !important;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__card {
  display: flex !important;
  width: clamp(286px, 82vw, 378px) !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden;
  flex: 0 0 clamp(286px, 82vw, 378px) !important;
  flex-direction: column;
  color: var(--nh-ink);
  border: 1px solid var(--nh-line) !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  box-shadow: none !important;
  scroll-snap-align: start;
  transition:
    transform 0.3s,
    box-shadow 0.3s,
    border-color 0.3s;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__card:hover {
  border-color: rgba(109, 53, 232, 0.35) !important;
  box-shadow: 0 44px 84px -36px rgba(30, 16, 74, 0.4) !important;
  transform: translateY(-6px);
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__thumb {
  position: relative;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden;
  flex: 0 0 auto !important;
  aspect-ratio: 16 / 10;
  border-radius: 0 !important;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__thumb iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__thumb:not(:has(iframe))::after {
  position: absolute;
  top: -38px;
  right: 14px;
  color: rgba(255, 255, 255, 0.15);
  content: "\201D";
  font-family: var(--disp);
  font-size: 150px;
  font-weight: 600;
  line-height: 1;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__company-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  padding: 5px 10px;
  color: #ffffff;
  border-radius: 6px;
  background: rgba(10, 10, 15, 0.5);
  backdrop-filter: blur(6px);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__info {
  display: flex;
  min-height: 170px;
  padding: 24px !important;
  flex: 1 1 auto;
  flex-direction: column;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__quote {
  margin: 0;
  color: var(--nh-ink) !important;
  font-family: var(--disp);
  font-size: 17px !important;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.42 !important;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid var(--nh-line);
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__name {
  display: block;
  color: var(--nh-ink);
  font-size: 14px;
  font-weight: 700;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__role {
  display: block;
  margin-top: 2px;
  color: var(--nh-muted);
  font-size: 12px;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__link-text {
  min-height: 0 !important;
  padding: 0 !important;
  flex: none;
  color: var(--nh-violet) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 500;
  transition:
    color 0.15s,
    transform 0.15s;
}

body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__link-text:hover {
  color: var(--nh-violet-bright) !important;
  background: transparent !important;
  transform: translateX(3px);
}

/* Real Estate and Cybersecurity load fixed-card page layers after this file,
   including !important media heights. The page body plus ID-weighted rail
   scope must outrank those late rules so both keep the shared card contract. */
body.bf-page-real-estate.bf-experience-v3.bf-template-industry.bf-variant-standard.bf-nh :is(#bf-cases, .bf-cases).bf-re-proof .bf-cases__card,
body.bf-page-cyber-security.bf-experience-v3.bf-template-industry.bf-nh :is(#bf-cases, .bf-cases) .bf-cases__card {
  width: clamp(286px, 82vw, 378px) !important;
  max-width: 378px !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  flex: 0 0 clamp(286px, 82vw, 378px) !important;
  border-radius: 20px !important;
}

body.bf-page-real-estate.bf-experience-v3.bf-template-industry.bf-variant-standard.bf-nh :is(#bf-cases, .bf-cases).bf-re-proof .bf-cases__thumb,
body.bf-page-cyber-security.bf-experience-v3.bf-template-industry.bf-nh :is(#bf-cases, .bf-cases) .bf-cases__thumb {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  aspect-ratio: 16 / 10 !important;
  border-radius: 0 !important;
}

body.bf-page-real-estate.bf-experience-v3.bf-template-industry.bf-variant-standard.bf-nh :is(#bf-cases, .bf-cases).bf-re-proof .bf-cases__info,
body.bf-page-cyber-security.bf-experience-v3.bf-template-industry.bf-nh :is(#bf-cases, .bf-cases) .bf-cases__info {
  display: flex !important;
  min-height: 170px !important;
  padding: 24px !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
}

body.bf-page-real-estate.bf-experience-v3.bf-template-industry.bf-variant-standard.bf-nh :is(#bf-cases, .bf-cases).bf-re-proof .bf-cases__bottom,
body.bf-page-cyber-security.bf-experience-v3.bf-template-industry.bf-nh :is(#bf-cases, .bf-cases) .bf-cases__bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: auto !important;
  padding-top: 18px !important;
  border-top: 1px solid var(--nh-line) !important;
}

body.bf-template-framework.bf-nh .std-numbers-wrap {
  padding: 0 !important;
  background: var(--nh-wash) !important;
}

body.bf-template-framework.bf-nh .std-numbers-card {
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--nh-wash) !important;
  box-shadow: none !important;
}

body.bf-template-framework.bf-nh .std-proof__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0 !important;
  border-block: 1px solid var(--nh-line);
}

body.bf-template-framework.bf-nh .std-proof__item {
  min-width: 0;
  padding: 26px 18px !important;
  border-right: 1px solid var(--nh-line);
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.bf-template-framework.bf-nh .std-proof__item:last-child {
  border-right: 0;
}

body.bf-template-framework.bf-nh :where(.std-install__card, .std-ba__card) {
  border: 1px solid var(--nh-line) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 28px rgba(32, 18, 72, 0.055) !important;
}

/* Conversion and FAQ composition ---------------------------------------- */

body.bf-nh.bf-experience-v3 .bf-cta {
  overflow: hidden;
  background:
    radial-gradient(circle at 80% 18%, rgba(155, 114, 246, 0.24), transparent 30%),
    linear-gradient(130deg, #0b0a12, #201843) !important;
}

body.bf-nh.bf-experience-v3 .bf-cta__split {
  display: flex !important;
  width: min(100% - 64px, 1200px);
  max-width: 1200px !important;
  margin-inline: auto;
  padding: 0 !important;
  align-items: center;
  gap: clamp(48px, 7vw, 96px);
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.bf-nh.bf-experience-v3 .bf-cta__left {
  width: min(52%, 580px);
  padding: 0 !important;
  flex: 1 1 580px;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.bf-nh.bf-experience-v3 .bf-cta__left .bf-eyebrow {
  color: #ddd2ff !important;
  border-color: rgba(196, 181, 253, 0.3) !important;
  background: rgba(109, 53, 232, 0.18) !important;
}

body.bf-nh.bf-experience-v3 .bf-cta__left :where(.bf-h2, h2) {
  color: #ffffff !important;
}

body.bf-nh.bf-experience-v3 .bf-cta__body {
  max-width: 55ch;
  color: var(--nh-dark-copy) !important;
  font-size: 1rem;
  line-height: 1.7;
}

body.bf-nh.bf-experience-v3 .bf-cta__fine {
  color: rgba(255, 255, 255, 0.58) !important;
}

body.bf-nh.bf-experience-v3 .bf-cta__left > .bf-btn {
  width: max-content !important;
  max-width: 100%;
  align-self: flex-start;
}

body.bf-nh.bf-experience-v3 .bf-cta__right {
  width: min(42%, 470px);
  height: 360px;
  min-height: 360px;
  overflow: hidden;
  flex: 1 1 470px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 22px !important;
  background: rgba(255, 255, 255, 0.07);
}

body.bf-nh.bf-experience-v3 .bf-cta__right :where(video, img) {
  display: block;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
}

body.bf-nh.bf-experience-v3 #bf-faq {
  background:
    linear-gradient(180deg, var(--nh-wash), #ffffff 180px) !important;
}

body.bf-nh.bf-experience-v3 #bf-faq .bf-faq__item {
  margin: 0 !important;
  border: 1px solid var(--nh-line) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 24px rgba(32, 18, 72, 0.045) !important;
}

body.bf-nh.bf-experience-v3 #bf-faq .bf-faq__question {
  min-height: 64px;
  color: var(--nh-ink);
  font-size: 0.98rem;
  line-height: 1.35;
}

body.bf-nh.bf-experience-v3 #bf-faq .bf-faq__answer-inner {
  color: var(--nh-muted);
  font-size: 0.95rem;
  line-height: 1.7;
}

body.bf-nh.bf-experience-v3 :where(
  .bf-btn--primary,
  .bf-cta .bf-btn,
  .bf-about-cta .bf-btn
) {
  min-height: 52px;
  padding-inline: 23px;
  gap: 10px;
}

/* Hover cannot carry keyboard users from a dropdown trigger into its panel.
   Keep desktop menus open for the complete focus path; mobile remains JS-led. */
@media (min-width: 769px) {
  body.bf-nh.bf-experience-v3 .bf-nav__dropdown:focus-within .bf-nav__mega {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }

  body.bf-nh.bf-experience-v3 .bf-nav__dropdown:focus-within .bf-nav__link-chevron {
    opacity: 1;
    transform: rotate(180deg);
  }
}

/* Responsive foundation -------------------------------------------------- */

@media (max-width: 1080px) {
  body.bf-nh.bf-experience-v3 .bf-hero__inner {
    flex-direction: column;
  }

  body.bf-nh.bf-experience-v3 .bf-hero__left {
    width: 100%;
    max-width: 760px !important;
    text-align: center;
  }

  body.bf-nh.bf-experience-v3 .bf-hero__ctas {
    justify-content: center !important;
  }

  body.bf-nh.bf-experience-v3 .bf-hero__right {
    width: min(100%, 680px);
  }

  body.bf-nh.bf-experience-v3 .bf-hero__inner > :last-child:not(.bf-hero__left) {
    width: min(100%, 680px);
  }

  body.bf-template-framework.bf-nh .std-hero__inner {
    max-width: 760px;
    padding-right: 0 !important;
  }

  body.bf-template-framework.bf-nh .std-stack {
    position: static !important;
    width: 100%;
  }

  body.bf-nh.bf-experience-v3 .bf-cta__split {
    flex-direction: column;
  }

  body.bf-nh.bf-experience-v3 .bf-cta__left {
    width: 100%;
    max-width: 760px !important;
    text-align: center;
  }

  body.bf-nh.bf-experience-v3 .bf-cta__left > .bf-btn {
    align-self: center;
  }

  body.bf-nh.bf-experience-v3 .bf-cta__right {
    width: min(100%, 680px);
  }
}

@media (max-width: 900px) {
  body.bf-nh.bf-experience-v3 :where(.bf-container, .std-container),
  body.bf-template-article.bf-nh :where(.bf-editorial-hero__inner, .bf-editorial-shell) {
    width: min(100% - 36px, 760px);
  }

  body.bf-template-article.bf-nh .bf-editorial-shell {
    grid-template-columns: 1fr;
  }

  body.bf-template-framework.bf-nh .std-proof__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.bf-nh.bf-experience-v3 :where(
    .bf-pain-grid,
    .bf-system-grid,
    .bf-standard__grid,
    .bf-steps-grid,
    .bf-signal__grid
  ) {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 680px) {
  body.bf-nh.bf-experience-v3 :where(.bf-container, .std-container),
  body.bf-template-article.bf-nh :where(.bf-editorial-hero__inner, .bf-editorial-shell) {
    width: min(100% - 40px, 620px);
  }

  body.bf-nh.bf-experience-v3 :where(
    .bf-composed-section,
    .bf-section,
    .bf-problem,
    .bf-problem-dark,
    .bf-proof-section,
    .bf-cases,
    .bf-about-cta,
    .bf-cta
  ) {
    padding-block: 54px !important;
  }

  body.bf-nh.bf-experience-v3 .bf-hero {
    padding: 52px 0 42px !important;
  }

  body.bf-nh.bf-experience-v3 .bf-hero__inner > :last-child:not(.bf-hero__left) > video {
    height: 280px !important;
  }

  body.bf-nh.bf-experience-v3 .bf-proof-grid,
  body.bf-template-framework.bf-nh .std-proof__grid {
    grid-template-columns: 1fr;
  }

  body.bf-nh.bf-experience-v3 .bf-proof-card,
  body.bf-template-framework.bf-nh .std-proof__item {
    border-right: 0 !important;
    border-bottom: 1px solid var(--nh-line) !important;
  }

  body.bf-nh.bf-experience-v3 .bf-stats-dark__item,
  body.bf-nh.bf-experience-v3 .bf-stats-dark__item:first-child,
  body.bf-nh.bf-experience-v3 .bf-stats-dark__item:last-child {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16) !important;
  }

  body.bf-nh.bf-experience-v3 .bf-stats-dark__item:last-child {
    border-bottom: 0 !important;
  }

  body.bf-nh.bf-experience-v3 .bf-cta__split {
    width: min(100% - 40px, 620px);
  }

  body.bf-nh.bf-experience-v3 .bf-cta__right {
    height: 260px;
    min-height: 260px;
  }

  body.bf-nh.bf-experience-v3 section .bf-btn--large {
    width: 100%;
    justify-content: center;
  }

  body.bf-template-article.bf-nh .bf-editorial-hero h1 {
    font-size: clamp(2.55rem, 10vw, 3.1rem) !important;
  }

  body.bf-template-framework.bf-nh .std-hero__title {
    font-size: clamp(2.75rem, 11vw, 3.5rem) !important;
  }

  body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__top {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  body.bf-template-industry.bf-nh.bf-experience-v3 :is(#bf-cases, .bf-cases) .bf-cases__arrows {
    order: 2;
  }
}

@media (max-width: 768px) {
  /* Cinematic desktop menu widths are !important and load before this layer.
     Reset both the panel and its multi-column list to the mobile viewport. */
  body.bf-nh.bf-experience-v3 .bf-nav__mega {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.bf-nh.bf-experience-v3 .bf-nav__mega-grid--2col {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* Reserve the fixed CTA's full footprint only where one exists, including
     notched-device space, so the footer remains operable at maximum scroll. */
  body.bf-nh.bf-experience-v3:has(.bf-sticky-book) {
    padding-bottom: calc(84px + env(safe-area-inset-bottom)) !important;
  }

  body.bf-nh.bf-experience-v3 .bf-sticky-book {
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.bf-nh.bf-experience-v3 *,
  body.bf-nh.bf-experience-v3 *::before,
  body.bf-nh.bf-experience-v3 *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}