<style>


@media screen and (max-width: 1400px) {

	
	div#content {
    max-width: 100%!important;
		padding: 0px;
}
}

section#head {
    display: none!important;
}


div#content {
    max-width: 100%;
	padding: 0px;
}


body{
	background-color:#df1c23!important;
}


.wrap-770.main.clear {
    max-width: 100%;
}
 /* Basic reset */
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }


a#lp_cta {
    background-color: #FFFFF5;
    color: #df1a23;
    margin-right: 20px;
    font-family: 'neulis-neue', sans-serif;
    font-size: 16px;
    letter-spacing: 0.5px;
    font-weight: 700;
    padding: 10px 30px;
}
a#lp_cta span:after{
	display:none;
}

#lp_wrapper {
      background: #FFFFF5;
      color: #DF1923; /* All font colors */
font-family: "elza", sans-serif;
font-weight: 500;
font-style: normal;
    font-size: 16px;
    line-height:2.2em;
    }

    #lp_wrapper h1, #lp_wrapper h2, #lp_wrapper h3, #lp_wrapper h4{
font-family: "neulis-neue", sans-serif!important;
font-weight: 900;
font-style: normal;
      line-height:1em;
      text-transform: uppercase;
            color: #DF1923; /* All font colors */
text-shadow:none!important;

    }

    #lp_wrapper h1 {
    color: #C5ECBF;
    font-size: 8rem;
    margin-bottom: 20px;
    font-weight: 900;
    max-width:900px;
font-family: "neulis-neue", sans-serif;
font-weight: 900;
font-style: normal;
}

    #lp_wrapper h2 {
      font-size: 5rem;
    }

    #lp_wrapper p {
      line-height:1.3em;

}

#lp_wrapper .section_hero button {
    background: #FFFFF5;
    color: #DF1B22;
    border: none;
    padding: 15px 25px;
    font-size: 1.3rem;
    cursor: pointer;
    border-radius: 100px;
    transition: background 0.3s;
    margin-top:50px;
          font-family:'neulis-neue';
      font-weight:700;
      line-height:1em;
      text-transform: uppercase;
  }

#lp_wrapper .container {
      width: 100%;
      max-width: 1310px;
      margin: 0 auto;
      display: flex;
      position: relative;
      flex-direction: column;
      align-items: center;
    }

    .section_hero {
    background: #DF1B22;
    padding: 90px 20px;
    text-align: left;
    color: #C5ECBF;
}

#lp_wrapper .container_hero {
     width: 100%;
      max-width: 1310px;
      margin: 0 auto;
      display: flex;
      position: relative;
      flex-direction: column;
      align-items: left;
    }

#lp_wrapper .section_hero p {
    color: #C5ECBF;
    font-size: 2.125rem;
    max-width: 800px;
}



   #lp_wrapper .section_red {
    background: #DF1B22;
    padding: 120px 20px;
    text-align: center;
    color: #C5ECBF;
    margin-top: -75px;
    z-index: 9;
    position: relative;
}




   #lp_wrapper .section_beige {
    background: #FFFFF5;
    padding: 120px 20px;
    text-align: center;
    color: #C5ECBF;
    position: relative;
}
 /* Modern browsers: use aspect-ratio */
    .video-container {
      max-width: 940px;           /* Optional max width */
      margin: 0 auto;             /* Center horizontally */
      aspect-ratio: 16 / 9;        /* Maintains 16:9 ratio */
      background: #000;           /* Fallback background */
    }
    
    .video-container video {
      width: 100%;
      height: 100%;
      object-fit: cover;          /* Ensures the content covers the container */
      display: block;
		cursor:pointer;
    }
    
    /* Fallback for browsers that do NOT support aspect-ratio */
    @supports not (aspect-ratio: 16/9) {
      .video-container {
        position: relative;
        width: 100%;
        padding-bottom: 56.25%;   /* 16:9 ratio = 9/16 = 56.25% */
        height: 0;
        overflow: hidden;
      }
      .video-container video {
        position: absolute;
        top: 0;
        left: 0;
      }
    }
