@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/cormorant-garamond-italic-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/cormorant-garamond-italic-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/cormorant-garamond-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/cormorant-garamond-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/cormorant-garamond-normal-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/cormorant-garamond-normal-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/cormorant-garamond-normal-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/cormorant-garamond-normal-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/plus-jakarta-sans-normal-400-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/plus-jakarta-sans-normal-400-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*
 * ChinaPackSource — shared public design system.
 * Adapted from cp-tailwind-v4-starter.css for the existing WordPress theme.
 * Kept as plain, scoped CSS so the public site does not need Tailwind Preflight.
 */

:root {
	--ccp-color-canvas: #f9f8f5;
	--ccp-color-surface: #ffffff;
	--ccp-color-cream: #f5f3ef;
	--ccp-color-blush: #f6e9e5;
	--ccp-color-ink: #14241e;
	--ccp-color-ink-strong: #1e4235;
	--ccp-color-ink-deep: #122620;
	--ccp-color-muted: #424a45;
	--ccp-color-tertiary: #66716b;
	--ccp-color-celadon: #87988d;
	--ccp-color-celadon-deep: #65786d;
	--ccp-color-celadon-soft: #e8ede8;
	--ccp-color-accent: #8e2a3e;
	--ccp-color-accent-hover: #721e2f;
	--ccp-color-cinnabar: var(--ccp-color-accent);
	--ccp-color-cinnabar-hover: var(--ccp-color-accent-hover);
	--ccp-color-brass: #ae9874;
	--ccp-color-rose: #cfa99f;
	--ccp-color-border: #d9d5cd;
	--ccp-color-hairline: rgba(20, 36, 30, 0.1);
	--ccp-color-success-bg: #edf4ec;
	--ccp-color-success-ink: #285b31;
	--ccp-color-error-bg: #fbefec;
	--ccp-color-error-ink: #721e2f;
	--ccp-color-white: #fff;
	--ccp-color-footer: #e6ebe5;
	--ccp-color-footer-ink: #14241e;
	--ccp-color-footer-muted: #424a45;

	/*
	 * Text colours for inverted (dark) surfaces.
	 * The light-surface text tokens above all fail on the deep green panels, so
	 * inverted blocks must pick from this group instead of declaring literals.
	 */
	--ccp-color-on-dark: #c2cec8;
	--ccp-color-on-dark-strong: #fcfbf8;
	--ccp-color-on-dark-accent: #a3c9b2;

	/* Compatibility aliases: use the semantic color names above in new CSS. */
	--ccp-color-bronze: var(--ccp-color-brass);
	--ccp-color-bronze-dark: var(--ccp-color-cinnabar);

	--ccp-font-display: "Cormorant Garamond", Garamond, "Noto Serif SC", Georgia, serif;
	--ccp-font-ui: "Plus Jakarta Sans", "Noto Sans SC", Arial, sans-serif;
	--ccp-font-body: var(--ccp-font-ui);
	--wp--preset--font-family--manrope: var(--ccp-font-ui);
	--ccp-serif: var(--ccp-font-display);
	--ccp-sans: var(--ccp-font-ui);
	--ccp-type-h1: clamp(2.125rem, 4vw, 3.75rem);
	--ccp-type-h2: clamp(1.625rem, 3vw, 2.5rem);
	--ccp-type-h3: clamp(1.25rem, 2vw, 1.75rem);
	--ccp-type-card-title: 0.9375rem;
	--ccp-type-catalog-filter-label: 1.125rem;
	--ccp-type-product-title: clamp(1.75rem, 2.5vw, 2.25rem);
	--ccp-type-body: 1rem;
	--ccp-type-small: 0.875rem;
	--ccp-type-label: 0.75rem;
	--ccp-type-button: 0.8125rem;

	/*
	 * Line height, letter spacing and font weight steps.
	 * These three groups pair 1:1 with the type tiers above; every public
	 * component must reference them instead of declaring its own values.
	 */
	--ccp-leading-display: 1.05;
	--ccp-leading-page: 1.12;
	--ccp-leading-section: 1.25;
	--ccp-leading-card: 1.35;
	--ccp-leading-body: 1.75;
	--ccp-leading-caption: 1.6;
	--ccp-leading-label: 1.4;

	--ccp-tracking-normal: 0;
	--ccp-tracking-heading: 0.02em;
	--ccp-tracking-button: 0.04em;
	--ccp-tracking-caps: 0.12em;

	--ccp-weight-regular: 400;
	--ccp-weight-medium: 500;
	--ccp-weight-semibold: 600;

	--ccp-space-1: 0.25rem;
	--ccp-space-2: 0.5rem;
	--ccp-space-3: 0.75rem;
	--ccp-space-4: 1rem;
	--ccp-space-6: 1.5rem;
	--ccp-space-8: 2rem;
	--ccp-space-12: 3rem;
	--ccp-space-16: 4rem;
	--ccp-space-20: 5rem;
	--ccp-space-24: 6rem;

	--ccp-container-width: 85rem;
	--ccp-content-width: var(--ccp-container-width);
	--ccp-gutter: 1.5rem;
	/* Canonical horizontal alignment for the public header and page content. */
	--ccp-page-container-width: 90rem;
	--ccp-page-gutter: clamp(1.125rem, 4.8vw, 3.875rem);
	--ccp-page-edge-inset: max(var(--ccp-page-gutter), calc((100% - var(--ccp-page-container-width)) / 2 + var(--ccp-page-gutter)));
	--ccp-section-gap: 6rem;
	--ccp-radius-none: 0;
	--ccp-radius-control: 0.1875rem;
	--ccp-radius-sm: var(--ccp-radius-control);
	--ccp-radius-md: 0.375rem;
	--ccp-radius-lg: 0.5rem;
	--ccp-border-width: 1px;
	--ccp-border-accent: rgba(135, 152, 141, 0.45);

	--ccp-shadow-sm: 0 2px 8px rgba(32, 39, 34, 0.04);
	--ccp-shadow-md: 0 12px 28px rgba(32, 39, 34, 0.06);
	--ccp-shadow-lg: 0 24px 50px -12px rgba(32, 39, 34, 0.08);

	--ccp-motion-duration-fast: 120ms;
	--ccp-motion-duration-standard: 240ms;
	--ccp-motion-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--ccp-motion-standard: var(--ccp-motion-duration-standard) var(--ccp-motion-ease);

	--ccp-focus-width: 2px;
	--ccp-focus-offset: 3px;
	--ccp-control-height: 2.75rem;
	--ccp-control-height-mobile: 3rem;
	--ccp-tap-target: 2.75rem;
	--ccp-button-primary-bg: var(--ccp-color-cinnabar);
	--ccp-button-primary-fg: var(--ccp-color-surface);
	--ccp-button-primary-hover: var(--ccp-color-cinnabar-hover);
	--ccp-button-secondary-bg: var(--ccp-color-surface);
	--ccp-button-secondary-fg: var(--ccp-color-ink);
	--ccp-button-secondary-border: var(--ccp-color-border);

	/* Breakpoint references: mobile 48rem, tablet 64rem, wide 90rem. */
}

