/*
Theme Name: Cerovaine
Theme URI: https://cerovaine.com
Description: Cerovaine brand layer on top of Blocksy.
Author: Cerovaine LLC
Template: blocksy
Version: 1.2.1
Text Domain: cerovaine
*/
/*
 * Cerovaine brand layer for Blocksy + WooCommerce.
 * Load after the theme stylesheet (child theme or Customizer > Additional CSS).
 * Fonts: Fraunces (Google Fonts) and Satoshi (Fontshare), both self-hosted
 * from assets/fonts/ so no third-party font requests are made.
 */

@font-face {
	font-family: "Fraunces";
	src: url("assets/fonts/Fraunces-Variable.woff2") format("woff2");
	font-weight: 300 700;
	font-display: swap;
}
@font-face {
	font-family: "Satoshi";
	src: url("assets/fonts/Satoshi-Variable.woff2") format("woff2");
	font-weight: 300 900;
	font-display: swap;
}

:root {
	--cv-paper: #faf8f5;
	--cv-paper-deep: #f2eee8;
	--cv-ink: #1f1d1b;
	--cv-ink-soft: #5c5752;
	--cv-hairline: rgba(31, 29, 27, 0.08);

	/* One accent per collection. Default is the October rose. */
	--cv-accent: #b85c74;
	--cv-accent-tint: #f6e7eb;

	--cv-radius-lg: 2rem;
	--cv-radius-md: 1.25rem;
	--cv-ease: cubic-bezier(0.32, 0.72, 0, 1);
	--cv-shadow: 0 24px 48px -24px rgba(31, 29, 27, 0.12);

	--cv-font-display: "Fraunces", Georgia, serif;
	--cv-font-body: "Satoshi", system-ui, sans-serif;
}

/* Collection accents. WooCommerce adds term-* on archives and product_cat-* on products. */
.term-christmas, .product_cat-christmas, .page-christmas {
	--cv-accent: #2f5d4a;
	--cv-accent-tint: #e5eee9;
}
.term-thanksgiving, .product_cat-thanksgiving, .page-thanksgiving {
	--cv-accent: #b4602f;
	--cv-accent-tint: #f6e9df;
}

/* ---------- Base ---------- */

body {
	background: var(--cv-paper);
	color: var(--cv-ink);
	font-family: var(--cv-font-body);
	font-size: 1.0625rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, .product_title, .woocommerce-loop-product__title {
	font-family: var(--cv-font-display);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: var(--cv-ink);
}
h1 { font-size: clamp(2.5rem, 5vw, 4.25rem); }
h2 { font-size: clamp(2rem, 3.5vw, 3rem); }

p { max-width: 65ch; color: var(--cv-ink-soft); }

a { color: var(--cv-ink); text-underline-offset: 0.2em; transition: color 0.4s var(--cv-ease); }
a:hover { color: var(--cv-accent); }

/* Small pill label above section headings: <span class="cv-eyebrow">New for Christmas</span> */
.cv-eyebrow {
	display: inline-block;
	padding: 0.35rem 0.85rem;
	border-radius: 999px;
	background: var(--cv-accent-tint);
	color: var(--cv-accent);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

/* ---------- Blocksy palette mapped to the brand ---------- */

:root {
	--theme-palette-color-1: var(--cv-ink);
	--theme-palette-color-2: var(--cv-accent);
	--theme-palette-color-3: var(--cv-ink-soft);
	--theme-palette-color-4: var(--cv-ink);
	--theme-palette-color-5: #e7e1d8;
	--theme-palette-color-6: var(--cv-paper-deep);
	--theme-palette-color-7: var(--cv-paper);
	--theme-palette-color-8: #ffffff;
	--theme-link-initial-color: var(--cv-ink);
	--theme-link-hover-color: var(--cv-accent);
}
body, #main-container, .site-main, [data-prefix] .hero-section { background-color: var(--cv-paper); }

/* ---------- Floating pill header (sticky) ---------- */

#header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 50;
	background: transparent;
	pointer-events: none; /* only the pill itself takes clicks */
}
#header [data-row],
#header .ct-sticky-container { background: transparent !important; border: 0 !important; box-shadow: none !important; }
#header [data-row="middle"] { --height: 64px; }
#header [data-row="middle"] > .ct-container {
	pointer-events: auto;
	margin-top: 1rem;
	width: auto;
	max-width: calc(100% - 2rem);
	padding: 0 0.5rem 0 1.5rem;
	gap: 2rem;
	border-radius: 999px;
	background: rgba(250, 248, 245, 0.8);
	backdrop-filter: blur(18px) saturate(1.4);
	-webkit-backdrop-filter: blur(18px) saturate(1.4);
	box-shadow: 0 0 0 1px var(--cv-hairline), 0 10px 30px -18px rgba(31, 29, 27, 0.25);
	transition: box-shadow 0.6s var(--cv-ease), background-color 0.6s var(--cv-ease), margin 0.6s var(--cv-ease);
}
@media (min-width: 1000px) {
	#header [data-device="desktop"] [data-row="middle"] > .ct-container { max-width: max-content; }
}
.cv-scrolled #header [data-row="middle"] > .ct-container {
	margin-top: 0.6rem;
	background: rgba(250, 248, 245, 0.92);
	box-shadow: 0 0 0 1px var(--cv-hairline), 0 18px 40px -20px rgba(31, 29, 27, 0.35);
}

