/* How it works: the tool switcher that fills the orbit pane in the static build. */
.product-orbit .lp-orbit{min-height:0;height:auto;overflow:visible}
.product-orbit{min-height:0}

.tool-switch{display:grid;grid-template-rows:auto 1fr;height:100%;padding:64px 7% 64px 9%;gap:0}
.tool-tabs{display:flex;flex-wrap:wrap;gap:8px;border-bottom:1px solid #1d3a44;padding-bottom:22px}
.tool-tabs button{
  border:1px solid #27454f;background:transparent;color:#9fc2c6;
  border-radius:99px;padding:9px 18px;font-size:15px;line-height:1.2;
  transition:border-color .15s ease,color .15s ease,background .15s ease;
}
.tool-tabs button:hover{border-color:#4f8f8a;color:#d7eeee}
.tool-tabs button[aria-selected="true"]{background:var(--mint);border-color:var(--mint);color:#04201a;font-weight:500}
.tool-tabs button:focus-visible{outline:2px solid var(--bright);outline-offset:2px}

.tool-panels{padding-top:38px}
.tool-panels>div[hidden]{display:none}
.tool-panels h3{font-size:clamp(26px,2.3vw,36px);letter-spacing:-.025em;margin:0 0 22px;color:#edf7f6}
.tool-panels p{font-size:18px;line-height:1.65;color:#b1c7ce;margin:0 0 18px;max-width:52ch}
.tool-panels .tool-link{
  display:inline-flex;align-items:center;gap:14px;margin-top:12px;
  font-size:15px;font-weight:500;color:var(--mint);
}
.tool-panels .tool-link:hover{color:var(--bright)}

@media (max-width:1100px){
  .tool-switch{padding:52px 7%}
  .tool-panels h3{font-size:28px}
}
@media (max-width:700px){
  .tool-switch{padding:40px 26px 48px}
  .tool-tabs{gap:7px;padding-bottom:18px}
  .tool-tabs button{font-size:14px;padding:8px 14px}
  .tool-panels{padding-top:28px}
  .tool-panels p{font-size:17px}
}

/* The two-column architecture sections pair a short heading with a tall row
   list; pin the heading so the left track is not a block of dead space. */
.architecture>.section-heading{position:sticky;top:40px;align-self:start}
@media (max-width:900px){
  .architecture>.section-heading{position:static}
}