body {
	background-color: var(--ccp-color-canvas);
	color: var(--ccp-color-muted);
	font-family: var(--ccp-font-body);
	font-size: var(--ccp-type-body);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

@layer components {
	body .wp-site-blocks :where(h1, h2, h3) {
		color: var(--ccp-color-ink);
		font-family: var(--ccp-font-display);
		font-weight: 400;
		letter-spacing: -0.01em;
	}
}

header.wp-block-template-part > .wp-block-group {
	max-width: var(--ccp-container-width) !important;
}

/* Bound editor-managed About content, including WordPress wide/full alignments. */
.ccp-about-page .wp-site-blocks > main {
	box-sizing: border-box;
	margin-inline: auto;
	max-width: var(--ccp-page-container-width);
	padding-inline: var(--ccp-page-gutter);
	width: 100%;
}

.ccp-about-page .wp-site-blocks > main > .wp-block-group,
.ccp-about-page .wp-block-post-content {
	box-sizing: border-box;
	margin-inline: 0;
	max-width: 100%;
	min-width: 0;
	padding-inline: 0;
	width: 100%;
}

.ccp-about-page .wp-block-post-content > :where(.alignwide, .alignfull) {
	margin-inline: 0;
	max-width: 100%;
	width: 100%;
}

.ccp-top-contact-bar {
	--ccp-content-width: var(--ccp-container-width);
	--ccp-ink: var(--ccp-color-ink);
	--ccp-serif: var(--ccp-font-display);
	--ccp-sans: var(--ccp-font-body);
	background: var(--ccp-color-cream);
	border-color: var(--ccp-color-border);
	color: var(--ccp-color-muted);
}

.ccp-top-contact-bar a {
	color: inherit;
}

.ccp-top-contact-bar a:hover,
.ccp-top-contact-bar a:focus-visible {
	color: var(--ccp-color-cinnabar);
}

header.wp-block-template-part .ccp-brand__link {
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-display);
}

