/* 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; }

.lg-toolbar .hf-download { width: 46px; height: 46px; background: none; border: 0; cursor: pointer; opacity: .85; }
.lg-toolbar .hf-download:hover { opacity: 1; }
.lg-toolbar .hf-download svg { vertical-align: middle; }

@media (max-width: 1024px) {
  .happyfiles-gallery > ul.crop[data-col], .happyfiles-gallery > ul.no-crop[data-col] {
    grid-template-columns: repeat(2,1fr);
  }
}

#mobile-menu-control-wrapper{
	border: solid 3px;
	border-radius: 50rem;
	transition: all 0.3s ease 0s;
	button.menu-toggle{
		transition: all 0.3s ease 0s;
		padding:0 0.6rem;
		margin:0 0 2px;
		line-height:2rem;
	}
}

#mobile-menu-control-wrapper:hover{
	border: solid 3px;
	border-radius: 50rem;
	background-color: var(--contrast);
	button.menu-toggle{
		padding:0 0.6rem;
		margin:0 0 2px;
		line-height:2rem;
		color:var(--base-3)
	}
}

.inside-header .txt-pill:is(:hover,:focus-visible){background-color:var(--contrast);color:var(--base-2);border-color:var(--contrast)}

#vid--hero {
	position: relative;       
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	margin: 0;
}