/* Beyond Bytes — motion layer
   Restrained, single-purpose animations. transform/opacity only.
   Disabled entirely under prefers-reduced-motion. */

:root {
  --motion-ease: cubic-bezier(0.2, 0.65, 0.3, 1);
  --motion-duration: 620ms;
  --motion-distance: 14px;
}

/* ---------- Scroll reveal ---------- */
.reveal {
  opacity: 0;
  transform: translateY(var(--motion-distance));
  transition:
    opacity var(--motion-duration) var(--motion-ease),
    transform var(--motion-duration) var(--motion-ease);
  will-change: opacity, transform;
}
.reveal.in {
  opacity: 1;
  transform: none;
}
/* Stagger by data-delay (0–6, ~70ms steps) */
.reveal[data-delay="1"] { transition-delay:  70ms; }
.reveal[data-delay="2"] { transition-delay: 140ms; }
.reveal[data-delay="3"] { transition-delay: 210ms; }
.reveal[data-delay="4"] { transition-delay: 280ms; }
.reveal[data-delay="5"] { transition-delay: 350ms; }
.reveal[data-delay="6"] { transition-delay: 420ms; }

/* Auto-stagger children when parent uses .reveal-stagger.in */
.reveal-stagger > * {
  opacity: 0;
  transform: translateY(var(--motion-distance));
  transition:
    opacity var(--motion-duration) var(--motion-ease),
    transform var(--motion-duration) var(--motion-ease);
  will-change: opacity, transform;
}
.reveal-stagger.in > * { opacity: 1; transform: none; }
.reveal-stagger.in > *:nth-child(1) { transition-delay:   0ms; }
.reveal-stagger.in > *:nth-child(2) { transition-delay:  90ms; }
.reveal-stagger.in > *:nth-child(3) { transition-delay: 180ms; }
.reveal-stagger.in > *:nth-child(4) { transition-delay: 270ms; }
.reveal-stagger.in > *:nth-child(5) { transition-delay: 360ms; }
.reveal-stagger.in > *:nth-child(6) { transition-delay: 450ms; }

/* ---------- Hero entrance (fires on load) ---------- */
.bb-hero--type .bb-hero__inner > * {
  opacity: 0;
  transform: translateY(12px);
  animation: bb-hero-rise 720ms var(--motion-ease) forwards;
}
.bb-hero--type .bb-hero__inner > *:nth-child(1) { animation-delay:  40ms; }  /* status pill */
.bb-hero--type .bb-hero__inner > *:nth-child(2) { /* headline — overridden, chars handle their own */ }
.bb-hero--type .bb-hero__inner > *:nth-child(3) { animation-delay: 1700ms; } /* rule — lands after typewriter completes */
.bb-hero--type .bb-hero__inner > *:nth-child(4) { animation-delay: 1780ms; } /* subhead */
.bb-hero--type .bb-hero__inner > *:nth-child(5) { animation-delay: 1860ms; } /* ctas */
.bb-hero--type .bb-hero__inner > *:nth-child(6) { animation-delay: 1940ms; } /* meta */

@keyframes bb-hero-rise {
  to { opacity: 1; transform: none; }
}

/* The hero rule slides in from 0 width — one small typographic flourish.
   Now lands after the typewriter headline completes (~1700ms). */
.bb-hero--type .bb-hero__rule {
  width: 0;
  position: relative;
  animation:
    bb-hero-rise 720ms var(--motion-ease) 1700ms forwards,
    bb-hero-rule 560ms var(--motion-ease) 1880ms forwards;
}
@keyframes bb-hero-rule {
  to { width: 80px; }
}

/* Pulsing accent dot at the right end of the rule — fires after the wipe completes. */
.bb-hero--type .bb-hero__rule::after {
  content: "";
  position: absolute;
  right: -12px; top: 50%;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #b6f24a;
  opacity: 0;
  transform: translate(0, -50%) scale(0.4);
  animation:
    bb-dot-in 360ms var(--motion-ease) 2460ms forwards,
    bb-dot-pulse 2400ms ease-in-out 2860ms infinite;
}
@keyframes bb-dot-in {
  to { opacity: 1; transform: translate(0, -50%) scale(1); }
}
@keyframes bb-dot-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(182, 242, 74, 0); }
  50%      { box-shadow: 0 0 0 6px rgba(182, 242, 74, 0.16); }
}