/* Wordmark */
#header .site-title {
	font-family: var(--cv-font-display);
	font-size: 1.5rem;
	font-weight: 400;
	letter-spacing: -0.02em;
}
#header .site-title a { color: var(--cv-ink); }

/* Menu links: sentence case, animated underline, active pill */
#header .menu > li > .ct-menu-link {
	position: relative;
	padding: 0.5rem 0.9rem;
	border-radius: 999px;
	font-family: var(--cv-font-body);
	font-size: 0.9375rem;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	color: var(--cv-ink-soft);
	transition: color 0.4s var(--cv-ease), background-color 0.4s var(--cv-ease);
}
#header .menu > li > .ct-menu-link::after {
	content: "";
	position: absolute;
	left: 0.9rem;
	right: 0.9rem;
	bottom: 0.35rem;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 0.5s var(--cv-ease);
}
#header .menu > li > .ct-menu-link:hover { color: var(--cv-ink); }
#header .menu > li > .ct-menu-link:hover::after { transform: scaleX(1); transform-origin: left; }
#header .menu > .current-menu-item > .ct-menu-link,
#header .menu > .current-menu-ancestor > .ct-menu-link {
	color: var(--cv-ink);
	background: rgba(31, 29, 27, 0.06);
}
#header .menu > .current-menu-item > .ct-menu-link::after { display: none; }

/* Cart + CTA added by functions.php */
#header .menu > .cv-nav-cart > a,
#header .menu > .cv-nav-cta > a { text-transform: none; }
#header .menu > .cv-nav-cart > a {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 0.75rem;
	color: var(--cv-ink);
}
.cv-nav-cart__count {
	display: inline-grid;
	place-items: center;
	min-width: 1.25rem;
	height: 1.25rem;
	padding: 0 0.3rem;
	border-radius: 999px;
	background: var(--cv-ink);
	color: var(--cv-paper);
	font-size: 0.6875rem;
	font-weight: 700;
}
.cv-nav-cart__count:empty { display: none; }
#header .menu > .cv-nav-cta { margin-left: 0.25rem; }
#header .menu > .cv-nav-cta > a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	height: 2.75rem;
	padding: 0 0.4rem 0 1.15rem;
	border-radius: 999px;
	background: var(--cv-ink);
	color: var(--cv-paper);
	font-size: 0.875rem;
	font-weight: 600;
	transition: transform 0.4s var(--cv-ease), background-color 0.4s var(--cv-ease);
}
#header .menu > .cv-nav-cta > a::after { display: none; }
#header .menu > .cv-nav-cta > a:hover { background: #2f5d4a; color: #fff; }
#header .menu > .cv-nav-cta > a:active { transform: scale(0.97); }
#header .menu > .cv-nav-cta .cv-chip { width: 1.9rem; height: 1.9rem; margin: 0; background: rgba(255, 255, 255, 0.14); }
#header .menu > .cv-nav-cta > a:hover .cv-chip { transform: translate(2px, -1px); }

/* Search icon */
#header .ct-header-search { color: var(--cv-ink-soft); }
#header .ct-header-search:hover { color: var(--cv-ink); }

