@import url("./sections/header.css?v=20261102-6");
@import url("./sections/hero.css?v=20261102-7");
@import url("./sections/services.css?v=20261102-13");
@import url("./sections/process.css?v=20261102-6");
@import url("./sections/coaching.css?v=20261102-8");
@import url("./sections/proof.css?v=20261102-7");
@import url("./sections/faq.css?v=20261102-7");
@import url("./sections/cta.css?v=20261102-6");
@import url("./sections/footer.css?v=20261102-8");

@font-face {
	font-family: "Manrope";
	src: url("../fonts/manrope-latin.woff2") format("woff2");
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	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: "Manrope";
	src: url("../fonts/manrope-vietnamese.woff2") format("woff2");
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

:root {
	color-scheme: light;

	/* Colour scale */
	--jc-navy-950: #05070a;
	--jc-navy-900: #111827;
	--jc-navy-800: #1f2b4d;
	--jc-navy-700: #33405e;
	--jc-navy-600: #4d5873;
	--jc-stone-400: #a6a7a5;
	--jc-stone-300: #c9c8c3;
	--jc-stone-200: #e3e1dc;
	--jc-stone-100: #f4f4f2;
	--jc-white: #ffffff;
	--jc-amber-600: #dd7b0c;
	--jc-amber-500: #f7941d;
	--jc-amber-300: #ffc36b;

	/* Semantic colour roles */
	--jc-color-bg: var(--jc-white);
	--jc-color-surface: var(--jc-stone-100);
	--jc-color-surface-strong: var(--jc-stone-200);
	--jc-color-ink: var(--jc-navy-800);
	--jc-color-muted: var(--jc-navy-600);
	--jc-color-inverse: var(--jc-white);
	--jc-color-dark-field: var(--jc-navy-950);
	--jc-color-mid-field: var(--jc-navy-900);
	--jc-color-accent: var(--jc-amber-500);
	--jc-color-accent-strong: var(--jc-amber-600);
	--jc-color-accent-soft: var(--jc-amber-300);
	--jc-color-accent-ink: var(--jc-navy-950);
	--jc-color-focus: var(--jc-amber-600);

	/* Fluid type scale */
	--jc-font-sans: "Manrope", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--jc-font-size-small: clamp(0.8125rem, 0.79rem + 0.1vw, 0.875rem);
	--jc-font-size-body: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
	--jc-font-size-lead: clamp(1.25rem, 1.08rem + 0.65vw, 1.625rem);
	--jc-font-size-head: clamp(2.5rem, 1.55rem + 3.8vw, 4.75rem);
	--jc-font-size-display: clamp(3.5rem, 2.1rem + 6.4vw, 8rem);
	--jc-line-tight: 0.92;
	--jc-line-heading: 0.98;
	--jc-line-body: 1.5;
	--jc-letter-display: -0.05em;
	--jc-letter-heading: -0.04em;

	/* Spacing scale */
	--jc-space-1: 0.25rem;
	--jc-space-2: 0.5rem;
	--jc-space-3: 0.75rem;
	--jc-space-4: 1rem;
	--jc-space-5: 1.25rem;
	--jc-space-6: 1.5rem;
	--jc-space-7: 2rem;
	--jc-space-8: 2.5rem;
	--jc-space-9: 3rem;
	--jc-space-10: 4rem;
	--jc-space-11: 5rem;
	--jc-space-12: 6rem;
	--jc-space-14: 8rem;
	--jc-section-space: clamp(7rem, 11vw, 11rem);
	--jc-section-space-compact: clamp(5rem, 8vw, 8rem);

	/* Shape, depth, motion and frame */
	--jc-radius: 0;
	--jc-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--jc-ease-expo: cubic-bezier(0.16, 1, 0.3, 1);
	--jc-ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
	--jc-ease-soft: cubic-bezier(0.33, 1, 0.68, 1);
	--jc-duration-press: 140ms;
	--jc-duration-hover: 180ms;
	--jc-duration-ui: 240ms;
	--jc-duration-reveal: 800ms;
	--jc-duration-open: 1200ms;
	--jc-container-max: 120rem;
	--jc-page-gutter: clamp(1rem, 1.7vw, 1.75rem);
	--jc-board-gap: clamp(0.375rem, 0.6vw, 0.625rem);
	--jc-grid-gap: clamp(1rem, 1.6vw, 1.75rem);
	--jc-header-height: 4.25rem;
	--jc-control-height: 3.5rem;
	--jc-focus-width: 0.1875rem;

	/* Keep Elementor and WooCommerce on the same brand system. */
	--e-global-typography-primary-font-family: "Manrope";
	--e-global-typography-secondary-font-family: "Manrope";
	--e-global-typography-text-font-family: "Manrope";
	--e-global-typography-accent-font-family: "Manrope";
	--wc-primary: var(--jc-color-accent);
	--wc-primary-text: var(--jc-color-accent-ink);
	--wc-secondary: var(--jc-color-surface);
	--wc-secondary-text: var(--jc-color-ink);
	--wc-red: var(--jc-color-accent-strong);
	--wc-green: var(--jc-color-ink);
	--wp--preset--color--vivid-red: var(--jc-color-accent-strong);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body,
button,
input,
textarea,
select,
optgroup {
	font-family: var(--jc-font-sans);
}

:where(h1, h2, h3, h4, h5, h6) {
	font-family: var(--jc-font-sans);
}

body.jc-home {
	margin: 0;
	background: var(--jc-color-bg);
	color: var(--jc-color-ink);
	font-family: var(--jc-font-sans);
	font-size: var(--jc-font-size-body);
	font-weight: 400;
	line-height: var(--jc-line-body);
	letter-spacing: -0.005em;
	text-rendering: optimizeLegibility;
}

body.jc-home.jc-menu-open {
	overflow: hidden;
}

body.jc-home :where(h1, h2, h3, h4, h5, h6, p, ul, ol, blockquote, figure) {
	margin: 0;
}

body.jc-home :where(ul, ol) {
	padding: 0;
}

body.jc-home :where(h1, h2, h3, h4, h5, h6) {
	font-family: var(--jc-font-sans);
	font-weight: 500;
	line-height: var(--jc-line-heading);
	letter-spacing: var(--jc-letter-heading);
	text-wrap: balance;
}

body.jc-home h1 {
	font-size: var(--jc-font-size-display);
	line-height: var(--jc-line-tight);
	letter-spacing: var(--jc-letter-display);
}

body.jc-home h2 {
	font-size: var(--jc-font-size-head);
}

body.jc-home h3 {
	font-size: var(--jc-font-size-lead);
}

body.jc-home p {
	max-width: 62ch;
	text-wrap: pretty;
}

body.jc-home a {
	color: inherit;
	text-decoration-thickness: 0.07em;
	text-underline-offset: 0.18em;
}

body.jc-home :where(button, input, textarea, select) {
	font: inherit;
}

body.jc-home :where(button, summary) {
	cursor: pointer;
}

body.jc-home :where(img, svg, video) {
	display: block;
	max-width: 100%;
}

body.jc-home :focus-visible {
	outline: var(--jc-focus-width) solid var(--jc-color-focus);
	outline-offset: var(--jc-space-1);
}

body.jc-home ::selection {
	background: var(--jc-color-accent);
	color: var(--jc-color-accent-ink);
}

.jc-site {
	overflow: clip;
}

.jc-container {
	width: min(100%, var(--jc-container-max));
	margin-inline: auto;
	padding-inline: var(--jc-page-gutter);
}

.jc-section {
	position: relative;
	padding-block: var(--jc-section-space);
}

.jc-section,
body.jc-home [id] {
	scroll-margin-top: calc(var(--jc-header-height) + var(--jc-space-4));
}

.jc-section__heading {
	max-width: 14ch;
}

body.jc-home .jc-button {
	display: inline-flex;
	min-height: var(--jc-control-height);
	align-items: center;
	justify-content: center;
	padding: var(--jc-space-4) var(--jc-space-6);
	border: 0;
	border-radius: var(--jc-radius);
	background: var(--jc-color-accent);
	color: var(--jc-color-accent-ink);
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	transition: transform var(--jc-duration-press) var(--jc-ease-out), background-color var(--jc-duration-hover) ease, color var(--jc-duration-hover) ease;
}

body.jc-home .jc-button--dark {
	background: var(--jc-color-dark-field);
	color: var(--jc-color-inverse);
}

.jc-button:active {
	transform: scale(0.97);
}

.jc-text-link {
	font-weight: 500;
	text-decoration-color: transparent;
	transition: text-decoration-color var(--jc-duration-hover) ease;
}

.jc-skip-link {
	position: fixed;
	top: var(--jc-space-4);
	left: var(--jc-page-gutter);
	z-index: 1000;
	transform: translateY(-200%);
	background: var(--jc-color-accent);
	color: var(--jc-color-accent-ink);
	padding: var(--jc-space-3) var(--jc-space-4);
}

.jc-skip-link:focus {
	transform: none;
}

.jc-screen-reader-text {
	position: absolute;
	width: 0.0625rem;
	height: 0.0625rem;
	padding: 0;
	margin: -0.0625rem;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (hover: hover) and (pointer: fine) {
	body.jc-home .jc-button:hover {
		background: var(--jc-color-accent-strong);
		color: var(--jc-color-inverse);
	}

	body.jc-home .jc-button--dark:hover {
		background: var(--jc-color-ink);
	}

	.jc-text-link:hover {
		text-decoration-color: currentColor;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.js [data-reveal] {
		opacity: 0;
		transform: translateY(var(--jc-space-6));
		transition: opacity var(--jc-duration-reveal) var(--jc-ease-expo), transform var(--jc-duration-reveal) var(--jc-ease-expo);
	}

	.js [data-reveal].is-in {
		opacity: 1;
		transform: none;
	}

	.js .jc-hero [data-load] {
		opacity: 0;
		transform: translateY(var(--jc-space-4));
		animation: jc-load-rise 650ms var(--jc-ease-expo) forwards;
	}

	.js .jc-hero [data-load]:nth-child(4) {
		animation-delay: 180ms;
	}

	.js .jc-hero [data-load]:nth-child(5) {
		animation-delay: 260ms;
	}

	.js .jc-shutter {
		clip-path: inset(0 0 100% 0);
		animation: jc-shutter-open 1100ms var(--jc-ease-in-out) 120ms forwards;
	}

	.js .jc-shutter img {
		transform: scale(1.12);
		animation: jc-image-settle 1400ms var(--jc-ease-soft) 80ms forwards;
	}

	@supports (animation-timeline: view()) {
		.jc-services__ownership img,
		.jc-coaching__image img {
			animation: jc-image-drift linear both;
			animation-timeline: view();
			animation-range: entry 0% exit 100%;
		}
	}
}

@keyframes jc-load-rise {
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes jc-shutter-open {
	to {
		clip-path: inset(0);
	}
}

@keyframes jc-image-settle {
	to {
		transform: none;
	}
}

@keyframes jc-image-drift {
	from {
		transform: translateY(-3%) scale(1.06);
	}

	to {
		transform: translateY(3%) scale(1.06);
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* WooCommerce colour reset: remove the plugin's default pink/purple accents. */
.woocommerce :where(a.button, button.button, input.button, #respond input#submit),
.woocommerce-page :where(a.button, button.button, input.button, #respond input#submit),
.wc-block-components-button:not(.is-link) {
	border: 0 !important;
	border-radius: var(--jc-radius) !important;
	background: var(--jc-color-accent) !important;
	color: var(--jc-color-accent-ink) !important;
	font-family: var(--jc-font-sans) !important;
	font-weight: 600 !important;
}

.woocommerce :where(a.button, button.button, input.button, #respond input#submit):hover,
.woocommerce-page :where(a.button, button.button, input.button, #respond input#submit):hover,
.wc-block-components-button:not(.is-link):hover {
	background: var(--jc-color-accent-strong) !important;
	color: var(--jc-color-inverse) !important;
}

.woocommerce span.onsale,
.wc-block-grid__product-onsale,
.wc-block-components-product-sale-badge {
	border: 0 !important;
	border-radius: var(--jc-radius) !important;
	background: var(--jc-color-dark-field) !important;
	color: var(--jc-color-inverse) !important;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
	border-color: var(--jc-color-ink) !important;
	background: var(--jc-color-surface) !important;
	color: var(--jc-color-ink) !important;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before,
.wc-block-components-notice-banner > svg {
	color: var(--jc-color-ink) !important;
	fill: var(--jc-color-ink) !important;
}

.woocommerce a.remove,
.wc-block-cart-item__remove-link,
.wc-block-components-chip__remove {
	color: var(--jc-color-ink) !important;
}
