:root {
  /* === Base Variables === */
  --heading--base: 1.125rem;
  --heading--vw-min: 320px;
  --heading--vw-max: 1920px;
  --heading--ratio-min: 1.13;
  --heading--ratio-max: 1.425;
  --test--step: calc((100vw - var(--heading--vw-min)) / (var(--heading--vw-max) - var(--heading--vw-min)));

  --heading--ratio: calc(
      var(--heading--ratio-min) + ( var(--heading--ratio-max) - var(--heading--ratio-min) ) *
      ( (100vw - var(--heading--vw-min) ) / ( var(--heading--vw-max) - var(--heading--vw-min) ) ) );

	--heading--ratio: calc(
  (
    var(--heading--ratio-min) +
    (var(--heading--ratio-max) - var(--heading--ratio-min)) *
    ((100vw - var(--heading--vw-min)) /
     (var(--heading--vw-max) - var(--heading--vw-min)))
  ) * 1px / 1px
);
	--test1: calc( 1000px - 320px );
/* Inverse fluid ratio for negative steps (shrinks with viewport) */
  --heading--ratio-inverse: calc(
      var(--heading--ratio-max) + (var(--heading--ratio-min) - var(--heading--ratio-max)) *
      ((100vw - var(--heading--vw-min)) / (var(--heading--vw-max) - var(--heading--vw-min))));

  /* === Heading Type Steps === */
  --tms--step--heading--minus-2: calc(var(--heading--base) / var(--heading--ratio-inverse) / var(--heading--ratio-inverse));
  --tms--step--heading--minus-1: calc(var(--heading--base) / var(--heading--ratio-inverse));

  --tms--step--heading--minus-2: 12px;
  --tms--step--heading--minus-1: 14px;

  --tms--step--heading--0: var(--heading--base);
  --tms--step--heading--1: calc(var(--heading--base) * pow(var(--heading--ratio), 1));
  --tms--step--heading--2: calc(var(--heading--base) * pow(var(--heading--ratio), 2));
  --tms--step--heading--3: calc(var(--heading--base) * pow(var(--heading--ratio), 3));
  --tms--step--heading--4: calc(var(--heading--base) * pow(var(--heading--ratio), 4));
  --tms--step--heading--5: calc(var(--heading--base) * pow(var(--heading--ratio), 5));
  --tms--step--heading--6: calc( var(--body--base) * pow( 1.4, 6 ) );
  --tms--step--heading--6: calc(var(--heading--base) * pow(var(--heading--ratio), 6));
  --tms--step--heading--7: calc(var(--heading--base) * pow(var(--heading--ratio), 7));
  --tms--step--heading--8: calc(var(--heading--base) * pow(var(--heading--ratio), 8));
  --tms--step--heading--9: calc(var(--heading--base) * pow(var(--heading--ratio), 9));

  /* === Base Variables === */
  --body--base: 1.125rem;
  --body--vw-min: 320px;
  --body--vw-max: 1920px;
  --body--ratio-min: 1.13;
  --body--ratio-max: 1.26;

  --body--ratio: calc(
      var(--body--ratio-min) + (var(--body--ratio-max) - var(--body--ratio-min)) *
      ((100vw - var(--body--vw-min)) / (var(--body--vw-max) - var(--body--vw-min))));
  /* Inverse fluid ratio for negative steps (shrinks with viewport) */
    --body--ratio-inverse: calc(
        var(--body--ratio-max) + (var(--body--ratio-min) - var(--body--ratio-max)) *
        ((100vw - var(--body--vw-min)) / (var(--body--vw-max) - var(--body--vw-min))));
    
    /* === Body Type Steps === */
    --tms--step--body--minus-2: calc(var(--body--base) / var(--body--ratio-inverse) / var(--body--ratio-inverse));
    --tms--step--body--minus-1: calc(var(--body--base) / var(--body--ratio-inverse));

	/* Small sizes overriding */
	--tms--step--body--minus-2: 12px;
	--tms--step--body--minus-1: 14px;
	
  --tms--step--body--0: var(--body--base);
  --tms--step--body--1: calc(var(--body--base) * pow(var(--body--ratio), 1));
  --tms--step--body--2: calc(var(--body--base) * pow(var(--body--ratio), 2));
  --tms--step--body--3: calc(var(--body--base) * pow(var(--body--ratio), 3));
  --tms--step--body--4: calc(var(--body--base) * pow(var(--body--ratio), 4));
  --tms--step--body--5: calc(var(--body--base) * pow(var(--body--ratio), 5));
  --tms--step--body--6: calc( var(--body--base) * pow( 1.4, 6 ) );
  --tms--step--body--6: calc(var(--body--base) * pow(var(--body--ratio), 6));
  --tms--step--body--7: calc(var(--body--base) * pow(var(--body--ratio), 7));
  --tms--step--body--8: calc(var(--body--base) * pow(var(--body--ratio), 8));
  --tms--step--body--9: calc(var(--body--base) * pow(var(--body--ratio), 9));

  /* Heading presets	 */
      --wp--preset--font-size--very-small: var(--tms--step--heading--minus-2) ;
  	  --wp--preset--font-size--small: var(--tms--step--heading--minus-1) ;        
  	  --wp--preset--font-size--medium:  var(--tms--step--heading--0) ;                    
  	  --wp--preset--font-size--large:  var(--tms--step--heading--1) ;        
  	  --wp--preset--font-size--x-large:  var(--tms--step--heading--2);    
  	  --wp--preset--font-size--xx-large: var(--tms--step--heading--3);    
  	  --wp--preset--font-size--3-x-large:  var(--tms--step--heading--4);    
  	  --wp--preset--font-size--4-x-large:  var(--tms--step--heading--5);    
  	  --wp--preset--font-size--5-x-large:  var(--tms--step--heading--6);        
  	  --wp--preset--font-size--6-x-large:  var(--tms--step--heading--7);     
  	  --wp--preset--font-size--7-x-large:  var(--tms--step--heading--8);     
  	  --wp--preset--font-size--8-x-large:  var(--tms--step--heading--9);    
  	
  /*  Body presets	 */
  		--wp--preset--font-size--body-very-small: var(--tms--step--body--minus-2);  
  		--wp--preset--font-size--body-small: var(--tms--step--body--minus-1);        
  	  --wp--preset--font-size--body-medium:  var(--tms--step--body--0) ;                    
  	  --wp--preset--font-size--body-large:  var(--tms--step--body--1) ;        
  	  --wp--preset--font-size--body-x-large:  var(--tms--step--body--2);    
  	  --wp--preset--font-size--body-xx-large: var(--tms--step--body--3);    
  	  --wp--preset--font-size--body-3-x-large:  var(--tms--step--body--4);    
  	  --wp--preset--font-size--body-4-x-large:  var(--tms--step--body--5);    
  	  --wp--preset--font-size--body-5-x-large:  var(--tms--step--body--6);        
  	  --wp--preset--font-size--body-6-x-large:  var(--tms--step--body--7);     
  	  --wp--preset--font-size--body-7-x-large:  var(--tms--step--body--8);     
  	  --wp--preset--font-size--body-8-x-large:  var(--tms--step--body--9);  

    --wp--preset--spacing--resp: clamp(8px, 1.66vw, 32px);
  
}
/* Webkit browsers (Chrome, Safari, Edge) */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: #ff0000;
}

