/* Variables / Base Styles */

:host, :root {

	--oat-white: #F4EFE6;
    --slate-black: #1B1B1B;

    --terracotta: #D86044;
	--pale-autumn: #FA9370;
	--ocean-teal: #39676C;
	--soft-aqua: #72A3A0;
	--rose: #C15262; 
	--blossom: #EFB4B9;
	--sunrise-orange: #E5803A;
	--sand: #FFA06A;
	--fireside-red: #C33B32;
	--coral: #E1695A;
	--fern: #4E725E;
	--spring-green: #AEC29C;

	--espresso: #5B2727;
	--forrest: #2F3F2F;
	--stone: #13343A; 

	--green-breeze: #EBECD6;
	--pistachio: #B5B592;
	--sky-blue: #D8E6EF;
	--mellow-amber: #F3BC72;

	--transition: 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95);
	--body-font: 'Chivo', sans-serif;

}

html, body {
  overscroll-behavior: none;
}

.rvd-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    column-gap: 20px;
	width: calc(100vw - 60px);
	max-width: 1440px;
	margin: 0 auto;
} 

shopify-account::part(dialog) {
  border-radius: 0 !important;
}

.site-container {
    width: calc(100vw - 60px);
	max-width: 1440px;
	margin: 0 auto;
} 

/* Typography */

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	text-wrap: pretty;
}

.paragraph > * {
	font-family: var(--body-font);
}

p {
    margin: 0;
    margin-bottom: 1.1em;

    &:last-of-type {
        margin-bottom: 0;
    }

    &.large {
        /* 24/32px in rem */
    	font-size: clamp(1.5rem, 0.781vw + 1.219rem, 2rem);
        line-height: 120%;
		letter-spacing: 0;
    }

	&.small {
        /* 12px in rem */
    	font-size: 0.75rem;
        line-height: 140%;
    }

}

/* Custom Buttons */

a {

	&.btn-primary,
	&.btn-secondary,
	&.btn-link {
		/* 16/18px in rem */
		display: inline-block;
  		text-align: center;
		/* 16/18px in rem */
		font-size: clamp(1rem, 0.195vw + 0.93rem, 1.125rem);
		font-style: normal;
		font-weight: 500;
		letter-spacing: 0.2px;
		text-decoration: none;
	}

	&.btn-primary {
		transition: background-color var(--transition); 
		padding: 10px 20px;
		background-color: var(--slate-black);
		color: var(--oat-white);

		@media (hover: hover) {
			
			&:hover {
				background-color: var(--terracotta);
			}

		}

	}

	&.btn-secondary,
	&.btn-link {
		cursor: pointer;
		position: relative;
		white-space: nowrap;
		color: inherit;
		line-height: 120%;

		&::before {
			content: '';
			position: absolute;
			width: 100%;
			height: 1px;
			background: currentColor;
			bottom: -2px;
			left: 0;
			pointer-events: none;
			transform-origin: 0% 50%;
			transform: scale3d(1, 1, 1);
			transition: transform 0.4s;
		}

		@media (hover: hover) {
			
			&:hover {

				&::before {
					transform-origin: 100% 50%;
					transform: scale3d(0, 1, 1);
				}

			}

		}

	}

}

.cta-container {

	a {
		&.btn-secondary {
			align-self: anchor-center;
		}
	}

}

.underline {
	cursor: pointer;
	position: relative;
	white-space: nowrap;
	color: inherit;

	&::before {
		content: '';
		position: absolute;
		width: 100%;
		height: 1px;
		background: currentColor;
		bottom: -3px;
		left: 0;
		pointer-events: none;
		transform-origin: 100% 50%;
		transform: scale3d(0, 1, 1);
		transition: transform 0.4s;
	}

	@media (hover: hover) {
		
		&:hover {

			&::before {
				transform-origin: 0% 50%;
				transform: scale3d(1, 1, 1);
			}

		}

	}

}


/* Header Styls */

#header-component {
	padding-block: 8px;
}

.header-menu {

	.menu-list__link-title {
		font-family: var(--body-font);
		font-size: 16px;
		font-style: normal;
		font-weight: 500;
		line-height: 120%; /* 19.2px */
		letter-spacing: 1px;
		text-transform: uppercase;
		padding-inline: 40px;
	}

}

/* Custom Text - Accent / Product Title */

