/*
 Theme Name:   Martin Fondse 03
 Theme URI:    https://nieta.nl
 Description:  GeneratePress child theme
 Author:       nieta
 Author URI:   https://nieta.nl
 Template:     generatepress
 Version:      0.1
*/

/* Colors */
/* base-white: #FFFFFF; */
/* base-cream: #E7E6DE */
/* accent: #222222 */
/* accent-yellow: #F0AE04 */
/* accent-red: #D8242A */
/* accent-orange: #FF715B */
/* accent-blue: #0052FA */
/* accent-green: #3B7930 */
/* accent-rose: #F69AAB */ 

/* Home sections: Hero base-cream, Skills accent-yellow, Blurb accent-red, Live accent-blue, Projects accent-orange, Media accent-green, Video accent-rose, Footer accent-yellow */

:root {
  /* Base */
  font-size: 16px;

  /* Font families */
  /* --font-body: "Aeonik", Arial, sans-serif; */
  /* --font-heading: "Aeonik", "Open Sans", Arial, sans-serif; */
  --font-body: "Manrope", Arial, sans-serif;
  --font-heading: "Manrope", "Open Sans", Arial, sans-serif;

  /* Font weights */
  --regular: 400;
  --medium: 500;
  --bold: 700;

  /* Modular scale 1.25 */
  --text-xs: 0.8rem;
  --text-sm: 1rem;
  --text-base: 1.125rem;
  --text-lg: 1.25rem;
  --text-xl: 1.563rem;
  --text-2xl: 1.953rem;
  --text-3xl: 2.441rem;
  --text-4xl: 3.052rem;
  --text-5xl: 3.815rem;
  --text-6xl: 4.768rem;
}

body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.6;
}

/* LIVE */
body.page-id-193 {
  background: var(--accent-blue);
}
body.page-id-193 h1.entry-title {
  color: #ffffff;
}

/* PROJECTS */
body.page-id-173 {
  background: var(--accent-orange);
}

/* ABOUT */
body.page-id-186 {
  background: var(--accent-yellow);
}

h1 {
  font-family: var(--font-heading);
  font-size: var(--text-6xl);
  line-height: calc(2px + 2ex);
  font-weight: var(--medium);
}

h2 {
  font-family: var(--font-heading);
  font-size: var(--text-5xl);
  line-height: calc(4px + 2ex);
  font-weight: var(--medium);
}

h3 {
  font-family: var(--font-heading);
  font-size: var(--text-4xl);
  line-height: calc(7px + 2ex);
  font-weight: var(--medium);
}

h4 {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  line-height: calc(8px + 2ex);
  font-weight: var(--medium);
}

h5 {
  font-family: var(--font-heading);
  font-size: 20px;
  line-height: calc(8px + 2ex);
  font-weight: var(--medium);
}

h6 {
  font-family: var(--font-heading);
  font-size: 18px;
  line-height: calc(8px + 2ex);
  font-weight: var(--medium);
}

h1 {
    font-size: clamp(2.5rem, 5.063vw + 0.07rem, 4.5rem);
}

h2 {
    font-size: clamp(2rem, 1.266vw + 1.392rem, 2.5rem);
}

h3 {
    font-size: clamp(1.5rem, 0.633vw + 1.196rem, 1.75rem);
}

h4 {
   font-size: clamp(1.313rem, 0.475vw + 1.085rem, 1.5rem);
}
@media (max-width: 1024px) and (min-width: 769px) {
  .one-container .site-content, .inside-page-header {
      padding: 128px 48px 128px 48px;
  }
}
/* Navigation */
.gb-is-sticky {
    box-shadow: none !important;
}
:where(.gb-navigation[data-gb-mobile-menu-type=full-overlay]) .gb-menu-container--mobile .gb-menu-toggle--clone {
  top: 1rem !important;
  right: 50px !important;
}
@media (max-width: 1024px) {
  :where(.gb-navigation[data-gb-mobile-menu-type=full-overlay]) .gb-menu-container--mobile .gb-menu-toggle--clone {
  top: 1.5rem !important;
    right: 4px !important;
  }
    .gb-menu-container-0291cbf7.gb-menu-container--mobile {
        row-gap: 0 !important;
    }
}
media (max-width: 1024px) {
    .gb-menu-container-0291cbf7.gb-menu-container--mobile {
        background-color: var(--base-white);
    }

.off-canvas-menu {
    height: 100vh; /* fallback voor oudere browsers */
    height: 100dvh; /* dynamic viewport height, houdt rekening met de adresbalk */
    overflow-y: auto;
}
}

@media (max-width: 767px) {
    .gb-menu-toggle-ba7b9da2 .gb-menu-open-icon,
    .gb-menu-toggle-ba7b9da2 .gb-menu-close-icon {
        font-size: 1rem !important;
    }
}

/* Buttons */
.gbp-button--tertiary .gb-shape svg,
.gbp-button--secondary .gb-shape svg {
    transform: rotate(270deg);
    transition: transform 0.3s ease; /* optional smooth transition */
}

/* Greyed-out ticket button for past events */
.ticket-button.is-past-event,
a.is-past-event {
    pointer-events: none;
    opacity: 0.5;
    filter: grayscale(100%);
    cursor: not-allowed;
}

/* Hero Header + animated logo */
.mf-hero {
  height: 90vh;
  height: 90svh;
}
.mf-hero .hero-line {
  display: inline-block;
  text-transform: uppercase;
  font-weight: 900;
  line-height: 1.2;
  will-change: transform, opacity;
}
.mf-hero .hero-line-1 {
  font-size: clamp(4rem, 12vw, 14rem);
}
.mf-hero .hero-line-2 {
  font-size: clamp(4rem, 12vw, 14rem);
}
@media (max-width: 767px) {
.mf-skills {
  background: var(--base-cream) !important;
}
}

.mf-blurb {
  color: #FFFFFF;
}

.mf-live {
  
}

.mf-projects {
  
}

.mf-media,
.mf-media h3 {
  color: #FFFFFF;
}

.mf-video {
  
}

.background-video {
    /* position: absolute; */
    /* opacity: 0.5; */
}
video[poster] {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
@media (max-width: 767px) {
  h3.gb-text.gb-text-13a951a0 {
    overflow-wrap: break-all;
    font-size: 1.3rem; 
  }
}
/* Projects - Masonry layout */
.masonry-container {
    width: 100%;
}
.masonry-container .gb-loop-item {
    margin-bottom: 3rem;
}

/* Projects - Upcoming */
.projects-section-upcoming {
  margin-bottom: 4rem;
  margin-top: 4rem;
}

.single .wp-block-embed.is-type-video {
  margin: 1.5rem 0;
}