/* ----------------------------------------------------------------
	Canvas: Gear
-----------------------------------------------------------------*/


		/* -----------------------------------------------
		   WILDROOT — Outdoor Brand Theme
		----------------------------------------------- */

		:root {
			--cnvs-themecolor: #3D6B2A;
			--cnvs-themecolor-rgb: 61, 107, 42;
			--cnvs-primary-font: 'Source Sans 3', sans-serif;
			--cnvs-body-font: 'Source Sans 3', sans-serif;
		}

		/* Typography */
		h1, h2, h3, h4, h5,
		.wr-heading { font-family: 'Playfair Display', serif; }

		/* ── HEADER ── */
		#header {
			--cnvs-header-height: 76px;
			--cnvs-primary-menu-tt: none;
			--cnvs-primary-menu-font-weight: 600;
			--cnvs-primary-menu-font-size: 0.9375rem;
		}

		#logo a {
			color: var(--cnvs-contrast-1000);
		}

		.wr-logo-text {
			font-family: 'Playfair Display', serif;
			font-size: 1.5rem;
			font-weight: 900;
			letter-spacing: 3px;
			text-transform: uppercase;
			color: #F5F0E8;
			text-decoration: none;
			transition: color 0.3s;
		}

		#header-wrap.not-dark .wr-logo-text,
		#header.not-dark .wr-logo-text { color: #1F3A1B; }

		#header.not-dark .cnvs-hamburger-inner,
		#header.not-dark .cnvs-hamburger-inner::before,
		#header.not-dark .cnvs-hamburger-inner::after { background-color: #1F3A1B; }

		/* ── HERO ── */
		.wr-hero-badge {
			display: inline-block;
			font-family: 'Source Sans 3', sans-serif;
			font-size: 0.72rem;
			font-weight: 700;
			letter-spacing: 3.5px;
			text-transform: uppercase;
			color: rgba(245, 240, 232, 0.85);
			border: 1px solid rgba(245, 240, 232, 0.35);
			padding: 7px 22px;
			border-radius: 2px;
			margin-bottom: 28px;
		}

		.wr-hero-title {
			font-family: 'Playfair Display', serif;
			font-size: clamp(3.5rem, 9vw, 7.5rem);
			font-weight: 900;
			color: #F5F0E8;
			line-height: 1.03;
			letter-spacing: -2px;
			margin-bottom: 28px;
		}

		.wr-hero-subtitle {
			font-size: 1.2rem;
			font-weight: 300;
			color: rgba(245, 240, 232, 0.8);
			letter-spacing: 0.3px;
			line-height: 1.75;
			max-width: 480px;
			margin: 0 auto 48px;
		}

		.wr-scroll-hint {
			position: absolute;
			bottom: 44px;
			left: 50%;
			transform: translateX(-50%);
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 10px;
			color: rgba(245, 240, 232, 0.5);
			font-size: 0.68rem;
			font-weight: 700;
			letter-spacing: 2.5px;
			text-transform: uppercase;
			z-index: 10;
		}

		.wr-scroll-hint .wr-scroll-line {
			width: 1px;
			height: 56px;
			background: linear-gradient(to bottom, rgba(245, 240, 232, 0.6), transparent);
			animation: scrollAnim 2.2s ease-in-out infinite;
		}

		@keyframes scrollAnim {
			0%   { transform: scaleY(0); transform-origin: top; opacity: 0; }
			40%  { transform: scaleY(1); transform-origin: top; opacity: 1; }
			80%  { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
			100% { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
		}

		/* ── BUTTONS ── */
		.btn-wr {
			display: inline-block;
			background-color: #3D6B2A;
			color: #F5F0E8 !important;
			padding: 16px 44px;
			font-family: 'Source Sans 3', sans-serif;
			font-size: 0.8rem;
			font-weight: 700;
			letter-spacing: 2.5px;
			text-transform: uppercase;
			border-radius: 2px;
			text-decoration: none !important;
			transition: background-color 0.3s, transform 0.2s;
		}

		.btn-wr:hover { background-color: #2D5018; transform: translateY(-1px); }

		.btn-wr-ghost {
			display: inline-block;
			background-color: transparent;
			color: #F5F0E8 !important;
			padding: 14px 44px;
			font-family: 'Source Sans 3', sans-serif;
			font-size: 0.8rem;
			font-weight: 700;
			letter-spacing: 2.5px;
			text-transform: uppercase;
			border-radius: 2px;
			border: 2px solid rgba(245, 240, 232, 0.4);
			text-decoration: none !important;
			transition: border-color 0.3s, background-color 0.3s;
		}

		.btn-wr-ghost:hover {
			border-color: #F5F0E8;
			background-color: rgba(245, 240, 232, 0.08);
		}

		.btn-wr-sage {
			display: inline-block;
			background-color: #A8C98A;
			color: #1F3A1B !important;
			padding: 17px 48px;
			font-family: 'Source Sans 3', sans-serif;
			font-size: 0.82rem;
			font-weight: 700;
			letter-spacing: 2.5px;
			text-transform: uppercase;
			border-radius: 2px;
			text-decoration: none !important;
			transition: background-color 0.3s, transform 0.2s;
		}

		.btn-wr-sage:hover { background-color: #96BD72; transform: translateY(-1px); }

		/* Section label */
		.wr-section-label {
			display: inline-block;
			font-family: 'Source Sans 3', sans-serif;
			font-size: 0.7rem;
			font-weight: 700;
			letter-spacing: 3.5px;
			text-transform: uppercase;
			margin-bottom: 14px;
		}

		.wr-label-green  { color: #3D6B2A; }
		.wr-label-brown  { color: #8B5E3C; }
		.wr-label-sage   { color: #A8C98A; }
		.wr-label-cream  { color: rgba(245, 240, 232, 0.6); }

		/* ── PRODUCTS ── */
		#products { background-color: #F5F0E8; }

		.wr-product-card { position: relative; overflow: hidden; border-radius: 3px; }

		.wr-product-img {
			position: relative;
			overflow: hidden;
			aspect-ratio: 3/4;
			display: block;
		}

		.wr-product-img img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
			display: block;
		}

		.wr-product-card:hover .wr-product-img img { transform: scale(1.07); }

		.wr-product-overlay {
			position: absolute;
			bottom: 0; left: 0; right: 0;
			padding: 48px 28px 28px;
			background: linear-gradient(to top, rgba(8, 17, 6, 0.9) 0%, rgba(8, 17, 6, 0.3) 60%, transparent 100%);
		}

		.wr-product-tag {
			display: inline-block;
			font-size: 0.65rem;
			font-weight: 700;
			letter-spacing: 2.5px;
			text-transform: uppercase;
			color: #A8C98A;
			margin-bottom: 8px;
		}

		.wr-product-name {
			font-family: 'Playfair Display', serif;
			font-size: 1.7rem;
			font-weight: 700;
			color: #F5F0E8;
			line-height: 1.2;
			margin-bottom: 6px;
		}

		.wr-product-price {
			font-size: 1rem;
			font-weight: 400;
			color: rgba(245, 240, 232, 0.65);
			margin-bottom: 18px;
		}

		.wr-product-link {
			display: inline-flex;
			align-items: center;
			gap: 7px;
			font-size: 0.75rem;
			font-weight: 700;
			letter-spacing: 1.5px;
			text-transform: uppercase;
			color: #F5F0E8 !important;
			text-decoration: none !important;
			border-bottom: 1px solid rgba(245, 240, 232, 0.35);
			padding-bottom: 3px;
			transition: color 0.3s, border-color 0.3s;
		}

		.wr-product-card:hover .wr-product-link {
			color: #A8C98A !important;
			border-color: #A8C98A;
		}

		/* ── BRAND STORY ── */
		#brand-story { background-color: #1F3A1B; }

		.wr-story-img-col {
			min-height: 540px;
			background: url('https://images.unsplash.com/photo-1476514525535-07fb3b4ae5f1?w=1000&q=80') center center;
			background-size: cover;
			position: relative;
		}

		.wr-story-img-col::after {
			content: '';
			position: absolute;
			inset: 0;
			background: rgba(31, 58, 27, 0.25);
		}

		.wr-story-pad {
			padding: clamp(52px, 8vw, 100px) clamp(32px, 6vw, 80px);
		}

		.wr-stat-number {
			font-family: 'Playfair Display', serif;
			font-size: 3.2rem;
			font-weight: 900;
			color: #A8C98A;
			line-height: 1;
		}

		.wr-stat-label {
			font-size: 0.7rem;
			font-weight: 700;
			letter-spacing: 2px;
			text-transform: uppercase;
			color: rgba(245, 240, 232, 0.45);
			margin-top: 7px;
		}

		.wr-stat-divider {
			width: 1px;
			background: rgba(245, 240, 232, 0.1);
			align-self: stretch;
		}

		/* ── GALLERY ── */
		#gallery { background-color: #EDE4D3; }

		.wr-gallery-grid {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: 260px 260px;
			gap: 10px;
		}

		.wr-gallery-item {
			overflow: hidden;
			position: relative;
			border-radius: 2px;
		}

		.wr-gallery-item img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			transition: transform 0.55s ease;
		}

		.wr-gallery-item:hover img { transform: scale(1.06); }

		.wr-gallery-item:nth-child(1) { grid-row: span 2; }
		.wr-gallery-item:nth-child(4) { grid-column: span 2; }

		.wr-gallery-overlay {
			position: absolute;
			inset: 0;
			background: rgba(31, 58, 27, 0.5);
			opacity: 0;
			transition: opacity 0.3s;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.wr-gallery-item:hover .wr-gallery-overlay { opacity: 1; }
		.wr-gallery-overlay i { font-size: 1.8rem; color: #F5F0E8; }

		/* ── TESTIMONIALS ── */
		#testimonials { background-color: #F5F0E8; }

		.wr-testi-card {
			background: #FFFFFF;
			border-radius: 3px;
			padding: 36px 32px 32px;
			border-top: 3px solid #3D6B2A;
			height: 100%;
			display: flex;
			flex-direction: column;
			box-shadow: 0 2px 24px rgba(31, 58, 27, 0.07);
		}

		.wr-testi-stars {
			display: flex;
			gap: 3px;
			color: #C8A96A;
			font-size: 0.85rem;
			margin-bottom: 18px;
		}

		.wr-testi-quote {
			font-family: 'Playfair Display', serif;
			font-size: 1.05rem;
			font-style: italic;
			line-height: 1.8;
			color: #3A3A3A;
			flex: 1;
			margin-bottom: 28px;
		}

		.wr-testi-author { display: flex; align-items: center; gap: 14px; }

		.wr-testi-author img {
			width: 50px;
			height: 50px;
			border-radius: 50%;
			object-fit: cover;
			flex-shrink: 0;
		}

		.wr-testi-name {
			font-weight: 700;
			color: #1F3A1B;
			font-size: 0.95rem;
		}

		.wr-testi-role {
			font-size: 0.7rem;
			font-weight: 700;
			letter-spacing: 1.5px;
			text-transform: uppercase;
			color: #8B5E3C;
			margin-top: 3px;
		}

		/* ── CTA ── */
		#cta-shop {
			position: relative;
			background: url('https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?w=1920&q=75') center center;
			background-size: cover;
			background-attachment: fixed;
		}

		#cta-shop::before {
			content: '';
			position: absolute;
			inset: 0;
			background: linear-gradient(160deg, rgba(15, 30, 12, 0.88) 0%, rgba(31, 58, 27, 0.82) 100%);
		}

		#cta-shop .container { position: relative; }

		/* ── FOOTER ── */
		#footer { background-color: #0C180A !important; }

		.wr-footer-link {
			color: rgba(245, 240, 232, 0.45) !important;
			font-size: 0.9rem;
			text-decoration: none !important;
			transition: color 0.2s;
			display: inline-block;
			margin-bottom: 10px;
		}

		.wr-footer-link:hover { color: rgba(245, 240, 232, 0.85) !important; }

		.wr-footer-heading {
			font-family: 'Source Sans 3', sans-serif;
			font-size: 0.68rem;
			font-weight: 700;
			letter-spacing: 3px;
			text-transform: uppercase;
			color: rgba(245, 240, 232, 0.6);
			margin-bottom: 22px;
		}

		/* ── RESPONSIVE ── */
		@media (max-width: 991px) {
			.wr-story-img-col { min-height: 360px; order: -1; }
		}

		@media (max-width: 767px) {
			.wr-gallery-grid {
				grid-template-columns: repeat(2, 1fr);
				grid-template-rows: 180px 180px 180px;
			}
			.wr-gallery-item:nth-child(1) { grid-row: span 1; }
			.wr-gallery-item:nth-child(4) { grid-column: span 1; }
			.wr-gallery-item:nth-child(5) { display: none; }
		}

	