header.wp-block-template-part .ccp-brand__mark {
	color: var(--ccp-color-bronze);
}

header.wp-block-template-part .wp-block-navigation-item__content,
header.wp-block-template-part .wp-block-navigation-item__label {
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-body);
}

header.wp-block-template-part .wp-block-navigation-item__content:hover,
header.wp-block-template-part .wp-block-navigation-item__content:focus-visible {
	color: var(--ccp-color-cinnabar);
}

header.wp-block-template-part .ccp-header-cta {
	background: var(--ccp-button-primary-bg);
	border-color: var(--ccp-button-primary-bg);
	border-radius: var(--ccp-radius-sm);
	color: var(--ccp-button-primary-fg);
	font-family: var(--ccp-font-body);
}

header.wp-block-template-part .ccp-header-cta:hover,
header.wp-block-template-part .ccp-header-cta:focus-visible {
	background: var(--ccp-button-primary-hover);
	border-color: var(--ccp-button-primary-hover);
}

/*
 * The footer previously shadowed the shared `--ccp-ink` here. No rule inside the
 * footer reads that name, so the override is dropped rather than renamed.
 */
.ccp-global-footer {
	background-color: var(--ccp-color-footer);
	background-image: linear-gradient(90deg, rgba(249, 248, 245, 0.94), rgba(230, 235, 229, 0.88)), url("images/atelier/atelier-mist-mountains.webp");
	background-position: center 55%;
	background-repeat: no-repeat;
	background-size: cover;
	color: var(--ccp-color-footer-ink);
	font-family: var(--ccp-font-body);
}

.ccp-global-footer__brand-link {
	font-family: var(--ccp-font-display);
}

.ccp-global-footer__group h2 {
	color: var(--ccp-color-footer-ink);
	font-family: var(--ccp-font-display);
}

/*
 * Homepage shell. Token definitions for the homepage live here and nowhere else;
 * `homepage.css` used to declare a second, conflicting set on this same selector.
 */
.ccp-homepage {
	max-width: var(--ccp-container-width);
	width: calc(100% - 2 * var(--ccp-gutter));
}

.ccp-homepage > section:not(.ccp-hero):not(.ccp-final-inquiry) {
	padding-block: clamp(3rem, 5vw, var(--ccp-section-gap));
}

.ccp-homepage .ccp-button,
.ccp-homepage .ccp-hero__actions a,
.ccp-homepage .ccp-featured-product__details {
	border-radius: var(--ccp-radius-sm);
	font-family: var(--ccp-font-body);
	min-height: 3rem;
}

.ccp-homepage > .ccp-hero {
	background: linear-gradient(105deg, var(--ccp-color-cream) 0%, var(--ccp-color-surface) 56%, var(--ccp-color-blush) 100%);
}

.ccp-homepage .ccp-button--primary,
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form > .ccp-button,
.ccp-homepage .ccp-final-inquiry .ccp-contact-form > .ccp-button {
	background: var(--ccp-button-primary-bg);
	border-color: var(--ccp-button-primary-bg);
}

