.elementor-925 .elementor-element.elementor-element-1ee580d{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-start;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-image .widget-image-caption{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-925 .elementor-element.elementor-element-227ff2fc{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -8px) 0px;text-align:left;}.elementor-925 .elementor-element.elementor-element-227ff2fc img{width:201px;}.elementor-925 .elementor-element.elementor-element-42a1adb{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-end;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-925 .elementor-element.elementor-element-4789376{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-925 .elementor-element.elementor-element-2a2f529a .e-off-canvas__content{background-color:#0C0C0C;}.elementor-925 .elementor-element.elementor-element-2a2f529a .e-off-canvas__overlay{background-color:rgba(0,0,0,.8);}.elementor-925 .elementor-element.elementor-element-2a2f529a{--e-off-canvas-width:100%;--e-off-canvas-height:100vh;--e-off-canvas-content-overflow:auto;--e-off-canvas-animation-duration:1s;--e-off-canvas-overlay-opacity:1;}.elementor-925 .elementor-element.elementor-element-2c06edb4{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-925 .elementor-element.elementor-element-2c06edb4:not(.elementor-motion-effects-element-type-background), .elementor-925 .elementor-element.elementor-element-2c06edb4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-784133c );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-925 .elementor-element.elementor-element-79d3034f{padding:6rem 2rem 0rem 2rem;--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-icon i{color:var( --e-global-color-text );transition:color 0.3s;}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-icon svg{fill:var( --e-global-color-text );transition:fill 0.3s;}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-item > a{font-family:"Degular", Sans-serif;font-size:6.25rem;font-weight:700;text-transform:uppercase;}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-925 .elementor-element.elementor-element-56ce0929{padding:0px 0px 0px 0px;--e-nav-menu-horizontal-menu-item-margin:calc( 49px / 2 );}.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu .elementor-item{font-family:"Degular", Sans-serif;font-size:1.438rem;font-weight:600;}.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu--main .elementor-item{color:#FFFFFF;fill:#FFFFFF;padding-left:0px;padding-right:0px;}.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu--main .elementor-item:hover,
					.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:49px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-925 .elementor-element.elementor-element-227ff2fc img{width:158px;}.elementor-925 .elementor-element.elementor-element-56ce0929{--e-nav-menu-horizontal-menu-item-margin:calc( 46px / 2 );}.elementor-925 .elementor-element.elementor-element-56ce0929 .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:46px;}}@media(max-width:767px){.elementor-925 .elementor-element.elementor-element-1ee580d{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-925 .elementor-element.elementor-element-227ff2fc{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -8px) 0px;}.elementor-925 .elementor-element.elementor-element-227ff2fc img{width:113px;}.elementor-925 .elementor-element.elementor-element-42a1adb{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-925 .elementor-element.elementor-element-4789376{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-925 .elementor-element.elementor-element-2a2f529a{--e-off-canvas-align-items:flex-start;}.elementor-925 .elementor-element.elementor-element-2c06edb4{--justify-content:flex-start;}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(10px/2);}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(10px/2);}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(10px/2);}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-10px/2);}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-10px/2);}.elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-925 .elementor-element.elementor-element-79d3034f .elementor-icon-list-item > a{font-size:3.125rem;line-height:3.2rem;}}/* Start custom CSS for container, class: .elementor-element-1ee580d *//* =========================
   Recreation Header (Elementor)
   ========================= */

/* Sizes */
:root { 
  --hmh: 90px; 
  --pad-x: 26px;            /* default (mobile) */
}
@media (min-width: 768px){
  /* :root { --pad-x: 49px; }  ≥768px gets 49px side padding */
}
@media (max-width: 767px){
  :root { --hmh: 50px; }    /* mobile header height */
}

/* Make wrappers transparent & non-isolating so the effect can see the backdrop */
.elementor.elementor-925.elementor-location-header,
.elementor-element-1ee580d,
.elementor-element-1ee580d > .e-con-inner{
  background: transparent !important;
  isolation: auto !important;
  filter: none !important;
  opacity: 1 !important;
  transform: none !important;
  max-width:1920px;
}

/* ---------- Main (logo) bar ---------- */
.elementor-element-1ee580d{ /* header-main */
  position: fixed; top: 0; left: 0; right: 0;
  display: flex; align-items: center; gap: 16px;
  min-height: var(--hmh);
  padding-inline: var(--pad-x);
  z-index: 2147483000;                 /* parent ABOVE dropdown */
  margin: 0 !important;
  padding-block: 0 !important;
  box-sizing: border-box;
}