/* ---------- Hero headline: character-by-character typewriter reveal ----------
   Each character is wrapped in a <span class="char"> at runtime by JS.
   Each char inherits its cascade index via a --i CSS variable.
   The .word containers themselves are not animated — characters are. */
.bb-hero--type .bb-hero__headline {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}
.bb-hero--type .bb-hero__headline .word {
  display: inline-block;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}
.bb-hero--type .bb-hero__headline .char {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.18em);
  animation: bb-char-typewriter 360ms var(--motion-ease) calc(var(--i, 0) * 24ms + 200ms) forwards;
  will-change: opacity, transform;
}
@keyframes bb-char-typewriter {
  to { opacity: 1; transform: none; }
}

/* Blinking terminal cursor at the very end of the headline — echoes the
   logo's green underscore. Appears once the last character has typed in. */
.bb-hero--type .bb-hero__headline .bb-headline-cursor {
  display: inline-block;
  margin-left: 0.18em;
  color: #b6f24a;
  font-weight: var(--weight-light);
  opacity: 0;
  animation:
    bb-headline-cursor-in 320ms var(--motion-ease) var(--cursor-delay, 1700ms) forwards,
    bb-headline-cursor-blink 1.1s step-end calc(var(--cursor-delay, 1700ms) + 320ms) infinite;
  text-shadow: 0 0 18px rgba(182, 242, 74, 0.45);
  vertical-align: baseline;
}
@keyframes bb-headline-cursor-in {
  to { opacity: 1; }
}
@keyframes bb-headline-cursor-blink {
  50% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .bb-hero--type .bb-hero__headline .char {
    animation: none;
    opacity: 1;
    transform: none;
  }
  .bb-hero--type .bb-hero__headline .bb-headline-cursor {
    animation: none;
    opacity: 1;
  }
}

/* ---------- Hero background grid: subtle dot-grid that fades in on load ----------
   Adds depth and gives the cursor-follow glow something to "illuminate." */
.bb-hero__grid-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(0, 0, 0, 0.10) 1px, transparent 1.5px);
  background-size: 32px 32px;
  background-position: 0 0;
  opacity: 0;
  animation: bb-grid-fade 1400ms var(--motion-ease) 200ms forwards;
  -webkit-mask-image: radial-gradient(ellipse 90% 80% at 50% 45%, #000 25%, transparent 85%);
          mask-image: radial-gradient(ellipse 90% 80% at 50% 45%, #000 25%, transparent 85%);
}
@keyframes bb-grid-fade {
  to { opacity: 1; }
}

.bb-hero--type { position: relative; }
.bb-hero__inner { position: relative; z-index: 1; }

/* Cursor-follow ambient glow — soft brand-green halo that tracks the cursor
   inside the hero. JS sets --cx / --cy as percentages on mousemove. */
.bb-hero__cursor-glow {
  position: absolute;
  top: 0; left: 0;
  width: 640px;
  height: 640px;
  border-radius: 50%;
  background: radial-gradient(
    circle at center,
    rgba(182, 242, 74, 0.30) 0%,
    rgba(182, 242, 74, 0.12) 30%,
    transparent 65%
  );
  filter: blur(40px);
  pointer-events: none;
  opacity: 0;
  transform: translate3d(var(--cx, 50%), var(--cy, 50%), 0) translate(-50%, -50%);
  transition: opacity 360ms var(--motion-ease);
  z-index: 0;
  will-change: transform, opacity;
}
.bb-hero--type:hover .bb-hero__cursor-glow { opacity: 1; }
@media (hover: none), (max-width: 720px), (prefers-reduced-motion: reduce) {
  .bb-hero__cursor-glow { display: none; }
}

/* ---------- Hover refinements ---------- */

/* Workcards: lift + shadow on hover, deeper press state on :active.
   The green corner-glow brightens and the index number turns brand green
   for a clear visual response on press. */
.bb-workcard {
  transition:
    box-shadow 280ms var(--motion-ease),
    transform 280ms var(--motion-ease);
  cursor: pointer;
}
.bb-workcard:hover {
  transform: translateY(-5px);
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.16),
    0 4px 12px rgba(0, 0, 0, 0.08);
}
.bb-workcard:active {
  transform: translateY(-2px) scale(0.995);
  transition-duration: 110ms;
}