/* Mobile row: same pill, roomy tap targets */
#header [data-device="mobile"] [data-row="middle"] > .ct-container { padding: 0 0.4rem 0 1.25rem; }
#header .ct-header-trigger { width: 2.75rem; height: 2.75rem; border-radius: 999px; background: rgba(31, 29, 27, 0.06); }
#header .cv-nav-cart__label { display: none; }

/* ---------- Mobile drawer ---------- */

#offcanvas {
	--theme-text-color: var(--cv-ink);
	background: rgba(31, 29, 27, 0.28) !important;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
#offcanvas .ct-panel-inner {
	background: var(--cv-paper) !important;
	box-shadow: -30px 0 60px -30px rgba(31, 29, 27, 0.35);
}
#offcanvas .ct-panel-actions { padding: 1.25rem 1.25rem 0; }
#offcanvas .ct-toggle-close {
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 999px;
	background: rgba(31, 29, 27, 0.06);
	--theme-icon-color: var(--cv-ink);
	color: var(--cv-ink);
}
#offcanvas .ct-panel-content { padding: 1rem 1.75rem 2rem; }
#offcanvas .ct-panel-content-inner { padding: 0; width: 100%; }
#offcanvas .mobile-menu { width: 100%; }
#offcanvas .mobile-menu > ul { counter-reset: cvnav; margin: 0; padding: 0; width: 100%; }

#offcanvas .mobile-menu > ul > li {
	opacity: 0;
	transform: translateY(1.25rem);
	transition: opacity 0.7s var(--cv-ease), transform 0.7s var(--cv-ease);
}
#offcanvas.active .mobile-menu > ul > li { opacity: 1; transform: none; }
#offcanvas.active .mobile-menu > ul > li:nth-child(2) { transition-delay: 60ms; }
#offcanvas.active .mobile-menu > ul > li:nth-child(3) { transition-delay: 120ms; }
#offcanvas.active .mobile-menu > ul > li:nth-child(4) { transition-delay: 180ms; }
#offcanvas.active .mobile-menu > ul > li:nth-child(5) { transition-delay: 240ms; }
#offcanvas.active .mobile-menu > ul > li:nth-child(6) { transition-delay: 300ms; }
#offcanvas.active .mobile-menu > ul > li:nth-child(7) { transition-delay: 360ms; }

/* Page links: big serif with a small index number */
#offcanvas .mobile-menu > ul > li:not(.cv-nav-cart):not(.cv-nav-cta):not(.cv-nav-meta) {
	counter-increment: cvnav;
	border-bottom: 1px solid var(--cv-hairline);
}
#offcanvas .mobile-menu > ul > li:not(.cv-nav-cart):not(.cv-nav-cta):not(.cv-nav-meta) > .ct-menu-link {
	display: flex;
	align-items: baseline;
	gap: 1rem;
	width: 100%;
	padding: 1rem 0;
	font-family: var(--cv-font-display);
	font-size: 2.125rem;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.02em;
	text-transform: none;
	color: var(--cv-ink);
}
#offcanvas .mobile-menu > ul > li:not(.cv-nav-cart):not(.cv-nav-cta):not(.cv-nav-meta) > .ct-menu-link::before {
	content: counter(cvnav, decimal-leading-zero);
	font-family: var(--cv-font-body);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	color: var(--cv-accent);
	min-width: 1.5rem;
}
#offcanvas .mobile-menu > ul > li.current-menu-item > .ct-menu-link { font-style: italic; color: var(--cv-accent); }

/* Cart row */
#offcanvas .cv-nav-cart > a {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	width: 100%;
	margin-top: 1.25rem;
	padding: 1rem 1.25rem;
	border-radius: 1.25rem;
	background: #fff;
	box-shadow: 0 0 0 1px var(--cv-hairline);
	font-size: 1rem;
	font-weight: 600;
	color: var(--cv-ink);
}
#offcanvas .cv-nav-cart__count { margin-left: auto; }
#offcanvas .cv-nav-cart__count:empty { display: inline-grid; background: rgba(31, 29, 27, 0.08); color: var(--cv-ink-soft); }
#offcanvas .cv-nav-cart__count:empty::before { content: "0"; }

/* Full-width CTA */
#offcanvas .cv-nav-cta > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin-top: 0.75rem;
	padding: 0.5rem 0.5rem 0.5rem 1.5rem;
	height: 3.5rem;
	border-radius: 999px;
	background: var(--cv-ink);
	color: var(--cv-paper);
	font-size: 1rem;
	font-weight: 600;
	text-transform: none;
}
#offcanvas .cv-nav-cta .cv-chip { width: 2.5rem; height: 2.5rem; margin: 0; background: rgba(255, 255, 255, 0.14); }

