h2 { font-size: clamp(28px, 3.6vw, 38px); font-weight: 700; line-height: 1.12; letter-spacing: -.03em; text-wrap: balance; }
h3 { font-size: 18px; font-weight: 650; letter-spacing: -.01em; }
.sub { color: var(--muted); font-size: 18px; line-height: 1.6; margin-top: 12px; max-width: 60ch; }
.note { margin-top: 16px; font-size: 14px; color: var(--muted); }
.inline { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.mid { margin-top: 36px; }

.hero { padding: 68px 0 64px; border-bottom: 1px solid var(--line); }
.hero .wrap { display: grid; gap: 44px 72px; grid-template-columns: 1fr; align-items: start; }
.kicker { font-size: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); margin-bottom: 18px; }
.hero h1 { font-size: clamp(36px, 5.4vw, 62px); font-weight: 700; line-height: 1.06; letter-spacing: -.04em; text-wrap: balance; }
.hero .lede { margin-top: 22px; font-size: clamp(17px, 2vw, 20px); line-height: 1.6; color: var(--muted); max-width: 56ch; }
.hero .cta-row { margin-top: 30px; }
.facts { border: 1px solid var(--line); border-radius: 10px; padding: 26px 28px 14px; background: var(--bg); }
.facts-h { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 650; }
.facts dl div { display: grid; grid-template-columns: 112px 1fr; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--line); font-size: 15px; line-height: 1.5; }
.facts dl div:last-child { border-bottom: 0; }
.facts dt { color: var(--muted); }
.facts dd { margin: 0; font-weight: 600; }
@media (min-width: 1000px) { .hero .wrap { grid-template-columns: 7fr 5fr; } }

.pillars { background: var(--band); border-bottom: 1px solid var(--line); }
.pillars .wrap { display: grid; grid-template-columns: 1fr; }
.pillars div { padding: 24px 0; border-bottom: 1px solid var(--line); }
.pillars div:last-child { border-bottom: 0; }
.pillars b { display: block; font-size: 20px; letter-spacing: -.02em; }
.pillars span { display: block; margin-top: 4px; color: var(--muted); font-size: 15px; line-height: 1.5; max-width: 34ch; }
@media (min-width: 900px) {
  .pillars .wrap { grid-template-columns: repeat(4, 1fr); }
  .pillars div { padding: 32px 28px 32px 0; border-bottom: 0; border-right: 1px solid var(--line); margin-right: 28px; }
  .pillars div:last-child { border-right: 0; margin-right: 0; }
}

.block { padding: 88px 0; }
.block.tint { background: var(--band); border-block: 1px solid var(--line); }
.split { display: grid; gap: 36px 72px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .split { grid-template-columns: 5fr 7fr; } }

.tablewrap { margin-top: 36px; border: 1px solid var(--line); border-radius: 10px; overflow: clip; background: var(--bg); }
.matrix { width: 100%; border-collapse: collapse; }
.matrix th, .matrix td { text-align: left; vertical-align: top; padding: 18px 22px; border-top: 1px solid var(--line); line-height: 1.55; }
.matrix thead th { border-top: 0; background: var(--band); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 650; padding-block: 14px; }
.matrix tbody th { width: 24%; font-weight: 650; }
.matrix td { color: var(--muted); }
.compare .us { background: color-mix(in srgb, var(--soft) 55%, var(--bg)); color: var(--ink); }
.compare thead .us { color: var(--soft-ink); background: var(--soft); }
.compare tbody .us { font-weight: 550; }