/* Media panel: green glow intensifies on hover via brightness/saturation */
.bb-workcard__media {
  transition: filter 320ms var(--motion-ease);
}
.bb-workcard:hover .bb-workcard__media {
  filter: brightness(1.22) saturate(1.08);
}

/* Index number lights up to brand green on hover */
.bb-workcard__index {
  transition:
    color 280ms var(--motion-ease),
    text-shadow 320ms var(--motion-ease);
}
.bb-workcard:hover .bb-workcard__index {
  color: #b6f24a;
  text-shadow: 0 0 24px rgba(182, 242, 74, 0.45);
}

/* Practice cards (text-only): rich hover state to compensate for the
   absence of imagery. Combined: lift + border + left bar + radial wash + title color. */
.bb-card {
  position: relative;
  overflow: hidden;
  transition:
    border-color 280ms var(--motion-ease),
    transform 320ms var(--motion-ease),
    box-shadow 320ms var(--motion-ease);
  cursor: default;
}
.bb-card:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 0, 0, 0.30);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.07);
}

/* Green vertical accent on the left edge — grows from top on hover */
.bb-card::before {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: 3px;
  height: 0;
  background: #b6f24a;
  transition: height 380ms var(--motion-ease);
}
.bb-card:hover::before { height: 64%; }

/* Soft green radial wash from top-right corner — barely there at rest, blooms on hover */
.bb-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(80% 60% at 100% 0%, rgba(182, 242, 74, 0.08), transparent 70%);
  opacity: 0;
  transition: opacity 360ms var(--motion-ease);
  pointer-events: none;
}
.bb-card:hover::after { opacity: 1; }

/* Title intensifies from default to full black on hover */
.bb-card__body { position: relative; z-index: 1; }
.bb-card__title {
  transition: color 240ms var(--motion-ease);
}
.bb-card:hover .bb-card__title { color: #000; }


/* Lead pills: arrow nudges right on hover */
.bb-lead__pill > span:last-child {
  display: inline-block;
  transition: transform 180ms var(--motion-ease);
}
.bb-lead__pill:hover > span:last-child { transform: translateX(4px); }

/* Trust pills: tiny scale on hover */
.bb-pill {
  transition: transform 160ms var(--motion-ease), background 160ms ease, color 160ms ease;
}
.bb-pill:hover { transform: translateY(-1px); }

/* Nav: shadow appears once the page is scrolled (toggled via JS class on body) */
.bb-nav {
  transition: box-shadow 180ms ease, border-color 180ms ease;
}
body.is-scrolled .bb-nav {
  box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 8px 24px rgba(0,0,0,0.04);
}

/* Nav links: underline slides in from left on hover/active. */
.bb-nav__link {
  position: relative;
  border-bottom: 0 !important; /* override site.css static border */
  padding-bottom: 4px;
}
.bb-nav__link::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 1px;
  background: #000;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 240ms var(--motion-ease);
}
.bb-nav__link:hover::after,
.bb-nav__link.is-active::after { transform: scaleX(1); }

/* Section headings: small accent line draws underneath when revealed. */
.bb-section__heading.reveal {
  position: relative;
  padding-bottom: 12px;
}
.bb-section__heading.reveal::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 0; height: 2px;
  background: rgba(0, 0, 0, 0.18);
  transition: width 700ms var(--motion-ease) 220ms;
}
.bb-section__heading.reveal.in::after { width: 56px; }
/* Inverted variant (Contact section, dark) */
.bb-section__heading--invert.reveal::after { background: rgba(255, 255, 255, 0.32); }