/* Small print */
#offcanvas .cv-nav-meta {
	display: grid;
	gap: 0.35rem;
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--cv-hairline);
	font-size: 0.8125rem;
	color: var(--cv-ink-soft);
}
#offcanvas .cv-nav-meta a { color: var(--cv-ink); text-decoration: underline; text-underline-offset: 0.25em; }

@media (prefers-reduced-motion: reduce) {
	#offcanvas .mobile-menu > ul > li { opacity: 1; transform: none; transition: none; }
}

/* ---------- Buttons ---------- */

.button, button[type="submit"], .wp-element-button,
.woocommerce a.button, .woocommerce button.button, .single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.85rem 1.6rem;
	border: 0;
	border-radius: 999px;
	background: var(--cv-ink);
	color: var(--cv-paper);
	font-family: var(--cv-font-body);
	font-weight: 600;
	letter-spacing: 0.01em;
	transition: transform 0.5s var(--cv-ease), background-color 0.5s var(--cv-ease);
}
.button:hover, .wp-element-button:hover,
.woocommerce a.button:hover, .single_add_to_cart_button:hover {
	background: var(--cv-accent);
	color: #fff;
}
.button:active, .wp-element-button:active, .single_add_to_cart_button:active {
	transform: scale(0.98);
}

/* Arrow chip inside a CTA: <a class="wp-element-button">Shop Christmas <span class="cv-chip">&rarr;</span></a> */
.cv-chip {
	display: inline-grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	margin-right: -0.9rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.14);
	transition: transform 0.5s var(--cv-ease);
}
a:hover > .cv-chip { transform: translate(2px, -1px) scale(1.05); }

/* ---------- Hero (split, left text / right image) ---------- */

.cv-hero {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	align-items: center;
	min-height: 88dvh;
	padding: 2.5rem 1rem 3.5rem;
}
@media (min-width: 900px) {
	.cv-hero {
		grid-template-columns: 5fr 6fr;
		gap: 5rem;
		padding: 9rem max(2rem, 6vw) 6rem;
	}
}

/* ---------- Image frame: outer tray + inner image ---------- */

.cv-frame, .woocommerce ul.products li.product a img,
.woocommerce-product-gallery__image {
	border-radius: var(--cv-radius-lg);
}
.cv-frame {
	padding: 0.4rem;
	background: rgba(31, 29, 27, 0.03);
	box-shadow: 0 0 0 1px var(--cv-hairline);
}
.cv-frame > img {
	display: block;
	width: 100%;
	border-radius: calc(var(--cv-radius-lg) - 0.4rem);
}

/* ---------- Product grid (masonry on desktop, single column on phones) ---------- */

.woocommerce ul.products {
	display: block;
	columns: 1;
	column-gap: 1.75rem;
}
@media (min-width: 640px) { .woocommerce ul.products { columns: 2; } }
@media (min-width: 1100px) { .woocommerce ul.products { columns: 3; } }

.woocommerce ul.products li.product {
	display: inline-block;
	width: 100%;
	margin: 0 0 2.5rem;
	break-inside: avoid;
}
.woocommerce ul.products li.product a img {
	margin-bottom: 1rem;
	background: var(--cv-paper-deep);
	transition: transform 0.8s var(--cv-ease);
}
.woocommerce ul.products li.product:hover a img { transform: translateY(-4px); }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 1.25rem;
	padding: 0;
}
.woocommerce ul.products li.product .price {
	color: var(--cv-ink-soft);
	font-weight: 500;
}

/* ---------- Single product ---------- */

.single-product .product_title { font-size: clamp(2rem, 3.5vw, 3rem); }
.single-product .price { font-size: 1.5rem; color: var(--cv-ink); }
.single-product .variations select {
	border-radius: 999px;
	border: 1px solid var(--cv-hairline);
	background: #fff;
	padding: 0.6rem 1rem;
}

/* ---------- Forms ---------- */

