@import url('https://fonts.googleapis.com/css2?family=Saira:wdth,wght@50..125,100..900&display=swap');

:root {
		--ink: #081321;
		--ink-soft: #0d1c2e;
		--panel: #12233a;
		--panel-2: #1a2d47;
		--line: rgba(255, 255, 255, .12);
		--line-strong: rgba(255, 255, 255, .22);
		--text: #fffaf0;
		--muted: #a9b9ca;
		--blue: #4388ff;
		--blue-bright: #66a3ff;
		--gold: #ffb847;
		--gold-soft: #ffd58d;
		--cream: #fff4df;
		--success: #9ee5b0;
		--danger: #ffb1b1;
		--shadow: 0 26px 80px rgba(0, 0, 0, .34);
		--radius: 24px;
		--container: 1180px;
}

* {
		box-sizing: border-box;
}

html {
		scroll-behavior: smooth;
		background: var(--ink);
}

body {
		margin: 0;
		min-width: 320px;
		overflow-x: hidden;
		color: var(--text);
		background:
				radial-gradient(circle at 12% 8%, rgba(67, 136, 255, .14), transparent 35%),
				radial-gradient(circle at 88% 16%, rgba(255, 184, 71, .11), transparent 28%),
				var(--ink);
		font-family: 'Saira', system-ui, -apple-system, sans-serif;
		line-height: 1.5;
		text-rendering: optimizeLegibility;
}

img,
video {
		display: block;
		max-width: 100%;
}

a {
		color: inherit;
}

button,
input,
textarea {
		font: inherit;
}

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

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

.eyebrow {
		margin: 0 0 14px;
		color: var(--gold);
		font-size: 12px;
		font-weight: 500;
		letter-spacing: .15em;
		text-transform: uppercase;
}

.section {
		position: relative;
		padding: clamp(76px, 9vw, 132px) 0;
}

.section-heading {
		margin-bottom: clamp(34px, 5vw, 58px);
}

.section-heading h2 {
		margin: 0;
		font-size: clamp(38px, 6vw, 72px);
		line-height: 1.2;
		letter-spacing: -.055em;
		font-weight: 500;
}

.section-heading p:last-child {
		margin: 24px 0 0;
		color: var(--muted);
		font-size: clamp(17px, 2vw, 21px);
}

.site-header {
		position: fixed;
		z-index: 50;
		top: 0;
		left: 0;
		width: 100%;
		border-bottom: 1px solid transparent;
		transition:
				background .25s ease,
				border-color .25s ease,
				backdrop-filter .25s ease;
}


.site-header {
		position: sticky;
		z-index: 30;
		top: 0;
		border-bottom: 1px solid var(--line);
		background: rgba(8,19,33,.84);
		backdrop-filter: blur(10px);
}


.site-header.is-scrolled {
		border-color: var(--line);
		background: rgba(8, 19, 33, .82);
		backdrop-filter: blur(10px);
}

.nav {
		min-height: 76px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
}

.brand {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		text-decoration: none;
}

.brand img {
		width: 60px;
		height: 60px;
		object-fit: contain;
		filter: sepia(20%) saturate(70%) hue-rotate(160deg);
}

.brand-word {
    font-size: 35px;
    font-weight: 500;
    letter-spacing: -.045em;
    color: #ffffff;
}

.accent {
		color: var(--blue);
}


.nav-links {
		display: flex;
		align-items: center;
		gap: 30px;
		color: rgba(255, 255, 255, .72);
		font-size: 15px;
		font-weight: 400;
}

.nav-links a {
		text-decoration: none;
		transition: color .3s ease,
				border-color .3s ease;
}

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

.nav-cta {
		padding: 11px 16px;
		border: 1px solid var(--line-strong);
		border-radius: 12px;
		background: rgba(255, 255, 255, .06);
		color: #fff !important;
}

.nav-cta:hover {
		border-color: #ffffff;
}

.hero {
		position: relative;
		display: grid;
		align-items: end;
		overflow: hidden;
		padding: 138px 0 clamp(62px, 9vw, 112px);
		isolation: isolate;
}