/* Word-stagger heading variant — used on key headings for emphasis.
   Suppress the parent reveal animation; let each word handle its own entrance. */
.bb-section__heading--words.reveal {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
}
.bb-section__heading--words .word {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.4em);
  transition:
    opacity 620ms var(--motion-ease),
    transform 620ms var(--motion-ease);
  will-change: opacity, transform;
}
.bb-section__heading--words.reveal.in .word { opacity: 1; transform: none; }
.bb-section__heading--words.reveal.in .word:nth-child(1) { transition-delay:   0ms; }
.bb-section__heading--words.reveal.in .word:nth-child(2) { transition-delay:  70ms; }
.bb-section__heading--words.reveal.in .word:nth-child(3) { transition-delay: 140ms; }
.bb-section__heading--words.reveal.in .word:nth-child(4) { transition-delay: 210ms; }
.bb-section__heading--words.reveal.in .word:nth-child(5) { transition-delay: 280ms; }
.bb-section__heading--words.reveal.in .word:nth-child(6) { transition-delay: 350ms; }
.bb-section__heading--words.reveal.in .word:nth-child(7) { transition-delay: 420ms; }
.bb-section__heading--words.reveal.in .word:nth-child(8) { transition-delay: 490ms; }

/* Workcard: a soft highlight pans across the gradient panel on hover. */
.bb-workcard__media { position: relative; overflow: hidden; }
.bb-workcard__media::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: -60%;
  width: 40%;
  background: linear-gradient(
    100deg,
    transparent 0%,
    rgba(255, 255, 255, 0.18) 50%,
    transparent 100%
  );
  transform: translateX(0) skewX(-12deg);
  transition: transform 800ms var(--motion-ease);
  pointer-events: none;
}
.bb-workcard:hover .bb-workcard__media::before {
  transform: translateX(420%) skewX(-12deg);
}

/* ---------- Stake section: claims slide in from sides, divider draws down ---------- */

/* Left claim slides in from the left, right claim from the right.
   Override the default reveal vertical translate. */
.bb-stake__claim--left.reveal {
  transform: translateX(-32px);
}
.bb-stake__claim--right.reveal {
  transform: translateX(32px);
  transition-delay: 140ms;
}
.bb-stake__claim--left.reveal.in,
.bb-stake__claim--right.reveal.in {
  transform: none;
}

/* Vertical divider draws from top to bottom on reveal */
.bb-stake__divider.reveal {
  transform: scaleY(0);
  transform-origin: top center;
  transition:
    opacity 200ms var(--motion-ease) 320ms,
    transform 720ms var(--motion-ease) 320ms;
}
.bb-stake__divider.reveal.in {
  transform: scaleY(1);
}

/* Conclusion lands AFTER the claims have slid in and divider drawn */
.bb-stake__conclusion.reveal {
  transition-delay: 700ms;
}

/* "Why now" kicker reveals first */
.bb-stake__kicker.reveal {
  transition-duration: 500ms;
}

@media (prefers-reduced-motion: reduce) {
  .bb-stake__claim--left.reveal,
  .bb-stake__claim--right.reveal,
  .bb-stake__divider.reveal,
  .bb-stake__conclusion.reveal,
  .bb-stake__kicker.reveal {
    transform: none !important;
    transition-delay: 0ms !important;
  }
}

/* ---------- "Why we focus" cells: directional slide-in + inner stagger + hover ---------- */

/* Cells slide in from opposite sides — a subtle "two opposing forces" feel.
   Override the generic reveal-stagger transform direction. */