::-webkit-scrollbar-thumb {
  background: #41914e;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background: #9e2f66;
}

/* Firefox */
* {
  /* scrollbar-width: thin; */
  scrollbar-color:  var(--wp--preset--color--accent-1) gray ; /* thumb track */
}
.bgr-grid {
	position:absolute;
	display:grid;
}
.bgr-grid ~ * {
	position:relative;
}
.grid-cell {
    transition: background-color 1.5s ease-out;
    /* cursor: default; */
  }

  .grid-cell.active {
    transition: background-color 0.1s ease-in;
  }

.viewport-exit {
	transform-origin: 50% 100%;
}

.cta {
	font-size:clamp(18px, 1.25vw, 24px) !important;
	font-weight: 400;
	transform:translate(0px, 0px); 
	transition: transform .2s ease-out;
}
.cta:hover {
	/* filter: drop-shadow( -6px 0px 0px var(--wp--preset--color--base)); */
	/* transform:translate(8px, 0px);  */
	font-weight: 400;
}
.cta .split-line {
	position:relative;
}


.cta.dark:hover p {
	color:var(--wp--preset--color--contrast) !important;
	/* font-weight: 700 !important; */
}


.cta .split-line::before {
	content:"";
	/* border-radius:16px; */
	position:absolute;
	background-color: var(--wp--preset--color--base-2);
	top:50%;
	left:50%;
	height:calc(100% + 0.2em);
	transform:translate(-50%, -50%);
	padding: inherit;
	width:0%;
	transition: width .2s ease-out;
}
.cta.dark .split-line::before {
	content:"";
	/* border-radius:16px; */
	position:absolute;
	background-color: var(--wp--preset--color--base-2);
	top:50%;
	left:50%;
	height:calc(100% + 0.2em);
	transform:translate(-50%, -50%);
	padding: inherit;
	width:0%;
	transition: width .2s ease-out;
}
.cta:hover .split-line::before {
	
	width:calc(100% + 0.2em);	
}
.cta p {
	--extra--top:0px;
	--extra--left:-4px;
	padding-top: calc(var(--wp--preset--spacing--60) + var(--extra--top));
	padding-right: calc(var(--wp--preset--spacing--70) + var(--extra--left));
	padding-bottom: calc(var(--wp--preset--spacing--60) + var(--extra--top));
	padding-left: calc(var(--wp--preset--spacing--70) + var(--extra--left));
	position:relative;
	overflow: hidden;
	text-wrap: nowrap  !important;
	white-space: nowrap !important;
	transition: padding .2s ease-out;
	text-box-edge: cap alphabetic;
    text-box-trim: trim-both;
}
.cta:hover p {
	--extra--left:0px;
}
.cta img {
    --right:0px;
    height:90%;
    width:auto;
    aspect-ratio: 1;
    position:absolute;
    right: calc(var(--right) - var(--wp--preset--spacing--20));
    transform: translateX(100%);
    transition: right .2s ease-out;;
}
.cta:hover img {
    --right:-8px;
}
a {
	text-decoration: none !important;
	text-underline-offset: .1em;
}
 a:hover * {
	/* text-decoration: solid underline 2px currentColor !important; */
}
a:focus {
	border-radius:5000px;
	outline-offset: 2px;
}
footer a:focus {
	outline-offset: 8px;
}