.hero-media {
		position: absolute;
		z-index: -4;
		inset: 0;
		overflow: hidden;
		background:
				linear-gradient(135deg, #07101b, #10263e 58%, #172e45);
}

.hero-video {
		width: 100%;
		height: 100%;
		object-fit: cover;
		opacity: .47;
		filter: saturate(.9) contrast(1.04);
		transform: scale(1.02);
}

.hero-media::after {
		content: "";
		position: absolute;
		inset: 0;
		background:
				linear-gradient(90deg, rgba(8, 19, 33, .98) 0%, rgba(8, 19, 33, .82) 44%, rgba(8, 19, 33, .36) 100%),
				linear-gradient(0deg, var(--ink) 0%, transparent 36%),
				radial-gradient(circle at 72% 30%, rgba(67, 136, 255, .18), transparent 40%);
}

.hero-fallback {
		position: absolute;
		z-index: -1;
		inset: 0;
		background:
				radial-gradient(circle at 72% 34%, rgba(67, 136, 255, .22), transparent 28%),
				radial-gradient(circle at 80% 42%, rgba(255, 184, 71, .13), transparent 18%);
}

.hero-content {

}

.hero-kicker {
		display: inline-flex;
		align-items: center;
		gap: 9px;
		margin-bottom: 24px;
		padding: 8px 12px;
		border: 1px solid rgba(255, 184, 71, .32);
		border-radius: 999px;
		background: rgba(255, 184, 71, .08);
		color: var(--gold-soft);
		font-size: 12px;
		font-weight: 400;
		letter-spacing: .11em;
		text-transform: uppercase;
}

.hero-kicker::before {
		content: "";
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background: var(--gold);
		box-shadow: 0 0 18px rgba(255, 184, 71, .9);
}

.hero h1 {
		margin: 0;
		max-width: 920px;
		font-size: clamp(58px, 10vw, 126px);
		line-height: .84;
		letter-spacing: -.075em;
		text-wrap: balance;
		font-weight: 500;
}

.hero h1 .blue {
		color: var(--blue-bright);
}

.hero-copy {
		margin: 34px 0 0;
		color: rgba(255, 255, 255, .78);
		font-size: clamp(19px, 2.4vw, 26px);
		line-height: 1.42;
		text-wrap: balance;
}

.hero-actions {
		display: flex;
		flex-wrap: wrap;
		gap: 14px;
		margin-top: 38px;
}

.button {
		display: inline-flex;
		min-height: 52px;
		align-items: center;
		justify-content: center;
		gap: 10px;
		padding: 0 21px;
		border: 1px solid transparent;
		border-radius: 13px;
		text-decoration: none;
		font-weight: 400;
		transition:
				transform .18s ease,
				border-color .18s ease,
				background .18s ease;
}

.button:hover {
		transform: translateY(-2px);
}

.button-primary {
		background: var(--blue);
		color: #fff;
		box-shadow: 0 16px 44px rgba(67, 136, 255, .24);
}

.button-secondary {
		border-color: var(--line-strong);
		background: rgba(255, 255, 255, .07);
		color: #fff;
		backdrop-filter: blur(10px);
}

.hero-proof {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 12px;
		margin-top: clamp(48px, 8vw, 92px);
}

.hero-proof article {
		min-height: 132px;
		padding: 22px;
		border: 1px solid var(--line);
		border-radius: 18px;
		background: rgba(9, 23, 39, .68);
		backdrop-filter: blur(16px);
}

.hero-proof strong {
		display: block;
		margin-bottom: 8px;
		color: #fff;
		font-size: clamp(24px, 3vw, 34px);
		line-height: 1;
		letter-spacing: -.04em;
}

.hero-proof span {
		color: var(--muted);
		font-size: 14px;
}

.problem-grid,
.feature-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 16px;
}

.card {
		padding: clamp(24px, 3vw, 34px);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		background:
				linear-gradient(145deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .025));
		box-shadow: 0 20px 60px rgba(0, 0, 0, .12);
}

.card-number {
		display: inline-grid;
		width: 42px;
		height: 42px;
		place-items: center;
		margin-bottom: 36px;
		border-radius: 12px;
		background: rgba(67, 136, 255, .13);
		color: var(--blue-bright);
		font-size: 13px;
		font-weight: 300;
}

.card h3 {
		margin: 0;
		font-size: 25px;
		letter-spacing: -.035em;
}

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

.metric-section {
		overflow: hidden;
		background:
				radial-gradient(circle at 18% 50%, rgba(255, 184, 71, .12), transparent 24%),
				linear-gradient(180deg, transparent, rgba(255, 255, 255, .025), transparent);
}

