.p-hero{padding:80px var(--pad-x) 80px;position:relative}
.p-hero .eyebrow{margin-bottom:42px}
.p-hero h1{
  font-family:var(--font-display);
  font-size:clamp(56px,10vw,140px);
  line-height:.88;letter-spacing:-.035em;text-transform:uppercase;
  max-width:14ch;
}
.p-hero h1 .e{color:var(--ember)}
.p-hero h1 .out{-webkit-text-stroke:var(--border) var(--bone);color:transparent}
.p-hero .lead{
  margin-top:42px;max-width:60ch;
  font-family:var(--font-mono);font-size:14px;line-height:1.85;color:var(--steel);
}
.p-hero .lead b{color:var(--bone);font-weight:500}

.section-head{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:60px var(--pad-x) 28px;
  border-top:var(--border) solid var(--line-d);
  border-bottom:var(--border) solid var(--line-d);
}
.section-head .n{
  font-family:var(--font-mono);font-size:11px;
  letter-spacing:.3em;text-transform:uppercase;color:var(--ember);
}
.section-head h2{
  font-family:var(--font-display);
  font-size:clamp(36px,5vw,68px);
  line-height:.95;letter-spacing:-.03em;text-transform:uppercase;
  margin-top:12px;
}
.section-head h2 .e{color:var(--ember)}
.section-head .right{
  font-family:var(--font-mono);font-size:12px;color:var(--slate);
  text-transform:uppercase;letter-spacing:.16em;text-align:right;
  max-width:38ch;
}

.light{background:var(--bone);color:var(--graphite);border-bottom:var(--border) solid var(--graphite)}
.light .section-head{border-color:var(--graphite)}
.light .section-head .n{color:var(--ember)}
.light .section-head .right{color:var(--slate)}

.pipeline{
  padding:80px var(--pad-x) 100px;
  display:flex;justify-content:center;
}
.pipeline pre{
  font-family:var(--font-mono);
  font-size:14px;line-height:1.7;color:var(--steel);
  white-space:pre;
  max-width:900px;width:100%;
}
.pipeline .lbl{color:var(--ember)}
.pipeline .node{color:var(--bone);font-weight:500}
.pipeline .arr{color:var(--slate)}
.pipeline .pipe{color:var(--ember)}

.storage{
  display:grid;grid-template-columns:1fr 1fr;
  gap:var(--border);background:var(--line-d);
}
.storage .card{
  background:var(--graphite);
  padding:48px var(--pad-x);
  min-height:240px;
}
.storage .card .n{
  font-family:var(--font-mono);font-size:11px;
  color:var(--ember);letter-spacing:.3em;text-transform:uppercase;
}
.storage .card h3{
  font-family:var(--font-display);
  font-size:clamp(26px,2.6vw,38px);
  letter-spacing:-.02em;text-transform:uppercase;
  font-weight:400;margin:18px 0 18px;line-height:1;
}
.storage .card p{
  font-family:var(--font-mono);font-size:13px;line-height:1.8;
  color:var(--slate);max-width:48ch;
}
.storage .card p b{color:var(--bone);font-weight:500}
.storage .card .stat{
  margin-top:24px;font-family:var(--font-display);
  font-size:42px;color:var(--bone);letter-spacing:-.025em;line-height:1;
}
.storage .card .stat b{
  font-family:var(--font-mono);font-size:14px;color:var(--slate);
  font-weight:400;letter-spacing:0;
}

.qlang{
  padding:60px var(--pad-x) 80px;
  display:grid;grid-template-columns:1fr 1.4fr;gap:48px;
  background:var(--bone);color:var(--graphite);
  border-bottom:var(--border) solid var(--graphite);
}
.qlang .copy h3{
  font-family:var(--font-display);
  font-size:clamp(28px,3.2vw,42px);
  text-transform:uppercase;letter-spacing:-.02em;line-height:.95;
  margin-bottom:24px;font-weight:400;
}
.qlang .copy p{
  font-family:var(--font-mono);font-size:13px;line-height:1.85;
  color:var(--slate);max-width:42ch;margin-bottom:20px;
}
.qlang .copy p b{color:var(--graphite);font-weight:500}
.qlang .copy ul{
  list-style:none;
  font-family:var(--font-mono);font-size:13px;color:var(--slate);line-height:1.9;
}
.qlang .copy ul li{padding-left:22px;position:relative}
.qlang .copy ul li::before{content:"→";position:absolute;left:0;color:var(--ember)}
.qlang .copy ul b{color:var(--graphite);font-weight:500}

