.cad-hero {
  position: relative;
  margin-block-start: calc(-1 * var(--head-h));
  padding-block: calc(var(--head-h) + clamp(1.5rem, 4vw, 3rem)) clamp(2.5rem, 5vw, 4rem);
  min-height: clamp(560px, 80vh, 800px);
  display: grid;
  align-items: center;
  overflow: hidden;
}

.cad-hero__media { position: absolute; inset: 0; }

.cad-hero__media img {
  
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}

.cad-hero__body { position: relative; z-index: 1; width: 100%; }

.cad-hero__text { max-width: 38%; }

.cad-hero__h1 {
  margin: var(--sp-4) 0 0;
  max-width: 20ch;
  font-family: var(--font-display);
  font-size: var(--fs-h1);
  font-weight: 650;
  line-height: 1.04;
  letter-spacing: -.02em;
}

.cad-hero__deck { margin: var(--sp-6) 0 0; max-width: 42ch; }

.cad-hero__cells {
  display: grid;
  gap: var(--sp-3);
  margin-block-start: var(--sp-8);
  padding-block-start: var(--sp-4);
  border-block-start: 1px solid var(--rule);
}

.cad-cell { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--sp-2) var(--sp-4); align-items: baseline; }

.cad-cell__fig {
  font-family: var(--font-mono);
  font-size: clamp(1.375rem, 2vw, 1.875rem);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: -.02em;
}

.cad-cell__lab { font-size: var(--fs-micro); line-height: 1.4; color: var(--ink-muted); }

@media (max-width: 900px) {
  .cad-hero { display: block; min-height: 0; }
  .cad-hero__media { position: relative; aspect-ratio: 16 / 9; }
  .cad-hero__body { padding-block: clamp(2rem, 6vw, 3rem) 0; }
  .cad-hero__text { max-width: none; }
  .cad-hero__h1 { max-width: none; }
}



.cadsvg { display: block; width: 100%; height: auto; }
.cadsvg text { font-family: var(--font-body); fill: var(--ink); }
.cadsvg .cadbox { fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linejoin: miter; }
.cadsvg .cadboxm { fill: none; stroke: var(--ink-muted); stroke-width: 1.5; stroke-linejoin: miter; }
.cadsvg .cadln { fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linecap: square; }
.cadsvg .cadlnm { fill: none; stroke: var(--ink-muted); stroke-width: 1.5; stroke-linecap: square; }
.cadsvg .cadld { fill: none; stroke: var(--ink-muted); stroke-width: 1; stroke-linecap: square; }
.cadsvg .caddash { fill: none; stroke: var(--ink-muted); stroke-width: 1.5; stroke-dasharray: 7 5; stroke-linecap: square; }
.cadsvg .caddashm { fill: none; stroke: var(--ink-muted); stroke-width: 1; stroke-dasharray: 3 3; }
.cadsvg .cadacc { fill: none; stroke: var(--accent); stroke-width: 1.5; stroke-linecap: square; }
.cadsvg .cadaccd { fill: none; stroke: var(--accent); stroke-width: 1.5; stroke-dasharray: 8 5; stroke-linecap: square; }
.cadsvg .cadarrow { fill: var(--accent); stroke: none; }
.cadsvg .cadfill { fill: var(--ink); stroke: none; }
.cadsvg .cadfillc { fill: var(--ground-cool); stroke: none; }
.cadsvg .cadlab { font-family: var(--font-mono); font-size: 11px; fill: var(--ink-muted); }
.cadsvg .cadlabH { font-family: var(--font-mono); font-size: 12px; font-weight: 600; letter-spacing: .14em; fill: var(--ink); }
.cadsvg .cadfig { font-family: var(--font-mono); font-size: 13px; font-variant-numeric: tabular-nums; fill: var(--ink); }
.cadsvg .cadbadge { fill: none; stroke: var(--ink); stroke-width: 1.5; }
.cadsvg .cadbadgeA { fill: none; stroke: var(--accent); stroke-width: 1.5; }
.cadsvg .cadbadget { font-family: var(--font-mono); font-size: 12px; font-weight: 600; fill: var(--ink); }
.cadsvg .cadbadgetA { font-family: var(--font-mono); font-size: 12px; font-weight: 600; fill: var(--accent-deep); }




.cad-head {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: var(--sp-4);
  align-items: baseline;
  margin-block-end: var(--sp-6);
}

.cad-head__b {
  display: inline-grid;
  place-items: center;
  min-width: 46px;
  min-height: 34px;
  padding-inline: var(--sp-2);
  border: 1.5px solid var(--ink);
  border-radius: var(--r-card);
  font-family: var(--font-mono);
  font-size: var(--fs-small);
  font-weight: 600;
}

.cad-head__t {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.375rem, 2vw, 1.625rem);
  font-weight: 650;
  line-height: 1.2;
}



.cad-lede {
  margin: 0 0 var(--sp-8);
  max-width: 60ch;
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: 1.3;
}