header {
	--border-radius:16px;
    position:fixed;
    top:0px;
    left:0px;
    right:0px;
    z-index:9999;
	padding-bottom:var(--border-radius);
}
header .padding {
	transition: padding .4s ease-out;
}

header .logo-anchor {
	/* --border-radius:20px; */
	margin-left:calc(var(--wp--preset--spacing--resp) / 2 );
	margin-top:calc(var(--wp--preset--spacing--resp) / 2 );
	background-color:var(--wp--preset--color--accent-1);
	border-radius: 5000px;
	position:relative;
    z-index: 100;
}
/* header .logo-anchor::before {
	content:"";
	background-color:transparent;
	position:absolute;
	top: 0;
	left: 100%;
	height: calc(var(--border-radius) * 2);
	width: var(--border-radius);
	border-top-left-radius: var(--border-radius);
	box-shadow: 0 calc(var(--border-radius) * -1)  0 0 var(--wp--preset--color--accent-1);
} */
/* header .logo-anchor::after {
	content:"";
	background-color:transparent;
	position:absolute;
	top: 100%;
	left: 0;
	height: calc(var(--border-radius) * 2);
	width: var(--border-radius);
	border-top-left-radius: var(--border-radius);
	box-shadow: 0 calc(var(--border-radius) * -1) 0 0 var(--wp--preset--color--accent-1);
} */
header .logo-anchor img {
	width:clamp(50px,  4.166vw, 80px) !important;
	transition: width .3s ease-out;
}
header.scrolled .logo-anchor img{
	width:clamp(50px,  4.166vw, 60px) !important;
}
header.scrolled .padding {
	padding-top: 8px !important;
	padding-bottom:8px !important;
}
header .row {
	align-items:center;
}
header .nav-wrapper {
  position: relative;
}

