.elementor-39 .elementor-element.elementor-element-fd89434{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--gap:70px 70px;--row-gap:70px;--column-gap:70px;--padding-top:30px;--padding-bottom:30px;--padding-left:30px;--padding-right:30px;}.elementor-39 .elementor-element.elementor-element-fd89434:not(.elementor-motion-effects-element-type-background), .elementor-39 .elementor-element.elementor-element-fd89434 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-secondary );}.elementor-widget-theme-site-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-item:not(:last-child):after{border-color:var( --e-global-color-text );}.elementor-widget-icon-list .elementor-icon-list-icon i{color:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-icon svg{fill:var( --e-global-color-primary );}.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-widget-icon-list .elementor-icon-list-text{color:var( --e-global-color-secondary );}.elementor-39 .elementor-element.elementor-element-d98594d .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-39 .elementor-element.elementor-element-d98594d .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-39 .elementor-element.elementor-element-d98594d{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-39 .elementor-element.elementor-element-d98594d .elementor-icon-list-text{transition:color 0.3s;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-39 .elementor-element.elementor-element-4a725d1{--display:flex;--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;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for container, class: .elementor-element-fd89434 */@font-face {
  font-display: block;
  font-family: Mori;
  font-style: normal;
  font-weight: 400;
  src: url(https://assets.codepen.io/16327/PPMori-Regular.woff) format("woff");
}

/* Set up your design variables */
:root {
  --color-shockingly-green: #0ae448;
  --color-just-black: #0e100f;
  --color-surface-white: #fffce1;
  --color-pink: #fec5fb;
  --color-shockingly-pink: #f100cb;
  --color-orangey: #ff8709;
  --color-lilac: #9d95ff;
  --color-lt-green: #abff84;
  --color-blue: #00bae2;
  --color-grey: #191919;
  --color-surface75: #bbbaa6;
  --color-surface50: #7c7c6f;
  --color-surface25: #42433d;
}

/* Base Body Styles (optional, adjust if needed) */
body {
  font-family: Mori;
  font-weight: 300;
  margin: 0;
  padding: 0;
  /* Use your site's background color here */
  /* background: var(--color-just-black); */
}

/* --- Elementor Header Styles --- */

/* * IMPORTANT: Replace `.elementor-sticky-header` with 
* the custom class you assigned to your main header section/container.
*/
.elementor-sticky-header {
  /* Ensure your Elementor header is fixed to the top */
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 1000; /* Make sure it stays on top of content */
  /* Add the transition for the smooth height change and for the GSAP animation */
  transition: ease 0.4s; 
  
  /* The original code had a fixed height and background, you might want to 
     remove or adjust these if they conflict with your Elementor design. */
  /* height: 80px; 
  background: linear-gradient(
      144.02deg,
      var(--color-blue) 4.56%,
      var(--color-pink) 72.98%
  ); */
}

/* * This is for a potential height/style change when the header is in 
* its 'scrolled' state. You need to manually add this class in JS 
* on scroll (which is not what the original GSAP code does), 
* so I've simplified the effect to just use the GSAP hide/show. 
* You can ignore this if only using the hide/show effect.
*/
/*
.elementor-sticky-header.header-scrolled {
  height: 40px; 
}
*/

/* Only needed for testing, remove this if your content is already long */
.scrollable-area {
  height: 200vh;
}/* End custom CSS */