/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

html { scroll-behavior: auto; }

html.lenis,
html.lenis body,
html.mcc-motion-stability {
  scroll-behavior: auto !important;
}

:root {
  --space-unit: 1rem;
}

:root, * {
  --space-4xs: calc(0.125 * var(--space-unit));
  --space-3xs: calc(0.25 * var(--space-unit));
  --space-2xs: calc(0.375 * var(--space-unit));
  --space-xs: calc(0.5 * var(--space-unit));
  --space-sm: calc(0.75 * var(--space-unit));
  --space-md: calc(1.25 * var(--space-unit));
  --space-lg: calc(2 * var(--space-unit));
  --space-xl: calc(3.25 * var(--space-unit));
  --space-2xl: calc(5.25 * var(--space-unit));
  --space-3xl: calc(8.5 * var(--space-unit));
  --space-4xl: calc(13.75 * var(--space-unit));
  --component-padding: var(--space-md);
}


@media (max-width: 1024px), (pointer: coarse) {
  .mp-reveal-img,
  .mp-reveal-img img {
    opacity: 1 !important;
    visibility: visible !important;
  }
}

/*
.mp-offset-anchor{
  height: 1px!important;
  scroll-margin-top: 100vh; // scrolls to elementTop - 50vh
}
*/


/* Force slide backgrounds to scroll with the slide (no viewport-fixed background) */
.journal-carousel .journal-carousel-slide .journal-carousel-slide-image,
.journal-carousel .journal-carousel-slide .journal-carousel-slide-image > * {
  background-attachment: scroll !important;
}

/* Guard against background shorthand reintroducing 'fixed' */
.journal-carousel .journal-carousel-slide .journal-carousel-slide-image {
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

/* Bricks carousel image alignment guard. */
.brxe-carousel .swiper-slide {
  text-align: center;
}

.brxe-carousel .swiper-slide > img.image,
.brxe-carousel .swiper-slide > picture,
.brxe-carousel .swiper-slide .brxe-image,
.brxe-carousel .swiper-slide figure {
  display: block;
  margin-left: auto !important;
  margin-right: auto !important;
}

.brxe-carousel .swiper-slide img,
.brxe-carousel .swiper-slide .image {
  object-position: center center !important;
  background-position: center center !important;
}

/* Hero slider crop guard: Motion.page parallax can pull slide backgrounds left/up. */
.mp-hero-parallax .hero-slider .x-slider_slide,
.mp-hero-parallax .hero-slider .splide__slide {
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

@media (max-width: 1024px) {
  .mp-hero-parallax .hero-slider .x-slider_slide,
  .mp-hero-parallax .hero-slider .splide__slide {
    background-position: 50% 50% !important;
    background-position-x: 50% !important;
    background-position-y: 50% !important;
  }

  #about-hero .hero-slider .x-slider_slide,
  #about-hero .hero-slider .splide__slide {
    background-position-x: 60% !important;
  }
}

@media (max-width: 478px) {
  #about-hero .hero-slider .x-slider_slide,
  #about-hero .hero-slider .splide__slide {
    background-position-x: 50% !important;
  }
}

/* Motion.page stability: fixed backgrounds are prone to repaint gaps inside pinned/transformed sections. */
#brxe-esfffe,
.brxe-sbnriv {
  background-attachment: scroll !important;
}

.pin-spacer,
.pin-spacer > * {
  box-sizing: border-box;
}

.overlay-menu-circle {
  pointer-events: none;
}

.header.brxe-section .McC-Logo.brxe-block,
.header.brxe-section .brxe-ivdzyd {
  pointer-events: auto;
  z-index: 10001 !important;
}

.header.brxe-section .McC-Logo.brxe-block a,
.header.brxe-section .brxe-ivdzyd a,
.header.brxe-section .brxe-yzckxv {
  pointer-events: auto;
}

body.mcc-menu-settled-open .header.brxe-section .brxe-yzckxv path {
  fill: #fff !important;
  stroke: #fff !important;
}

.header.brxe-section .McC-Logo.brxe-block a:focus,
.header.brxe-section .brxe-ivdzyd a:focus,
.brxe-toggle[data-selector=".overlay-menu"]:focus,
.overlay-menu a:focus {
  outline: none !important;
  box-shadow: none !important;
}

.brxe-toggle[data-selector=".overlay-menu"]::-moz-focus-inner {
  border: 0;
}

.overlay-menu a:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  text-decoration: underline currentColor solid 1px !important;
  text-underline-offset: 0.18em;
}

.footer-btn[aria-current="page"] {
  text-decoration: underline currentColor solid 1px !important;
  text-underline-offset: 0.18em;
}

.header.brxe-section .McC-Logo.brxe-block a:focus-visible .brxe-yzckxv,
.header.brxe-section .brxe-ivdzyd a:focus-visible .brxe-yzckxv {
  filter: drop-shadow(0 2px 0 rgba(249, 98, 52, 0.9));
}

body.mcc-menu-settled-open .header.brxe-section .McC-Logo.brxe-block a:focus-visible .brxe-yzckxv,
body.mcc-menu-settled-open .header.brxe-section .brxe-ivdzyd a:focus-visible .brxe-yzckxv {
  filter: drop-shadow(0 2px 0 rgba(255, 255, 255, 0.9));
}

.brxe-toggle[data-selector=".overlay-menu"]:focus-visible .brxa-wrap {
  filter: drop-shadow(0 2px 0 currentColor);
}

body.mcc-menu-visibility-fallback .overlay-menu.brxe-block {
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

body.mcc-menu-visibility-fallback .overlay-menu.brxe-block .overlay-content {
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

@media (max-width: 767px), (pointer: coarse) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  body.no-scroll {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden !important;
  }

  .header.brxe-section {
    z-index: 10000 !important;
  }

  .brxe-iaovqc.brxe-toggle,
  .brxe-toggle[data-selector=".overlay-menu"] {
    z-index: 10001 !important;
  }

  .overlay-menu.brxe-block,
  body.mcc-menu-open .overlay-menu.brxe-block {
    position: fixed !important;
    inset: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100dvw !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    touch-action: pan-y;
    transform: none !important;
    z-index: 9998 !important;
    -webkit-overflow-scrolling: touch;
  }

  body.mcc-menu-open .overlay-menu.brxe-block {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
  }

  .overlay-menu.x-offcanvas,
  .overlay-menu.x-offcanvas .x-offcanvas_inner,
  .overlay-menu.x-offcanvas .x-offcanvas_backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    width: 100dvw !important;
    max-width: none !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
  }

  .overlay-menu.x-offcanvas .x-offcanvas_inner {
    left: 0 !important;
    right: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .overlay-menu.x-offcanvas .x-offcanvas_inner[aria-hidden="false"] {
    transform: none !important;
  }
}

@supports (-moz-appearance: none) {
  @media (max-width: 767px), (pointer: coarse) {
    .overlay-menu.brx-open {
      opacity: 1 !important;
      pointer-events: auto !important;
      visibility: visible !important;
    }

  }
}

/* Fluid size header text - update, used SVG instead for better scaling on problem items.
.decor-size {
  position: relative;
  overflow: visible;
  font-size: clamp(2.5rem, 1.2rem + 4vw, 6rem);
 outline: 2px solid red;
}

.decor-text {
  margin: 0;
  font-size: 1em;
  line-height: 0.9;
 outline: 2px solid red;
}
*/ 