.ccp-homepage .ccp-button--primary:hover,
.ccp-homepage .ccp-button--primary:focus-visible,
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form > .ccp-button:hover,
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form > .ccp-button:focus-visible,
.ccp-homepage .ccp-final-inquiry .ccp-contact-form > .ccp-button:hover,
.ccp-homepage .ccp-final-inquiry .ccp-contact-form > .ccp-button:focus-visible {
	background: var(--ccp-button-primary-hover);
	border-color: var(--ccp-button-primary-hover);
}

.ccp-homepage .ccp-button--outline {
	border-color: var(--ccp-color-border);
}

.ccp-catalog-template,
body.single-product .ccp-catalog-template {
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-body);
	max-width: var(--ccp-container-width);
	width: calc(100% - 2 * var(--ccp-gutter));
}

.ccp-product-listing.ccp-catalog-template {
	max-width: var(--ccp-container-width);
	padding-block: 2.5rem 5rem;
	width: calc(100% - 2 * var(--ccp-gutter));
}

body.single-product .ccp-catalog-template,
body.single-product .ccp-product-page {
	max-width: var(--ccp-container-width);
	padding-inline: 0;
}

.ccp-catalog-breadcrumbs,
.ccp-product-results,
.ccp-product-detail__description,
.ccp-product-customization p:not(.ccp-product-customization__eyebrow),
.ccp-rfq-form__privacy {
	color: var(--ccp-color-muted);
}

.ccp-catalog-breadcrumbs a:hover,
.ccp-catalog-breadcrumbs a:focus-visible,
.ccp-product-card__title a:hover,
.ccp-product-card__title a:focus-visible {
	color: var(--ccp-color-cinnabar);
}

.ccp-product-listing__header h1,
.ccp-product-listing__header h2,
.ccp-catalog-hero__copy h1,
.ccp-product-detail__title,
.ccp-product-customization h2,
.ccp-rfq__intro h2 {
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-display);
	font-weight: 400;
}

.ccp-product-card__title,
.ccp-product-card__title a {
	font-family: var(--ccp-font-ui);
	font-size: var(--ccp-type-card-title);
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.4;
}

.ccp-product-listing__eyebrow,
.ccp-product-card__category,
.ccp-product-detail__eyebrow,
.ccp-product-customization__eyebrow,
.ccp-rfq__intro > p:first-child {
	color: var(--ccp-color-cinnabar);
}

.ccp-product-card {
	background: var(--ccp-color-canvas);
	border: 1px solid var(--ccp-color-border);
	border-radius: var(--ccp-radius-md);
	overflow: hidden;
}

.ccp-product-card__media,
.ccp-product-card__image,
.ccp-product-card__image-placeholder {
	border-radius: var(--ccp-radius-sm);
}

.ccp-product-card__media {
	background: var(--ccp-color-surface);
}

.ccp-product-card__body {
	padding: 0.9rem 0.6rem 0.75rem;
}

.ccp-product-card__title a {
	color: var(--ccp-color-ink);
}

.ccp-product-card__details {
	border-color: var(--ccp-color-bronze);
	color: var(--ccp-color-cinnabar);
}

.ccp-product-filters {
	border-color: var(--ccp-color-border);
}

.ccp-product-filters label span,
.ccp-product-detail__applications-label,
.ccp-product-detail__specification dt,
.ccp-rfq-form label span {
	color: var(--ccp-color-muted);
}

.ccp-contact-form {
	display: grid;
	gap: 0.9rem 1rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ccp-contact-form .ccp-form-field {
	min-width: 0;
}

.ccp-contact-form .ccp-form-field--message,
.ccp-contact-form .ccp-form-field--website,
.ccp-contact-form .ccp-inquiry-product-context,
.ccp-contact-form .ccp-contact__contact-hint,
.ccp-contact-form .ccp-contact__privacy,
.ccp-contact-form > .ccp-button {
	grid-column: 1 / -1;
}

.ccp-contact-form label {
	display: grid;
	font-family: var(--ccp-font-body);
	font-size: var(--ccp-type-label);
	font-weight: 600;
	gap: 0.4rem;
}

.ccp-rfq-form input,
.ccp-rfq-form textarea,
.ccp-contact-form input:not([type="hidden"]),
.ccp-contact-form textarea,
.ccp-contact-form select,
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form input:not([type="hidden"]),
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form textarea,
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form select,
.ccp-homepage .ccp-final-inquiry .ccp-contact-form input:not([type="hidden"]),
.ccp-homepage .ccp-final-inquiry .ccp-contact-form textarea,
.ccp-homepage .ccp-final-inquiry .ccp-contact-form select {
	background: var(--ccp-color-canvas);
	border: 1px solid var(--ccp-color-border);
	border-radius: var(--ccp-radius-sm);
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-body);
}

