/* The approved compounding circuit, integrated into the existing homepage. */
.hero.hero-circuit {
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);
  align-items:center;
  gap:clamp(28px,3vw,52px);
  min-height:0;
  padding-block:72px 96px;
}
.hero-circuit .hero-copy {
  width:auto;
  min-width:0;
  pointer-events:auto;
}
.hero-circuit h1 {
  margin:0 0 32px;
  font-size:clamp(44px,4.15vw,66px);
  line-height:1.08;
}
.hero-circuit .hero-dek {
  font-size:clamp(17px,1.45vw,20px);
  line-height:1.55;
  letter-spacing:-.35px;
}
.circuit-art {
  min-width:0;
  width:100%;
}
.circuit-eyebrow {
  margin:0;
  color:var(--muted);
  font:10px/1.6 var(--mono);
  text-transform:uppercase;
  letter-spacing:1.2px;
}
.circuit-phase {
  margin:12px 0 0;
  min-height:2.36em;
  font-size:clamp(26px,2.5vw,36px);
  font-weight:400;
  line-height:1.18;
  letter-spacing:-1px;
  text-wrap:balance;
}
.circuit-canvas {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:760/540;
}
.circuit-description {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.circuit-key {
  display:none;
  margin:0 0 16px;
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}
.circuit-art[data-compact="true"] .circuit-key { display:block; }
.circuit-caption {
  display:flex;
  align-items:center;
  gap:20px;
  min-height:64px;
}
.circuit-caption p {
  max-width:420px;
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.6;
}
.circuit-motion {
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-left:auto;
  padding:9px 14px;
  min-height:40px;
  min-width:84px;
  background:transparent;
  border:1px solid var(--rule);
  border-radius:24px;
  font-size:12px;
}
.circuit-motion[hidden] { display:none; }
.circuit-motion:hover { border-color:var(--ink); }
@media(max-width:1000px) {
  .hero.hero-circuit {
    grid-template-columns:minmax(0,1fr);
    gap:48px;
    padding-block:58px 70px;
  }
  .hero-circuit .hero-copy { max-width:660px; }
  .hero-circuit h1 { font-size:clamp(40px,6.3vw,60px); }
  .hero-circuit .hero-dek { font-size:20px; max-width:590px; }
  .circuit-art { max-width:760px; margin-inline:auto; }
}
@media(max-width:760px) {
  .hero.hero-circuit { gap:38px; padding-block:41px 48px; }
  .hero-circuit h1 { font-size:clamp(32px,8.7vw,56px); margin-bottom:27px; }
  .hero-circuit .hero-dek { font-size:18px; }
  .circuit-eyebrow { font-size:9px; letter-spacing:.9px; }
  .circuit-phase { font-size:27px; }
  .circuit-caption { gap:16px; min-height:68px; }
  .circuit-caption p { font-size:12px; }
  .circuit-key { font-size:11px; }
  .circuit-motion { min-height:44px; min-width:78px; padding-inline:12px; }
}
@media print {
  .hero.hero-circuit { display:block; padding-block:24px 36px; }
  .circuit-art { display:none; }
}