@font-face {
	font-family: 'DM Sans';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('/fonts/dm-sans-v17-latin.woff2') format('woff2');
}

@font-face {
	font-family: 'DM Serif Display';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/fonts/dm-serif-display-v17-latin.woff2') format('woff2');
}

@font-face {
	font-family: 'DM Serif Display';
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url('/fonts/dm-serif-display-v17-italic-latin.woff2') format('woff2');
}

:root {
	--navy: #080d19;
	--navy-soft: #101a2d;
	--ink: #0b1020;
	--paper: #fffaf0;
	--cream: #f3ecdf;
	--gold: #d9b66f;
	--gold-light: #f2d99a;
	--muted: #586273;
	--muted-light: #bec8d6;
	--line: rgba(11, 16, 32, 0.14);
	--line-dark: rgba(255, 255, 255, 0.14);
	--serif: 'DM Serif Display', Georgia, serif;
	--sans: 'DM Sans', Aptos, 'Segoe UI', sans-serif;
	--shell: 1180px;
	--header-height: 76px;
}

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

html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--header-height);
}

body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

body.menu-open {
	overflow: hidden;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
input,
select,
textarea {
	font: inherit;
}

button,
a {
	-webkit-tap-highlight-color: transparent;
}

img,
svg {
	display: block;
}

p,
h1,
h2,
h3,
blockquote {
	margin-top: 0;
}

.shell {
	width: min(calc(100% - 48px), var(--shell));
	margin-inline: auto;
}

.skip-link {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 200;
	padding: 10px 16px;
	background: var(--gold-light);
	color: var(--ink);
	transform: translateY(-150%);
}

.skip-link:focus {
	transform: translateY(0);
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	min-height: var(--header-height);
	background: rgba(8, 13, 25, 0.94);
	border-bottom: 1px solid var(--line-dark);
	color: #fff;
	backdrop-filter: blur(16px);
}

.header-inner {
	height: var(--header-height);
	display: flex;
	align-items: center;
	gap: 32px;
}

.wordmark {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	flex: 0 0 auto;
}

.wordmark-mark {
	width: 31px;
	height: 31px;
	fill: none;
	stroke: var(--gold);
	stroke-width: 3.5;
	stroke-linecap: square;
	stroke-linejoin: miter;
}

.wordmark-mark .mark-arrow {
	fill: var(--gold);
	stroke: none;
}

.wordmark-copy {
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	gap: 3px;
}

.wordmark-name {
	display: block;
	font-family: var(--serif);
	font-size: 25px;
	line-height: 1;
	letter-spacing: -0.015em;
}

.wordmark-byline {
	display: block;
	padding-left: 1px;
	color: var(--muted-light);
	font-size: 7px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

.desktop-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 28px;
	margin-left: auto;
	font-size: 13px;
	font-weight: 600;
}

.desktop-nav a {
	color: rgba(255, 255, 255, 0.74);
	transition: color 180ms ease;
}

.desktop-nav a:hover,
.desktop-nav a:focus-visible {
	color: #fff;
}

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 22px;
	border: 1px solid var(--gold);
	border-radius: 0;
	background: linear-gradient(135deg, var(--gold-light), var(--gold));
	color: var(--ink);
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.button:hover,
.button:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 14px 32px rgba(217, 182, 111, 0.2);
}

.button-small {
	min-height: 40px;
	padding: 10px 16px;
	font-size: 12px;
}

.header-cta {
	margin-left: 2px;
}

.menu-toggle {
	display: none;
	width: 42px;
	height: 42px;
	margin-left: auto;
	border: 1px solid var(--line-dark);
	background: transparent;
	color: #fff;
	cursor: pointer;
}

.menu-toggle span {
	display: block;
	width: 18px;
	height: 1px;
	margin: 5px auto;
	background: currentColor;
	transition: transform 180ms ease;
}

.menu-toggle[aria-expanded='true'] span:first-child {
	transform: translateY(3px) rotate(45deg);
}

.menu-toggle[aria-expanded='true'] span:last-child {
	transform: translateY(-3px) rotate(-45deg);
}

.menu-toggle:focus-visible,
.mobile-nav a:focus-visible {
	outline: 2px solid var(--gold-light);
	outline-offset: 4px;
}

.mobile-nav {
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	height: calc(100vh - var(--header-height));
	height: calc(100dvh - var(--header-height));
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 32px 24px;
	background: var(--navy);
}

.mobile-nav a {
	display: block;
	padding: 18px 0;
	border-bottom: 1px solid var(--line-dark);
	font-family: var(--serif);
	font-size: 29px;
}

.hero {
	position: relative;
	min-height: 810px;
	overflow: hidden;
	display: flex;
	align-items: center;
	background:
		radial-gradient(circle at 18% 20%, rgba(217, 182, 111, 0.13), transparent 28%),
		radial-gradient(circle at 82% 18%, rgba(72, 118, 158, 0.2), transparent 32%),
		linear-gradient(135deg, #070b16 0%, #080d19 48%, #0e1c32 100%);
	color: #fff;
}

.hero::after {
	content: '';
	position: absolute;
	inset: auto 0 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(217, 182, 111, 0.5), transparent);
}