.term { border-radius: 14px; overflow: hidden; background: #0e131a; border: 1px solid #27303c; }
.term-bar { padding: 11px 18px; font: 13px var(--mono); color: #a9b6c8; border-bottom: 1px solid #27303c; background: #151b24; }
.term pre { margin: 0; padding: 22px 22px 26px; font: 15px/1.75 var(--mono); color: #d7e0ee; overflow-x: auto; white-space: pre-wrap; }
.term .p { color: #84b9ff; }
.term .h { color: #fff; font-weight: 600; }
.term .k { color: #4fd1a5; }

.phases { display: grid; gap: 0; grid-template-columns: 1fr; margin-top: 40px; border-top: 1px solid var(--line); }
.phases li { padding: 24px 4px; border-bottom: 1px solid var(--line); }
.phases p { color: var(--muted); margin-top: 6px; }
.phases b { display: block; margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--soft-ink); }
@media (min-width: 900px) {
  .phases { grid-template-columns: repeat(4, 1fr); border-top: 0; }
  .phases li { padding: 4px 24px 8px; border-bottom: 0; border-left: 1px solid var(--line); }
  .phases li:first-child { padding-left: 0; border-left: 0; }
}

.refs-h { font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 650; }
.refs { margin-top: 10px; border-top: 1px solid var(--line); }
.refs li { padding: 18px 0; border-bottom: 1px solid var(--line); }
.refs b { display: block; font-size: 18px; letter-spacing: -.015em; }
.refs span { display: block; margin-top: 4px; color: var(--muted); line-height: 1.6; }

.sheet { margin-top: 32px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.sheet > div { display: grid; grid-template-columns: 1fr; gap: 4px 28px; padding: 18px 24px; border-bottom: 1px solid var(--line); }
.sheet > div:last-child { border-bottom: 0; }
.sheet dt { color: var(--muted); font-weight: 600; font-size: 14px; }
.sheet dd { margin: 0; line-height: 1.6; }
@media (min-width: 760px) { .sheet > div { grid-template-columns: 200px 1fr; } }

.qa details { border-top: 1px solid var(--line); }
.qa details:last-child { border-bottom: 1px solid var(--line); }

.closer { padding: 88px 0; border-top: 1px solid var(--line); }
.closer h2 { max-width: 20ch; }
.closer p { margin: 14px 0 28px; font-size: 19px; color: var(--muted); max-width: 50ch; }

@media (max-width: 759px) {
  .hero { padding: 40px 0 44px; }
  .block { padding: 60px 0; }
  .closer { padding: 60px 0; }
  .facts { padding: 22px 20px 8px; }
  .facts dl div { grid-template-columns: 1fr; gap: 2px; }
  .cta-row .btn { width: 100%; }
  .matrix thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .matrix, .matrix tbody, .matrix tr, .matrix th, .matrix td { display: block; width: 100%; }
  .matrix tr { padding: 14px 0; border-top: 1px solid var(--line); }
  .matrix tr:first-child { border-top: 0; }
  .matrix th, .matrix td { border: 0; padding: 4px 18px; }
  .matrix tbody th { width: 100%; padding-top: 8px; }
  .matrix td::before { content: attr(data-label); display: block; font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: var(--accent); margin-bottom: 2px; }
  .compare .us { margin: 6px 12px 0; width: auto; border-radius: 8px; padding: 10px 14px; }
}

.promises { background: var(--band); border-block: 1px solid var(--line); }
.promises .wrap { padding-block: 60px; }
.promises h2 { font-size: clamp(26px, 3.4vw, 36px); font-weight: 700; letter-spacing: -.03em; line-height: 1.15; }
.promises ul { display: grid; grid-template-columns: 1fr; margin-top: 28px; border-top: 1px solid var(--line); }
.promises li { padding: 22px 0; border-bottom: 1px solid var(--line); }
.promises b { display: block; font-size: 20px; letter-spacing: -.02em; line-height: 1.3; }
.promises span { display: block; margin-top: 6px; color: var(--muted); line-height: 1.6; max-width: 42ch; }
@media (min-width: 900px) {
  .promises ul { grid-template-columns: repeat(3, 1fr); border-top: 0; margin-top: 32px; }
  .promises li { padding: 4px 32px 4px 28px; border-bottom: 0; border-left: 1px solid var(--line); }
  .promises li:first-child { padding-left: 0; border-left: 0; }
}
@media (max-width: 759px) { .promises .wrap { padding-block: 44px; } }