:root {
	--pk-color-canvas: #121212;
	--pk-color-surface: #161616;
	--pk-color-surface-elevated: #1A1A1A;
	--pk-color-global-chrome: #000000;
	--pk-color-action: #6BC8CC;
	--pk-color-action-hover: #7FF3F7;
	--pk-color-text: #AFB2B1;
	--pk-color-text-muted: rgb(175 178 177 / 0.65);
	--pk-color-border: #AFB2B14D;
	--pk-color-error: #E5484D;

	--pk-font-family-ui: Montserrat, sans-serif;
	--pk-font-size-page-title: 28px;
	--pk-font-size-section-heading: 20px;
	--pk-font-size-component-heading: 16px;
	--pk-font-size-control: 14px;
	--pk-font-size-body: 14px;
	--pk-font-size-metadata: 12px;
	--pk-font-weight-heading: 600;
	--pk-font-weight-control: 500;
	--pk-font-weight-body: 500;
	--pk-font-weight-button: 600;
	--pk-line-height-control: 20px;

	--pk-space-4: 4px;
	--pk-space-8: 8px;
	--pk-space-10: 10px;
	--pk-space-12: 12px;
	--pk-space-14: 14px;
	--pk-space-16: 16px;
	--pk-space-20: 20px;
	--pk-space-24: 24px;
	--pk-space-30: 30px;
	--pk-space-32: 32px;
	--pk-space-40: 40px;

	--pk-page-gutter-desktop: clamp(12px, 2.5vw, 30px);
	--pk-page-top-gap: 32px;
	--pk-page-intro-content-gap: 32px;
	--pk-section-gap: 40px;
	--pk-panel-padding: 24px;
	--pk-card-padding: 16px;
	--pk-grid-gap: 16px;
	--pk-component-group-gap: 24px;
	--pk-component-gap: 16px;
	--pk-radius-surface: 4px;
	--pk-radius-input: 4px;
	--pk-radius-button: 3px;
	--pk-border-standard: 1px solid var(--pk-color-border);
	--pk-shadow-primary-container: 0 10px 26px rgba(0, 0, 0, 0.58), 0 3px 8px rgba(0, 0, 0, 0.44), 0 1px 2px rgba(0, 0, 0, 0.32);
	--pk-padding-primary-container: var(--pk-panel-padding);
	--pk-button-height: 36px;
	--pk-header-height-desktop: 72px;
	--pk-header-height-mobile: 60px;
	--pk-header-search-max-height: 180px;
	--pk-header-search-offset: 6px;
	--pk-layer-page: 0;
	--pk-layer-backdrop: 20;
	--pk-layer-overlay: 30;
	--pk-layer-header: 40;
	--pk-icon-size: 16px;
	--pk-icon-size-compact: 16px;
	--pk-icon-stroke-width: 1.75;
	--pk-community-grid-gap: clamp(12px, 1.33vw, 16px);
	--pk-community-panel-padding: clamp(16px, calc(4px + 1.67vw), 24px);
	--pk-header-brand-width: clamp(175px, calc(75px + 11.25vw), 210px);
	--pk-header-action-icon-size: clamp(18px, calc(16.67px + 0.444vw), 22px);
	--pk-header-action-hit-size: clamp(24px, calc(20.57px + 0.893vw), 32px);
	--pk-header-action-gap: clamp(4px, calc(1.33px + 1.223vw), 16px);
	--pk-motion-duration: 0.25s;
	--pk-overlay-motion-duration: 0.325s;
	--pk-overlay-motion-easing: cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 767.98px) {
	:root {
		--pk-page-top-gap: clamp(24px, calc(18.42px + 1.74vw), 32px);
		--pk-page-intro-content-gap: clamp(24px, calc(18.42px + 1.74vw), 32px);
		--pk-section-gap: clamp(32px, calc(26.42px + 1.74vw), 40px);
		--pk-panel-padding: clamp(16px, calc(13.21px + 0.91vw), 20px);
		--pk-card-padding: clamp(14px, calc(12.21px + 0.56vw), 16px);
		--pk-grid-gap: clamp(12px, calc(9.21px + 0.91vw), 16px);
		--pk-component-group-gap: clamp(20px, calc(17.21px + 0.91vw), 24px);
	}
}
