/* The same painted bende, built from native Elementor image widgets. */
.mb-elementor-page main .mb-penguin-header {
  width: 100vw !important;
  margin: 0 calc(50% - 50vw) !important;
  height: auto !important;
  min-height: 0 !important;
  padding: calc(var(--mb-header-height, 92px) + 30px) 48px 28px !important;
  background: #202020 !important;
  color: #fff;
  overflow: clip;
  isolation: isolate;
}
.mb-elementor-page main .mb-penguin-header > .elementor-background-overlay { display: none; }
.mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) > .elementor-container {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 1280px;
  min-height: 0 !important;
  margin-inline: auto;
  gap: 40px;
}
.mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) > .elementor-container > .mb-penguin-copy {
  width: 42%;
  flex: 42 1 0;
  min-width: 0;
  z-index: 5;
}
.mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) > .elementor-container > .mb-penguin-crew { width: 58%; flex: 58 1 0; min-width: 0; }
.mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) .mb-penguin-copy > .elementor-widget-wrap {
  display: flex !important;
  flex-direction: column;
  align-content: stretch;
  gap: 25px;
  padding: 0 !important;
}
.mb-elementor-page main .mb-penguin-header .mb-penguin-copy { padding-block: 22px 48px; }
.mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) .mb-penguin-copy .elementor-widget { width: 100%; margin: 0; }
.mb-elementor-page main .mb-penguin-header .mb-penguin-copy :is(h1, h2, p) { color: inherit; margin: 0; }
.mb-elementor-page main .mb-penguin-header :is(h1, h2, .mb-penguin-heading .elementor-heading-title) {
  font-size: clamp(54px, 6.5vw, 90px);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -.04em;
  max-width: 12ch;
}
.mb-elementor-page main .mb-penguin-header .mb-penguin-copy .elementor-widget-text-editor { font-size: 20px; line-height: 1.5; max-width: 39ch; color: #d2d2d2; }
.mb-elementor-page main .mb-penguin-header .mb-penguin-copy .elementor-widget-text-editor p + p { margin-top: 18px; }
.mb-elementor-page main .mb-penguin-header .mb-penguin-copy .elementor-button { color: #fff; font-size: 17px; font-weight: 700; text-decoration: underline; text-underline-offset: 6px; padding: 8px 0; }
.mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) .mb-penguin-copy a:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
.mb-elementor-page main .mb-penguin-crew > .elementor-widget-wrap {
  --mb-crew-height: 540px;
  height: var(--mb-crew-height);
  width: 100%;
  display: block !important;
  position: relative;
  isolation: isolate;
  padding: 0 !important;
  overflow: visible;
}
.mb-elementor-page main .mb-penguin-crew :is(.mb-crew-john, .mb-crew-laptop, .mb-crew-tablet, .mb-crew-camera) {
  --mb-crew-angle: 0deg;
  --mb-crew-entry-x: 20px;
  position: absolute;
  width: 42% !important;
  height: 73%;
  bottom: 36px;
  left: 0;
  margin: 0 !important;
  padding: 0;
  opacity: 1;
  transform: rotate(var(--mb-crew-angle));
  transform-origin: center bottom;
}
.mb-elementor-page main .mb-penguin-crew :is(.mb-crew-john, .mb-crew-laptop, .mb-crew-tablet, .mb-crew-camera) > .elementor-widget-container { height: 100%; width: 100%; }
.mb-elementor-page main .mb-penguin-crew :is(.mb-crew-john, .mb-crew-laptop, .mb-crew-tablet, .mb-crew-camera) img { display: block; width: 100%; max-width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.mb-elementor-page main .mb-penguin-crew .mb-crew-john { width: 55% !important; height: 98%; bottom: 0; left: 16%; z-index: 4; }
.mb-elementor-page main .mb-penguin-crew .mb-crew-laptop { --mb-crew-angle: -4deg; --mb-crew-entry-x: -20px; z-index: 1; }
.mb-elementor-page main .mb-penguin-crew .mb-crew-tablet { --mb-crew-angle: 3deg; width: 39% !important; height: 75%; bottom: 74px; left: 43%; z-index: 1; }
.mb-elementor-page main .mb-penguin-crew .mb-crew-camera { --mb-crew-angle: 3deg; width: 41% !important; height: 66%; bottom: 21px; left: 57%; z-index: 2; }
.mb-elementor-page main .mb-crew-moment { padding: 68px 48px; margin: 0 !important; width: 100% !important; max-width: 100%; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-crew > .elementor-widget-wrap { --mb-crew-height: 380px; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-copy :is(.elementor-heading-title, h2) { color: inherit; margin: 0; font-size: clamp(30px, 3.4vw, 46px); font-weight: 700; line-height: 1.1; letter-spacing: -.035em; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-copy .elementor-widget-text-editor { font-size: 19px; line-height: 1.6; max-width: 44ch; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-copy p { margin: 0; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-copy p + p { margin-top: 18px; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-copy .elementor-widget-text-editor h2 + p { margin-top: 25px; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-crew .mb-crew-scene { position: relative; width: 100% !important; height: 100%; margin: 0; opacity: 1; transform: none; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-crew .mb-crew-scene > .elementor-widget-container { width: 100%; height: 100%; }
.mb-elementor-page main .mb-crew-moment .mb-penguin-crew .mb-crew-scene img { display: block; width: 100%; max-width: 100%; height: 100%; object-fit: contain; object-position: center; }
/* JS opts in only these explicit teamwork passages; without JS every image is visible. */
.mb-elementor-page main .mb-crew-ready .mb-penguin-crew .mb-crew-scene { transition: transform 600ms cubic-bezier(.16, 1, .3, 1), opacity 420ms ease-out; }
.mb-elementor-page main .mb-crew-ready:not(.mb-crew-together) .mb-penguin-crew .mb-crew-scene { opacity: 0; transform: translateY(12px); }
/* Hero assembly: John steps out of the dark first, then the bende converges behind him. */
.mb-elementor-page main .mb-penguin-header.mb-crew-ready .mb-penguin-crew :is(.mb-crew-john, .mb-crew-laptop, .mb-crew-tablet, .mb-crew-camera) { opacity: 0; will-change: translate, scale, filter, opacity; }
.mb-elementor-page main .mb-penguin-header.mb-crew-together .mb-crew-john { animation: mb-crew-john 1800ms cubic-bezier(.22, 1, .36, 1) 200ms both; }
.mb-elementor-page main .mb-penguin-header.mb-crew-together .mb-crew-laptop { --mb-crew-from: -58% 6%; animation: mb-crew-join 1800ms cubic-bezier(.16, 1, .3, 1) 1400ms both; }
.mb-elementor-page main .mb-penguin-header.mb-crew-together .mb-crew-camera { --mb-crew-from: 62% 8%; animation: mb-crew-join 1800ms cubic-bezier(.16, 1, .3, 1) 1750ms both; }
.mb-elementor-page main .mb-penguin-header.mb-crew-together .mb-crew-tablet { --mb-crew-from: 14% -16%; animation: mb-crew-join 1900ms cubic-bezier(.16, 1, .3, 1) 2100ms both; }
.mb-elementor-page main .mb-penguin-header .mb-penguin-crew > .elementor-widget-wrap::before {
  content: "";
  position: absolute;
  inset: 8% 4% 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(38% 46% at 30% 62%, rgba(0, 185, 213, .55), transparent 70%),
    radial-gradient(34% 42% at 52% 42%, rgba(118, 56, 184, .5), transparent 70%),
    radial-gradient(36% 44% at 72% 60%, rgba(233, 42, 152, .5), transparent 70%),
    radial-gradient(30% 36% at 60% 82%, rgba(239, 76, 67, .45), transparent 70%);
  filter: blur(40px);
}
.mb-elementor-page main .mb-penguin-header.mb-crew-together .mb-penguin-crew > .elementor-widget-wrap::before { animation: mb-crew-bloom 3800ms ease-out 1100ms both; }
@keyframes mb-crew-john {
  0% { opacity: 0; translate: 0 9%; scale: .9; filter: blur(14px) brightness(.4); }
  55% { opacity: 1; filter: blur(0) brightness(1.08); }
  100% { opacity: 1; translate: 0 0; scale: 1; filter: none; }
}
@keyframes mb-crew-join {
  0% { opacity: 0; translate: var(--mb-crew-from); scale: .82; filter: blur(10px) brightness(.5); }
  45% { opacity: 1; filter: blur(0) brightness(1); }
  72% { translate: 0 -2.5%; scale: 1.015; }
  100% { opacity: 1; translate: 0 0; scale: 1; filter: none; }
}
@keyframes mb-crew-bloom {
  0% { opacity: 0; scale: .7; }
  40% { opacity: .55; scale: 1.05; }
  100% { opacity: 0; scale: 1.15; }
}
@media (max-width: 1023px) {
  .mb-elementor-page main .mb-penguin-header { padding-inline: 32px !important; }
  .mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) > .elementor-container { gap: 28px; }
  .mb-elementor-page main .mb-penguin-crew > .elementor-widget-wrap { --mb-crew-height: 430px; }
  .mb-elementor-page main .mb-penguin-header .mb-penguin-copy .elementor-widget-text-editor { font-size: 18px; }
  .mb-elementor-page main .mb-crew-moment { padding-inline: 32px; }
  .mb-elementor-page main .mb-crew-moment .mb-penguin-crew > .elementor-widget-wrap { --mb-crew-height: 340px; }
}
@media (max-width: 767px) {
  .mb-elementor-page main .mb-penguin-header { padding: calc(var(--mb-header-height, 72px) + 35px) 24px 22px !important; }
  .mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) > .elementor-container { flex-direction: column; gap: 20px; }
  .mb-elementor-page main :is(.mb-penguin-header, .mb-crew-moment) > .elementor-container > :is(.mb-penguin-copy, .mb-penguin-crew) { width: 100%; flex: 0 1 auto; }
  .mb-elementor-page main .mb-penguin-header .mb-penguin-copy { padding: 0; }
  .mb-elementor-page main .mb-penguin-header :is(h1, h2, .mb-penguin-heading .elementor-heading-title) { font-size: clamp(47px, 12.5vw, 68px); }
  .mb-elementor-page main .mb-penguin-header .mb-penguin-copy .elementor-widget-text-editor { font-size: 18px; max-width: 42ch; }
  .mb-elementor-page main .mb-penguin-crew > .elementor-widget-wrap { --mb-crew-height: clamp(270px, 46.4vw, 340px); }
  .mb-elementor-page main .mb-penguin-crew .mb-crew-laptop { bottom: 20px; }
  .mb-elementor-page main .mb-penguin-crew .mb-crew-tablet { bottom: 53px; }
  .mb-elementor-page main .mb-penguin-crew .mb-crew-camera { bottom: 15px; }
  .mb-elementor-page main .mb-crew-moment { padding: 52px 24px 35px; }
  .mb-elementor-page main .mb-crew-moment .mb-penguin-crew > .elementor-widget-wrap { --mb-crew-height: clamp(240px, 40vw, 300px); }
  .mb-elementor-page main .mb-crew-moment .mb-penguin-copy .elementor-widget-text-editor { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .mb-elementor-page main .mb-crew-ready .mb-penguin-crew .mb-crew-scene { opacity: 1 !important; transform: none !important; transition: none !important; }
  .mb-elementor-page main .mb-crew-ready .mb-penguin-crew :is(.mb-crew-laptop, .mb-crew-tablet, .mb-crew-camera) { opacity: 1 !important; transform: rotate(var(--mb-crew-angle)) !important; transition: none !important; }
  .mb-elementor-page main .mb-penguin-header.mb-crew-ready .mb-penguin-crew :is(.mb-crew-john, .mb-crew-laptop, .mb-crew-tablet, .mb-crew-camera) { opacity: 1 !important; animation: none !important; }
  .mb-elementor-page main .mb-penguin-header .mb-penguin-crew > .elementor-widget-wrap::before { animation: none !important; opacity: 0 !important; }
}