#contact{
	padding-top:140px;
}
.gform_wrapper.gravity-theme #field_submit, .gform_wrapper.gravity-theme .gform_footer {
    display: flex;
    justify-content: center;
}

   #lp_wrapper .section_beige .subheading{
      color: #DF1923;
      font-size: 2rem;
	   max-width:800px;

}

body .gform_wrapper .gform_footer input.button, body .gform_wrapper .gform_footer input[type=submit], body .gform_wrapper .gform_footer input.button:focus, body .gform_wrapper .gform_footer input[type=submit]:focus {
    font-size: 1.2em;
    font-family: 'neulis-neue' !important;
    letter-spacing: 0;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1.2px;
    line-height: normal;
    padding: 12px 28px 12px 28px;
    text-align: center;
    border-radius: 40px;
    display: inline-block;
    min-width: 200px;
    border: 0px solid #DF1A22 !important;
    background-color: #DF1A22;
    color: #FFFFF5;
}


h2.form_subheading{
  font-size: 3.5rem!important;
font-family: "neulis-neue", sans-serif!important;
font-weight: 900!important;
	max-width:750px!important;
	
}

.gfield--type-html {
    display: flex
;
    justify-content: center;
}

#lp_wrapper .section_red h2 {
    color: #ffffff;
    margin-bottom: 20px;
	font-size:8.2rem;
	max-width:880px;
	line-height:1em;
}



#lp_wrapper .section_red .small_heading{
	font-size:4.3rem;
	line-height:1em;
}
#lp_wrapper h2 p {
	margin-top:20px;
    line-height: 0.85em;
		padding-bottom:10px;

}



#lp_wrapper .section_draw-heading h2{
  text-align:center;
  font-size:7rem;
}


#lp_wrapper h2 .word {
  display: inline;
  white-space: normal;
}


#lp_wrapper .section_draw-heading{
        background: #C5ECBF;
        z-index:9;
        padding:80px 20px 30px 20px;
        position:relative;

}
    /* The main pinned section */
    #lp_wrapper .section_pinned {
      width: 100%;
      padding: 0px 20px;
    }

    /* Container: 2 columns with different widths */
    .container_grid-2 {
      max-width: 1310px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1.5fr; /* 1:1.5 ratio */
      gap: 40px;
      align-items: center;
    }

    /* LEFT column */
    .left-col {
      display: flex;
      flex-direction: column; 
      gap: 20px;
      flex: 1; 
      justify-content: center;
    }
    .left-col h2 {
      font-size: 6rem;
      text-transform: uppercase;
      font-weight: 900;
		    max-width: 390px;

    }


    .left-col p {
      font-size: 2rem;
    }

    /* RIGHT column: 100vh container for Matter.js world */
    .right-col {
      flex: 1.5; 
      height: 100vh; 
      display: flex;
      flex-direction: column;
    }

    /* Matter.js container */
    #world {
      position: relative;
      width: 100%;
      height: 100%; 
      overflow: hidden;
      background: #FFFFF5;
    }

    /* The Matter.js canvas */
    #matter-canvas {
      display: block;
      width: 100%; 
      height: auto;
    }

   /************************************************************
 * Styling for each orange’s overlay content
 ************************************************************/

.orange-content {
  position: absolute;  /* So its children can be positioned relative to it */
  overflow: hidden;    /* Hide any overflow if needed */
}

.orange-content-wrapper{
	display:none;
}

.orange-label {
  position: absolute;
  top: 50%;
  left: 50%;
  /* These properties work with GSAP’s xPercent/yPercent tweening */
  transform: translate(-50%, -50%);
  margin: 0;
  font-size: 2.5rem;
  font-weight: 900;
}

.orange_content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  opacity: 0; /* start hidden; will fade in during the grow */
}

.orange-heading {
  margin: 0;
  font-size: 2.5rem;
  font-weight: 900;
	max-width:300px;
	text-align:center;
}