.cad-tag {
  display: grid;
  grid-template-columns: minmax(0, 16ch) minmax(0, 1fr);
  gap: var(--sp-2) var(--sp-4);
  margin: 0;
  padding-block: var(--sp-3);
  border-block-start: 1px solid var(--rule-soft);
}

.cad-tag:first-child { border-block-start: 0; }

.cad-tag__k {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding-block-start: .35em;
}

.cad-tag__v { margin: 0; font-size: var(--fs-small); line-height: 1.55; }

.cad-note { margin: var(--sp-6) 0 0; max-width: var(--wrap-txt); font-size: var(--fs-small); line-height: 1.65; }

.cad-close {
  display: grid;
  grid-template-columns: minmax(0, 12ch) minmax(0, 1fr);
  gap: var(--sp-2) var(--sp-4);
  margin: var(--sp-6) 0 0;
  padding-block-start: var(--sp-4);
  border-block-start: 1px solid var(--rule);
  font-size: var(--fs-small);
  font-weight: 600;
  line-height: 1.55;
}

.cad-close--acc { color: var(--accent-deep); }

.cad-close__lab {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  padding-block-start: .3em;
}

.cad-miss {
  display: grid;
  grid-template-columns: minmax(0, 12ch) minmax(0, 1fr);
  gap: var(--sp-2) var(--sp-4);
  margin: var(--sp-4) 0 0;
  font-size: var(--fs-micro);
  line-height: 1.5;
  color: var(--ink-muted);
}

.cad-miss__lab { font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: .12em; text-transform: uppercase; }

.cad-scrollWide { max-width: 100%; }

@media (max-width: 1100px) {
  .cad-scrollWide { overflow-x: auto; }
  .cad-scrollWide .spec { min-width: 620px; }
}

.cad-fig { margin: 0; }
.cad-fig__cap { margin: var(--sp-4) 0 0; max-width: 100ch; font-size: var(--fs-micro); line-height: 1.55; color: var(--ink-muted); }

.cad-lines { margin: 0; padding: 0; list-style: none; }

.cad-lines li {
  display: grid;
  grid-template-columns: minmax(0, 22ch) minmax(0, 1fr);
  gap: var(--sp-2) var(--sp-4);
  padding-block: var(--sp-3);
  border-block-start: 1px solid var(--rule-soft);
}

.cad-lines li:first-child { border-block-start: 0; }
.cad-lines__t { font-family: var(--font-mono); font-size: var(--fs-small); font-weight: 600; line-height: 1.45; }
.cad-lines__d { margin: 0; font-size: var(--fs-small); line-height: 1.55; color: var(--ink-muted); }



.cad-rule {
  display: grid;
  gap: var(--sp-4);
  padding: var(--sp-6);
  background: var(--sheet);
  border: 1px solid var(--rule);
  border-radius: var(--r-card);
}

.cad-rule__fig {
  font-family: var(--font-mono);
  font-size: var(--fs-figure);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: -.02em;
}

.cad-rule__lines { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--sp-2); }

.cad-rule__lines li {
  padding-block-start: var(--sp-2);
  border-block-start: 1px solid var(--rule-soft);
  font-size: var(--fs-small);
  line-height: 1.55;
}



.cad-check { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--sp-3); }

.cad-check li {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: var(--sp-4);
  align-items: start;
  font-size: var(--fs-small);
  line-height: 1.55;
}

.cad-check__box {
  width: 16px;
  height: 16px;
  margin-block-start: .25em;
  border: 1.5px solid var(--ink-muted);
  border-radius: var(--r-flat);
}



.cad-tracks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-8); align-items: start; }

.cad-steps { margin: 0; padding: 0; list-style: none; }

.cad-steps li {
  display: grid;
  grid-template-columns: minmax(0, 4ch) minmax(0, 1fr);
  gap: var(--sp-2) var(--sp-4);
  padding-block: var(--sp-3);
  border-block-start: 1px solid var(--rule-soft);
  font-size: var(--fs-small);
  line-height: 1.6;
}

.cad-steps li:first-child { border-block-start: 0; }
.cad-steps__n { font-family: var(--font-mono); color: var(--ink-muted); }

@media (max-width: 860px) { .cad-tracks { grid-template-columns: minmax(0, 1fr); } }

.cad-doc { margin: var(--sp-6) 0 0; padding-block-start: var(--sp-4); border-block-start: 1px solid var(--rule); font-family: var(--font-mono); font-size: var(--fs-small); font-variant-numeric: tabular-nums; }



.cad-spec {
  margin: 0;
  padding: var(--sp-6);
  background: var(--sheet);
  border: 1px solid var(--rule);
  border-radius: var(--r-flat);
  overflow-x: auto;
}

.cad-spec code {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-small);
  line-height: 2;
  white-space: pre;
  color: var(--ink);
}



.cad-cta { display: grid; justify-items: center; text-align: center; gap: var(--sp-6); }
.cad-cta__line { margin: 0 auto; max-width: var(--wrap-txt); }
.cad-cta__links { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-6); font-size: var(--fs-small); font-weight: 600; }