.hero-grid {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(340px, 0.72fr);
	align-items: center;
	gap: 110px;
	padding-block: 110px 100px;
}

.hero h1 {
	max-width: 720px;
	margin-bottom: 28px;
	font-family: var(--serif);
	font-size: clamp(64px, 6.2vw, 92px);
	font-weight: 400;
	line-height: 0.97;
	letter-spacing: -0.035em;
}

.hero h1 em {
	color: var(--gold-light);
	font-weight: 400;
}

.eyebrow {
	margin-bottom: 20px;
	color: #76581f;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.eyebrow-light {
	color: var(--gold-light);
}

.hero-lead {
	max-width: 620px;
	margin-bottom: 34px;
	color: #d5dde8;
	font-size: 20px;
	line-height: 1.55;
}

.hero-actions {
	display: flex;
	align-items: center;
	gap: 28px;
}

.text-link {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 13px;
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: rgba(11, 16, 32, 0.28);
	text-underline-offset: 5px;
}

.text-link span {
	color: #9b772d;
	text-decoration: none;
}

.text-link-light {
	color: #fff;
	text-decoration-color: rgba(255, 255, 255, 0.28);
}

.text-link-light span {
	color: var(--gold-light);
}

.hero-card {
	position: relative;
	padding: 38px;
	border: 1px solid rgba(255, 255, 255, 0.17);
	background: rgba(255, 255, 255, 0.055);
	box-shadow: 0 32px 90px rgba(0, 0, 0, 0.25);
	backdrop-filter: blur(10px);
}

.hero-card::before {
	content: '';
	position: absolute;
	top: -1px;
	left: -1px;
	width: 68px;
	height: 3px;
	background: var(--gold);
}

.hero-card blockquote {
	margin-bottom: 0;
	font-family: var(--serif);
	font-size: 29px;
	line-height: 1.24;
}

.hero-orbit {
	position: absolute;
	border: 1px solid rgba(255, 255, 255, 0.055);
	border-radius: 50%;
}

.hero-orbit-one {
	width: 560px;
	height: 560px;
	top: -290px;
	right: -100px;
}

.hero-orbit-two {
	width: 760px;
	height: 760px;
	bottom: -600px;
	left: 8%;
}

.section {
	padding-block: 128px;
}

.section-paper {
	background: var(--paper);
}

.section-cream {
	background: var(--cream);
}

.section-dark {
	background: var(--navy);
	color: #fff;
}

.section-heading {
	max-width: 760px;
	margin-bottom: 58px;
}

.section-heading-centred {
	margin-inline: auto;
	text-align: center;
}

.section-heading h2,
.split-copy h2,
.philippines-copy h2,
.faq-intro h2,
.contact-copy h2 {
	margin-bottom: 24px;
	font-family: var(--serif);
	font-size: clamp(48px, 5.1vw, 72px);
	font-weight: 400;
	line-height: 1.04;
	letter-spacing: -0.028em;
}

.section-heading > p:last-child,
.faq-intro > p {
	max-width: 620px;
	margin-inline: auto;
	color: var(--muted);
	font-size: 18px;
}

.wide-heading {
	max-width: 870px;
}

.wide-heading > p:last-child {
	margin-left: 0;
}

.problem-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.line-card {
	min-height: 250px;
	padding: 35px 32px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.step > span {
	display: block;
	margin-bottom: 54px;
	color: #9b772d;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
}

.line-card h3,
.capability-card h3 {
	margin-bottom: 16px;
	font-family: var(--serif);
	font-size: 28px;
	font-weight: 400;
	line-height: 1.1;
}

.line-card p {
	margin-bottom: 0;
	color: var(--muted);
	font-size: 14px;
}

.split-layout {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(460px, 1fr);
	gap: 110px;
	align-items: start;
}

.split-copy {
	position: sticky;
	top: calc(var(--header-height) + 50px);
}

.large-copy {
	font-size: 20px;
	line-height: 1.6;
}

.split-copy > p:not(.eyebrow) {
	color: #414959;
}

.model-panel {
	border-top: 1px solid var(--line);
}

.model-row {
	display: grid;
	grid-template-columns: 62px 1fr;
	gap: 20px;
	padding: 27px 0;
	border-bottom: 1px solid var(--line);
}

.model-icon {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border: 1px solid var(--gold);
	color: #76581f;
	font-size: 10px;
	font-weight: 700;
}

.model-row strong {
	display: block;
	margin-bottom: 4px;
	font-family: var(--serif);
	font-size: 24px;
	font-weight: 400;
}

.model-row p {
	margin-bottom: 0;
	color: var(--muted);
	font-size: 14px;
}

.capability-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.capability-card {
	min-height: 310px;
	padding: 32px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	transition: background 200ms ease, transform 200ms ease;
}

.capability-card:hover {
	position: relative;
	z-index: 2;
	background: #fff;
	transform: translateY(-5px);
	box-shadow: 0 24px 60px rgba(11, 16, 32, 0.08);
}

.capability-card ul,
.contact-prompt ul {
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--muted);
	font-size: 13px;
}

