/* Reuse the portfolio case-study system; only this page's composition differs. */
.bellows-page { background: #f4f4f4; }
.bellows-page .boltwagon-content { --bw-section-before: 120px; --bw-section-after: 80px; }
.bellows-page main figure img { border-radius: 12px; }
.bellows-page .bw-cover img { border-radius: 0; }
.bellows-hero-shell { position: relative; max-width: 1360px; margin-inline: auto; }
.bellows-page .topbar { z-index: 5; width: 100%; padding-inline: 40px; }
.bellows-page .bellows-image-reveal { opacity: 0; transform: translateY(20px); transition: opacity 700ms cubic-bezier(.22,1,.36,1), transform 700ms cubic-bezier(.22,1,.36,1); }
.bellows-page .bellows-image-reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (min-width: 761px) {
  .bellows-page .topbar .desktop-nav { visibility: hidden; }
  .bellows-page .topbar { position: absolute; }
}
@media (min-width: 761px) and (max-width: 1024px) {
  .bellows-page .bw-introduction { grid-template-columns: minmax(0,1fr); gap: 28px; }
}
@media (max-width: 760px) {
  .bellows-page .topbar { position: relative; padding-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .bellows-page .bellows-image-reveal { opacity: 1; transform: none; transition: none; }
}



/* Challenge ends after its 80px bottom padding; showcases begin in white. */
.bellows-page .bellows-process-background { background: #FFFFFF; }

/* Use the shared two-action case-study menu; keep its header over the hero. */
@media (max-width: 1024px) {
  .bellows-hero-shell { display: contents; }
  .bellows-page .topbar { position: sticky; top: 0; left: auto; z-index: 1000; margin-inline: auto; background: transparent; }
}
/* Match the shared BoltWagon tablet navbar gutters. */
@media (min-width: 761px) and (max-width: 1024px) {
  .bellows-page .topbar { padding-inline: 20px; }
}

/* Let the header stick to the full page while preserving its hero overlay. */
.bellows-hero-shell { display: contents; }
.bellows-page .topbar { position: sticky; top: 0; left: auto; z-index: 1000; max-width: 1360px; margin-inline: auto; background: transparent; }
.bellows-page .bellows-challenge { background: #F4F4F4; }