.qlang .examples{display:flex;flex-direction:column;gap:18px}
.qlang .ex{
  font-family:var(--font-mono);font-size:13px;line-height:1.75;
  background:var(--graphite);color:var(--steel);
  padding:22px 26px;
  border-left:var(--border) solid var(--ember);
  white-space:pre;overflow-x:auto;
}
.qlang .ex .l{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--slate);margin-bottom:10px;display:block}
.qlang .ex .p{color:var(--bone)}
.qlang .ex .e{color:var(--ember)}
.qlang .ex .c{color:var(--slate);font-style:italic}

.integrations{
  display:grid;grid-template-columns:repeat(6,1fr);
  background:var(--graphite);
  border-bottom:var(--border) solid var(--line-d);
}
.int{
  padding:32px 18px;
  border-right:var(--border) solid var(--line-d);
  border-bottom:var(--border) solid var(--line-d);
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:140px;
  transition:background var(--dur-fast);
  cursor:default;
}
.int:nth-child(6n){border-right:none}
.int:nth-last-child(-n+6){border-bottom:none}
.int:hover{background:var(--graphite-soft)}
.int .name{
  font-family:var(--font-display);font-size:16px;
  text-transform:uppercase;letter-spacing:-.01em;color:var(--bone);
  line-height:1.1;
}
.int .name.lower{text-transform:lowercase;font-family:var(--font-mono);font-weight:600;letter-spacing:-.01em}
.int .tag{
  font-family:var(--font-mono);font-size:10px;
  color:var(--slate);letter-spacing:.16em;text-transform:uppercase;
}
.int .ready{color:var(--signal)}
.int .beta{color:var(--ember)}

.compliance{
  display:grid;grid-template-columns:repeat(6,1fr);
  background:var(--bone);color:var(--graphite);
  border-bottom:var(--border) solid var(--graphite);
}
.comp{
  padding:48px 18px;
  border-right:var(--border) solid var(--graphite);
  text-align:center;
}
.comp:last-child{border-right:none}
.comp b{
  display:block;font-family:var(--font-display);font-weight:400;
  font-size:24px;text-transform:uppercase;letter-spacing:-.01em;line-height:1;
}
.comp span{
  display:block;margin-top:10px;
  font-family:var(--font-mono);font-size:11px;
  color:var(--slate);letter-spacing:.18em;text-transform:uppercase;
}

.versus{
  display:grid;grid-template-columns:1fr 1fr;
  background:var(--graphite);
  border-bottom:var(--border) solid var(--line-d);
}
.vs{
  padding:60px var(--pad-x) 60px;
  border-right:var(--border) solid var(--line-d);
  position:relative;
}
.vs:last-child{border-right:none;background:var(--graphite-soft)}
.vs .badge{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.3em;
  text-transform:uppercase;color:var(--ember);margin-bottom:18px;
}
.vs h3{
  font-family:var(--font-display);
  font-size:clamp(36px,4vw,60px);
  text-transform:uppercase;letter-spacing:-.025em;line-height:.95;
  margin-bottom:32px;font-weight:400;
}
.vs ul{
  list-style:none;font-family:var(--font-mono);font-size:13px;
  color:var(--steel);line-height:1.85;
}
.vs ul li{padding-left:24px;position:relative}
.vs ul li::before{content:"→";position:absolute;left:0;color:var(--ember)}
.vs ul b{color:var(--bone);font-weight:500}
.vs .price{
  margin-top:32px;padding-top:24px;
  border-top:var(--border) solid var(--line-d);
  font-family:var(--font-mono);font-size:13px;color:var(--slate);
  letter-spacing:.06em;
}
.vs .price b{display:block;color:var(--bone);font-family:var(--font-display);font-weight:400;font-size:32px;letter-spacing:-.02em;margin-bottom:4px}
.vs .price b .e{color:var(--ember)}

.cta-strip{
  background:var(--graphite);
  padding:120px var(--pad-x);text-align:center;
  border-bottom:var(--border) solid var(--line-d);
}
.cta-strip h2{
  font-family:var(--font-display);
  font-size:clamp(40px,6vw,96px);
  text-transform:uppercase;letter-spacing:-.03em;line-height:.95;
  margin-bottom:42px;
}
.cta-strip h2 .e{color:var(--ember)}
.cta-strip .row-btns{display:inline-flex;flex-wrap:wrap;gap:14px;justify-content:center}

@media (max-width:900px){
  .storage{grid-template-columns:1fr}
  .qlang{grid-template-columns:1fr}
  .integrations{grid-template-columns:repeat(2,1fr)}
  .int:nth-child(6n){border-right:var(--border) solid var(--line-d)}
  .int:nth-child(2n){border-right:none}
  .compliance{grid-template-columns:repeat(2,1fr)}
  .comp{border-right:var(--border) solid var(--graphite);border-bottom:var(--border) solid var(--graphite)}
  .comp:nth-child(2n){border-right:none}
  .versus{grid-template-columns:1fr}
  .vs{border-right:none;border-bottom:var(--border) solid var(--line-d)}
  .pipeline pre{font-size:11px}
}