.text-block {

	&.accent {

		p {
			font-family: var(--body-font);
			/* 14/18px in rem */
			font-size: clamp(0.938rem, 0.292vw + 0.833rem, 1.125rem);
			font-weight: 600;
			line-height: 100%;
			letter-spacing: 1px;
			text-transform: uppercase;
		}
	
	}

	&.product-card-title {

		p {
			font-family: var(--body-font);
			/* 16/18px in rem */
			font-size: clamp(1rem, 0.246vw + 0.879rem, 1.125rem);
			font-weight: 500;
			line-height: 130%;
			letter-spacing: 0.18px;
			text-transform: uppercase;
		}

	}

}

/* Custom Background Colour Settings */

.section {

	&.section--full-width {

		&.no-bg {background: none !important; color: var(--stone); p {color: var(--stone);}}
		&.terracotta-bg {background: var(--terracotta) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.pale-autumn-bg {background: var(--pale-autumn) !important; color: var(--stone); p {color: var(--stone);}}
		&.ocean-teal-bg {background: var(--ocean-teal) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.soft-aqua-bg{background: var(--soft-aqua) !important; color: var(--stone); p {color: var(--stone);}}
		&.rose-bg {background: var(--rose) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.blossom-bg {background: var(--blossom) !important; color: var(--stone); p {color: var(--stone);}}
		&.sunrise-orange-bg {background: var(--sunrise-orange) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.sand-bg {background: var(--sand) !important; color: var(--stone); p {color: var(--stone);}}
		&.fireside-red-bg {background: var(--fireside-red) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.coral-bg {background: var(--coral) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.fern-bg {background: var(--fern) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.spring-green-bg {background: var(--spring-green) !important; color: var(--stone); p {color: var(--stone);}}
		&.espresso-bg {background: var(--espresso) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.forrest-bg {background: var(--forrest) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.stone-bg {background: var(--stone) !important; color: var(--oat-white); p {color: var(--oat-white);}}
		&.green-breeze-bg {background: var(--green-breeze) !important; color: var(--stone); p {color: var(--stone);}}
		&.pistachio-bg {background: var(--pistachio) !important; color: var(--stone); p {color: var(--stone);}}
		&.sky-blue-bg {background: var(--sky-blue) !important; color: var(--stone); p {color: var(--stone);}}
		&.mellow-amber-bg {background: var(--mellow-amber) !important; color: var(--stone); p {color: var(--stone);}}

	}

	&.section--page-width {

		&.no-bg .group-block-content {background: none !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.terracotta-bg .group-block-content {background: var(--terracotta) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.pale-autumn-bg .group-block-content {background: var(--pale-autumn) !important; color: var(--stone); padding-inline: var(--page-margin) !important;}
		&.ocean-teal-bg .group-block-content {background: var(--ocean-teal) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.soft-aqua-bg .group-block-content {background: var(--soft-aqua) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.rose-bg .group-block-content {background: var(--rose) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.blossom-bg .group-block-content {background: var(--blossom) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.sunrise-orange-bg .group-block-content {background: var(--sunrise-orange) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.sand-bg .group-block-content {background: var(--sand) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.fireside-red-bg .group-block-content {background: var(--fireside-red) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.coral-bg .group-block-content {background: var(--coral) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.fern-bg .group-block-content {background: var(--fern) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.spring-green-bg .group-block-content {background: var(--spring-green) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.espresso-bg .group-block-content {background: var(--espresso) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.forrest-bg .group-block-content {background: var(--forrest) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.stone-bg .group-block-content {background: var(--stone) !important; color: var(--oat-white); p {color: var(--oat-white);} padding-inline: var(--page-margin) !important;}
		&.green-breeze-bg .group-block-content {background: var(--green-breeze) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.pistachio-bg .group-block-content {background: var(--pistachio) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.sky-blue-bg .group-block-content {background: var(--sky-blue) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}
		&.mellow-amber-bg .group-block-content {background: var(--mellow-amber) !important; color: var(--stone); p {color: var(--stone);} padding-inline: var(--page-margin) !important;}

	}

}

.section.media-with-content {
	h2 {
		width: min(100%, 800px);
	}
}

.shopify-section {

	&:has(.no-bg) {
		background: var(--oat-white) !important;
	}

}

/* Custom Component -  Product Cards */

.product-card {
	position: relative;

	.product-media {
		overflow: hidden;

		img {
			transform: scale(1.04);
			transition: transform 0.4s ease-in-out;
		}

	}

	.group-block {
		flex-grow: 1;

		rte-formatter.text-block {
			flex-grow: 1;

			p {
				font-size: 14px;
				font-style: normal;
				font-weight: 400;
				line-height: 140%; /* 19.6px */
				letter-spacing: 0.2px;
				max-width: 80%;
			}

		}

	}

	.product-card__tag {
		position: absolute;
		top: 20px;
		left: 20px;
		background: var(--oat-white);
		color: var(--slate-black);
		font-size: 14px;
		font-style: normal;
		font-weight: 400;
		line-height: 1;
		letter-spacing: 0.2px;
		padding: 10px 16px;
	}

	.btn-primary {
		transition: background-color 0.2s ease-in-out;
	}

	@media (hover: hover) {
							
		&:hover {

			.product-media {

				img {
					transform: scale(1);
				}

			}

			.btn-primary {
				background-color: var(--terracotta);
			}

		}

	}
	
}

/* Custom Template -  Blog Post(s) */

.blog-post-hero-inner {
	position: relative;

	.blog-header {
		display: flex;
		flex-direction: column;
		gap: 20px;
		padding-block: 40px;
		width: 100%;
		max-width: 1000px;
		margin: 0 auto;

		@media screen and (min-width: 768px) {
			padding-top: 60px;
			padding-bottom: 0px;
		}

		h1 {
			/* 28/42px in rem */
			font-size: clamp(1.75rem, 1.367vw + 1.258rem, 2.625rem);
			line-height: 115%;
		}

		p {
			/* 18/21px in rem */
			font-size: clamp(1.125rem, 0.294vw + 1.019rem, 1.313rem);
			line-height: 135%;
		}

		.blog-post-details {
			margin: 0;
			padding: 0;
		}

	}

	&:has(.blog-post-featured-image) {
		display: grid;

		@media screen and (min-width: 768px) {

			.blog-post-featured-image {
				position: relative;

				&::after {
					content: "";
					display: block;
					position: absolute;
					inset: 0;
					background: 1B1B1B;
					background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(27, 27, 27, 0) 15%, rgba(27, 27, 27, 0.05) 35%, rgba(27, 27, 27, 0.35) 100%);
				}
				
			}

			.shopify-block,
			.blog-header {
				grid-column: 1 / 2;
				grid-row: 1;
			}

			.blog-header {
				padding: 40px;
				position: relative;
				z-index: 1;
				color: var(--oat-white);
				align-self: end;

				.blog-post-details {
					color: var(--oat-white);
				}

			}

		}

		@media screen and (min-width: 1200px) {

			.blog-post-featured-image {

				img {
					aspect-ratio: 2.05 / 1;
				}

			}

		}

	}

}

.blog-post-content {

	p {

		a {
			color: var(--terracotta);

			@media (hover: hover) {
		
				&:hover {
					color: var(--terracotta) !important;
				}

			}

		}

	}

	.cta-container {
		padding-top: 40px;
		display: flex;
		gap: 30px;
	}

}

.related-blog-posts {
	background-color: var(--sand);
	padding-block: 50px; 

	.related-posts-header {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 30px;
	}

	.related-posts-grid {
		padding-top: 20px;
		row-gap: 40px;

		.related-blog-post-card {
			grid-column: 1 / 13;

			@media screen and (min-width: 768px) {

				&:nth-child(1) {
					grid-column: 1 / 7;
				}

				&:nth-child(2) {
					grid-column: 7 / 13;
				}

			}

			a {
				display: block;
				text-decoration: none;

				.related-content {
					margin-top: 16px;
					display: flex;
					flex-direction: column;
					gap: 16px;

					.related-cta {
						align-self: flex-start;
						position: relative;
						white-space: nowrap;
						color: inherit;
						display: inline-block;
						text-align: center;
						/* 16/18px in rem */
						font-size: clamp(1rem, 0.195vw + 0.93rem, 1.125rem);
						font-style: normal;
						font-weight: 500;
						letter-spacing: 0.2px;

						&::before {
							content: '';
							position: absolute;
							width: 100%;
							height: 1px;
							background: currentColor;
							bottom: -3px;
							left: 0;
							pointer-events: none;
							transform-origin: 0% 50%;
							transform: scale3d(1, 1, 1);
							transition: transform 0.4s;
						}

					}

				}

				.related-image {
					overflow: hidden;

					.related-article-image {
						aspect-ratio: 3 / 2;
						width: 100%;
						height: 100%;
						object-fit: cover;
						transform: scale(1.04);
						transition: transform 0.4s ease-in-out;
					}

				}

				@media (hover: hover) {
							
					&:hover {

						.related-cta {

							&::before {
								transform-origin: 100% 50%;
								transform: scale3d(0, 1, 1);
							}

						}

						.related-article-image {
							transform: scale(1);
						}

					}

				}

			}

		}

	}

}


/* Custom Section - Animated Marquee */

@-webkit-keyframes marquee {
    from {
        -webkit-transform: translateX(0);
                transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(-25%);
                transform: translateX(-25%);
    }
}
@keyframes marquee {
    from {
        -webkit-transform: translateX(0);
                transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(-25%);
                transform: translateX(-25%);
    }
}

.animated-marquee {
	background-color: var(--oat-white);
	padding-block: clamp(1.563rem, 1.464vw + 1.036rem, 2.5rem);
	position: relative;
    overflow: hidden;

	.icon-blocks-wrapper {
		position: relative;
    	overflow: hidden;
		animation: none;

		.icon-blocks {
			display: flex;
			flex-wrap: wrap;
			column-gap: 40px;
			row-gap: 20px;
			justify-content: center;

			.icon-block {
				display: flex;
				gap: 10px;
				align-items: center;

				.icon-block-image {
					width: clamp(4.375rem, 1.953vw + 3.672rem, 5.625rem);
					height: clamp(4.375rem, 1.953vw + 3.672rem, 5.625rem);
				}

				p {
					font-size: clamp(1.125rem, 0.294vw + 1.019rem, 1.313rem);
				}

			}

		}

		&.animated {
			display: flex;
			flex-wrap: nowrap;
			gap: 40px;
			width: max-content;
			position: relative;
			animation: marquee var(--animation-speed) linear infinite;
		}

	}

}


/* Custom Section - FAQ Banner */

.faq-banner {
	/* 20/40px in rem */
	padding-block: clamp(1.25rem, 1.953vw + 0.547rem, 2.5rem);
	background-color: var(--oat-white);

	.rvd-grid {
		gap: 20px;

		.section-title {
			grid-column: 1 / 13;

			@media screen and (min-width: 768px) {
				grid-column: 1 / 5;
			}

			h2 {
				width: 100%;

				@media screen and (min-width: 768px) {
					width: 90%;
				}

			}

		}

		.section-content {
			grid-column: 1 / 13;

			@media screen and (min-width: 768px) {
				grid-column: 5 / 13;
			}

			.details {

				.details__header {
					font-family: var(--body-font);
					font-style: normal;
					font-weight: 400;
					/* 17/18px in rem */
					font-size: clamp(1.063rem, 0.097vw + 1.028rem, 1.125rem);
					line-height: 135%;
					letter-spacing: 0.2px;
					padding-block: 20px;
				}

				.details-content {
					padding-block-end: 20px;

					.text-block>* {
						max-inline-size: 80%;
					}

				}

			}

		}

	}

}


/* Custom Section - 3 Column Image Banner */

.threeCol-image-banner {
	/* 20/40px in rem */
	padding-block: clamp(1.25rem, 1.953vw + 0.547rem, 2.5rem);
	background-color: var(--oat-white);

	.rvd-grid {
		row-gap: 20px;

		.section-title,
		.threeCol-image-blocks {
			grid-column: 1 / 13;
		}

	}

	.threeCol-image-blocks {
		display: flex;
		flex-wrap: wrap;
		gap: 20px;

		.threeCol-image-block {
			flex: 0 0 100%;
			max-width: 100%;
			position: relative;
			display: grid;

			@media screen and (min-width: 576px) {
				flex: 0 0 calc(50% - 10px);
				max-width: unset;
			}

			@media screen and (min-width: 992px) {
				flex: 1;
			}

			.media-wrapper {
				position: relative;
				grid-column: 1 / 2;
				grid-row: 1;

				&::after {
					content: "";
					display: block;
					position: absolute;
					z-index: 1;
					inset: 0;
					background: #1B1B1B;
					background: linear-gradient(180deg, rgba(27, 27, 27, 0.3) 0%, rgba(27, 27, 27, 0) 20%, rgba(27, 27, 27, 0) 56%, rgba(27, 27, 27, 0.4) 100%);
				}

				.threeCol-image,
				.threeCol-video {
					aspect-ratio: 3 / 4;
					width: 100%;
					height: 100%;
					object-fit: cover;
					position: relative;
					z-index: 1;
				}

				.tag {
					position: absolute;
					z-index: 2;
					top: clamp(1.25rem, 1.953vw + 0.547rem, 2.5rem);
					left: 50%;
					transform: translateX(-50%);
					font-family: var(--body-font);
					color: var(--oat-white);
					/* 14/18px in rem */
					font-size: clamp(0.938rem, 0.292vw + 0.833rem, 1.125rem);
					font-weight: 600;
					line-height: 100%;
					letter-spacing: 1px;
					text-transform: uppercase;
				}

			}

			.title {
				grid-column: 1 / 2;
				grid-row: 2;
				position: relative;
				z-index: 2;
				/* 20/40px in rem */
				padding: clamp(1.25rem, 1.953vw + 0.547rem, 2.5rem);
				color: var(--slate-black);
				text-align: center;

				@media screen and (min-width: 992px) {
					color: var(--oat-white);
					grid-row: 1;
					align-self: end;
				}

			}

		}

	}

}

/* Custom Section - Testimonials Banner */

.testimonials-banner {
	/* 40/80px in rem */
	padding-block: clamp(2.5rem, 3.906vw + 1.094rem, 5rem);
	overflow-x: hidden;
	width: 100%;
	background-color: var(--oat-white);

	.section-title {
		width: 80%;
		max-width: 560px;
	}

	.testimonial-blocks {

		.testimonial-block {

			.block-wrapper {
				display: flex;
				flex-direction: column;
				align-items: start;
				gap: 20px;
			}
			
			img {
				max-height: 34px;
				width: auto;
			}

			h4 {
				font-family: var(--body-font);
				font-size: 18px;
				font-style: normal;
				font-weight: 500;
				line-height: 1;
				letter-spacing: 0.2px;
				text-transform: uppercase;
				color: var(--stone);
				min-height: 34px; /* Matches image height */
				align-content: end;
			}

			blockquote {
				margin: 0;
				padding: 0;
				position: relative;

				p {
					font-size: 18px;
					font-style: normal;
					font-weight: 400;
					line-height: 150%;
				}

				&.quote-marks {

					&::before {
						content: "\201C";
						display: block;
						position: absolute;
						top: 0;
						left: -0.5em;
						color: var(--slate-black);
						font-size: 18px;
						line-height: 150%;
					}

				}

				cite {
					display: block;
					font-size: 14px;
					font-style: normal;
					font-weight: 400;
					line-height: 140%; /* 19.6px */
					letter-spacing: 0.2px;
					color: var(--slate-black);
					margin-top: 6px;
				}

			}

		}

		.splide__track {
    		overflow: visible;
		}

		.splide__arrows {
			display: flex;
			gap: 0.4rem;
			justify-content: end;
			padding-block: 20px;

			.splide__arrow {
				position: relative;
				top: 0;
				left: 0;
				right: 0;
				transform: unset;
				margin: 0;
				padding: 0;
				height: 3em;
				background: none;
				opacity: 1;
				border-radius: 0;
			}

		}

	}

}


/* Custom Section - Footer */

footer {
	position: relative;
    z-index: 1;
}

footer.revived-footer {
	background: var(--terracotta);
	color: var(--oat-white);

	a {
		color: var(--oat-white);
	}

	.top-footer {
		padding-block: 40px;

		.rvd-grid {
			row-gap: 40px;
		}

		.footer-column {
			grid-column: 1 / 13;

			@media screen and (min-width: 768px) {
				
				&:nth-child(1) {
					grid-column: 1 / 6;
				}

				&:nth-child(2) {
					grid-column: 7 / 13;
				}

				&:nth-child(3) {
					grid-column: 7 / 13;
				}
				
			}

			@media screen and (min-width: 1300px) {
				
				&:nth-child(1) {
					grid-column: 1 / 5;
				}

				&:nth-child(2) {
					grid-column: 5 / 10;
				}

				&:nth-child(3) {
					grid-column: 10 / 13;
				}
				
			}

			p.f-large {
				/* 21/24px in rem */
				font-size: clamp(1.313rem, 0.292vw + 1.208rem, 1.5rem);
				font-style: normal;
				font-weight: 400;
				line-height: 150%; /* 36px */
				letter-spacing: 0.2px;
				width: 100%;
				/* text-box: trim-start cap alphabetic; */

				@media screen and (min-width: 768px) {
					max-width: 380px;
				}

			}
			
			p:not(.f-large) {
				margin-top: 12px;
			}

			.social-icons__wrapper {
				/* 20/40px in rem */
				margin-top: clamp(1.25rem, 1.953vw + 0.547rem, 2.5rem);

				.social-icons__icon-wrapper {

					.icon-default {
						transition: fill var(--transition);

						path {
							transition: fill var(--transition);
						}
			
					}

					@media (hover: hover) {
		
						&:hover {

							.icon-default {
								fill: var(--pale-autumn);

								path {
									fill: var(--pale-autumn);
								}
					
							}

						}

					}

				}

			}

			.column-inner {
				display: flex;
				gap: 20px;

				.footer-menu {
					flex: 1;

					ul {
						list-style: none;
						margin: 0;
						padding: 0;

						li {
							margin-top: 10px;
							text-transform: uppercase;

							a {
								font-family: var(--body-font);
								/* 14/16px in rem */
								font-size: clamp(0.875rem, 0.195vw + 0.805rem, 1rem);
								font-weight: 500;
								line-height: 1;
								letter-spacing: 1px;
							}

						}

					}

				}

			}

			h6 {
				/* 16/18px in rem */
				font-size: clamp(1rem, 0.195vw + 0.93rem, 1.125rem);
				font-weight: 700;
				line-height: 120%;
				letter-spacing: 1px;
				color: var(--pale-autumn);
				text-transform: uppercase;

			}

		}

		.large-logo {
			grid-column: 1 / 13;
			width: 100%;
			height: auto;
			padding-top: 0;

			@media screen and (min-width: 768px) {
				padding-top: 40px;
			}

		}

	}

    .bottom-footer {
        background: var(--pale-autumn);
        color: var(--slate-black);
		padding-block: 16px;

		.inner {
			grid-column: 1 / 13;
			display: flex;
			flex-direction: column;
			row-gap: 20px;
			align-items: center;

			@media screen and (min-width: 768px) {
				flex-direction: row;
				align-items: unset;
				justify-content: space-between;
			}

			.copyright {
				margin: 0;

				a {
					text-decoration: none;
				}

			}

		}

		p, ul {
			/* 12/14px in rem */
			font-size: clamp(0.75rem, 0.195vw + 0.68rem, 0.875rem);
			line-height: 1;
		}

		a {
			color: var(--slate-black);
		}

		ul {
			list-style: none;
			margin: 0;
			padding: 0;
			display: flex;
			justify-content: center;
			flex-wrap: wrap;
			gap: 20px;

			li {
				display: inline-block;
				text-transform: uppercase;
				letter-spacing: 1px;
			}

		}

    }

}

/* Policy Page Styles */

.shopify-policy__container {
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 0;
	padding-bottom: 80px;

	.shopify-policy__title {
		text-align: left;
		padding-block: 40px;
		
		h1 {
			/* 28/42px in rem */
			font-size: clamp(1.75rem, 1.367vw + 1.258rem, 2.625rem);
			line-height: 115%;
			letter-spacing: 0.2px;
		}
		
	}

	p, ul, ol {

		a {
			color: var(--terracotta);

			@media (hover: hover) {
		
				&:hover {
					color: var(--terracotta) !important;
				}

			}

		}

	}
	
}

/* Custom Newsletter Styles */

form.klaviyo-form {
	margin-top: 20px;
	border-bottom: 1px solid var(--slate-black) !important;

	& > div {
		flex-direction: row !important;
		justify-content: unset !important;

		.kl-private-reset-css-Xuajs1 {
			
			&:first-of-type {
				flex-grow: 1;
			}

			input { 
				font-family: var(--body-font) !important;
				font-size: 14px !important;
			}

			button {
				padding-inline: 20px;
				font-family: var(--body-font) !important;
				font-size: 14px !important;
				font-style: normal !important;
				font-weight: 500 !important;
				line-height: normal !important;
				letter-spacing: 1px !important;
				text-transform: uppercase !important;
			}

		}

	}

}

form.klaviyo-form input::-webkit-input-placeholder {
	font-family: var(--body-font) !important;
	font-size: 14px !important;
}

form.klaviyo-form input:-ms-input-placeholder {
	font-family: var(--body-font) !important;
	font-size: 14px !important;
}

form.klaviyo-form input:-moz-placeholder {
	font-family: var(--body-font) !important;
	font-size: 14px !important;
}

form.klaviyo-form input::-moz-placeholder {
	font-family: var(--body-font) !important;
	font-size: 14px !important;
}


.appio-rating-badge {

	.appio-review-popup {
		display: none !important;
	}

}



.quick-add-modal {

	#quick-add-modal-content {

		.product-information__media img {
			height: 100%;
			object-fit: cover;
		}

		.product-details :is(.view-product-title) {
			flex-direction: column;
		}

	}

}