.jdb-v3 .jdb-v3-section-system-preview {
  width:calc(100% + var(--jdb-space-8));
  margin:var(--jdb-space-20) calc(0px - var(--jdb-space-4)) 0;
}
.jdb-v3 .jdb-v3-section-system-preview__label {
  padding:0 var(--jdb-space-4) var(--jdb-space-4);
  color:var(--jdb-color-text-muted);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
}
.jdb-v3 .jdb-v3-section { width:100%; padding-block:var(--jdb-space-16); }
.jdb-v3 .jdb-v3-section--canvas { background:var(--jdb-color-canvas); }
.jdb-v3 .jdb-v3-section--surface { background:var(--jdb-color-surface); }
.jdb-v3 .jdb-v3-section--elevated { background:var(--jdb-color-elevated); }
.jdb-v3 .jdb-v3-container {
  display:grid;
  width:100%;
  max-width:var(--jdb-container);
  margin-inline:auto;
  padding-inline:var(--jdb-space-4);
}
.jdb-v3 .jdb-v3-section .jdb-v3-section-heading { display:contents; margin:0; }
.jdb-v3 .jdb-v3-section-heading__eyebrow {
  order:1;
  margin:0 0 var(--jdb-space-2);
  color:var(--jdb-color-text-muted);
  font-size:11px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.jdb-v3 .jdb-v3-section-heading__row { display:contents; }
.jdb-v3 .jdb-v3-section-heading__body { order:2; min-width:0; }
.jdb-v3 .jdb-v3-section-heading__title {
  margin:0;
  color:var(--jdb-color-text);
  font-size:24px;
  font-weight:700;
  line-height:1.4;
  overflow-wrap:anywhere;
  word-break:normal;
}
.jdb-v3 .jdb-v3-section-heading__title::before,
.jdb-v3 .jdb-v3-section-heading__title::after { content:none; }
.jdb-v3 .jdb-v3-section-heading__description {
  max-width:680px;
  margin-top:var(--jdb-space-2);
  color:var(--jdb-color-text-secondary);
  font-size:15px;
  line-height:1.8;
}
.jdb-v3 .jdb-v3-section__content { order:3; min-width:0; margin-top:var(--jdb-space-6); }
.jdb-v3 .jdb-v3-section-heading__link {
  display:flex;
  order:4;
  width:100%;
  min-height:44px;
  margin-top:var(--jdb-space-6);
  padding-block:var(--jdb-space-2);
  align-items:center;
  justify-content:space-between;
  gap:var(--jdb-space-3);
  border-top:1px solid var(--jdb-color-border);
  color:var(--jdb-color-text-secondary);
  font-size:14px;
  font-weight:700;
  line-height:1.5;
  transition:color var(--jdb-duration-fast) ease,border-color var(--jdb-duration-fast) ease;
}
.jdb-v3 .jdb-v3-section-heading__link-icon { display:grid; width:20px; height:20px; flex:0 0 20px; place-items:center; }
.jdb-v3 .jdb-v3-section-heading__link-icon svg { display:block; width:20px; height:20px; }
.jdb-v3 .jdb-v3-section-heading__link:focus-visible { border-radius:var(--jdb-radius-xs); }
.jdb-v3 .jdb-v3-section-demo-note { max-width:680px; color:var(--jdb-color-text-secondary); font-size:15px; line-height:1.8; }

@media (hover:hover) and (pointer:fine) {
  .jdb-v3 .jdb-v3-section-heading__link:hover { border-color:var(--jdb-color-border-strong); color:var(--jdb-color-text); }
}
@media (min-width:600px) {
  .jdb-v3 .jdb-v3-section-system-preview { width:calc(100% + var(--jdb-space-12)); margin-inline:calc(0px - var(--jdb-space-6)); }
  .jdb-v3 .jdb-v3-section-system-preview__label { padding-inline:var(--jdb-space-6); }
  .jdb-v3 .jdb-v3-container { padding-inline:var(--jdb-space-6); }
}
@media (min-width:768px) {
  .jdb-v3 .jdb-v3-section { padding-block:var(--jdb-space-20); }
  .jdb-v3 .jdb-v3-container { display:block; }
  .jdb-v3 .jdb-v3-section .jdb-v3-section-heading { display:block; margin:0; }
  .jdb-v3 .jdb-v3-section-heading__eyebrow { margin-bottom:var(--jdb-space-2); }
  .jdb-v3 .jdb-v3-section-heading__row { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--jdb-space-8); }
  .jdb-v3 .jdb-v3-section-heading__body { flex:1 1 auto; }
  .jdb-v3 .jdb-v3-section-heading__title { font-size:28px; }
  .jdb-v3 .jdb-v3-section-heading__description { font-size:16px; }
  .jdb-v3 .jdb-v3-section-heading__link { width:auto; min-width:max-content; margin:0 0 2px auto; padding:var(--jdb-space-2) 0; justify-content:flex-start; border-top:0; }
  .jdb-v3 .jdb-v3-section__content { margin-top:calc(var(--jdb-space-6) + var(--jdb-space-1)); }
}
@media (min-width:1024px) {
  .jdb-v3 .jdb-v3-section-system-preview { width:calc(100% + var(--jdb-space-16)); margin-inline:calc(0px - var(--jdb-space-8)); }
  .jdb-v3 .jdb-v3-section-system-preview__label { padding-inline:var(--jdb-space-8); }
  .jdb-v3 .jdb-v3-section { padding-block:var(--jdb-space-24); }
  .jdb-v3 .jdb-v3-container { padding-inline:var(--jdb-space-8); }
  .jdb-v3 .jdb-v3-section-heading__title { font-size:32px; }
  .jdb-v3 .jdb-v3-section__content { margin-top:var(--jdb-space-8); }
}
@media (prefers-reduced-motion:reduce) {
  .jdb-v3 .jdb-v3-section-heading__link { transition:none; }
}