/* ---------- Dropdown (nav) bar ---------- */
.elementor-element-42a1adb{ /* header-drop */
  position: fixed; top: 0; left: 0; right: 0;
  background: #22231e; color: #fff;
  transform: translate3d(0, -100%, 0); /* fully hidden (no top sliver) */
  transition: transform .25s ease;
  z-index: 2147482999;                 /* just under header-main parent */
  will-change: transform; backface-visibility: hidden;
  margin: 0 !important; border: 0; box-shadow: none;
}

/* Inner wrappers: same height, no stray spacing */
.elementor-element-42a1adb > .e-con-inner,
.elementor-element-4789376{
  display: flex; align-items: center;
  min-height: var(--hmh) !important;
  /*padding-inline: var(--pad-x) !important;*/
  /*padding-inline: var(--pad-x);*/
  padding-block: 0 !important;
  /*margin: 0 !important;*/
  box-sizing: border-box;
}

@media (min-width:767px){
.elementor-element-42a1adb > .e-con-inner,
.elementor-element-4789376{
	padding-left: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
    padding-right: clamp(var(--fluid-side-padding-min), 6.522vw + -0.217rem, var(--fluid-side-padding-max))!important;
	}
}

/* Normalize the nav widget spacing & vertical centering */
.elementor-element-56ce0929 .elementor-nav-menu--main{ padding: 0 !important; }
.elementor-element-56ce0929 .elementor-nav-menu > li > a.elementor-item{
  display: inline-flex; align-items: center;
  height: var(--hmh); line-height: 1;
  /*padding: 0 14px;*/
}

/* ---------- Open states ---------- */
/* Desktop hover open */
.elementor.elementor-925.elementor-location-header:hover .elementor-element-42a1adb{
  transform: translate3d(0, 0, 0);
}
/* Mobile/touch toggle (html.nav-open set by JS) */
html.nav-open .elementor-element-42a1adb{
  transform: translate3d(0, 0, 0);
}

/* While open, let clicks reach the dropdown, but keep logo link clickable */
.elementor.elementor-925.elementor-location-header:hover .elementor-element-1ee580d,
html.nav-open .elementor-element-1ee580d{ pointer-events: none; }
.elementor.elementor-925.elementor-location-header:hover .elementor-element-227ff2fc > a,
html.nav-open .elementor-element-227ff2fc > a{ pointer-events: auto; }

/* ---------- Logo “difference” effect via mask + backdrop-filter ---------- */
/* Keep the original <img> only for sizing/alt; draw the logo via ::before */
.elementor-element-227ff2fc{ position: relative; display: inline-block; }
.elementor-element-227ff2fc > a{
  position: relative; display: inline-block;
  z-index: 2147483001; /* above both bars; still clickable when open */
}

.elementor-element-227ff2fc img{
  display: block;
  opacity: 0; visibility: hidden; pointer-events: none; /* hide the literal pixels */
}

/* Invert only the backdrop inside the logo shape = “difference” look */
.elementor-element-227ff2fc > a::before{
  content: "";
  position: absolute; inset: 0;
  pointer-events: none; /* don’t block the link */
  -webkit-mask: url("https://www.rec.agency/wp-content/uploads/2025/09/Recreation_Logo_tm.svg")
                no-repeat center / contain;
          mask: url("https://www.rec.agency/wp-content/uploads/2025/09/Recreation_Logo_tm.svg")
                no-repeat center / contain;
  -webkit-backdrop-filter: invert(1) contrast(1.02);
          backdrop-filter: invert(1) contrast(1.02);
}

/* Firefox fallback if backdrop-filter isn’t supported */
@supports not ((-webkit-backdrop-filter: invert(1)) or (backdrop-filter: invert(1))){
  .elementor-element-227ff2fc > a::before{ background: #fff; }
}

/* ---------- Admin bar offsets ---------- */
@media (min-width: 768px){
  body.admin-bar .elementor-element-1ee580d,
  body.admin-bar .elementor-element-42a1adb{ top: 32px; }
}
@media (max-width: 767px){
  body.admin-bar .elementor-element-1ee580d,
  body.admin-bar .elementor-element-42a1adb{ top: 46px; }
  
  .elementor-element-42a1adb > .e-con-inner,
.elementor-element-4789376{
    padding-inline: 0px !important;
}

.elementor.elementor-925.elementor-location-header .elementor-element-42a1adb {
    transform: translate3d(0, 0, 0)!important;
}
}

/* Optional: if you ever see a faint line when closed, nudge an extra pixel */
// .elementor-element-42a1adb{ transform: translate3d(0, calc(-100% - 1px), 0); }


/* Don't apply the global press effect to the logo link */
.elementor-element-227ff2fc > a,
.elementor-element-227ff2fc > a:active,
.elementor-element-227ff2fc > a:focus {
  transform: none !important;
  filter: none !important;
}

/* Always keep the WP admin bar on top of EVERYTHING */
#wpadminbar{
  position: fixed;           /* WP sets this already, we reinforce it */
  top: 0; left: 0; right: 0;
  z-index: 2147483647 !important;  /* max safe int */
  pointer-events: auto;      /* ensure it's clickable even over overlays */
}