.ccp-contact-form input:not([type="hidden"]),
.ccp-contact-form textarea,
.ccp-contact-form select {
	box-sizing: border-box;
	padding: 0.65rem 0.875rem;
	width: 100%;
}

.ccp-contact-form textarea {
	min-height: 8rem;
	resize: vertical;
}

.ccp-contact-form .ccp-form-field--website {
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

.ccp-form-notice {
	border: 1px solid var(--ccp-color-border);
	border-radius: var(--ccp-radius-sm);
	margin-block: 0 1rem;
	padding: 0.75rem 1rem;
}

.ccp-form-notice--success {
	background: var(--ccp-color-success-bg);
	color: var(--ccp-color-success-ink);
}

.ccp-form-notice--error {
	background: var(--ccp-color-error-bg);
	color: var(--ccp-color-error-ink);
}

.ccp-rfq-form input,
.ccp-contact-form input:not([type="hidden"]),
.ccp-contact-form select,
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form input:not([type="hidden"]),
.ccp-homepage .ccp-quick-inquiry .ccp-contact-form select,
.ccp-homepage .ccp-final-inquiry .ccp-contact-form input:not([type="hidden"]),
.ccp-homepage .ccp-final-inquiry .ccp-contact-form select {
	min-height: 3rem;
}

.ccp-contact-form > .ccp-button {
	align-items: center;
	background: var(--ccp-button-primary-bg);
	border: 1px solid var(--ccp-button-primary-bg);
	border-radius: var(--ccp-radius-sm);
	color: var(--ccp-button-primary-fg);
	cursor: pointer;
	display: inline-flex;
	font-family: var(--ccp-font-body);
	justify-content: center;
	min-height: 3rem;
	padding: 0.75rem 1.5rem;
}

.ccp-contact-form > .ccp-button:hover,
.ccp-contact-form > .ccp-button:focus-visible {
	background: var(--ccp-button-primary-hover);
	border-color: var(--ccp-button-primary-hover);
	color: var(--ccp-button-primary-fg);
}

.ccp-product-filters button,
.ccp-product-filters [data-filter-reset],
.ccp-product-listing__cta > a,
.ccp-product-pagination .page-numbers .current,
.ccp-product-detail__quote,
.ccp-rfq-form button {
	background: var(--ccp-button-primary-bg);
	border-color: var(--ccp-button-primary-bg);
	border-radius: var(--ccp-radius-sm);
	color: var(--ccp-button-primary-fg);
	font-family: var(--ccp-font-body);
	min-height: 3rem;
}

.ccp-product-filters button:hover,
.ccp-product-filters button:focus-visible,
.ccp-product-listing__cta > a:hover,
.ccp-product-listing__cta > a:focus-visible,
.ccp-product-detail__quote:hover,
.ccp-product-detail__quote:focus-visible,
.ccp-rfq-form button:hover,
.ccp-rfq-form button:focus-visible {
	background: var(--ccp-button-primary-hover);
	border-color: var(--ccp-button-primary-hover);
	color: var(--ccp-button-primary-fg);
}

.ccp-product-filters [data-filter-reset] {
	background: transparent;
	border-color: transparent;
	color: var(--ccp-color-muted);
}

.ccp-product-pagination .page-numbers a,
.ccp-product-pagination .page-numbers span {
	background: var(--ccp-color-canvas);
	border-color: var(--ccp-color-border);
	border-radius: var(--ccp-radius-sm);
	color: var(--ccp-color-ink);
}

.ccp-product-pagination .page-numbers a:hover,
.ccp-product-pagination .page-numbers a:focus-visible {
	border-color: var(--ccp-color-bronze);
	color: var(--ccp-color-cinnabar);
}

.ccp-product-pagination .page-numbers .current {
	color: var(--ccp-button-primary-fg);
}

.ccp-product-listing__cta {
	background: var(--ccp-color-surface);
	border: 1px solid var(--ccp-color-border);
	border-radius: var(--ccp-radius-lg);
}

/*
 * Not-found route. Reuses the shared header and footer, so only the page body
 * needs component rules here; layout and spacing come from `tw:` utilities.
 *
 * Typography is declared in this scope rather than as `tw:` utilities because the
 * active theme prints its theme.json globals as inline, unlayered styles, and
 * unlayered rules outrank `@layer utilities` for the same property.
 */
.ccp-error-404__eyebrow,
.ccp-error-404__label {
	color: var(--ccp-color-cinnabar);
	font-family: var(--ccp-font-body);
	font-size: var(--ccp-type-label);
	font-weight: var(--ccp-weight-semibold);
	letter-spacing: var(--ccp-tracking-caps);
	line-height: var(--ccp-leading-label);
	text-transform: uppercase;
}

.ccp-error-404__label {
	color: var(--ccp-color-muted);
}

.ccp-error-404__title {
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-display);
	font-size: var(--ccp-type-h1);
	font-weight: var(--ccp-weight-regular);
	letter-spacing: var(--ccp-tracking-heading);
	line-height: var(--ccp-leading-display);
}

