/**
 * Taylor Williams animated logo — roof draw + wordmark rise.
 */

.tw-logo-animated {
	--tw-logo-anim-color: #ffffff;
	display: block;
	line-height: 0;
}

.tw-logo-animated--on-light {
	--tw-logo-anim-color: #16181c;
}

.tw-logo-animated__svg {
	display: block;
	width: 100%;
	height: auto;
}

.tw-hero-logo .tw-logo-animated,
.tw-hero-logo .tw-logo-animated__svg {
	max-height: var(--tw-site-logo-max-height, var(--tw-hero-logo-max-height, clamp(3.35rem, 7.5vw, 4.5rem)));
	max-width: var(--tw-site-logo-max-width, var(--tw-hero-logo-max-width, min(100%, 22rem)));
}

.tw-home-hero .tw-hero-header .tw-logo-animated,
.tw-home-hero .tw-hero-header .tw-logo-animated__svg {
	max-height: var(--tw-home-logo-max-height, clamp(7.236rem, 16.2vw, 9.72rem));
	max-width: var(--tw-home-logo-max-width, min(100%, 47.52rem));
}

.tw-primary-menu__visual-logo .tw-logo-animated,
.tw-primary-menu__visual-logo .tw-logo-animated__svg,
.tw-primary-menu__panel-logo .tw-logo-animated,
.tw-primary-menu__panel-logo .tw-logo-animated__svg {
	max-height: clamp(3.25rem, 6.5vw, 4.75rem);
	max-width: min(100%, 18rem);
}

.tw-logo-animated .roof-stroke path {
	fill: none;
	stroke: var(--tw-logo-anim-color);
	stroke-width: 68;
	stroke-linejoin: round;
	stroke-linecap: round;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
}

.tw-logo-animated .roof-fill {
	fill: var(--tw-logo-anim-color);
	opacity: 0;
}

.tw-logo-animated .line {
	fill: var(--tw-logo-anim-color);
	opacity: 0;
	transform: translateY(26px);
	transform-box: fill-box;
	transform-origin: center;
}

.tw-logo-animated--animate:not(.tw-logo-animated--hold) .roof-stroke path {
	animation: tw-logo-draw 1s ease-in-out forwards;
}

.tw-logo-animated--animate:not(.tw-logo-animated--hold) .roof-fill {
	animation: tw-logo-fadein 0.45s ease forwards;
	animation-delay: 0.85s;
}

.tw-logo-animated--animate:not(.tw-logo-animated--hold) .line.l1 {
	animation: tw-logo-rise-in 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
	animation-delay: 1.15s;
}

.tw-logo-animated--animate:not(.tw-logo-animated--hold) .line.l2 {
	animation: tw-logo-rise-in 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
	animation-delay: 1.3s;
}

.tw-logo-animated--animate:not(.tw-logo-animated--hold) .line.l3 {
	animation: tw-logo-rise-in 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
	animation-delay: 1.45s;
}

@keyframes tw-logo-draw {
	to {
		stroke-dashoffset: 0;
	}
}

@keyframes tw-logo-fadein {
	to {
		opacity: 1;
	}
}

@keyframes tw-logo-rise-in {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Static / completed logo (animation disabled in markup) */
.tw-logo-animated.is-complete .roof-stroke path {
	stroke-dashoffset: 0;
}

.tw-logo-animated.is-complete .roof-fill,
.tw-logo-animated.is-complete .line {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.tw-logo-animated .roof-stroke path {
		animation: none !important;
		stroke-dashoffset: 0;
	}

	.tw-logo-animated .roof-fill,
	.tw-logo-animated .line {
		animation: none !important;
		opacity: 1;
		transform: none;
	}
}