.bb-focus__grid.reveal-stagger > *:nth-child(1) {
  transform: translateX(-28px) translateY(8px);
  transition:
    opacity 720ms var(--motion-ease),
    transform 720ms var(--motion-ease);
}
.bb-focus__grid.reveal-stagger > *:nth-child(2) {
  transform: translateX(28px) translateY(8px);
  transition:
    opacity 720ms var(--motion-ease),
    transform 720ms var(--motion-ease);
  transition-delay: 90ms;
}
.bb-focus__grid.reveal-stagger.in > *:nth-child(1),
.bb-focus__grid.reveal-stagger.in > *:nth-child(2) {
  opacity: 1;
  transform: none;
}

/* Inside each cell, label → headline → body stagger after the cell lands. */
.bb-focus__cell > * {
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity 520ms var(--motion-ease),
    transform 520ms var(--motion-ease);
}
.bb-focus__grid.reveal-stagger.in .bb-focus__cell > * {
  opacity: 1;
  transform: none;
}
.bb-focus__grid.reveal-stagger.in .bb-focus__cell > *:nth-child(1) { transition-delay: 320ms; }
.bb-focus__grid.reveal-stagger.in .bb-focus__cell > *:nth-child(2) { transition-delay: 400ms; }
.bb-focus__grid.reveal-stagger.in .bb-focus__cell > *:nth-child(3) { transition-delay: 480ms; }
/* Right-cell inner content waits for its own slide (90ms parent delay) */
.bb-focus__grid.reveal-stagger.in > *:nth-child(2) > *:nth-child(1) { transition-delay: 410ms; }
.bb-focus__grid.reveal-stagger.in > *:nth-child(2) > *:nth-child(2) { transition-delay: 490ms; }
.bb-focus__grid.reveal-stagger.in > *:nth-child(2) > *:nth-child(3) { transition-delay: 570ms; }

/* Hover: lift + border accent on the light cell, intensified halo on the accent cell. */
.bb-focus__cell {
  transition:
    transform 280ms var(--motion-ease),
    border-color 280ms ease,
    box-shadow 280ms ease;
  will-change: transform;
}
.bb-focus__cell:not(.bb-focus__cell--accent):hover {
  transform: translateY(-3px);
  border-color: rgba(0, 0, 0, 0.28);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
}
.bb-focus__cell--accent::before {
  transition: opacity 420ms ease, filter 420ms ease, transform 420ms var(--motion-ease);
}
.bb-focus__cell--accent:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.22);
}
.bb-focus__cell--accent:hover::before {
  opacity: 0.55;
  filter: blur(40px);
  transform: scale(1.1);
}

/* ---------- Past performance table ---------- */

/* Row container: relative for the accent bar, hover tint, padding for breathing. */
.bb-perf__row {
  position: relative;
  transition:
    background-color 220ms ease,
    transform 280ms var(--motion-ease);
  border-radius: 6px;
  padding-left: 16px;
  padding-right: 12px;
  margin-left: -16px;
  margin-right: -12px;
}
.bb-perf__row:hover {
  background-color: rgba(0, 0, 0, 0.025);
  transform: translateX(2px);
}

/* Left edge accent — green vertical bar that grows on hover, like a "selected row" cue. */
.bb-perf__row::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 3px; height: 0;
  background: #b6f24a;
  border-radius: 1.5px;
  transform: translateY(-50%);
  transition: height 300ms var(--motion-ease);
}
.bb-perf__row:hover::before { height: 60%; }