.capability-card li {
	padding: 8px 0;
	border-bottom: 1px solid rgba(11, 16, 32, 0.08);
}

.capability-card li::before,
.contact-prompt li::before {
	content: '•';
	margin-right: 8px;
	color: #9b772d;
}

.section-note {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	padding: 28px 0;
	border-bottom: 1px solid var(--line);
}

.section-note p {
	margin: 0;
	font-family: var(--serif);
	font-size: 22px;
}

.dark-heading {
	max-width: 830px;
}

.dark-heading h2 {
	color: #fff;
}

.steps-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--line-dark);
	border-left: 1px solid var(--line-dark);
}

.step {
	min-height: 330px;
	padding: 34px 28px;
	border-right: 1px solid var(--line-dark);
	border-bottom: 1px solid var(--line-dark);
}

.step > span {
	margin-bottom: 80px;
	color: var(--gold-light);
}

.step h3 {
	margin-bottom: 15px;
	font-family: var(--serif);
	font-size: 27px;
	font-weight: 400;
}

.step p {
	margin: 0;
	color: var(--muted-light);
	font-size: 13px;
}

.philippines-proof {
	display: grid;
	grid-template-columns: minmax(0, 0.82fr) minmax(520px, 1fr);
	gap: 88px;
	align-items: start;
}

.philippines-copy h2 {
	margin-bottom: 44px;
}

.proof-points {
	border-top: 1px solid var(--line);
}

.proof-point {
	display: grid;
	grid-template-columns: 56px 1fr;
	gap: 24px;
	padding: 27px 0;
	border-bottom: 1px solid var(--line);
}

.proof-icon {
	padding-top: 3px;
}

.proof-icon svg {
	width: 32px;
	height: 32px;
	fill: none;
	stroke: var(--ink);
	stroke-width: 1.8;
	stroke-linecap: square;
	stroke-linejoin: miter;
}

.proof-point h3 {
	margin-bottom: 8px;
	font-size: 17px;
	font-weight: 700;
}

.proof-point p {
	margin: 0;
	color: var(--muted);
	font-size: 13px;
	line-height: 1.65;
}

