.wp-block-howsick-site-header{
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:var(--wp--custom--z-index--50);
	height:var(--wp--custom--header--height);
	padding:var(--wp--preset--spacing--6) 0;
}

.wp-block-howsick-site-header .nav-bar{
		position:relative;
		z-index:1;
		display:flex;
		align-items:center;
		justify-content:space-between;
		max-width:var(--wp--custom--max-width--7-xl);
		height:60px;
		margin-inline:auto;

		border-radius:1000px;
		background-color:color-mix(
			in srgb,
			var(--wp--preset--color--warm-ivory) 0%,
			transparent
		);
		box-shadow:0 4px 24px hsl(0 0% 0% / calc(var(--scroll-progress, 0) * 0.12));
		transition:background-color var(--wp--custom--transition--duration--300) var(--wp--custom--transition--easing--out), backdrop-filter var(--wp--custom--transition--duration--300) var(--wp--custom--transition--easing--out);
	}

.wp-block-howsick-site-header .inner{
		display:flex;
		align-items:center;
		justify-content:space-between;
		width:100%;
		height:100%;
		padding-inline:calc(
			var(--wp--preset--spacing--5) * (0.5 * var(--scroll-progress, 0) + 0.5)
		);
	}

.wp-block-howsick-site-header.is-scrolled .nav-bar{
			background-color:color-mix(
				in srgb,
				var(--wp--preset--color--warm-ivory) 75%,
				transparent
			);
			backdrop-filter:blur(16px) saturate(180%);
			-webkit-backdrop-filter:blur(16px) saturate(180%);
		}

.wp-block-howsick-site-header .logo{
		display:flex;
		align-items:center;
		gap:var(--wp--preset--spacing--2);
		text-decoration:none;
		flex-shrink:0;
		color:var(--wp--preset--color--muted-rose);
	}

:is(.wp-block-howsick-site-header .logo) svg{
			display:block;
			width:24px;
			height:auto;
			fill:var(--wp--preset--color--dark-mud);
		}

.wp-block-howsick-site-header .brand-name{
		font-family:var(--wp--preset--font-family--tenor-sans);
		font-size:var(--wp--preset--font-size--base);
		color:var(--wp--preset--color--muted-rose);
		text-transform:uppercase;
		letter-spacing:var(--wp--custom--letter-spacing--wider);
		white-space:nowrap;
	}

.wp-block-howsick-site-header .nav{
		display:none;
		position:absolute;
		left:50%;
		top:0;
		bottom:0;
		transform:translateX(-50%);
		align-items:center;
	}

.wp-block-howsick-site-header .menu{
		list-style:none;
		margin:0;
		padding:0;
		display:flex;
		gap:var(--wp--preset--spacing--8);
	}

:is(.wp-block-howsick-site-header .menu) a{
			font-family:var(--wp--preset--font-family--tenor-sans);
			font-size:var(--wp--preset--font-size--sm);
			color:var(--wp--preset--color--muted-rose);
			text-decoration:none;
			letter-spacing:var(--wp--custom--letter-spacing--wider);
			text-transform:uppercase;
			white-space:nowrap;
			transition:opacity var(--wp--custom--transition--duration--200) var(--wp--custom--transition--easing--out);
		}

:is(:is(.wp-block-howsick-site-header .menu) a):hover{
				opacity:0.7;
			}

.wp-block-howsick-site-header .actions{
		display:flex;
		align-items:center;
		gap:var(--wp--preset--spacing--4);
		flex-shrink:0;
	}

.wp-block-howsick-site-header .cta-btn{
		position:absolute;
		right:calc(var(--wp--preset--spacing--3) * var(--scroll-progress, 0));
		top:50%;
		transform:translateY(-50%);
		display:flex;
		align-items:center;
		justify-content:center;
		width:36px;
		height:36px;
		padding-inline:0;
		border-radius:1000px;
		background-color:var(--wp--preset--color--deep-sage);
		color:var(--wp--preset--color--warm-ivory);
		font-family:var(--wp--preset--font-family--tenor-sans);
		font-size:var(--wp--preset--font-size--sm);
		text-transform:uppercase;
		letter-spacing:var(--wp--custom--letter-spacing--wider);
		text-decoration:none;
		white-space:nowrap;
		transition:opacity var(--wp--custom--transition--duration--200) var(--wp--custom--transition--easing--out);
	}