header .nav-toggle {
  display: none;
}
header .nav-container {
	/* --border-radius:16px; */
	transition:padding .2s ease-out;
	background-color:var(--wp--preset--color--accent-1);
	margin-right:calc(var(--wp--preset--spacing--resp) / 2 );
	margin-top:calc(var(--wp--preset--spacing--resp) / 2 );
	border-radius: 50000px;
	position:relative;
	/* filter: drop-shadow(-2px 2px  4px var(--wp--preset--color--contrast)); */
}

header .nav-toggle-label {
  display: none;
  flex-direction: column;
  cursor: pointer;
  width: 30px;
  gap: 5px;
  padding: 10px;
	position:relative;
	z-index: 100;
	pointer-events: auto;
}

header .nav-toggle-label span {
  height: 3px;
  width: 100%;
  background: var(--wp--preset--color--contrast);
  border-radius: 2px;
}
header nav ul {
	display:flex;
	font-weight:400;
	list-style-type: none;
	margin: 0;
	padding: 0;
	column-gap: var(--wp--preset--spacing--60);
	column-gap: max(4px, 1.66vw);
	pointer-events: auto;
}
header nav ul li {
	display: flex;
}
header nav ul li a {
	position:relative;

}
header nav ul li:first-child > a {
	width:calc(4.5em + .8em);
}
header nav ul li:nth-child(2) > a {
	width:calc(6.25em + 1em);
} 
header nav ul li a::before {
	content:"";
	position:absolute;
	background-color: var(--wp--preset--color--base);
	top:0%;
	left:50%;
	height:100%;
	width:0%;
	transform:translateX(-50%);
	transition: width .2s ease-out;
	
}
header nav ul li a:hover {
	gap:calc(var(--wp--preset--spacing--10) + 6px);
	transition: gap .2s ease-out;
}
header nav ul li a:hover::before{
	content:"";	
	width:100%;
}
header nav ul li a:focus {
	outline:unset;
}

header nav ul li a:focus , header nav ul li:has(:focus) a {
	border-radius:clamp(4px, 0.41vw, 16px);
	/* border-radius:5000px; */
	outline: 2px solid var(--wp--preset--color--base);
	outline-offset:8px;
/* 	outline-color: var(--wp--preset--color--contrast); */
}
header nav ul li a:hover p {
	letter-spacing: 0.05em;
}
header nav ul li a:focus:hover p {
	outline-color: var(--wp--preset--color--contrast);
}
header nav ul li a p {
	letter-spacing: -.02em;
	display:inline-block;
	margin:0px;
	/* padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--60); */
	/* padding: clamp(4px, 0.83vw, 16px) clamp(8px, 1.66vw, 32px); */
	text-decoration:none;
	text-wrap:nowrap;
	border-radius:clamp(4px, 0.83vw, 16px);
	border-radius:5000px;
	color:var(--wp--preset--color--contrast);
	box-shadow: 0px 0px  hsl(from var(--wp--preset--color--accent-4) h s l / 0);
	transform:translate(0px,0px);
	transition:box-shadow .1s ease-out, background-color .1s  ease-out, color .1s ease-out,  transform .1s ease-out,
	 letter-spacing .1s ease-out;
}