.chart-stack {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.data-card {
	padding: 32px 36px 26px;
	border: 1px solid rgba(155, 119, 45, 0.24);
	background: rgba(255, 255, 255, 0.7);
	box-shadow: 0 18px 50px rgba(11, 16, 32, 0.035);
}

.data-card h3 {
	margin-bottom: 2px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.data-card > p {
	margin-bottom: 17px;
	color: var(--muted);
	font-size: 11px;
}

.data-card a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.data-rule {
	height: 1px;
	margin-bottom: 18px;
	background: var(--line);
}

.data-bars {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.data-row {
	display: grid;
	grid-template-columns: 105px minmax(100px, 1fr) 48px;
	align-items: center;
	gap: 13px;
	font-size: 11px;
}

.data-row > span,
.data-row > strong {
	font-weight: 700;
}

.data-row > strong {
	text-align: right;
}

.data-track {
	height: 11px;
	overflow: hidden;
	background: #dfe4e9;
}

.data-fill {
	width: var(--score);
	height: 100%;
	background: #9caaba;
}

.data-row.highlight .data-fill {
	background: linear-gradient(90deg, var(--gold-light), var(--gold));
}

.data-date {
	margin-top: 16px;
	padding-top: 12px;
	border-top: 1px solid rgba(11, 16, 32, 0.08);
	color: #5f6875;
	font-size: 9px;
	text-align: right;
}

.comparison-wrap {
	overflow-x: auto;
	border: 1px solid var(--line);
}

.comparison-wrap:focus-visible {
	outline: 3px solid #76581f;
	outline-offset: 4px;
}

table {
	width: 100%;
	min-width: 760px;
	border-collapse: collapse;
	font-size: 13px;
}

th,
td {
	padding: 22px 24px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	text-align: left;
}

thead th {
	font-size: 11px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

tbody th {
	font-weight: 600;
}

td {
	color: var(--muted);
}

.featured-cell {
	background: var(--navy);
	color: #fff;
}

.backed-strip {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 70px;
	align-items: end;
	margin-top: 56px;
	padding: 42px;
	background: var(--cream);
}

.backed-strip h3 {
	margin: 0;
	font-family: var(--serif);
	font-size: 34px;
	font-weight: 400;
	line-height: 1.15;
}

.backed-strip > p {
	margin: 0;
	color: var(--muted);
	font-size: 14px;
}

.testimonial-section {
	padding-block: 34px;
}

.testimonial-card {
	display: grid;
	grid-template-columns: 190px minmax(0, 1fr);
	gap: 42px;
	align-items: stretch;
	margin: 0 auto;
	padding: 36px 42px;
	border: 1px solid var(--line);
	border-left: 4px solid var(--gold);
	background: #fff;
	box-shadow: 0 18px 45px rgba(11, 16, 32, 0.06);
	color: var(--ink);
}

.testimonial-card blockquote {
	grid-column: 2;
	grid-row: 1;
	max-width: 820px;
	margin-bottom: 0;
	font-family: var(--serif);
	font-size: clamp(19px, 1.7vw, 24px);
	line-height: 1.45;
}

.testimonial-card figcaption {
	display: flex;
	grid-column: 1;
	grid-row: 1;
	justify-content: center;
	padding-right: 30px;
	border-right: 1px solid var(--line);
	flex-direction: column;
	gap: 7px;
}

.testimonial-card figcaption strong {
	font-size: 15px;
}

.review-stars {
	color: #76581f;
	font-size: 19px;
	line-height: 1;
	letter-spacing: 0.14em;
}

.pricing-section {
	border-top: 1px solid var(--line);
}

.pricing-heading {
	margin-bottom: 24px;
}

.currency-note {
	margin-bottom: 34px;
	color: #76581f;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-align: center;
	text-transform: uppercase;
}

.pricing-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: stretch;
	gap: 16px;
}

.price-card {
	position: relative;
	display: flex;
	min-height: 600px;
	padding: 34px 30px 30px;
	border: 1px solid var(--line);
	background: rgba(255, 250, 240, 0.62);
	flex-direction: column;
}

.price-card-featured {
	z-index: 2;
	border: 2px solid var(--gold);
	background: var(--paper);
	box-shadow: 0 24px 70px rgba(11, 16, 32, 0.13);
	transform: translateY(-10px);
}

.price-ribbon {
	position: absolute;
	top: 0;
	right: 0;
	padding: 7px 11px;
	background: var(--gold-light);
	color: var(--ink);
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.price-card h3 {
	margin-bottom: 17px;
	font-family: var(--serif);
	font-size: 31px;
	font-weight: 400;
	line-height: 1.1;
}

.price {
	margin: -3px 0 18px;
	font-family: var(--serif);
	font-size: 42px;
	line-height: 1;
}

.price span {
	font-family: var(--sans);
	font-size: 13px;
	font-weight: 600;
}

.price-card-intro {
	min-height: 84px;
	margin-bottom: 23px;
	color: var(--muted);
	font-size: 13px;
}

.price-card ul {
	margin: 0 0 30px;
	padding: 0;
	list-style: none;
	font-size: 12px;
}

.price-card li {
	padding: 9px 0;
	border-bottom: 1px solid rgba(11, 16, 32, 0.09);
}

.price-card li::before {
	content: '•';
	margin-right: 8px;
	color: #9b772d;
}

.price-card .button {
	margin-top: auto;
}

.faq-layout {
	display: grid;
	grid-template-columns: minmax(300px, 0.7fr) minmax(0, 1.2fr);
	gap: 100px;
	align-items: start;
}

.faq-intro {
	position: sticky;
	top: calc(var(--header-height) + 50px);
}

.faq-intro h2 {
	font-size: clamp(45px, 4.4vw, 64px);
}

.faq-intro > p {
	margin: 0 0 28px;
	font-size: 15px;
}

.faq-list {
	border-top: 1px solid var(--line);
}

.faq-list details {
	border-bottom: 1px solid var(--line);
}

.faq-list summary {
	position: relative;
	padding: 25px 45px 25px 0;
	font-family: var(--serif);
	font-size: 22px;
	line-height: 1.3;
	list-style: none;
	cursor: pointer;
}

.faq-list summary::-webkit-details-marker {
	display: none;
}

.faq-list summary span,
.faq-list summary span::after {
	position: absolute;
	top: 50%;
	right: 4px;
	width: 14px;
	height: 1px;
	background: #9b772d;
	content: '';
	transition: transform 180ms ease;
}

.faq-list summary span::after {
	top: 0;
	right: 0;
	transform: rotate(90deg);
}

.faq-list details[open] summary span::after {
	transform: rotate(0);
}

.faq-list details p {
	max-width: 700px;
	margin: -3px 45px 26px 0;
	color: var(--muted);
	font-size: 14px;
}

.faq-list details[open] p {
	animation: faq-answer-in 190ms ease-out both;
}

@keyframes faq-answer-in {
	from {
		opacity: 0;
		transform: translateY(-5px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.contact-section {
	padding-block: 130px;
}

.contact-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(440px, 1fr);
	gap: 100px;
	align-items: start;
}

.contact-copy h2 {
	font-size: clamp(54px, 5.6vw, 78px);
}

.contact-copy > p:not(.eyebrow) {
	max-width: 540px;
	color: var(--muted-light);
	font-size: 18px;
}

.contact-prompt {
	margin-top: 55px;
	padding-top: 25px;
	border-top: 1px solid var(--line-dark);
}

.contact-prompt > span {
	display: block;
	margin-bottom: 12px;
	color: var(--gold-light);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.contact-prompt ul {
	color: var(--muted-light);
}

.contact-form {
	padding: 38px;
	background: var(--paper);
	color: var(--ink);
	box-shadow: 0 32px 90px rgba(0, 0, 0, 0.28);
}

.form-fields {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.contact-form input:not([type='range']),
.contact-form textarea {
	width: 100%;
	border: 1px solid var(--line);
	border-radius: 0;
	outline: 0;
	background: #fff;
	color: var(--ink);
}

.contact-form input:not([type='range']) {
	height: 48px;
	padding: 0 13px;
}

.contact-form textarea {
	min-height: 110px;
	padding: 12px 13px;
	resize: vertical;
}

.contact-form input:not([type='range']):focus,
.contact-form textarea:focus {
	border-color: #9b772d;
	box-shadow: 0 0 0 2px rgba(217, 182, 111, 0.2);
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
	color: #7b8490;
	opacity: 1;
}

.range-field {
	padding: 13px;
	border: 1px solid var(--line);
	background: #fff;
}

.range-label,
.range-scale {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.range-label {
	margin-bottom: 10px;
	font-size: 11px;
	font-weight: 600;
}

.range-label label {
	margin: 0;
}

.range-label output {
	font-weight: 700;
}

.contact-form input[type='range'] {
	width: 100%;
	height: 4px;
	margin: 7px 0 8px;
	border: 0;
	border-radius: 0;
	outline: none;
	background: linear-gradient(to right, var(--gold) 0%, var(--gold) var(--range-progress, 33.33%), #dfe4e9 var(--range-progress, 33.33%), #dfe4e9 100%);
	appearance: none;
	cursor: pointer;
}

.contact-form input[type='range']:focus-visible {
	outline: 3px solid #76581f;
	outline-offset: 6px;
}

.contact-form input[type='range']::-webkit-slider-thumb {
	width: 15px;
	height: 15px;
	border: 2px solid var(--paper);
	border-radius: 50%;
	background: var(--gold);
	box-shadow: 0 0 0 1px #9b772d;
	appearance: none;
}

.contact-form input[type='range']::-moz-range-thumb {
	width: 13px;
	height: 13px;
	border: 2px solid var(--paper);
	border-radius: 50%;
	background: var(--gold);
	box-shadow: 0 0 0 1px #9b772d;
}

.range-scale {
	color: var(--muted);
	font-size: 9px;
}

.button-wide {
	width: 100%;
	justify-content: space-between;
}

.contact-form .cf-turnstile {
	max-width: 100%;
}

.contact-form button:disabled {
	cursor: wait;
	opacity: 0.65;
}

.form-status {
	margin: 12px 0 0;
	color: var(--muted);
	font-size: 12px;
}

.form-status:empty {
	display: none;
}

.legal-main {
	background: var(--paper);
}

.legal-shell {
	max-width: 900px;
}

.legal-hero {
	padding-block: 100px 82px;
	border-bottom: 1px solid var(--line);
	background: var(--cream);
}

.legal-hero h1 {
	max-width: 780px;
	margin-bottom: 20px;
	font-family: var(--serif);
	font-size: clamp(50px, 6vw, 76px);
	font-weight: 400;
	line-height: 1.04;
	letter-spacing: -0.03em;
}

.legal-hero p {
	margin: 0;
	color: var(--muted);
	font-size: 13px;
}

.legal-content {
	padding-block: 80px 120px;
	color: #303847;
}

.legal-content > p:first-child {
	margin-bottom: 55px;
	font-size: 18px;
}

.legal-content section {
	padding: 34px 0;
	border-top: 1px solid var(--line);
}

.legal-content h2 {
	margin-bottom: 14px;
	color: var(--ink);
	font-family: var(--serif);
	font-size: 29px;
	font-weight: 400;
	line-height: 1.18;
}

.legal-content p {
	margin-bottom: 14px;
}

.legal-content p:last-child {
	margin-bottom: 0;
}

.legal-content ul {
	margin: 18px 0 0;
	padding-left: 22px;
}

.legal-content li {
	margin-bottom: 12px;
}

.legal-content a {
	color: #7e5e21;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.legal-footer {
	border-top: 1px solid var(--line-dark);
}

.error-main {
	min-height: calc(100vh - var(--header-height));
	display: grid;
	place-items: center;
	padding-block: 110px;
	background:
		radial-gradient(circle at 72% 25%, rgba(217, 182, 111, 0.13), transparent 25%),
		var(--navy);
	color: #fff;
}

.error-shell {
	max-width: 820px;
	text-align: center;
}

.error-code {
	display: block;
	margin-bottom: 22px;
	color: var(--gold-light);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.18em;
}

.error-shell h1 {
	margin-bottom: 24px;
	font-family: var(--serif);
	font-size: clamp(58px, 8vw, 104px);
	font-weight: 400;
	line-height: 0.98;
	letter-spacing: -0.035em;
}

.error-shell p {
	max-width: 600px;
	margin: 0 auto 34px;
	color: var(--muted-light);
	font-size: 18px;
}

.error-actions {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}

.site-footer {
	padding-block: 70px 30px;
	border-top: 1px solid var(--line-dark);
	background: #050914;
	color: var(--muted-light);
}

.footer-grid {
	display: grid;
	grid-template-columns: 2fr repeat(3, 1fr);
	gap: 60px;
}

.wordmark-footer {
	color: #fff;
}

.footer-brand p {
	max-width: 350px;
	margin: 24px 0 0;
	font-size: 14px;
}

.footer-social {
	display: flex;
	margin-top: 22px;
}

.footer-social a {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	color: var(--muted-light);
	transition: color 180ms ease, transform 180ms ease;
}

.footer-social a:hover,
.footer-social a:focus-visible {
	color: var(--gold-light);
	transform: translateY(-2px);
}

.footer-social a:focus-visible {
	outline: 2px solid var(--gold);
	outline-offset: 3px;
}

.footer-social svg {
	width: 19px;
	height: 19px;
	fill: currentColor;
}

.footer-links {
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 13px;
}

.footer-links strong {
	margin-bottom: 8px;
	color: #fff;
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.footer-links a:hover {
	color: #fff;
}

.footer-links span {
	color: rgba(190, 200, 214, 0.48);
}

.service-steps .step {
	min-height: 250px;
}

.service-model-panel .model-row > div {
	grid-column: 1 / -1;
}

.guide-hero h1 {
	max-width: 820px;
}

.guide-intro,
.guide-principles,
.guide-boundaries {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(390px, 0.72fr);
	gap: 100px;
	align-items: start;
}

.guide-intro-copy h2,
.guide-principles-copy h2,
.guide-boundaries-copy h2 {
	margin-bottom: 26px;
	font-family: var(--serif);
	font-size: clamp(48px, 5.1vw, 72px);
	font-weight: 400;
	line-height: 1.04;
	letter-spacing: -0.028em;
}

.guide-intro-copy > p:not(.large-copy),
.guide-boundaries-copy > p:not(.large-copy) {
	max-width: 680px;
	color: #414959;
}

.guide-example {
	position: relative;
	padding: 38px;
	background: var(--navy);
	color: #fff;
	box-shadow: 0 28px 70px rgba(11, 16, 32, 0.14);
}

.guide-example::before {
	content: '';
	position: absolute;
	inset: 0 auto auto 0;
	width: 76px;
	height: 3px;
	background: var(--gold);
}

.guide-example > span {
	display: block;
	margin-bottom: 24px;
	color: var(--gold-light);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.guide-example h3 {
	margin-bottom: 28px;
	font-family: var(--serif);
	font-size: 32px;
	font-weight: 400;
	line-height: 1.15;
}

.guide-example dl,
.guide-example dd {
	margin: 0;
}

.guide-example dl > div {
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: 18px;
	padding: 14px 0;
	border-top: 1px solid var(--line-dark);
}

.guide-example dt {
	color: var(--gold-light);
	font-size: 11px;
	font-weight: 700;
}

.guide-example dd {
	color: #d5dde8;
	font-size: 13px;
}

.guide-directory {
	border-top: 1px solid var(--line);
}

.guide-category {
	display: grid;
	grid-template-columns: minmax(190px, 0.35fr) 1fr;
	gap: 52px;
	padding: 30px 0;
	border-bottom: 1px solid var(--line);
}

.guide-category h3 {
	font-family: var(--serif);
	font-size: 29px;
	font-weight: 400;
}

.guide-category ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: #414959;
	font-size: 13px;
}

.guide-category li::before {
	content: '•';
	margin-right: 8px;
	color: #76581f;
}

.guide-service-links {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin-top: 62px;
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.guide-service-links a {
	position: relative;
	min-height: 145px;
	padding: 28px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	background: rgba(255, 255, 255, 0.42);
	transition: background 180ms ease, color 180ms ease;
}

.guide-service-links a::after {
	content: '→';
	position: absolute;
	right: 24px;
	bottom: 22px;
	color: #76581f;
}

.guide-service-links a:hover,
.guide-service-links a:focus-visible {
	background: var(--navy);
	color: #fff;
}

.guide-service-links a:focus-visible {
	outline: 3px solid var(--gold);
	outline-offset: 3px;
}

.guide-service-links span,
.guide-service-links strong {
	display: block;
}

.guide-service-links span {
	margin-bottom: 10px;
	color: var(--muted);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.guide-service-links a:hover span,
.guide-service-links a:focus-visible span {
	color: var(--gold-light);
}

.guide-service-links strong {
	font-family: var(--serif);
	font-size: 23px;
	font-weight: 400;
}

.guide-principles {
	grid-template-columns: minmax(0, 0.8fr) minmax(500px, 1fr);
}

.guide-principles-copy h2 {
	color: #fff;
}

.guide-principles-copy p {
	max-width: 520px;
	color: #d5dde8;
	font-size: 18px;
}

.guide-principle-list {
	border-top: 1px solid var(--line-dark);
}

.guide-principle-list article {
	display: grid;
	grid-template-columns: minmax(160px, 0.48fr) 1fr;
	gap: 30px;
	padding: 28px 0;
	border-bottom: 1px solid var(--line-dark);
}

.guide-principle-list h3 {
	color: var(--gold-light);
	font-family: var(--serif);
	font-size: 24px;
	font-weight: 400;
}

.guide-principle-list p {
	margin: 0;
	color: #d5dde8;
	font-size: 14px;
}

.guide-boundary-list {
	border-top: 1px solid var(--line);
}

.guide-boundary-list article {
	padding: 24px 0;
	border-bottom: 1px solid var(--line);
}

.guide-boundary-list h3 {
	margin-bottom: 6px;
	font-family: var(--serif);
	font-size: 24px;
	font-weight: 400;
}

.guide-boundary-list p {
	margin: 0;
	color: var(--muted);
	font-size: 13px;
}

.guide-handover {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.guide-handover article {
	min-height: 230px;
	padding: 34px 30px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	background: rgba(255, 255, 255, 0.32);
}

.guide-handover h3 {
	margin-bottom: 52px;
	font-family: var(--serif);
	font-size: 29px;
	font-weight: 400;
}

.guide-handover p {
	margin: 0;
	color: #414959;
	font-size: 14px;
}

.guide-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	padding-top: 34px;
}

.guide-cta p {
	margin: 0;
	font-family: var(--serif);
	font-size: 23px;
}

.footer-bottom {
	display: flex;
	justify-content: space-between;
	gap: 30px;
	margin-top: 60px;
	padding-top: 24px;
	border-top: 1px solid var(--line-dark);
	font-size: 11px;
}

.reveal-ready .reveal {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 650ms ease, transform 650ms ease;
}

.reveal-ready .reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.reveal-ready .reveal-delay {
	transition-delay: 110ms;
}

.reveal-ready .reveal-delay-two {
	transition-delay: 220ms;
}

@media (max-width: 1050px) {
	.desktop-nav {
		gap: 18px;
	}

	.hero-grid {
		gap: 60px;
	}

	.split-layout,
	.philippines-proof,
	.contact-grid {
		gap: 65px;
	}

	.capability-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.steps-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.guide-intro,
	.guide-principles,
	.guide-boundaries {
		gap: 60px;
	}

	.guide-service-links {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 899px) {
	:root {
		--header-height: 68px;
	}

	.shell {
		width: min(calc(100% - 32px), var(--shell));
	}

	.desktop-nav,
	.header-cta {
		display: none;
	}

	.menu-toggle {
		display: block;
	}

	.hero {
		min-height: auto;
	}

	.hero-grid,
	.split-layout,
	.philippines-proof,
	.faq-layout,
	.contact-grid,
	.guide-intro,
	.guide-principles,
	.guide-boundaries {
		grid-template-columns: 1fr;
	}

	.hero-grid {
		gap: 65px;
		padding-block: 90px 80px;
	}

	.hero h1 {
		font-size: clamp(55px, 13.5vw, 78px);
	}

	.hero-card {
		max-width: 560px;
	}

	.split-copy,
	.faq-intro {
		position: static;
	}

	.problem-grid {
		grid-template-columns: 1fr;
	}

	.line-card {
		min-height: auto;
	}

	.backed-strip {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.testimonial-card {
		grid-template-columns: 155px minmax(0, 1fr);
		gap: 30px;
	}

	.pricing-grid {
		max-width: 620px;
		margin-inline: auto;
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.price-card {
		min-height: auto;
	}

	.price-card-featured {
		transform: none;
	}

	.footer-grid {
		grid-template-columns: 1.6fr repeat(3, 1fr);
		gap: 40px;
	}

	.guide-example {
		max-width: 620px;
	}
}

@media (max-width: 640px) {
	.section {
		padding-block: 88px;
	}

	.wordmark-name {
		font-size: 23px;
	}

	.hero-grid {
		padding-block: 76px 68px;
	}

	.hero h1 {
		font-size: clamp(50px, 14vw, 67px);
	}

	.hero-lead {
		font-size: 17px;
	}

	.hero-actions {
		align-items: flex-start;
		flex-direction: column;
		gap: 22px;
	}

	.hero-card {
		padding: 28px;
	}

	.hero-card blockquote {
		font-size: 25px;
	}

	.section-heading h2,
	.split-copy h2,
	.faq-intro h2,
	.contact-copy h2,
	.guide-intro-copy h2,
	.guide-principles-copy h2,
	.guide-boundaries-copy h2 {
		font-size: clamp(42px, 12vw, 58px);
	}

	.section-heading {
		margin-bottom: 42px;
	}

	.section-heading > p:last-child,
	.faq-intro > p,
	.large-copy {
		font-size: 16px;
	}

	.capability-grid,
	.steps-grid,
	.guide-service-links,
	.guide-handover {
		grid-template-columns: 1fr;
	}

	.guide-category {
		grid-template-columns: 1fr;
		gap: 20px;
		padding: 28px 0;
	}

	.guide-category ul {
		grid-template-columns: 1fr 1fr;
		gap: 10px 18px;
	}

	.guide-principle-list article {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.guide-cta {
		align-items: flex-start;
		flex-direction: column;
	}

	.capability-card {
		min-height: auto;
	}

	.step {
		min-height: auto;
	}

	.step > span {
		margin-bottom: 45px;
	}

	.section-note {
		align-items: flex-start;
		flex-direction: column;
	}


	.data-card {
		padding: 24px 22px 20px;
	}

	.data-row {
		grid-template-columns: 82px minmax(70px, 1fr) 43px;
		gap: 9px;
		font-size: 10px;
	}

	.backed-strip {
		padding: 28px;
	}

	.testimonial-card {
		grid-template-columns: 1fr;
		gap: 22px;
		padding: 28px;
	}

	.testimonial-card blockquote,
	.testimonial-card figcaption {
		grid-column: 1;
	}

	.testimonial-card blockquote {
		grid-row: 2;
	}

	.testimonial-card figcaption {
		grid-row: 1;
		padding: 0 0 20px;
		border-right: 0;
		border-bottom: 1px solid var(--line);
	}

	.faq-layout {
		gap: 55px;
	}

	.faq-list summary {
		font-size: 19px;
	}

	.contact-section {
		padding-block: 90px;
	}

	.contact-grid {
		gap: 55px;
	}

	.contact-form {
		padding: 24px;
	}

	.legal-hero {
		padding-block: 72px 60px;
	}

	.legal-content {
		padding-block: 60px 88px;
	}

	.legal-content > p:first-child {
		font-size: 16px;
	}

	.legal-content h2 {
		font-size: 25px;
	}

	.footer-grid {
		grid-template-columns: 1fr 1fr;
	}

	.footer-brand {
		grid-column: 1 / -1;
	}

	.footer-bottom {
		align-items: flex-start;
		flex-direction: column;
	}
}

@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;
	}
}

.social-card-page {
	width: 1200px;
	height: 630px;
	overflow: hidden;
	background: var(--navy);
}

.social-card {
	position: relative;
	width: 1200px;
	height: 630px;
	overflow: hidden;
	padding: 58px 72px 50px;
	background:
		radial-gradient(circle at 18% 20%, rgba(217, 182, 111, 0.13), transparent 28%),
		radial-gradient(circle at 82% 18%, rgba(72, 118, 158, 0.2), transparent 32%),
		linear-gradient(135deg, #070b16 0%, #080d19 48%, #0e1c32 100%);
	color: #fff;
}

.social-card::after {
	content: '';
	position: absolute;
	inset: auto 0 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, rgba(217, 182, 111, 0.8), transparent);
}

.social-card-brand {
	position: relative;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 13px;
}

.social-card-brand .wordmark-mark {
	width: 38px;
	height: 38px;
}

.social-card-brand .wordmark-name {
	font-size: 31px;
}

.social-card-brand .wordmark-byline {
	font-size: 8px;
}

.social-card-copy {
	position: relative;
	z-index: 2;
	max-width: 890px;
	margin-top: 68px;
}

.social-card-copy h1 {
	margin-bottom: 26px;
	font-family: var(--serif);
	font-size: 80px;
	font-weight: 400;
	line-height: 0.96;
	letter-spacing: -0.035em;
}

.social-card-copy h1 em {
	color: var(--gold-light);
	font-weight: 400;
}

.social-card-copy p {
	max-width: 720px;
	margin: 0;
	color: #d5dde8;
	font-size: 21px;
	line-height: 1.5;
}

.social-card-footer {
	position: absolute;
	right: 72px;
	bottom: 47px;
	left: 72px;
	z-index: 2;
	display: flex;
	justify-content: space-between;
	padding-top: 18px;
	border-top: 1px solid var(--line-dark);
	color: var(--muted-light);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.social-orbit {
	position: absolute;
	border: 1px solid rgba(255, 255, 255, 0.065);
	border-radius: 50%;
}

.social-orbit-one {
	width: 560px;
	height: 560px;
	top: -300px;
	right: -80px;
}

.social-orbit-two {
	width: 730px;
	height: 730px;
	bottom: -610px;
	left: 8%;
}