/* Smooth fade between masked / real logo */
.elementor-element-227ff2fc img{
  transition: opacity .18s ease, visibility .18s ease;
}
.elementor-element-227ff2fc > a::before{
  transition: opacity .18s ease;
}

/* While dropdown is open (desktop hover OR mobile .nav-open):
   - show the real image
   - hide/disable the backdrop-filter mask */
.elementor.elementor-925.elementor-location-header:hover .elementor-element-227ff2fc img,
html.nav-open .elementor-element-227ff2fc img{
  opacity: 1; visibility: visible;
}

.elementor.elementor-925.elementor-location-header:hover .elementor-element-227ff2fc > a::before,
html.nav-open .elementor-element-227ff2fc > a::before{
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  opacity: 0;            /* visually hides the pseudo element */
  /* optional: fully remove the mask while open */
  -webkit-mask: none;
  mask: none;
}

/* Always show real logo on mobile/touch (disable the mask) */
@media (hover: none), (pointer: coarse), (max-width: 767px){
  .elementor-element-227ff2fc img{
    opacity: 1 !important;
    visibility: visible !important;
  }
  .elementor-element-227ff2fc > a::before{
    -webkit-backdrop-filter: none !important;
            backdrop-filter: none !important;
    -webkit-mask: none !important;
            mask: none !important;
    opacity: 0 !important;
  }
}/* End custom CSS */
/* Start custom CSS for icon-list, class: .elementor-element-79d3034f *//* Fade Down */
@keyframes fadeDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Fade Up (reverse) */
@keyframes fadeUp {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(-10px);
  }
}

.nav .elementor-icon-list-item {
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.7s ease, transform 0.4s ease;
}

/* Class when off-canvas is opened */
.offcanvas-open .elementor-icon-list-item {
  animation: fadeDown 0.5s ease forwards;
}

/* Class when off-canvas is closing */
.offcanvas-closing .elementor-icon-list-item {
  animation: fadeUp 0.5s ease forwards;
}

/* Optional stagger effect */
.offcanvas-open .elementor-icon-list-item:nth-child(1) {
  animation-delay: 0.4s;
}
.offcanvas-open .elementor-icon-list-item:nth-child(2) {
  animation-delay: 0.6s;
}
.offcanvas-open .elementor-icon-list-item:nth-child(3) {
  animation-delay: 0.8s;
}
.offcanvas-open .elementor-icon-list-item:nth-child(4) {
  animation-delay: 1.0s;
}
.offcanvas-open .elementor-icon-list-item:nth-child(5) {
  animation-delay: 1.2s;
}
.offcanvas-open .elementor-icon-list-item:nth-child(6) {
  animation-delay: 1.4s;
}
.offcanvas-open .elementor-icon-list-item:nth-child(7) {
  animation-delay: 1.6s;
}


/* Underline hover effect */
.nav .elementor-icon-list-text {
  position: relative;
  display: inline-block;
  color: #fff;
}

.nav .elementor-icon-list-text::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 4px;
  width: 100%;
  background-color: #fff;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.nav .elementor-icon-list-item:hover .nav .elementor-icon-list-text::after {
  transform: scaleX(1);
  transform-origin: left;
}

.nav.elementor-icon-list-item:not(:hover) .nav .elementor-icon-list-text::after {
  transform-origin: right;
  transform: scaleX(0);
}

/* Show icon-list items fully while editing in Elementor (no fade/stagger) */
.elementor-editor-active .nav .elementor-icon-list-item,
body.elementor-editor-preview .nav .elementor-icon-list-item,
html[data-elementor-device-mode] .nav .elementor-icon-list-item{
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  transition: none/* End custom CSS */