.metric-layout {
		display: grid;
		grid-template-columns: .82fr 1.18fr;
		align-items: center;
		gap: clamp(36px, 8vw, 100px);
}

.metric-big {
		margin: 0;
		font-size: clamp(58px, 10vw, 122px);
		line-height: .86;
		letter-spacing: -.075em;
}

.metric-big .arrow {
		color: var(--gold);
}

.metric-copy {
		color: var(--muted);
		font-size: clamp(18px, 2vw, 22px);
}

.metric-copy strong {
		color: #fff;
}

.product-shell {
		overflow: hidden;
		border: 1px solid var(--line-strong);
		border-radius: 28px;
		background: #0b1728;
		box-shadow: var(--shadow);
}

.product-shell img {
		width: 100%;
		aspect-ratio: 1000 / 538;
		object-fit: cover;
}

.product-caption {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
		padding: 22px 24px;
		color: var(--muted);
}

.product-caption strong {
		color: #fff;
}

.feature-card {
		position: relative;
		overflow: hidden;
		min-height: 300px;
}

.feature-card::after {
		content: "";
		position: absolute;
		right: -36px;
		bottom: -56px;
		width: 180px;
		height: 180px;
		border-radius: 50%;
		background: rgba(67, 136, 255, .08);
		filter: blur(4px);
}

.feature-icon {
		display: inline-flex;
		width: 50px;
		height: 50px;
		align-items: center;
		justify-content: center;
		margin-bottom: 20px;
		border: 1px solid rgba(255, 184, 71, .32);
		border-radius: 15px;
		background: rgba(255, 184, 71, .08);
		color: var(--gold);
		font-size: 22px;
}

.gallery {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 16px;
}

.gallery figure {
		overflow: hidden;
		margin: 0;
		border: 1px solid var(--line);
		border-radius: 20px;
		background: var(--panel);
}

.gallery img {
		width: 100%;
		aspect-ratio: 1000 / 538;
		object-fit: cover;
}

.gallery figcaption {
		padding: 17px 19px;
		color: var(--muted);
		font-size: 14px;
}

.gallery strong {
		color: #fff;
}

.lead-section {
		padding-top: clamp(70px, 8vw, 110px);
}

.lead-shell {
		display: grid;
		grid-template-columns: .92fr 1.08fr;
		gap: clamp(34px, 6vw, 76px);
		padding: clamp(28px, 5vw, 58px);
		border: 1px solid rgba(67, 136, 255, .22);
		border-radius: 30px;
		background:
				radial-gradient(circle at 10% 0%, rgba(67, 136, 255, .17), transparent 36%),
				radial-gradient(circle at 95% 100%, rgba(255, 184, 71, .10), transparent 28%),
				rgba(15, 31, 52, .9);
		box-shadow: var(--shadow);
}

.lead-copy h2 {
		margin: 0;
		font-size: 2.2vw;
		line-height: 1.1;
		letter-spacing: -.06em;
}

.lead-copy > p:not(.eyebrow) {
		margin: 24px 0 0;
		color: var(--muted);
		font-size: 18px;
}

.offer {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 16px;
		align-items: center;
		margin-top: 34px;
		padding: 18px;
		border: 1px solid rgba(255, 184, 71, .26);
		border-radius: 17px;
		background: rgba(255, 184, 71, .075);
}

.offer-price {
		color: var(--gold);
		font-size: 31px;
		font-weight: 900;
		letter-spacing: -.05em;
		white-space: nowrap;
}

.offer-copy {
		color: var(--muted);
		font-size: 14px;
}

.offer-copy strong {
		display: block;
		color: #fff;
		font-size: 15px;
}

.lead-form {
		display: grid;
		gap: 16px;
}

.form-row {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 14px;
}

.lead-form label {
		display: grid;
		gap: 7px;
		color: rgba(255, 255, 255, .9);
		font-size: 13px;
		font-weight: 300;
}

.lead-form label em {
		color: var(--muted);
		font-style: normal;
		font-weight: 500;
}

.lead-form input,
.lead-form textarea {
		width: 100%;
		border: 1px solid rgba(255, 255, 255, .14);
		border-radius: 12px;
		outline: none;
		background: rgba(4, 13, 24, .5);
		color: #fff;
		transition:
				border-color .18s ease,
				box-shadow .18s ease,
				background .18s ease;
}