.orange-desc {
  margin: 0;
  font-size: 1.3em;
  line-height: 1.2em;
  text-align: center;
  padding: 0 30px;
	min-width:400px;
	max-width:400px;
	margin-bottom:0px!important;
}

    /* Spacer for scroll */
    .spacer {
      height: 200vh;
      background: #eee;
    }

    /* Draw Section styling */
    #drawSection {
      background: #C5ECBF;
      height: auto;
      position: relative;

    }
    
    svg {
      width: 60%;
      height: auto;
      display: block;
    }
    /* Path Styles */
    #thePath {
      fill: none;
      stroke: #df1b22;
      stroke-linecap: round;
    }
    /* Circle along the path */
    #myCircle {
      fill: #fff;
    }
    /* Text blurbs */
    .text-blurb {
      position: absolute;
      font-size: 2em;
      max-width: 30%;
      color: #DF1923;
      opacity: 0;
    }
    .blurb1 {
      top: 5%;
      right: 0%;
      text-align: right;
    }
    .blurb2 {
      top: 35%;
      left: 0%;
      max-width: 40%;
    }
    .blurb3 {
      top: 60%;
      right: 0%;
      max-width: 40%;
      text-align: right;
    }


.gform_wrapper.gravity-theme input[type=color], .gform_wrapper.gravity-theme input[type=date], .gform_wrapper.gravity-theme input[type=datetime-local], .gform_wrapper.gravity-theme input[type=datetime], .gform_wrapper.gravity-theme input[type=email], .gform_wrapper.gravity-theme input[type=month], .gform_wrapper.gravity-theme input[type=number], .gform_wrapper.gravity-theme input[type=password], .gform_wrapper.gravity-theme input[type=search], .gform_wrapper.gravity-theme input[type=tel], .gform_wrapper.gravity-theme input[type=text], .gform_wrapper.gravity-theme input[type=time], .gform_wrapper.gravity-theme input[type=url], .gform_wrapper.gravity-theme input[type=week], .gform_wrapper.gravity-theme select, .gform_wrapper.gravity-theme textarea {
border:4px solid #DF1923!important;
	border-radius:10px!important;
	background-color:transparent!important;
font-size:1.4em!important;
	color:#DF1923!important;
}

::placeholder, ::-webkit-input-placeholder {
 	color: #DF1923;
	font-family:'elza'!important;
	font-weight:700!important;
	font-size:1.4em!important;
	opacity: 1!important;
	padding-top:10px!important;
	transform:translateY(4px);
}

textarea::placeholder, textarea::-webkit-input-placeholder{
	transform:translateY(-5px)
}

body .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) {
    border: 2px solid #e5e7e9;
    border-radius: 20px;
    height: 72px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    padding: 0 18px;
    color: #6d727d;
}
div#field_6_7 {
    display: flex!important;
    justify-content: center!important;
}
.gform_wrapper.gravity-theme textarea{
	padding:18px!important;
}
div#contact {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.gform_wrapper {
    width: 1000px;
}








.section_red h2 .word {
  display: inline;
  white-space: normal;
}




@media only screen and (min-width: 1024px) and (max-width: 1380px) {
	
.orange-label {
  font-size: 2rem;
}
  .left-col p {
      font-size: 1.5rem;
    }

  .left-col h2 {
max-width:430px;
	  min-width:430px;
    }
.orange-heading {
  font-size: 1.6rem;
	max-width:250px;
	  line-height: 1.1em;

}

.orange-desc {
  font-size: 1em;
  line-height: 1.1em;
	min-width:330px;
	max-width:330px;
}
	
	.blurb1 {
    right: 30px;
}
	
	.blurb2{
		left:30px;
	}
	
	.blurb3{
		right:30px;
	}

}





@media only screen and (min-height: 620px) and (max-height: 800px) {
	
.orange-label {
  font-size: 2rem;
}


.orange-heading {
  font-size: 1.6rem;
	max-width:250px;
	  line-height: 1.1em;

}

.orange-desc {
  font-size: 1em;
  line-height: 1.1em;
	min-width:330px;
	max-width:330px;
}
	
	
	
}









