:root {
  --ink: #05070C;
  --panel: #0D141F;
  --panel-raised: #121C2B;
  --white: #FFFFFF;
  --muted: #9AA5B5;
  --blue: #41B6D7;
  --cyan: #5EE6FF;
  --turquoise: #47D1B2;
  --green: #39E19B;
  --green-dim: #145B3A;
  --line: rgba(71, 209, 178, .18);
  --display: Manrope, system-ui, sans-serif;
  --body: Manrope, system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body {
  margin: 0;
  color: var(--white);
  background:
    radial-gradient(ellipse 880px 560px at 10% -15%, rgba(57, 225, 155, .105), transparent 65%),
    radial-gradient(ellipse 700px 540px at 100% 5%, rgba(71, 209, 178, .085), transparent 66%),
    var(--ink);
  font: 16px/1.65 var(--body);
  -webkit-font-smoothing: antialiased;
}
img, svg { max-width: 100%; }
a { color: inherit; }
button, input, select { font: inherit; }
.wrap { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 99; padding: 10px 14px;
  color: var(--ink); background: var(--green); border-radius: 8px;
}
.skip-link:focus { top: 12px; }

.site-header {
  position: sticky; top: 0; z-index: 40;
  border-bottom: 1px solid var(--line);
  background: rgba(5, 7, 12, .91);
  backdrop-filter: blur(16px);
}
.header-row {
  min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.brand-lockup { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; flex: 0 0 auto; }
.brand-lockup img { display: block; width: 48px; height: 48px; object-fit: contain; }
.brand-name { font: 700 23px/1 var(--display); letter-spacing: .055em; }
.brand-name .dollar { color: var(--green); }
.brand-name small {
  display: block; margin-top: 3px; color: var(--green); font: 700 9px/1 var(--body);
  letter-spacing: .34em; text-transform: uppercase;
}
.desktop-nav { display: flex; align-items: center; gap: clamp(14px, 2.2vw, 30px); }
.desktop-nav > a:not(.button) {
  color: var(--muted); text-decoration: none; font-size: 13px; font-weight: 700;
  transition: color .18s ease;
}
.desktop-nav > a:not(.button):hover { color: var(--white); }
.mobile-menu { display: none; position: relative; }
.mobile-menu summary {
  list-style: none; cursor: pointer; padding: 10px 14px; border: 1px solid var(--line);
  border-radius: 9px; color: var(--white); font-size: 13px; font-weight: 800;
}
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu[open] .mobile-links {
  position: absolute; right: 0; top: calc(100% + 10px); z-index: 50; width: min(290px, calc(100vw - 32px));
  display: grid; gap: 4px; padding: 10px; border: 1px solid var(--line); border-radius: 14px;
  background: #0D141F; box-shadow: 0 20px 50px rgba(0, 0, 0, .55);
}
.mobile-links a { padding: 11px 12px; border-radius: 8px; color: var(--muted); text-decoration: none; font-weight: 700; }
.mobile-links a:hover { color: var(--white); background: rgba(71, 209, 178, .08); }

.button {
  display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 9px;
  padding: 12px 20px; border: 1px solid transparent; border-radius: 9px;
  font-size: 14px; font-weight: 800; line-height: 1.2; text-decoration: none; text-align: center;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.button:hover { transform: translateY(-1px); }
.button-primary {
  color: #04120A; background: linear-gradient(135deg, var(--green), #47D1B2);
  box-shadow: 0 8px 24px rgba(57, 225, 155, .17);
}
.button-primary:hover { box-shadow: 0 12px 30px rgba(57, 225, 155, .26); }
.button-secondary { border-color: var(--line); color: var(--white); background: rgba(13, 20, 31, .55); }
.button-secondary:hover { border-color: rgba(71, 209, 178, .55); }
.text-link { color: var(--turquoise); font-size: 14px; font-weight: 800; text-decoration: none; }
.text-link:hover { color: var(--white); }

.eyebrow {
  display: inline-flex; align-items: center; gap: 9px; margin-bottom: 18px;
  color: var(--green); font-size: 11px; font-weight: 800; letter-spacing: .21em; text-transform: uppercase;
}
.eyebrow::before { content: ""; width: 22px; height: 1px; background: var(--green); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--white); }
h1, h2 { font-family: var(--display); font-weight: 600; letter-spacing: -.012em; }
h1 { margin-bottom: 22px; font-size: clamp(48px, 6vw, 78px); line-height: .99; }
h1 em, h2 em { color: var(--green); font-weight: 600; }
h2 { margin-bottom: 16px; font-size: clamp(36px, 4.2vw, 54px); line-height: 1.05; }
h3 { margin-bottom: 10px; font-size: 17px; line-height: 1.3; }
.lead { max-width: 650px; color: #C0C9D3; font-size: clamp(16px, 1.6vw, 19px); line-height: 1.7; }
.muted { color: var(--muted); }
.section { padding: 104px 0; border-top: 1px solid rgba(71, 209, 178, .1); }
.section-head { max-width: 720px; margin-bottom: 42px; }
.section-head p { max-width: 640px; margin-bottom: 0; color: var(--muted); font-size: 16px; }

.hero { position: relative; overflow: hidden; padding: clamp(74px, 9vw, 126px) 0 84px; }
.hero::after {
  position: absolute; right: -13%; bottom: -35%; width: 54vw; height: 54vw; min-width: 440px; min-height: 440px;
  border: 1px solid rgba(71, 209, 178, .07); border-radius: 50%; content: ""; pointer-events: none;
  box-shadow: 0 0 0 54px rgba(71, 209, 178, .018), 0 0 0 108px rgba(71, 209, 178, .012);
}
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(340px, .98fr); align-items: center; gap: clamp(36px, 7vw, 86px); }
.hero-copy { max-width: 650px; }
.hero-copy .lead { margin-bottom: 28px; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.hero-note {
  display: flex; align-items: center; gap: 11px; margin-top: 25px; color: var(--muted); font-size: 12px;
}
.hero-note b { color: var(--turquoise); font: 800 10px/1 var(--body); letter-spacing: .12em; }

.data-map {
  position: relative; padding: 25px; overflow: hidden; border: 1px solid rgba(71, 209, 178, .22);
  border-radius: 20px; background:
    linear-gradient(150deg, rgba(18, 28, 43, .97), rgba(8, 14, 22, .95)),
    var(--panel);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .035);
}
.data-map::before {
  position: absolute; inset: 0; background-image: linear-gradient(rgba(94, 230, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(94, 230, 255, .035) 1px, transparent 1px);
  background-size: 36px 36px; mask-image: linear-gradient(180deg, black, transparent 88%); content: ""; pointer-events: none;
}
.map-top, .map-bottom { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.map-top span:first-child { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.map-badge { padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; color: var(--turquoise); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.map-flow { position: relative; z-index: 1; display: grid; gap: 13px; margin: 23px 0; }
.map-node {
  position: relative; padding: 16px 17px; border: 1px solid rgba(71, 209, 178, .14); border-radius: 12px;
  background: rgba(13, 20, 31, .78);
}
.map-node + .map-node::before {
  position: absolute; left: 27px; top: -15px; width: 1px; height: 14px; background: linear-gradient(var(--blue), var(--green)); content: "";
}
.map-node small { display: block; margin-bottom: 6px; color: var(--turquoise); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.map-node strong { display: block; margin-bottom: 5px; font: 700 20px/1.1 var(--display); }
.map-node p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.map-node.highlight { border-color: rgba(57, 225, 155, .43); background: linear-gradient(110deg, rgba(20, 91, 58, .25), rgba(13, 20, 31, .9)); }
.map-bottom { justify-content: flex-start; color: var(--muted); font-size: 10px; }
.map-bottom span { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px var(--green); }
.trust-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 64px; border: 1px solid var(--line); border-radius: 12px; background: rgba(13, 20, 31, .48); }
.trust-strip > div { display: flex; align-items: center; gap: 12px; padding: 18px 22px; color: #D2D9E1; font-size: 12px; font-weight: 700; }
.trust-strip > div + div { border-left: 1px solid var(--line); }
.trust-strip i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--green); }

.card-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.feature-card {
  min-height: 208px; padding: 23px; border: 1px solid var(--line); border-radius: 15px;
  background: linear-gradient(155deg, rgba(18, 28, 43, .9), rgba(13, 20, 31, .8));
  transition: transform .2s ease, border-color .2s ease;
}
.feature-card:hover { transform: translateY(-3px); border-color: rgba(71, 209, 178, .42); }
.feature-icon {
  display: grid; width: 40px; height: 40px; place-items: center; margin-bottom: 21px;
  border: 1px solid rgba(71, 209, 178, .2); border-radius: 10px; color: var(--green); background: rgba(57, 225, 155, .075);
  font-size: 18px; font-weight: 800;
}
.feature-card p { margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.section-note { margin: 18px 0 0; color: #768494; font-size: 11px; }
.two-col { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); align-items: start; gap: clamp(36px, 8vw, 100px); }
.principles { display: grid; gap: 12px; }
.principle {
  display: grid; grid-template-columns: 44px 1fr; gap: 16px; padding: 18px 20px;
  border: 1px solid rgba(71, 209, 178, .13); border-radius: 12px; background: rgba(13, 20, 31, .66);
}
.principle .num { color: var(--turquoise); font: 600 24px/1 var(--display); }
.principle p { margin: 0; color: var(--muted); font-size: 13px; }
.principle strong { color: var(--white); }
.outcome-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.outcome-card { padding: 25px; border-left: 2px solid var(--green); background: rgba(13, 20, 31, .7); }
.outcome-card p { margin: 0; color: var(--muted); font-size: 13px; }
.max-panel {
  display: grid; grid-template-columns: minmax(190px, .62fr) minmax(0, 1.38fr); align-items: center; gap: clamp(26px, 5vw, 64px);
  padding: clamp(26px, 5vw, 52px); border: 1px solid rgba(57, 225, 155, .28); border-radius: 20px;
  background: radial-gradient(ellipse at 0% 100%, rgba(57, 225, 155, .1), transparent 55%), var(--panel);
}
.max-art { display: grid; justify-items: center; gap: 15px; text-align: center; }
.max-art img { display: block; width: min(170px, 100%); height: auto; object-fit: contain; filter: drop-shadow(0 16px 34px rgba(57, 225, 155, .16)); }
.max-art span { color: var(--turquoise); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.max-content h2 { max-width: 700px; }
.max-content > p { max-width: 740px; color: var(--muted); }
.max-points { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 23px 0; }
.max-point { padding: 15px; border: 1px solid rgba(71, 209, 178, .12); border-radius: 10px; background: rgba(5, 7, 12, .35); }
.max-point strong { display: block; margin-bottom: 4px; color: var(--white); font-size: 12px; }
.max-point span { color: var(--muted); font-size: 11px; line-height: 1.5; }
.build-note { margin: 16px 0 0 !important; color: #8794A4 !important; font-size: 11px; }
.buyer-panel {
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 32px; padding: clamp(26px, 5vw, 48px);
  border: 1px solid rgba(94, 230, 255, .2); border-radius: 18px;
  background: radial-gradient(ellipse at 100% 0%, rgba(94, 230, 255, .09), transparent 55%), var(--panel);
}
.buyer-panel p { max-width: 700px; margin: 0; color: var(--muted); }
.buyer-specs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.buyer-specs span { padding: 6px 10px; border: 1px solid rgba(71, 209, 178, .13); border-radius: 999px; color: #C2CED7; font-size: 10px; }
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.article-card { display: flex; min-height: 170px; flex-direction: column; justify-content: space-between; padding: 22px; border: 1px solid var(--line); border-radius: 14px; background: rgba(13, 20, 31, .68); text-decoration: none; }
.article-card:hover { border-color: rgba(71, 209, 178, .45); }
.article-card small { color: var(--green); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.article-card strong { margin: 18px 0 12px; font: 600 23px/1.15 var(--display); }
.article-card span { color: var(--turquoise); font-size: 12px; font-weight: 800; }

.assessment {
  padding: clamp(28px, 6vw, 60px); border: 1px solid rgba(57, 225, 155, .3); border-radius: 20px;
  background: radial-gradient(ellipse 700px 400px at 50% 0%, rgba(57, 225, 155, .1), transparent 72%), var(--panel);
}
.assessment-inner { max-width: 810px; margin: 0 auto; text-align: center; }
.assessment .lead { margin: 0 auto 25px; }
.assessment-form { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr) auto; gap: 10px; max-width: 780px; margin: 28px auto 0; }
.assessment-form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.assessment-form input {
  width: 100%; min-width: 0; min-height: 52px; padding: 13px 15px; border: 1px solid rgba(71, 209, 178, .2);
  border-radius: 9px; color: var(--white); background: #121C2B; font-size: 14px;
}
.assessment-form input::placeholder { color: #8B98A7; }
.assessment-form input:focus { outline: 2px solid rgba(94, 230, 255, .7); outline-offset: 1px; }
.assessment-form button { min-height: 52px; border: 0; cursor: pointer; }
.assessment-disclaimer { margin: 15px auto 0; color: #8491A1; font-size: 11px; }
.form-message { min-height: 24px; margin: 13px 0 0; color: var(--turquoise); font-size: 13px; }
.faq-list { max-width: 850px; }
.faq-list details { margin: 0 0 10px; border: 1px solid var(--line); border-radius: 12px; background: rgba(13, 20, 31, .66); }
.faq-list summary { cursor: pointer; padding: 17px 20px; color: var(--white); font: 600 20px/1.25 var(--display); list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { float: right; color: var(--green); content: "+"; font: 700 20px/1.1 var(--body); }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { margin: 0; padding: 0 20px 19px; color: var(--muted); font-size: 13px; }
.site-footer { padding: 38px 0 32px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.footer-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 18px; }
.footer-links a { color: var(--muted); text-decoration: none; }
.footer-links a:hover { color: var(--white); }
.legal-line { margin-top: 14px; color: #738091; font-size: 11px; }
.about-hero { padding: clamp(70px, 10vw, 130px) 0 78px; }
.about-copy { max-width: 860px; }
.about-copy h1 { max-width: 860px; }
.about-copy p { max-width: 740px; color: #C0C9D3; font-size: 17px; }
.about-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.about-value { padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: rgba(13, 20, 31, .7); }
.about-value p { margin: 0; color: var(--muted); font-size: 13px; }
.buyer-hero { padding: clamp(70px, 9vw, 116px) 0 74px; }
.buyer-hero .lead { max-width: 750px; }
.spec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

@media (max-width: 900px) {
  .desktop-nav { gap: 12px; }
  .desktop-nav > a:not(.button) { font-size: 12px; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 780px; }
  .data-map { max-width: 650px; }
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .two-col { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .wrap { width: min(100% - 32px, 1160px); }
  .header-row { min-height: 68px; }
  .desktop-nav { display: none; }
  .mobile-menu { display: block; }
  .hero { padding-top: 70px; }
  .hero-grid { gap: 38px; }
  h1 { font-size: clamp(44px, 12vw, 64px); }
  .section { padding: 76px 0; }
  .trust-strip { grid-template-columns: 1fr; margin-top: 42px; }
  .trust-strip > div + div { border-top: 1px solid var(--line); border-left: 0; }
  .buyer-panel { grid-template-columns: 1fr; }
  .max-panel { grid-template-columns: 1fr; }
  .max-art img { width: min(140px, 46vw); }
  .article-grid, .spec-grid { grid-template-columns: 1fr; }
  .assessment-form { grid-template-columns: 1fr; }
  .assessment-form .button { width: 100%; }
  .footer-row { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 480px) {
  .brand-lockup { gap: 7px; }
  .brand-lockup img { width: 40px; height: 40px; }
  .brand-name { font-size: 20px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-actions .button { width: 100%; }
  .data-map { padding: 18px; border-radius: 15px; }
  .card-grid, .outcome-grid, .about-values { grid-template-columns: 1fr; }
  .max-points { grid-template-columns: 1fr; }
  .feature-card { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}