.lead-form input {
		min-height: 49px;
		padding: 0 14px;
}

.lead-form textarea {
		min-height: 116px;
		resize: vertical;
		padding: 13px 14px;
}

.lead-form input:focus,
.lead-form textarea:focus {
		border-color: rgba(67, 136, 255, .72);
		background: rgba(4, 13, 24, .72);
		box-shadow: 0 0 0 4px rgba(67, 136, 255, .11);
}

.consent {
		grid-template-columns: auto 1fr !important;
		align-items: start;
		color: var(--muted) !important;
		font-weight: 500 !important;
		line-height: 1.42;
}

.consent a {
		color: var(--blue-bright);
		text-underline-offset: 3px;
}

.consent input {
		width: 17px;
		height: 17px;
		min-height: 0;
		margin-top: 2px;
		accent-color: var(--blue);
}

.lead-submit {
		min-height: 52px;
		border: 0;
		border-radius: 13px;
		background: var(--blue);
		color: #fff;
		font-weight: 600;
		cursor: pointer;
		transition: transform .18s ease,
				opacity .18s ease,
				background .18s ease;
		font-size: 1.2vw;
}

.lead-submit:hover {
		transform: translateY(-1px);
		background: #5494ff;
}

.lead-submit:disabled {
		cursor: wait;
		opacity: .56;
		transform: none;
}

.lead-status {
		min-height: 22px;
		margin: 0;
		font-size: 14px;
}

.lead-status[data-state="success"] {
		color: var(--success);
}

.lead-status[data-state="error"] {
		color: var(--danger);
}

.honeypot {
		position: absolute !important;
		left: -10000px !important;
		width: 1px !important;
		height: 1px !important;
		overflow: hidden !important;
}

footer {
		padding: 48px 0 56px;
		color: var(--muted);
		font-size: 14px;
}

.footer-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
		padding-top: 28px;
		border-top: 1px solid var(--line);
}

.footer-brand {
		display: flex;
		align-items: center;
		-gap: 10px;
		color: #fff;
		font-weight: 500;
}

.footer-brand img {
		width: 50px;
		height: 50px;
		filter: sepia(20%) saturate(70%) hue-rotate(160deg);
}

.accent {
		color: var(--blue);
}

.footer-links {
		display: flex;
		flex-wrap: wrap;
		gap: 18px;
}

.footer-links a {
		text-decoration: none;
		transition: color .3s ease, border-color .3s ease;
}

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

.footer-links span {
		color: var(--gold);
}


@media (max-width: 920px) {
		.nav-links a:not(.nav-cta) {
				display: none;
		}

		.hero-media::after {
				background:
						linear-gradient(90deg, rgba(8, 19, 33, .96), rgba(8, 19, 33, .66)),
						linear-gradient(0deg, var(--ink), transparent 46%);
		}

		.hero-proof,
		.problem-grid,
		.feature-grid {
				grid-template-columns: 1fr;
		}

		.hero-proof article {
				min-height: auto;
		}

		.metric-layout,
		.lead-shell {
				grid-template-columns: 1fr;
		}
}

@media (max-width: 680px) {
		.container {
				width: min(100% - 24px, var(--container));
		}

		.site-header .brand img {
				width: 40px;
				height: 40px;
		}

		.brand-word {
				font-size: 21px;
		}

		.nav {
				min-height: 66px;
		}

		.nav-cta {
				padding: 9px 12px;
		}

		.hero {
				padding-top: 116px;
		}

		.hero h1 {
				font-size: clamp(56px, 18vw, 84px);
		}

		.hero-copy {
				font-size: 18px;
		}

		.hero-actions {
				display: grid;
		}

		.button {
				width: 100%;
		}

		.gallery,
		.form-row {
				grid-template-columns: 1fr;
		}

		.product-caption,
		.footer-row {
				align-items: flex-start;
				flex-direction: column;
		}

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

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

		*,
		*::before,
		*::after {
				animation-duration: .01ms !important;
				animation-iteration-count: 1 !important;
				transition-duration: .01ms !important;
		}

		.hero-video {
				display: none;
		}
}















.policy a {
		color: var(--blue-bright);
		text-underline-offset: 3px;
}



.nav {
		min-height: 76px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
}