@media screen and (max-width: 1023px) {

html {
  scroll-padding-top: 100px;
}
html ::placeholder, html ::-webkit-input-placeholder {
 	color: #DF1923;
	font-family:'elza'!important;
	font-weight:700!important;
	font-size:1.2rem!important;
	opacity: 1!important;
	padding-top:10px!important;
	transform:translateY(0px);
}



body .gform_wrapper .gform_footer input.button, body .gform_wrapper .gform_footer input[type=submit], body .gform_wrapper .gform_footer input.button:focus, body .gform_wrapper .gform_footer input[type=submit]:focus {
    font-size: 1.2rem!important;
   
}

	
	
  /* Example: Scale down large headings */
  #lp_wrapper h1 {
    font-size: 2.7rem;
	  max-width:300px;
  }

  #lp_wrapper h2 {
    font-size: 2.5rem;
  }

	#lp_wrapper .subheading {
    color: #DF1923;
    font-size: 1rem!important;
    max-width: 800px;
}
	
  /* Example: Adjust paragraph font-size */
  #lp_wrapper p {
    font-size: 1rem;
    line-height: 1.5em;
  }

  /* Example: Adjust hero section padding and text alignment */
  .section_hero {
    padding: 40px 30px;
    text-align: left;
  }

  /* Center hero container elements */
  #lp_wrapper .container_hero {
    display: block;
    align-items: center;
  }
	

	
  #lp_wrapper .section_hero {
	min-height:calc(100vh - 100px);
	}

  /* Adjust hero paragraph size */
  #lp_wrapper .section_hero p {
    font-size: 1.2rem;
  }

  /* Reduce padding in section_red and section_beige */
  #lp_wrapper .section_red,
  #lp_wrapper .section_beige,
	#lp_wrapper .section_pinned{
    padding: 60px 30px;
  }
#lp_wrapper .section_draw-heading h2{
  text-align:center;
  font-size:2rem;
}
	
  /* Make the grid layout single-column */
  .container_grid-2 {
    display: block;
  }
	
  /* Each column becomes full-width */
  .left-col,
  .right-col {
    width: 100%;
    margin: 0 auto;
    height: auto; /* Remove fixed height if necessary */
  }

  /* Scale down large text in left-col */
  .left-col h2 {
    font-size: 2.5rem;
  }

  .left-col p {
    font-size: 1rem;
  }
	#contact {
    padding-top: 60px;
}
	body .gform_wrapper {
    margin-top: 0px;

}
	.orange_content {
    opacity: 1;
		height:unset;
	 position: relative;
    
}
	.right-col{
		padding-top:30px;
	}
	
	
	.orange-content-wrapper {
    background-color: #C5ECBF;
    border-radius: 500px;
    aspect-ratio: 1;
		    min-width: 350px;
		padding:40px;
        overflow: hidden;
        margin: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
}
	.orange-label {
		text-align:center;
    position: relative;
    top: unset;
    left: unset;
    transform: unset;
    margin: 0;

}

  /* Reduce size/width requirements for orange overlays */
  .orange-desc {
    font-size: 1rem;
    min-width: auto;
    max-width: 100%;
    padding: 0 10px;
  }
  .orange-heading {
    font-size: 1.8rem;
	  max-width:250px;
  }

  /* Ensure form container shrinks properly on small screens */
  .gform_wrapper {
    width: 100% !important;
    padding: 0 10px;
  }
	
	
	div#content {
    max-width: 100%!important;
}


.wrap-770.main.clear {
    max-width: 100%!important;
}
	
    .wrapper {
   
    }
	#world {
		display:none;
	}
	
	
	
	 /* The parent section must have a large height 
     to allow enough scrolling for the horizontal movement */
  .pin-section-mobile {
    position: relative;
    /* Increase or decrease as needed; 400vh or more 
       ensures enough scroll space for 4 items */
    height: 550vh;
	  padding-top:20px;
  }

  /* The sticky container stays pinned in view while we scroll */
  .pin-container {
    position: sticky;
    top: 50%; 
    transform: translateY(-50%); 
    height: 100vh;
    overflow: hidden; /* hide overflow so we only see one "circle" at a time if needed */
  }

  .oranges_wrapper {
    display: flex;
    height: 100%;
    /* We'll translateX this element in JS to show each item horizontally */
    transform: translateX(0%);
gap: 30px;
  }
	
	
	.orange-content {
    position: relative;
    min-width: 300px;
    aspect-ratio: 1;
    overflow: hidden;
}

	

	
	