input[type="text"], input[type="email"], input[type="tel"], textarea, select {
	border-radius: var(--cv-radius-md);
	border: 1px solid var(--cv-hairline);
	background: #fff;
	transition: box-shadow 0.4s var(--cv-ease);
}
input:focus, textarea:focus, select:focus {
	outline: none;
	box-shadow: 0 0 0 3px var(--cv-accent-tint);
	border-color: var(--cv-accent);
}

/* ---------- Scroll reveal (paired with cerovaine.js) ---------- */

.cv-reveal {
	opacity: 0;
	transform: translateY(2.5rem);
	transition: opacity 0.9s var(--cv-ease), transform 0.9s var(--cv-ease);
	transition-delay: calc(var(--cv-i, 0) * 80ms);
}
.cv-reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.cv-reveal { opacity: 1; transform: none; transition: none; }
	* { scroll-behavior: auto !important; }
}

/* ---------- Section spacing ---------- */

.cv-section { padding: 6rem 1rem; }
@media (min-width: 900px) { .cv-section { padding: 9rem max(2rem, 6vw); } }

/* =========================================================
 * Homepage (front-page.php)
 * ========================================================= */

.cv-home { overflow-x: clip; }
.cv-home em { font-style: italic; color: var(--cv-accent); }
.cv-home h1 em { font-weight: 300; }
.cv-home .cv-section { max-width: 1400px; margin-inline: auto; }

.cv-lede { font-size: 1.1875rem; margin: 1.5rem 0 2.25rem; }
.cv-btn { text-decoration: none; }
.cv-btn--light { background: var(--cv-paper); color: var(--cv-ink); }
.cv-btn--light .cv-chip { background: rgba(31, 29, 27, 0.08); }
.cv-link {
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.35em;
}

.cv-section__head { max-width: 40rem; margin-bottom: 3.5rem; }
.cv-section__head h2 { margin-top: 1rem; }

/* Hero */
.cv-home .cv-hero { --cv-accent: #2f5d4a; --cv-accent-tint: #e5eee9; max-width: 1400px; margin-inline: auto; }
.cv-hero h1 { margin: 1.25rem 0 0; max-width: 13ch; }
.cv-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem 2rem; }
.cv-proof {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin: 2.5rem 0 0;
	padding: 1.5rem 0 0;
	border-top: 1px solid var(--cv-hairline);
	list-style: none;
	font-size: 0.875rem;
	color: var(--cv-ink-soft);
}
.cv-proof li::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-right: 0.6rem;
	border-radius: 50%;
	background: var(--cv-accent);
	vertical-align: middle;
}