.back-link {
		display: inline-flex;
		min-height: 42px;
		align-items: center;
		justify-content: center;
		padding: 0 15px;
		border: 1px solid var(--line-strong);
		border-radius: 11px;
		background: rgba(255,255,255,.06);
		color: #fff;
		font-size: 14px;
		font-weight: 400;
		text-decoration: none;
		transition: color .3s ease,
				border-color .3s ease;
}

.back-link:hover {
		border-color: #ffffff;
}

.policy-meta {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		margin-top: 32px;
}

.policy-meta span {
		padding: 9px 12px;
		border: 1px solid var(--line);
		border-radius: 999px;
		background: rgba(255,255,255,.045);
		color: var(--muted);
		font-size: 13px;
}

.policy-layout {
		display: grid;
		grid-template-columns: 270px minmax(0, 1fr);
		align-items: start;
		gap: clamp(28px, 6vw, 78px);
		padding: 30px 0 clamp(84px, 9vw, 132px);
}

.toc {
		position: sticky;
		top: 104px;
		padding: 22px;
		border: 1px solid var(--line);
		border-radius: 18px;
		background: rgba(15,31,52,.78);
		box-shadow: 0 18px 48px rgba(0,0,0,.14);
}

.toc strong {
		display: block;
		margin-bottom: 12px;
		color: #fff;
		font-size: 13px;
		letter-spacing: .09em;
		text-transform: uppercase;
}

.toc nav {
		display: grid;
		gap: 8px;
}

.toc a {
		color: var(--muted);
		font-size: 13px;
		text-decoration: none;
}

.toc a:hover {
		color: #fff;
}

.policy {
		min-width: 0;
}

.notice {
		margin-bottom: 24px;
		padding: 21px 22px;
		border: 1px solid rgba(67,136,255,.30);
		border-radius: 16px;
		background: rgba(67,136,255,.085);
		color: #dbe9ff;
}

.policy section {
		scroll-margin-top: 110px;
		margin-bottom: 18px;
		padding: clamp(24px, 4vw, 38px);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		background:
				linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.022));
		box-shadow: 0 18px 55px rgba(0,0,0,.10);
}

.policy h2 {
		margin: 0 0 16px;
		color: #fff;
		font-size: clamp(25px, 3vw, 34px);
		line-height: 1.14;
		letter-spacing: -.035em;
}

.policy h3 {
		margin: 24px 0 8px;
		color: var(--gold-soft);
		font-size: 18px;
}

.policy p {
		margin: 0 0 14px;
		color: var(--muted);
}

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

.policy ul {
		margin: 12px 0 0;
		padding-left: 22px;
		color: var(--muted);
}

.policy li + li {
		margin-top: 8px;
}

.policy strong {
		color: #fff;
}

.data-table {
		width: 100%;
		margin-top: 18px;
		border-collapse: collapse;
		overflow: hidden;
		border: 1px solid var(--line);
		border-radius: 14px;
		font-size: 14px;
}

.data-table th,
.data-table td {
		padding: 13px 14px;
		border-bottom: 1px solid var(--line);
		vertical-align: top;
		text-align: left;
}

.data-table th {
		color: #fff;
		background: rgba(255,255,255,.055);
}

.data-table td {
		color: var(--muted);
}

.data-table tr:last-child td {
		border-bottom: 0;
}

.contact-card {
		border-color: rgba(255,184,71,.28) !important;
		background:
				radial-gradient(circle at 0 0, rgba(255,184,71,.09), transparent 36%),
				rgba(255,255,255,.025) !important;
}

.contact-email {
		display: inline-block;
		margin-top: 5px;
		color: var(--gold-soft);
		font-size: clamp(20px, 3vw, 28px);
		font-weight: 500;
}


@media (max-width: 880px) {
		.policy-layout {
				grid-template-columns: 1fr;
		}

		.toc {
				position: static;
		}

		.toc nav {
				grid-template-columns: repeat(2, minmax(0, 1fr));
		}
}

@media (max-width: 620px) {
		.container {
				width: min(100% - 24px, var(--container));
		}

		.nav {
				min-height: 66px;
		}

		.brand img {
				width: 39px;
				height: 39px;
		}

		.brand-word {
				font-size: 21px;
		}

		.back-link {
				padding: 0 11px;
				font-size: 13px;
		}

		.toc nav {
				grid-template-columns: 1fr;
		}

		.data-table {
				display: block;
				overflow-x: auto;
		}

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