#lp_wrapper	svg {
    width: auto;
    height: 160vh;
    display: block;

}
	.text-blurb{
		max-width:45%;
			font-size:1.4rem;
	}
	
	.blurb1 {
		top:13%;
    right: 30px;
}
	
	.blurb2{
		top:43%;
		left:30px;
	}
	
	.blurb3{
		top:70%;
		right:30px;
	}
	
	  /* Path Styles */
    #thePath {
    
      stroke-width: 50;
      stroke-linecap: round;
    }
	
	
	
	#lp_wrapper .section_red h2 {
    color: #ffffff;
    margin-bottom: 20px;
	font-size:3.5rem;
	max-width:100%;
	line-height:1em;
}



#lp_wrapper .section_red .small_heading{
	font-size:2.5rem;
	line-height:1em;
	        margin: auto;
}
	

	
#lp_wrapper h2 p {
	margin:0px;
    line-height: 1em;
		font-size:2.5rem;
		padding-bottom:0px;

}
	
	#lp_wrapper .heading_english {
		font-size:2.6rem!important;

}
	
	#lp_wrapper .small_heading-english{
	font-size:1.6rem!important;
}	
	
h2.form_subheading{
  font-size: 1.5rem!important;
	
}
	
	
}







@media only screen and (min-width: 801px) and (max-width: 1023px) {

	html ::placeholder, html ::-webkit-input-placeholder {
 	color: #DF1923;
	font-family:'elza'!important;
	font-weight:700!important;
	font-size:1.5rem!important;
	opacity: 1!important;
	padding-top:10px!important;
	transform:translateY(0px);
}



body .gform_wrapper .gform_footer input.button, body .gform_wrapper .gform_footer input[type=submit], body .gform_wrapper .gform_footer input.button:focus, body .gform_wrapper .gform_footer input[type=submit]:focus {
    font-size: 1.5rem!important;
   
}

	
	
  /* Example: Scale down large headings */
  #lp_wrapper h1 {
    font-size: 5.5rem;
	  max-width:600px;
  }

  #lp_wrapper h2 {
    font-size: 5rem;
  }

	#lp_wrapper .subheading {
    color: #DF1923;
    font-size: 2.2rem!important;
    max-width: 800px;
}
	
  /* Example: Adjust paragraph font-size */
  #lp_wrapper p {
    font-size: 1.5rem;
    line-height: 1.5em;
  }

  /* Example: Adjust hero section padding and text alignment */
  .section_hero {
    padding: 40px 30px;
    text-align: left;
  }

  /* Center hero container elements */
  #lp_wrapper .container_hero {
    display: block;
    align-items: center;
	  				padding:40px 40px!important

  }
	

	
  #lp_wrapper .section_hero {
	min-height:calc(100vh - 100px);
	  
	}

  /* Adjust hero paragraph size */
  #lp_wrapper .section_hero p {
    font-size: 2.2rem;
  }
	
	#lp_wrapper .section_hero button{
		font-size:2rem;
	}

  /* Reduce padding in section_red and section_beige */
  #lp_wrapper .section_red,
  #lp_wrapper .section_beige,
	#lp_wrapper .section_pinned{
    padding: 60px 60px;
  }
	
	#drawSection{
		padding: 0px 40px!Important;
	}
	#lp_wrapper .section_draw-heading{
		padding:80px 40px!important;
	}