header .site-logo-animated .logo-image-wrapper .logo-image {
	width: max( 22px, 2.18vw);
	height: max( 22px, 2.18vw);
	aspect-ratio:1;
}
.site-logo-animated .logo-image-wrapper .logo-image {
	width:53px;
	height:53px;
	aspect-ratio:1;
}
.site-logo-animated  .logo-text {
	width: max(80px, 8.645vw);
	height:auto;
	aspect-ratio: 166/44;
	
}
.site-logo-animated  .logo-text  figure {
	margin:0px;
}

/* Footer CSS */
footer section {
	 overflow-x: clip; 
	overflow-y: visible; 
}
footer .svg-container {
	height:100%;
	width: 100%;
	min-width:1000px;
	box-sizing: border-box;
	position:absolute;
	/* top:5vw;
	left:5vw; */
	transform:translateX(-50%);
	left:50%;
	bottom:0px;
	
}
footer svg.main, footer img.main {
	top:0px;
	position:absolute;
	left:0px;
	right:0px;
	bottom:0px;
	padding:0px 5vw;
	height: 100%;
	width: 100%;
	box-sizing: border-box;
}
footer .svg-container svg.footer-shadow, footer .svg-container img.footer-shadow{
	position:absolute;
	left:0px;
	right:0px;
	padding:0px 5vw;
	bottom:0px;
	height: 110%;
	width: 100%;
	box-sizing: border-box;
	/* height:calc(100% + 25px); */
}
footer ul {
	list-style: none;

}
footer ul p {
	text-box-edge: cap alphabetic;
    text-box-trim: trim-both;
}
/* End Footer CSS */

@media (max-width: 1000px) {
	:root {
		--heading--base: 1rem;
		--body--base: 1rem;
	}
	.cta p {
		--extra--top: -4px;
		--extra--left: -10px;
	}
}

@media (max-width: 900px) {
	 header  .nav-toggle-label {
    display: flex;
    }
	
  header .nav-menu {

    display: none;
    flex-direction: column;
    /* background: hsl( from var(--wp--preset--color--accent-1) h s l / 100% ); */
	background:  var(--wp--preset--color--accent-1) ;
	/* backdrop-filter: blur(4px); */
    position: fixed;
	  height:100vh;
	  box-sizing: border-box;
    top: 0;
    left: 0;
	right:0;
/*     bottom:0; */
    padding: 0px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
	z-index:99;
	align-items: center;
	justify-content: center;
    row-gap: 0px;
    /* padding-top: 80px; */
	
  }
	header.header-static .nav-menu {
		height:unset;
	}
	header .nav-menu li {
		/* border-bottom:1px solid hsl( from var(--wp--preset--color--contrast) h s l / 20% ); */
		width:100%;
		justify-content: center;
	}
	header .nav-menu li a {		
		padding:32px 8px;
		
		width:auto !important;
		flex-wrap: nowrap;
	}
	header .nav-menu li a p {
		font-size: var(--wp--preset--font-size--4-x-large);
		font-weight: 900 !important;
		font-style: italic !important;
		letter-spacing: -.03em;
		text-transform: uppercase;
		text-box-edge: cap alphabetic;
		text-box-trim: trim-both;
	}
	header .nav-menu li:last-child {
		border-bottom:unset;
	}
  header .nav-toggle:checked + .nav-toggle-label + .nav-menu {
    display: flex;
  }
	footer .container-white { 
/* 		 flex-direction:column;    */
		padding: calc( var(--wp--preset--spacing--resp) * 2 ) !important;
		gap:32px;
	}
	
	footer .container-white .left {
		display: flex;
    	grid-template-columns: 2fr 1fr;
		align-items:center;
		justify-content:center;
		gap:16px !important;
	}
	footer .container-white .left > figure {
		padding:0px 16px 8px 16px;
		
	}
	footer .container-white .left img {
		min-height: 40px;
    	min-width: 30px;
	}
	footer .container-white .right  {
		    justify-content: space-around;
	} 
	
}