.ccp-error-404__lead {
	color: var(--ccp-color-muted);
	font-family: var(--ccp-font-body);
	font-size: var(--ccp-type-body);
	font-weight: var(--ccp-weight-regular);
	letter-spacing: var(--ccp-tracking-normal);
	line-height: var(--ccp-leading-body);
}

.ccp-error-404__field input {
	border-radius: var(--ccp-radius-md);
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-body);
	font-size: var(--ccp-type-body);
	line-height: var(--ccp-leading-caption);
}

.ccp-error-404__field input::placeholder {
	color: var(--ccp-color-tertiary);
}

.ccp-error-404__submit,
.ccp-error-404__cta {
	align-items: center;
	border-radius: var(--ccp-radius-control);
	cursor: pointer;
	display: inline-flex;
	font-family: var(--ccp-font-body);
	font-size: var(--ccp-type-button);
	font-weight: var(--ccp-weight-semibold);
	justify-content: center;
	letter-spacing: var(--ccp-tracking-button);
	line-height: var(--ccp-leading-label);
	min-height: var(--ccp-control-height);
	text-decoration: none;
	transition: background-color var(--ccp-motion-duration-fast) var(--ccp-motion-ease),
		border-color var(--ccp-motion-duration-fast) var(--ccp-motion-ease);
}

.ccp-error-404__submit,
.ccp-error-404__cta--primary {
	background: var(--ccp-button-primary-bg);
	border-color: var(--ccp-button-primary-bg);
	color: var(--ccp-button-primary-fg);
}

.ccp-error-404__submit:hover,
.ccp-error-404__submit:focus-visible,
.ccp-error-404__cta--primary:hover,
.ccp-error-404__cta--primary:focus-visible {
	background: var(--ccp-button-primary-hover);
	border-color: var(--ccp-button-primary-hover);
	color: var(--ccp-button-primary-fg);
}

.ccp-error-404__cta--secondary {
	background: var(--ccp-button-secondary-bg);
	border-color: var(--ccp-button-secondary-border);
	color: var(--ccp-button-secondary-fg);
}

.ccp-error-404__cta--secondary:hover,
.ccp-error-404__cta--secondary:focus-visible {
	border-color: var(--ccp-color-brass);
	color: var(--ccp-color-cinnabar);
}

.ccp-error-404__link {
	align-items: center;
	color: var(--ccp-color-muted);
	display: inline-flex;
	font-family: var(--ccp-font-body);
	font-size: var(--ccp-type-body);
	font-weight: var(--ccp-weight-regular);
	letter-spacing: var(--ccp-tracking-normal);
	line-height: var(--ccp-leading-label);
	min-height: var(--ccp-tap-target);
	text-decoration: none;
}

.ccp-error-404__link:hover,
.ccp-error-404__link:focus-visible {
	color: var(--ccp-color-cinnabar);
	text-decoration: underline;
}