:is(.wp-block-howsick-site-header .cta-btn):hover{
			opacity:0.85;
		}

:is(.wp-block-howsick-site-header .cta-btn) .cta-label{
			display:none;
		}

:is(.wp-block-howsick-site-header .cta-btn) .cta-icon{
			display:flex;
			align-items:center;
			justify-content:center;
		}

:is(:is(.wp-block-howsick-site-header .cta-btn) .cta-icon) svg{
				display:block;
				width:20px;
				height:20px;
			}

.wp-block-howsick-site-header .burger{
		display:flex;
		flex-direction:column;
		gap:5px;
		background:none;
		border:none;
		cursor:pointer;
		padding:var(--wp--preset--spacing--2);
	}

.wp-block-howsick-site-header .bar{
		display:block;
		width:20px;
		height:1px;
		background-color:var(--wp--preset--color--muted-rose);
		transition:transform var(--wp--custom--transition--duration--300) var(--wp--custom--transition--easing--in-out), opacity var(--wp--custom--transition--duration--300) var(--wp--custom--transition--easing--in-out), background-color var(--wp--custom--transition--duration--300) var(--wp--custom--transition--easing--out);
	}

.wp-block-howsick-site-header.menu-open .bar:nth-child(1){
			transform:translateY(6px) rotate(45deg);
		}

.wp-block-howsick-site-header.menu-open .bar:nth-child(2){
			opacity:0;
		}

.wp-block-howsick-site-header.menu-open .bar:nth-child(3){
			transform:translateY(-6px) rotate(-45deg);
		}

.wp-block-howsick-site-header .drawer{
		display:none;
		position:fixed;
		inset:0;
		background-color:var(--wp--preset--color--soft-oat);
		z-index:0;
		align-items:center;
		justify-content:center;
		opacity:0;
	}

.is-open:is(.wp-block-howsick-site-header .drawer){
			display:flex;
			animation:ani-drawer-in var(--wp--custom--transition--duration--500) var(--wp--custom--transition--easing--out) forwards;
		}

.wp-block-howsick-site-header .drawer-menu{
		list-style:none;
		margin:0;
		padding:0;
		display:flex;
		flex-direction:column;
		align-items:center;
		gap:var(--wp--preset--spacing--8);
	}

:is(.wp-block-howsick-site-header .drawer-menu) a{
			font-family:var(--wp--preset--font-family--tenor-sans);
			font-size:var(--wp--preset--font-size--2xl);
			color:var(--wp--preset--color--dark-mud);
			text-decoration:none;
			text-transform:uppercase;
			letter-spacing:var(--wp--custom--letter-spacing--wider);
			transition:color var(--wp--custom--transition--duration--200) var(--wp--custom--transition--easing--out);
		}

:is(:is(.wp-block-howsick-site-header .drawer-menu) a):hover{
				color:var(--wp--preset--color--muted-rose);
			}

@media (min-width: 48rem){
		.wp-block-howsick-site-header .inner{
			padding-inline:calc(
				var(--wp--preset--spacing--6) * var(--scroll-progress, 0)
			);
		}

		.wp-block-howsick-site-header .nav{
			display:flex;
		}
		.wp-block-howsick-site-header .cta-btn{
			width:auto;
			padding-inline:var(--wp--preset--spacing--5);
		}

			:is(.wp-block-howsick-site-header .cta-btn) .cta-label{
				display:inline;
			}

			:is(.wp-block-howsick-site-header .cta-btn) .cta-icon{
				display:none;
			}
	}

@keyframes ani-drawer-in{
	0%{
		opacity:0;
	}
	100%{
		opacity:1;
	}
}