#lp_wrapper .section_draw-heading h2{
  text-align:center;
  font-size:5rem;

}
	
  /* Make the grid layout single-column */
  .container_grid-2 {
    display: block;
  }
	
  /* Each column becomes full-width */
  .left-col,
  .right-col {
    width: 100%;
    margin: 0 auto;
    height: auto; /* Remove fixed height if necessary */
  }
	


  /* Scale down large text in left-col */
  .left-col h2 {
    font-size: 5rem!important;
	  max-width:680px;
  }

  .left-col p {
    font-size: 2.2rem!important;
  }
	#contact {
    padding-top: 60px;
}
	body .gform_wrapper {
    margin-top: 0px;

}
	.orange_content {
    opacity: 1;
		height:unset;
	 position: relative;
    
}
	.right-col{
		padding-top:30px;
	}
	
	
	.orange-content-wrapper {
    background-color: #C5ECBF;
    border-radius: 500px;
    aspect-ratio: 1;
		    min-width: 500px;
				    max-width: 500px;
		    max-height: 500px;
				    min-height: 500px;
		padding:40px;
        overflow: hidden;
        margin: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
}
	.orange-label {
		text-align:center;
    position: relative;
    top: unset;
    left: unset;
    transform: unset;
    margin: 0;

}

  /* Reduce size/width requirements for orange overlays */
  .orange-desc {
    font-size: 1.5rem;
    min-width: auto;
    max-width: 100%;
    padding: 0 40px;
  }
  .orange-heading {
    font-size: 2.8rem;
	  max-width:340px;
  }

  /* Ensure form container shrinks properly on small screens */
  .gform_wrapper {
    width: 100% !important;
    padding: 0 10px;
  }
	
	
	div#content {
    max-width: 100%!important;
}


.wrap-770.main.clear {
    max-width: 100%!important;
}
	
    .wrapper {

    }
	#world {
		display:none;
	}
	
	
	
	 /* The parent section must have a large height 
     to allow enough scrolling for the horizontal movement */
  .pin-section-mobile {
    position: relative;
    /* Increase or decrease as needed; 400vh or more 
       ensures enough scroll space for 4 items */
    height: 550vh;
	  padding-top:20px;
  }

  /* The sticky container stays pinned in view while we scroll */
  .pin-container {
    position: sticky;
    top: 50%; 
    transform: translateY(-50%); 
    height: 100vh;
    overflow: hidden; /* hide overflow so we only see one "circle" at a time if needed */
  }

  .oranges_wrapper {
    display: flex;
    height: 100%;
    /* We'll translateX this element in JS to show each item horizontally */
    transform: translateX(0%);
gap: 30px;
  }
	
	
	.orange-content {
    position: relative;
    min-width: 300px;
    aspect-ratio: 1;
    overflow: hidden;
}

	

	
	
#lp_wrapper	svg {
    width: auto;
    height: 160vh;
    display: block;

}
	.text-blurb{
		max-width:45%;
			font-size:2.2rem!important;
	}
	
		.text-blurb p {

			font-size:2.2rem!important;
	}
	
	.blurb1 {
		top:13%;
    right: 30px;
}
	
	.blurb2{
		top:43%;
		left:30px;
	}
	
	.blurb3{
		top:70%;
		right:30px;
	}
	
	  /* Path Styles */
    #thePath {
    
      stroke-width: 50;
      stroke-linecap: round;
    }
	
	
	
	#lp_wrapper .section_red h2 {
    color: #ffffff;
    margin-bottom: 20px;
	font-size:3.5rem;
	max-width:100%;
	line-height:1em;
}

	#lp_wrapper .section_red h2 p{
			font-size:5rem;

	}

#lp_wrapper .section_red .small_heading{
	font-size:5rem;
	line-height:1em;
	        margin: auto;
}
	

	
#lp_wrapper h2 p {
	margin:0px;
    line-height: 1em;
		font-size:2.5rem;
		padding-bottom:0px;

}
	
	#lp_wrapper .heading_english {
		font-size:2.6rem!important;

}
	
	#lp_wrapper .small_heading-english{
	font-size:1.6rem!important;
}	
	
h2.form_subheading{
  font-size: 2.2rem!important;
	
}
	
	
}


</style>