.cv-hero__art { position: relative; aspect-ratio: 1 / 1.02; }
.cv-print {
	position: absolute;
	margin: 0;
	padding: 0.5rem;
	border-radius: var(--cv-radius-lg);
	background: rgba(31, 29, 27, 0.03);
	box-shadow: 0 0 0 1px var(--cv-hairline);
}
.cv-print img {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 8%;
	object-fit: contain;
	border-radius: calc(var(--cv-radius-lg) - 0.5rem);
	background: #fff;
	box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.6), var(--cv-shadow);
}
.cv-print--back  { inset: 2% auto auto 0;  width: 46%; aspect-ratio: 4 / 5; transform: rotate(-5deg); }
.cv-print--main  { inset: 6% 18% auto auto; width: 56%; aspect-ratio: 4 / 5; z-index: 1; }
.cv-print--front { inset: auto 0 -2% auto;  width: 34%; aspect-ratio: 4 / 5; transform: rotate(4deg); z-index: 2; }
.cv-print--main img { background: #fbf6ee; }

.cv-tag {
	position: absolute;
	left: 4%;
	bottom: 8%;
	z-index: 3;
	display: grid;
	gap: 0.1rem;
	margin: 0;
	padding: 1rem 1.25rem;
	border-radius: 1.25rem;
	background: rgba(250, 248, 245, 0.85);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	box-shadow: 0 0 0 1px var(--cv-hairline), var(--cv-shadow);
	max-width: none;
	color: var(--cv-ink);
}
.cv-tag span { font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cv-ink-soft); }
.cv-tag strong { font-family: var(--cv-font-display); font-size: 1.5rem; font-weight: 400; }
.cv-tag em { font-style: normal; font-size: 0.875rem; color: #2f5d4a; font-weight: 600; }

@media (max-width: 899px) {
	.cv-hero__art { aspect-ratio: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
	.cv-print { position: static; width: auto !important; transform: none !important; aspect-ratio: 4 / 5; }
	.cv-print--back { display: none; }
	.cv-tag { position: static; grid-column: 1 / -1; }
}

/* Uses strip */
.cv-marquee {
	overflow: hidden;
	padding: 1.25rem 0;
	border-block: 1px solid var(--cv-hairline);
	background: var(--cv-paper-deep);
}
.cv-marquee__track {
	display: flex;
	gap: 3rem;
	width: max-content;
	animation: cv-marquee 38s linear infinite;
}
.cv-marquee span {
	font-family: var(--cv-font-display);
	font-size: clamp(1.25rem, 2.2vw, 1.75rem);
	font-style: italic;
	white-space: nowrap;
	color: var(--cv-ink-soft);
}
.cv-marquee span::after { content: "\2726"; margin-left: 3rem; font-style: normal; font-size: 0.75em; color: var(--cv-accent); }
@keyframes cv-marquee { to { transform: translateX(-50%); } }

/* Collections bento */
.cv-bento { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 900px) {
	.cv-bento { grid-template-columns: 7fr 5fr; grid-template-rows: auto auto; }
	.cv-tile--xmas { grid-row: span 2; }
}
.cv-tile {
	position: relative;
	display: grid;
	gap: 1.5rem;
	padding: 0.5rem;
	border-radius: var(--cv-radius-lg);
	background: var(--cv-tile-bg, #fff);
	box-shadow: 0 0 0 1px var(--cv-hairline);
	color: var(--cv-ink);
	text-decoration: none;
	transition: transform 0.8s var(--cv-ease), box-shadow 0.8s var(--cv-ease);
}
a.cv-tile:hover { transform: translateY(-6px); box-shadow: 0 0 0 1px var(--cv-hairline), var(--cv-shadow); color: var(--cv-ink); }
.cv-tile__art {
	display: grid;
	place-items: center;
	aspect-ratio: 16 / 11;
	border-radius: calc(var(--cv-radius-lg) - 0.5rem);
	background: var(--cv-tile-art, var(--cv-paper-deep));
	overflow: hidden;
}
.cv-tile--xmas .cv-tile__art { aspect-ratio: 5 / 4; }
.cv-tile__art img { width: 62%; height: auto; transition: transform 1.2s var(--cv-ease); }
a.cv-tile:hover .cv-tile__art img { transform: scale(1.04) rotate(-1.5deg); }
.cv-tile__text { padding: 0 1.25rem 1.5rem; }
.cv-tile h3 { font-size: clamp(1.6rem, 2.4vw, 2.25rem); margin: 0 0 0.5rem; }
.cv-tile__cta { display: inline-block; margin-top: 1rem; font-weight: 600; color: var(--cv-accent); }
.cv-tile--xmas { --cv-accent: #2f5d4a; --cv-tile-art: #e5eee9; }
.cv-tile--pink { --cv-accent: #b85c74; --cv-tile-art: #f6e7eb; }
.cv-tile--soon {
	align-content: end;
	min-height: 15rem;
	padding: 2rem;
	--cv-accent: #b4602f;
	--cv-accent-tint: #f6e9df;
	background: linear-gradient(160deg, #f6e9df, var(--cv-paper));
}

/* Bundle spotlight */
.cv-spotlight { --cv-accent: #2f5d4a; --cv-accent-tint: #e5eee9; }
.cv-spotlight__grid {
	display: grid;
	gap: 3rem;
	padding: 2.5rem 1.5rem;
	border-radius: var(--cv-radius-lg);
	background: #1f2b25;
	color: #f3efe7;
}
@media (min-width: 900px) { .cv-spotlight__grid { grid-template-columns: 5fr 6fr; align-items: center; padding: 5rem; } }
.cv-spotlight h2, .cv-spotlight p { color: inherit; }
.cv-spotlight p { opacity: 0.78; }
.cv-spotlight .cv-eyebrow { background: rgba(243, 239, 231, 0.12); color: #cfe3d8; }
.cv-spotlight .wp-element-button { background: #f3efe7; color: #1f2b25; }
.cv-spotlight .wp-element-button:hover { background: #fff; color: #1f2b25; }
.cv-spotlight .cv-chip { background: rgba(31, 43, 37, 0.1); }
.cv-stats { display: flex; gap: 2.5rem; margin: 2rem 0 2.5rem; }
.cv-stats dt { font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.6; }
.cv-stats dd { margin: 0.25rem 0 0; font-family: var(--cv-font-display); font-size: 2.25rem; line-height: 1; }
.cv-spotlight__wall { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.cv-spotlight__wall .cv-print { position: static; aspect-ratio: 1; background: rgba(243, 239, 231, 0.06); box-shadow: 0 0 0 1px rgba(243, 239, 231, 0.1); }
.cv-spotlight__wall .cv-print:nth-child(even) { transform: translateY(2rem); }
.cv-spotlight__wall .cv-print img { background: #f3efe7; }
.cv-print--more {
	display: grid;
	place-content: center;
	text-align: center;
	gap: 0.25rem;
}
.cv-print--more strong { font-family: var(--cv-font-display); font-size: clamp(2.5rem, 4vw, 3.5rem); font-weight: 300; line-height: 1; }
.cv-print--more span { font-size: 0.875rem; opacity: 0.7; }

/* Steps */
.cv-steps__list {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--cv-hairline);
}
.cv-steps__list li {
	display: grid;
	grid-template-columns: 4rem 1fr;
	gap: 0.25rem 1.5rem;
	padding: 2rem 0;
	border-bottom: 1px solid var(--cv-hairline);
}
@media (min-width: 900px) {
	.cv-steps__list li { grid-template-columns: 8rem 22rem 1fr; align-items: baseline; padding: 2.5rem 0; }
}
.cv-steps__num { font-family: var(--cv-font-display); font-size: 1.25rem; color: var(--cv-accent); grid-row: span 2; }
@media (min-width: 900px) { .cv-steps__num { grid-row: auto; } }
.cv-steps h3 { margin: 0; font-size: 1.5rem; }
.cv-steps p { margin: 0; }

/* License */
.cv-license__grid { display: grid; gap: 3rem; }
@media (min-width: 900px) { .cv-license__grid { grid-template-columns: 4fr 7fr; align-items: start; } }
.cv-license h2 { margin: 1rem 0; }
.cv-license__cards { display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .cv-license__cards { grid-template-columns: 1fr 1fr; } }
.cv-card {
	padding: 2rem;
	border-radius: var(--cv-radius-lg);
	background: #fff;
	box-shadow: 0 0 0 1px var(--cv-hairline);
}
.cv-card h3 { font-size: 1.5rem; margin: 0; }
.cv-card__price { margin: 0.5rem 0 1.5rem; font-weight: 600; color: var(--cv-accent); }
.cv-card ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 0.75rem; color: var(--cv-ink-soft); }
.cv-card li { padding-left: 1.5rem; position: relative; }
.cv-card li::before { content: ""; position: absolute; left: 0; top: 0.8em; width: 0.75rem; height: 1px; background: currentColor; }
.cv-card--dark { background: var(--cv-ink); }
.cv-card--dark h3, .cv-card--dark li { color: #f3efe7; }
.cv-card--dark .cv-card__price { color: #e9b6c3; }

/* FAQ */
.cv-faq__list { max-width: 52rem; border-top: 1px solid var(--cv-hairline); }
.cv-faq details { border-bottom: 1px solid var(--cv-hairline); }
.cv-faq summary {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.5rem 0;
	cursor: pointer;
	list-style: none;
	font-family: var(--cv-font-display);
	font-size: 1.375rem;
}
.cv-faq summary::-webkit-details-marker { display: none; }
.cv-faq summary::after { content: "+"; font-family: var(--cv-font-body); transition: transform 0.5s var(--cv-ease); }
.cv-faq details[open] summary::after { transform: rotate(45deg); }
.cv-faq details p { margin: 0 0 1.5rem; }

/* Closing CTA */
.cv-close__inner {
	padding: 4rem 1.5rem;
	border-radius: var(--cv-radius-lg);
	background: radial-gradient(120% 140% at 0% 0%, #3c6b56 0%, #1f2b25 60%);
	color: #f3efe7;
}
@media (min-width: 900px) { .cv-close__inner { padding: 6rem; } }
.cv-close h2 { color: inherit; max-width: 16ch; }
.cv-close p { color: inherit; opacity: 0.78; margin: 1rem 0 2.5rem; }

@media (prefers-reduced-motion: reduce) {
	.cv-marquee__track { animation: none; }
	.cv-tile, .cv-tile__art img { transition: none; }
}