.ccp-product-listing__cta p {
	color: var(--ccp-color-muted);
}

.ccp-product-detail,
.ccp-product-customization,
.ccp-rfq {
	--ccp-product-canvas: var(--ccp-color-canvas);
	--ccp-product-ink: var(--ccp-color-ink);
	--ccp-product-muted: var(--ccp-color-muted);
	--ccp-product-line: var(--ccp-color-border);
	--ccp-product-gold: var(--ccp-color-bronze);
	color: var(--ccp-color-ink);
	font-family: var(--ccp-font-body);
}

/*
 * Product-detail token set. `single-product.css` declared a second copy of these
 * on `body.single-product`; it loaded later and therefore won, so its two
 * divergent values are folded in here to keep one source.
 */
body.single-product {
	--ccp-product-canvas: var(--ccp-color-canvas);
	--ccp-product-ink: var(--ccp-color-ink);
	--ccp-product-muted: var(--ccp-color-tertiary);
	--ccp-product-line: var(--ccp-color-border);
	--ccp-product-gold: var(--ccp-color-accent);
	background-color: var(--ccp-color-canvas);
}

.ccp-product-detail__stage,
.ccp-product-detail__thumbnail {
	background-color: var(--ccp-color-surface);
	border-radius: var(--ccp-radius-md);
}

.ccp-product-detail__application-chip {
	background: var(--ccp-color-surface);
	border-color: var(--ccp-color-border);
	border-radius: var(--ccp-radius-sm);
	color: var(--ccp-color-muted);
}

.ccp-product-detail__application-chip:hover,
.ccp-product-detail__application-chip:focus-visible {
	background: var(--ccp-color-cream);
	border-color: var(--ccp-color-bronze);
	color: var(--ccp-color-cinnabar);
}

.ccp-product-detail__quote {
	background: var(--ccp-color-cinnabar);
	border-color: var(--ccp-color-cinnabar);
}

.ccp-product-customization,
.ccp-product-customization__eyebrow,
.ccp-product-detail__specifications,
.ccp-product-detail__specification,
.ccp-rfq {
	border-color: var(--ccp-color-border);
}

.ccp-product-detail__specification dt,
.ccp-product-detail__specification dd {
	color: var(--ccp-color-ink);
}

.ccp-product-detail__customization-link,
.ccp-product-customization > a {
	border-color: var(--ccp-color-bronze);
	color: var(--ccp-color-cinnabar);
}

.ccp-contact-form label,
.ccp-rfq-form label,
.ccp-product-filters label {
	font-family: var(--ccp-font-body);
}

:where(.ccp-homepage, .ccp-catalog-template, .ccp-contact-form, .ccp-error-404, header.wp-block-template-part, .ccp-global-footer)
:where(a, button, input, textarea, select, summary):focus-visible {
	outline: var(--ccp-focus-width) solid var(--ccp-color-cinnabar);
	outline-offset: var(--ccp-focus-offset);
}

.ccp-homepage :where(img),
.ccp-catalog-template :where(img) {
	max-width: 100%;
}

@media (max-width: 767px) {
	:root {
		--ccp-gutter: 1rem;
		--ccp-section-gap: 3rem;
	}

	.ccp-product-listing.ccp-catalog-template {
		padding-block: 1.75rem 3rem;
	}

	.ccp-product-listing__cta {
		border-radius: var(--ccp-radius-md);
	}

	.ccp-contact-form {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ccp-homepage *,
	.ccp-homepage *::before,
	.ccp-homepage *::after,
	.ccp-catalog-template *,
	.ccp-catalog-template *::before,
	.ccp-catalog-template *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}

/* Bridge WordPress theme typography to the same public tokens as Tailwind. */
body .wp-site-blocks :where(h1, h2, h3, h4, h5, h6) {
 font-family: var(--ccp-font-display);
 font-optical-sizing: auto;
}
body :where(button, input, select, textarea),
body .wp-block-button__link {
 font-family: var(--ccp-font-ui);
}
:root body {
	font-family: var(--ccp-font-body);
	font-optical-sizing: auto;
}