/* Theme Name: 60 Second Portraits Theme
 * Theme URI: https://generatepress.com
 * Description: GeneratePress platform child theme for 60sec
 * Author: Big Ears Webagentur
 * Author URI: https://bigears.work
 * Template: generatepress
 * Version: 0.9
 * Text Domain: be_60s */





/* Media defaults */
.section img {
  display: block;
  max-width: 100%;
  height: auto;
}

.wp-block-video video {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;  /* crop instead of distort */
  object-position: center;
  z-index: 0;         /* behind overlay */
}


/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .main-navigation { transition: none; }
  .bottom-nav { transition: none; }
}

/* Bottom Navigation */
.bottom-nav {
  --bn-gap: 1rem;
  --bn-font: 0.8rem;

  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: env(safe-area-inset-bottom, 2.5rem);
  padding-bottom: env(safe-area-inset-bottom, 2.5rem);

  display: flex;
  gap: var(--bn-gap);
  z-index: 10005;
  pointer-events: auto;

  font-size: var(--bn-font);
}
.bottom-nav.light { color: #000; }
.bottom-nav.dark  { color: #fff; }
.bottom-nav a {
  text-decoration: none;
  color: inherit;
  line-height: 1.4;
  transition: opacity 0.2s ease;
}
.bottom-nav a:hover { opacity: 0.65; }
@media (max-width: 480px) {
  .bottom-nav {
    --bn-gap: 0.5rem;
    --bn-font: 0.75rem;
  }
}

/* Keep page content clear of fixed bottom bar (+ safe area) */
body:not(.block-editor-page) .site-content,
body:not(.block-editor-page) #content,
body:not(.block-editor-page) .page-wrap {
  padding-bottom: calc(2.5rem + env(safe-area-inset-bottom, 0px));
}

/* Scroll Progress Bar */
.scroll-progress {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 0.25rem;
  z-index: 10020;
  pointer-events: none;
}
.scroll-progress > span {
  display: block;
  height: 100%;
  width: 100%;
  transform: scaleX(var(--progress, 0));
  transform-origin: left center;
  transition: background-color 200ms ease;
  background: #000;
}
.scroll-progress.dark  > span { background: #fff; }
.scroll-progress.light > span { background: #000; }