/* Sector label slightly intensifies on row hover. */
.bb-perf__sector {
  transition: color 220ms ease;
}
.bb-perf__row:hover .bb-perf__sector { color: #000; }

/* Override reveal-stagger transform for these rows: slide from left rather than up.
   Inherits opacity transition + nth-child stagger timing from base reveal-stagger. */
.bb-perf__list.reveal-stagger > * {
  transform: translateX(-28px);
}
.bb-perf__list.reveal-stagger.in > * {
  transform: none;
}

/* Each row's top divider draws in from left to right, in step with the row entrance. */
.bb-perf__row {
  border-top: 0;
}
.bb-perf__row::after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 0; height: 1px;
  background: rgba(0, 0, 0, 0.10);
  transition: width 700ms var(--motion-ease);
}
.bb-perf__list.reveal-stagger.in .bb-perf__row::after { width: 100%; }
.bb-perf__list.reveal-stagger.in > *:nth-child(1) .bb-perf__row::after,
.bb-perf__list.reveal-stagger.in > *:nth-child(1)::after { transition-delay: 200ms; }
.bb-perf__list.reveal-stagger.in > *:nth-child(2)::after { transition-delay: 290ms; }
.bb-perf__list.reveal-stagger.in > *:nth-child(3)::after { transition-delay: 380ms; }
.bb-perf__list.reveal-stagger.in > *:nth-child(4)::after { transition-delay: 470ms; }
.bb-perf__list.reveal-stagger.in > *:nth-child(5)::after { transition-delay: 560ms; }
.bb-perf__list.reveal-stagger.in > *:nth-child(6)::after { transition-delay: 650ms; }

/* CTA arrows: nudge right on hover wherever .arrow appears inside a button or pill. */
.fbtn .arrow,
.bb-form__submit .arrow {
  display: inline-block;
  transition: transform 200ms var(--motion-ease);
  will-change: transform;
}
.fbtn:hover .arrow { transform: translateX(4px); }

/* "Beyond Bytes" wordmark: a tiny accent dot appears on nav-brand hover, beneath the mark. */
.bb-nav__brand { transition: transform 220ms var(--motion-ease); }
.bb-nav__brand:hover { transform: translateY(-1px); }

/* ---------- Toast (mailto click feedback) ---------- */
.bb-toast {
  position: fixed;
  bottom: 28px;
  left: 50%;
  transform: translate(-50%, 14px);
  padding: 10px 18px 12px;
  background: rgba(0, 0, 0, 0.92);
  color: #fff;
  border-radius: 50px;
  font-size: 14px;
  font-weight: var(--weight-medium-plus);
  letter-spacing: -0.14px;
  pointer-events: none;
  opacity: 0;
  transition:
    opacity 220ms var(--motion-ease),
    transform 260ms var(--motion-ease);
  z-index: 100;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
}
.bb-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
.bb-toast__dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #b6f24a;
  margin-right: 10px;
  vertical-align: middle;
  transform: translateY(-1px);
}

/* Hero accent dot under the rule should NOT pulse if reduced motion. */

/* ---------- Reduced motion: hard off ---------- */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal.in,
  .reveal-stagger > *,
  .reveal-stagger.in > *,
  .bb-hero--type .bb-hero__inner > *,
  .bb-hero--type .bb-hero__rule,
  .bb-hero--type .bb-hero__headline .word,
  .bb-hero--type .bb-hero__headline .char,
  .bb-section__heading--words .word,
  .bb-workcard,
  .bb-workcard__media,
  .bb-workcard__media::before,
  .bb-workcard__index,
  .bb-card,
  .bb-lead__pill > span:last-child,
  .bb-pill,
  .bb-nav,
  .bb-nav__link::after,
  .bb-section__heading.reveal::after,
  .bb-perf__row,
  .bb-perf__row::before,
  .bb-perf__row::after,
  .bb-focus__cell,
  .bb-focus__cell > *,
  .bb-focus__cell--accent::before,
  .fbtn .arrow {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
    width: auto;
  }
  .bb-hero--type .bb-hero__rule { width: 80px; }
  .bb-hero--type .bb-hero__rule::after { display: none; }
  .bb-hero__grid-bg { opacity: 1 !important; animation: none !important; }
  .bb-card::before,
  .bb-card::after { transition: none !important; }
  .bb-section__heading.reveal::after { width: 56px !important; }
  .bb-nav__link::after { display: none; }
  .bb-mobile-menu,
  .bb-mobile-menu__link,
  .bb-mobile-menu__cta,
  .bb-nav__toggle-bar { transition: none !important; }
  .bb-perf__row::before { display: none; }
  .bb-perf__row::after { width: 100% !important; }
}