:root {
    --beam-hub-brand: #2f7a7b;
    --beam-hub-brand-dark: #235f61;
    --beam-hub-brand-soft: #eaf6f5;
    --beam-hub-ink: #0f172a;
    --beam-hub-muted: #526174;
    --beam-hub-line: #dce4eb;
    --beam-hub-surface: #ffffff;
    --beam-hub-tint: #f7fafb;
    --beam-hub-warm: #fef8eb;
}

.beam-hub-v2 {
    background: var(--beam-hub-surface);
    color: var(--beam-hub-ink);
}

.beam-hub-v2 *,
.beam-hub-v2 *::before,
.beam-hub-v2 *::after {
    box-sizing: border-box;
}

.beam-hub-shell {
    width: min(100% - 2rem, 82rem);
    margin-inline: auto;
}

.beam-hub-preview {
    background: #0f2d32;
    color: #d8f4f1;
    font-size: 0.82rem;
}

.beam-hub-preview__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 2.65rem;
    gap: 1rem;
}

.beam-hub-preview strong {
    color: #fff;
}

.beam-hub-preview a {
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.beam-hub-preview a:hover {
    color: #b8ebe7;
}

.beam-hub-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(234, 246, 245, 0.94), rgba(255, 255, 255, 0.98) 74%),
        linear-gradient(90deg, rgba(47, 122, 123, 0.055) 1px, transparent 1px),
        linear-gradient(rgba(47, 122, 123, 0.055) 1px, transparent 1px);
    background-size: auto, 32px 32px, 32px 32px;
    border-bottom: 1px solid #edf2f5;
}

.beam-hub-hero__glow {
    position: absolute;
    z-index: -1;
    width: 54rem;
    height: 30rem;
    top: -18rem;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 999px;
    background: rgba(90, 188, 180, 0.25);
    filter: blur(72px);
}

.beam-hub-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.48rem;
    padding-top: 1.15rem;
    color: #6b7a8b;
    font-size: 0.76rem;
}

.beam-hub-breadcrumb a {
    color: #526174;
    font-weight: 700;
    text-decoration: none;
}

.beam-hub-breadcrumb a:hover {
    color: var(--beam-hub-brand);
}

.beam-hub-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(28rem, 0.9fr);
    align-items: center;
    gap: clamp(2rem, 5vw, 5rem);
    padding: clamp(2.25rem, 4vw, 4rem) 0 clamp(3rem, 5vw, 5rem);
}

.beam-hub-eyebrow,
.beam-hub-kicker {
    display: block;
    color: var(--beam-hub-brand-dark);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.beam-hub-hero h1 {
    max-width: 12ch;
    margin: 0.7rem 0 0;
    color: var(--beam-hub-ink);
    font-size: clamp(2.75rem, 5.2vw, 5.25rem);
    font-weight: 800;
    letter-spacing: -0.055em;
    line-height: 0.98;
}

.beam-hub-hero h1 span {
    color: var(--beam-hub-brand);
}

.beam-hub-hero__lede {
    max-width: 44rem;
    margin: 1.35rem 0 0;
    color: var(--beam-hub-muted);
    font-size: clamp(1.05rem, 1.4vw, 1.23rem);
    line-height: 1.7;
}

.beam-hub-v2 .beam-guide-byline {
    margin-top: 1.1rem;
}

.beam-hub-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.6rem;
}

.beam-hub-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 3rem;
    padding: 0.72rem 1.05rem;
    border: 1px solid transparent;
    border-radius: 0.72rem;
    font-size: 0.94rem;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    transition: 160ms ease;
}

.beam-hub-button:hover {
    transform: translateY(-1px);
}

.beam-hub-button--primary {
    background: var(--beam-hub-brand);
    color: #fff;
    box-shadow: 0 10px 24px rgba(47, 122, 123, 0.2);
}

.beam-hub-button--primary:hover {
    background: var(--beam-hub-brand-dark);
    color: #fff;
}

.beam-hub-button--secondary {
    border-color: #bfd8d7;
    background: rgba(255, 255, 255, 0.78);
    color: var(--beam-hub-brand-dark);
}

.beam-hub-button--secondary:hover {
    border-color: var(--beam-hub-brand);
    background: #fff;
    color: var(--beam-hub-brand-dark);
}

.beam-hub-button--light {
    background: #fff;
    color: var(--beam-hub-brand-dark);
}

.beam-hub-button--light:hover {
    color: #183f40;
}

.beam-hub-hero__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 1.8rem;
    margin: 1.85rem 0 0;
}

.beam-hub-hero__facts div {
    display: grid;
    grid-template-columns: auto auto;
    align-items: baseline;
    gap: 0.42rem;
}

.beam-hub-hero__facts dt {
    color: var(--beam-hub-brand-dark);
    font-size: 1.32rem;
    font-weight: 850;
}

.beam-hub-hero__facts dd {
    margin: 0;
    color: #657487;
    font-size: 0.78rem;
    font-weight: 700;
}

.beam-hub-cover {
    overflow: hidden;
    margin: 0;
    border: 1px solid rgba(47, 122, 123, 0.22);
    border-radius: 1.25rem;
    background: #fff;
    box-shadow: 0 28px 70px rgba(28, 59, 63, 0.14);
    transform: rotate(0.5deg);
}

.beam-hub-cover img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.beam-hub-cover figcaption {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--beam-hub-line);
    color: #647386;
    font-size: 0.72rem;
    font-weight: 750;
}

.beam-hub-jump {
    position: sticky;
    z-index: 20;
    top: 0;
    border-bottom: 1px solid var(--beam-hub-line);
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(12px);
}

.beam-hub-jump__inner {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    overflow-x: auto;
    padding-block: 0.55rem;
    scrollbar-width: none;
}

.beam-hub-jump__inner::-webkit-scrollbar {
    display: none;
}

.beam-hub-jump a {
    flex: 0 0 auto;
    padding: 0.48rem 0.78rem;
    border-radius: 999px;
    color: #556477;
    font-size: 0.78rem;
    font-weight: 750;
    text-decoration: none;
}

.beam-hub-jump a:hover {
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
}

.beam-hub-section {
    scroll-margin-top: 5rem;
    padding: clamp(4rem, 7vw, 6.7rem) 0;
}

.beam-hub-section--tint {
    background: var(--beam-hub-tint);
    border-block: 1px solid #edf2f5;
}

.beam-hub-section--intro {
    scroll-margin-top: 4.75rem;
    padding-block: clamp(3.5rem, 6vw, 5.5rem);
}

.beam-hub-section-heading {
    max-width: 50rem;
    margin: 0 auto 2.35rem;
    text-align: center;
}

.beam-hub-section-heading--left {
    margin-inline: 0;
    text-align: left;
}

.beam-hub-section-heading h2,
.beam-hub-restraint-intro h2,
.beam-hub-formula-bridge h2,
.beam-hub-final h2,
.beam-hub-review h2 {
    margin: 0.55rem 0 0;
    color: var(--beam-hub-ink);
    font-size: clamp(2rem, 3.8vw, 3.5rem);
    font-weight: 820;
    letter-spacing: -0.045em;
    line-height: 1.06;
}

.beam-hub-section-heading > p {
    margin: 1rem auto 0;
    color: var(--beam-hub-muted);
    font-size: 1.02rem;
    line-height: 1.75;
}

.beam-hub-section-heading--left > p {
    margin-inline: 0;
}

.beam-hub-restraint-intro {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: start;
}

.beam-hub-restraint-intro__copy p {
    margin: 0;
    color: var(--beam-hub-muted);
    font-size: 0.98rem;
    line-height: 1.76;
}

.beam-hub-restraint-intro__copy > strong {
    display: block;
    margin-bottom: 0.65rem;
    color: #26364a;
    font-size: 1.05rem;
    font-weight: 820;
    line-height: 1.45;
}

.beam-hub-restraint-intro__copy p + p {
    margin-top: 0.85rem;
}

.beam-hub-anchor-alias {
    display: block;
    position: relative;
    top: -5rem;
    visibility: hidden;
}

.beam-hub-restraint-model {
    display: grid;
    grid-template-columns: minmax(22rem, 0.88fr) minmax(0, 1.12fr);
    gap: 1rem;
    align-items: stretch;
    margin-top: 2.35rem;
}

.beam-hub-restraint-model__diagram {
    display: flex;
    min-width: 0;
    overflow: hidden;
    flex-direction: column;
    margin: 0;
    border: 1px solid var(--beam-hub-line);
    border-radius: 1.15rem;
    background: #f8fbfb;
    box-shadow: 0 12px 30px rgba(24, 54, 61, 0.055);
}

.beam-hub-restraint-model__diagram svg {
    display: block;
    width: 100%;
    height: auto;
    flex: 1;
}

.beam-hub-restraint-model__diagram figcaption {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.55rem;
    padding: 0.85rem 1rem;
    border-top: 1px solid #e0e9ec;
    background: #fff;
}

.beam-hub-restraint-model__diagram figcaption strong,
.beam-hub-restraint-model__diagram figcaption span {
    font-size: 0.68rem;
    line-height: 1.5;
}

.beam-hub-restraint-model__diagram figcaption strong {
    color: #334155;
}

.beam-hub-restraint-model__diagram figcaption span {
    color: #6b7989;
}

.beam-hub-restraint-rules {
    overflow: hidden;
    min-width: 0;
    border: 1px solid var(--beam-hub-line);
    border-radius: 1.15rem;
    background: #f5f8f9;
    box-shadow: 0 12px 30px rgba(24, 54, 61, 0.055);
}

.beam-hub-restraint-rules__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.15rem 1.2rem;
    border-bottom: 1px solid #dfe8eb;
    background: #fff;
}

.beam-hub-restraint-rules__header h3 {
    margin: 0.35rem 0 0;
    color: var(--beam-hub-ink);
    font-size: 1.15rem;
    font-weight: 830;
    letter-spacing: -0.025em;
    line-height: 1.25;
}

.beam-hub-restraint-legend {
    display: flex;
    flex: 0 0 auto;
    gap: 0.7rem;
    padding-bottom: 0.1rem;
}

.beam-hub-restraint-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #64748b;
    font-size: 0.62rem;
    font-weight: 750;
}

.beam-hub-restraint-legend i {
    width: 0.52rem;
    height: 0.52rem;
    border: 1.5px solid #55a8a3;
    border-radius: 999px;
    background: #fff;
}

.beam-hub-restraint-legend span:last-child i {
    border-color: #c27a2b;
    background: #fff0d7;
}

.beam-hub-support-rule-list {
    display: grid;
    gap: 0.65rem;
    padding: 0.75rem;
}

.beam-hub-support-rule {
    display: grid;
    grid-template-columns: minmax(13.5rem, 0.82fr) minmax(0, 1.18fr);
    overflow: hidden;
    border: 1px solid #dce5e8;
    border-radius: 0.85rem;
    background: #fff;
}

.beam-hub-support-rule__identity {
    display: grid;
    grid-template-columns: 5.1rem minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0.8rem;
    border-right: 1px solid #e4ebee;
}

.beam-hub-support-rule__identity > div:first-child {
    display: flex;
    height: 4.3rem;
    align-items: center;
    border-radius: 0.65rem;
    background: #f5f9fa;
}

.beam-hub-support-rule__identity svg {
    display: block;
    width: 100%;
    height: auto;
}

.beam-hub-support-rule__identity span {
    color: var(--beam-hub-brand-dark);
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.beam-hub-support-rule__identity h4 {
    margin: 0.18rem 0 0;
    color: #1f2937;
    font-size: 0.82rem;
    font-weight: 830;
    line-height: 1.25;
}

.beam-hub-support-rule__identity small {
    display: block;
    margin-top: 0.2rem;
    color: #6d7b8a;
    font-size: 0.61rem;
    line-height: 1.4;
}

.beam-hub-support-rule__states {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
    align-items: stretch;
    padding: 0.55rem;
}

.beam-hub-support-rule__states > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: 0.55rem 0.6rem;
    border: 1px solid #dfe8eb;
    border-radius: 0.58rem;
    background: #fafcfc;
}

.beam-hub-support-rule__states small,
.beam-hub-support-rule__states strong {
    display: block;
}

.beam-hub-support-rule__states small {
    color: #778493;
    font-size: 0.56rem;
    font-weight: 750;
    line-height: 1.35;
}

.beam-hub-support-rule__states strong {
    margin-top: 0.25rem;
    color: #2d7777;
    font-size: 0.62rem;
    font-weight: 850;
    line-height: 1.35;
}

.beam-hub-support-rule__states i {
    font-family: Georgia, "Times New Roman", serif;
    font-style: italic;
}

.beam-hub-support-rule__states .is-free::before,
.beam-hub-support-rule__states .is-restrained::before {
    content: "";
    width: 0.48rem;
    height: 0.48rem;
    margin-bottom: 0.32rem;
    border: 1.5px solid #55a8a3;
    border-radius: 999px;
    background: #fff;
}

.beam-hub-support-rule__states .is-restrained {
    border-color: #efd8b9;
    background: #fff9ee;
}

.beam-hub-support-rule__states .is-restrained::before {
    border-color: #c27a2b;
    background: #fff0d7;
}

.beam-hub-support-rule__states .is-restrained strong {
    color: #915614;
}

.beam-hub-classification-cues {
    display: grid;
    grid-template-columns: minmax(11rem, 0.7fr) repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
    margin-top: 1rem;
    padding: 0.75rem;
    border: 1px solid #d8e4e7;
    border-radius: 1rem;
    background: #edf7f6;
}

.beam-hub-classification-cues > div {
    min-width: 0;
    padding: 0.85rem 0.9rem;
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.86);
}

.beam-hub-classification-cues > div > span,
.beam-hub-classification-cues > div > strong,
.beam-hub-classification-cues > div > small {
    display: block;
}

.beam-hub-classification-cues > div > span {
    color: var(--beam-hub-brand-dark);
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.beam-hub-classification-cues > div > strong {
    margin-top: 0.36rem;
    color: #263548;
    font-size: 0.72rem;
    line-height: 1.4;
}

.beam-hub-classification-cues > div > small {
    margin-top: 0.35rem;
    color: #69798a;
    font-size: 0.62rem;
    line-height: 1.48;
}

.beam-hub-classification-cues .beam-hub-classification-cues__intro {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #174a4e;
}

.beam-hub-classification-cues__intro > span {
    color: #aee2de !important;
}

.beam-hub-classification-cues__intro > strong {
    color: #fff !important;
    font-size: 0.82rem !important;
}

.beam-hub-card-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1.15rem;
}

.beam-hub-card {
    position: relative;
    display: flex;
    grid-column: span 2;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--beam-hub-line);
    border-radius: 1.1rem;
    background: #fff;
    box-shadow: 0 9px 24px rgba(15, 23, 42, 0.045);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.beam-hub-card:nth-child(4) {
    grid-column: 2 / span 2;
}

.beam-hub-card:hover {
    transform: translateY(-3px);
    border-color: #a8cecb;
    box-shadow: 0 18px 38px rgba(32, 76, 79, 0.1);
}

.beam-hub-card__number {
    position: absolute;
    z-index: 2;
    top: 0.85rem;
    left: 0.85rem;
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.52rem;
    background: #fff;
    color: var(--beam-hub-brand-dark);
    font-size: 0.68rem;
    font-weight: 850;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1);
}

.beam-hub-card__diagram {
    display: flex;
    min-height: 8.25rem;
    align-items: center;
    justify-content: center;
    padding: 1.45rem 3.2rem 1rem;
    background:
        radial-gradient(circle at 50% 20%, rgba(103, 190, 184, 0.16), transparent 52%),
        linear-gradient(180deg, #f8fcfc, #f1f7f7);
    border-bottom: 1px solid #e5eeee;
}

.beam-hub-card__diagram svg {
    width: min(100%, 14rem);
    height: 5rem;
}

.beam-hub-card__body {
    flex: 1 1 auto;
    padding: 1.25rem;
}

.beam-hub-card__title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.7rem;
}

.beam-hub-card h3 {
    margin: 0;
    color: var(--beam-hub-ink);
    font-size: 1.25rem;
    font-weight: 820;
    letter-spacing: -0.025em;
}

.beam-hub-card__title-row > span {
    max-width: 9rem;
    padding: 0.32rem 0.5rem;
    border-radius: 999px;
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
    font-size: 0.61rem;
    font-weight: 800;
    line-height: 1.3;
    text-align: center;
}

.beam-hub-card__body > p {
    min-height: 5.25rem;
    margin: 0.78rem 0 0;
    color: var(--beam-hub-muted);
    font-size: 0.88rem;
    line-height: 1.68;
}

.beam-hub-card dl {
    display: grid;
    gap: 0.68rem;
    margin: 1rem 0 0;
    padding-top: 1rem;
    border-top: 1px solid #edf1f4;
}

.beam-hub-card dl div {
    display: grid;
    grid-template-columns: 5rem 1fr;
    gap: 0.55rem;
}

.beam-hub-card dt {
    color: #8490a0;
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.beam-hub-card dd {
    margin: 0;
    color: #425064;
    font-size: 0.76rem;
    font-weight: 650;
    line-height: 1.5;
}

.beam-hub-card__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.9rem 1.25rem;
    border-top: 1px solid var(--beam-hub-line);
    color: var(--beam-hub-brand-dark);
    font-size: 0.82rem;
    font-weight: 820;
    text-decoration: none;
}

.beam-hub-card__link:hover {
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
}

.beam-hub-table-wrap {
    overflow: hidden;
    border: 1px solid var(--beam-hub-line);
    border-radius: 1.05rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.045);
}

.beam-hub-table-wrap--support {
    margin-top: 1.2rem;
}

.beam-hub-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
}

.beam-hub-table thead {
    background: #f5f8fa;
}

.beam-hub-table th,
.beam-hub-table td {
    padding: 1rem 1.15rem;
    border-bottom: 1px solid #e8edf1;
    vertical-align: top;
}

.beam-hub-table thead th {
    color: #657486;
    font-size: 0.66rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.beam-hub-table tbody th {
    color: var(--beam-hub-ink);
    font-size: 0.86rem;
    font-weight: 800;
}

.beam-hub-table tbody th a {
    color: var(--beam-hub-brand-dark);
    text-decoration: none;
}

.beam-hub-table tbody th a:hover {
    text-decoration: underline;
}

.beam-hub-table tbody td {
    color: #506073;
    font-size: 0.8rem;
    line-height: 1.55;
}

.beam-hub-table tbody tr:last-child th,
.beam-hub-table tbody tr:last-child td {
    border-bottom: 0;
}

.beam-hub-table tbody tr:hover {
    background: #fbfdfd;
}

.beam-hub-table--comparison th,
.beam-hub-table--comparison td {
    vertical-align: middle;
}

.beam-hub-table--comparison thead th:first-child {
    width: 17rem;
}

.beam-hub-table__beam-type {
    display: grid;
    grid-template-columns: minmax(6.5rem, 1fr) minmax(8rem, 9.5rem);
    gap: 0.8rem;
    align-items: center;
}

.beam-hub-table__schematic {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    padding: 0.28rem 0.38rem;
    border: 1px solid #dce8e9;
    border-radius: 0.62rem;
    background:
        linear-gradient(rgba(47, 122, 123, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(47, 122, 123, 0.035) 1px, transparent 1px),
        #f8fbfb;
    background-size: 12px 12px;
}

.beam-hub-table__schematic svg {
    display: block;
    width: 100%;
    height: auto;
}

.beam-hub-note {
    margin: 0.85rem 0 0;
    color: #6b7a8b;
    font-size: 0.77rem;
    line-height: 1.65;
}

.beam-hub-support-catalog-heading {
    max-width: 52rem;
    margin: clamp(3.5rem, 6vw, 5.5rem) auto 1.65rem;
    padding-top: clamp(2.75rem, 4.5vw, 4rem);
    border-top: 1px solid #dce5e8;
    text-align: center;
}

.beam-hub-support-catalog-heading h3 {
    margin: 0.45rem 0 0;
    color: var(--beam-hub-ink);
    font-size: clamp(1.8rem, 3vw, 2.75rem);
    font-weight: 830;
    letter-spacing: -0.04em;
    line-height: 1.08;
}

.beam-hub-support-catalog-heading p {
    margin: 0.8rem auto 0;
    color: var(--beam-hub-muted);
    font-size: 0.94rem;
    line-height: 1.7;
}

.beam-hub-support-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.1rem;
}

.beam-hub-support-card {
    display: grid;
    grid-template-columns: 8.5rem 1fr;
    overflow: hidden;
    border: 1px solid var(--beam-hub-line);
    border-radius: 1rem;
    background: #fff;
}

.beam-hub-support-card__image {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.8rem;
    border-right: 1px solid #e9eef2;
    background: #f8fbfc;
}

.beam-hub-support-card__image img {
    display: block;
    width: 100%;
    height: 7rem;
    object-fit: contain;
}

.beam-hub-support-card__copy {
    padding: 1.1rem 1rem;
}

.beam-hub-support-card h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 820;
}

.beam-hub-support-card p {
    margin: 0.48rem 0 0;
    color: var(--beam-hub-muted);
    font-size: 0.76rem;
    line-height: 1.55;
}

.beam-hub-support-card__copy > span {
    display: inline-block;
    margin-top: 0.6rem;
    color: var(--beam-hub-brand-dark);
    font-size: 0.7rem;
    font-weight: 750;
}

.beam-hub-support-card__copy strong {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.beam-hub-terminology {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1rem;
    align-items: start;
    margin-top: 1.2rem;
    padding: 1.2rem 1.3rem;
    border: 1px solid #d9d9bd;
    border-radius: 1rem;
    background: #fffdf4;
}

.beam-hub-terminology__mark {
    display: flex;
    width: 2.7rem;
    height: 2.7rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    background: #fff3c8;
    color: #8a5b10;
    font-size: 1.25rem;
    font-weight: 850;
}

.beam-hub-terminology h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 820;
}

.beam-hub-terminology p {
    margin: 0.36rem 0 0;
    color: #5c5a50;
    font-size: 0.84rem;
    line-height: 1.65;
}

.beam-hub-decision-list {
    display: grid;
    gap: 0.65rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.beam-hub-decision-list li {
    display: grid;
    grid-template-columns: 3rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    border: 1px solid var(--beam-hub-line);
    border-radius: 0.95rem;
    background: #fff;
    transition: 150ms ease;
}

.beam-hub-decision-list li:hover {
    border-color: #a7cecb;
    background: #fbfefe;
}

.beam-hub-decision-list li > span {
    display: flex;
    width: 2.35rem;
    height: 2.35rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.7rem;
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
    font-size: 0.67rem;
    font-weight: 850;
}

.beam-hub-decision-list strong,
.beam-hub-decision-list small {
    display: block;
}

.beam-hub-decision-list strong {
    color: var(--beam-hub-ink);
    font-size: 0.93rem;
}

.beam-hub-decision-list small {
    margin-top: 0.22rem;
    color: #68778a;
    font-size: 0.76rem;
}

.beam-hub-decision-list a {
    color: var(--beam-hub-brand-dark);
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.beam-hub-decision-list a:hover {
    text-decoration: underline;
}

.beam-hub-warning {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    margin-top: 1.1rem;
    padding: 1.15rem 1.3rem;
    border-left: 4px solid #c69334;
    border-radius: 0.65rem;
    background: var(--beam-hub-warm);
}

.beam-hub-warning strong {
    max-width: 16rem;
    color: #5f410d;
    font-size: 0.84rem;
}

.beam-hub-warning p {
    margin: 0;
    color: #6d5e40;
    font-size: 0.78rem;
    line-height: 1.55;
}

.beam-hub-warning a {
    color: #755015;
    font-size: 0.75rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

#other-classifications {
    scroll-margin-top: 4.75rem;
    background:
        radial-gradient(circle at 8% 10%, rgba(118, 198, 191, 0.1), transparent 24rem),
        #fff;
}

.beam-hub-classification-library {
    display: grid;
    gap: 1.35rem;
}

.beam-hub-classification-chapter {
    scroll-margin-top: 4.75rem;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d7e2e6;
    border-radius: 1.25rem;
    background: #fff;
    box-shadow: 0 16px 40px rgba(24, 54, 61, 0.075);
}

.beam-hub-classification-chapter__header {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.8fr);
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: end;
    padding: clamp(1.35rem, 3vw, 2.15rem);
}

.beam-hub-classification-chapter__number {
    color: var(--beam-hub-brand-dark);
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.beam-hub-classification-chapter h3 {
    margin: 0.45rem 0 0;
    color: var(--beam-hub-ink);
    font-size: clamp(1.5rem, 2.7vw, 2.35rem);
    font-weight: 830;
    letter-spacing: -0.035em;
    line-height: 1.08;
}

.beam-hub-classification-chapter h3 i,
.beam-hub-classification-chapter p i,
.beam-hub-classification-chapter dd i {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 700;
}

.beam-hub-classification-chapter__header > p {
    margin: 0;
    color: #5f6f80;
    font-size: 0.86rem;
    line-height: 1.7;
}

.beam-hub-classification-chapter__main {
    display: grid;
    grid-template-columns: minmax(22rem, 0.88fr) minmax(0, 1.12fr);
    gap: 0;
    align-items: stretch;
    border-top: 1px solid #dfe8eb;
    background: #f5f8f9;
}

#classification-by-material .beam-hub-classification-chapter__main {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.beam-hub-material-visual-column {
    min-width: 0;
    border-right: 1px solid #dfe8eb;
    background: #f7fafb;
}

#classification-by-material .beam-hub-material-visual-column .beam-hub-classification-figure {
    padding-bottom: 0;
    border-right: 0;
    border-bottom: 0;
}

.beam-hub-material-visual-column__notes {
    padding: 1rem 0.8rem 0.8rem;
}

.beam-hub-classification-chapter__main--analysis {
    grid-template-columns: 1fr;
}

.beam-hub-classification-figure {
    display: flex;
    min-width: 0;
    flex-direction: column;
    margin: 0;
    padding: 1rem;
    border-right: 1px solid #dfe8eb;
    background: #f7fafb;
}

.beam-hub-classification-chapter--geometry .beam-hub-classification-figure {
    order: 2;
    border-right: 0;
    border-left: 1px solid #dfe8eb;
}

.beam-hub-classification-figure svg {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0.9rem;
    background: #fff;
}

.beam-hub-classification-mobile {
    display: none;
}

.beam-hub-classification-figure figcaption {
    margin-top: 0.75rem;
    padding-inline: 0.2rem;
    color: #6b7989;
    font-size: 0.67rem;
    line-height: 1.55;
}

#classification-by-material .beam-hub-classification-figure {
    padding: 0.8rem;
}

#classification-by-material .beam-hub-classification-figure figcaption {
    font-size: 0.78rem;
    line-height: 1.65;
}

.beam-hub-classification-details {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: clamp(1rem, 2.2vw, 1.6rem);
    background: #fff;
}

.beam-hub-equation-spotlight {
    display: grid;
    grid-template-columns: minmax(11rem, 0.7fr) minmax(0, 1.3fr);
    gap: 1.1rem;
    align-items: center;
    padding: 0.95rem 1rem;
    border: 1px solid #cfe2e0;
    border-radius: 0.8rem;
    background: #edf7f6;
}

.beam-hub-equation-spotlight > div span,
.beam-hub-equation-spotlight > div strong {
    display: block;
}

.beam-hub-equation-spotlight > div span {
    color: #557477;
    font-size: 0.61rem;
    font-weight: 850;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.beam-hub-equation-spotlight > div strong {
    margin-top: 0.28rem;
    color: var(--beam-hub-brand-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.08rem;
}

.beam-hub-equation-spotlight p {
    margin: 0;
    color: #536779;
    font-size: 0.69rem;
    line-height: 1.58;
}

.beam-hub-equation-spotlight--geometry {
    border-color: #ecd7b8;
    background: #fff8eb;
}

.beam-hub-equation-spotlight--geometry > div span,
.beam-hub-equation-spotlight--geometry > div strong {
    color: #875719;
}

.beam-hub-material-table-wrap {
    margin-top: 0.85rem;
    overflow: hidden;
    border: 1px solid #dfe7ea;
    border-radius: 0.8rem;
}

#classification-by-material .beam-hub-classification-details > .beam-hub-material-table-wrap:first-child {
    margin-top: 0;
}

.beam-hub-material-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.beam-hub-material-table th,
.beam-hub-material-table td {
    padding: 0.68rem 0.72rem;
    border-bottom: 1px solid #e4eaed;
    color: #5c6d7e;
    font-size: 0.61rem;
    line-height: 1.45;
    text-align: left;
    vertical-align: middle;
}

.beam-hub-material-table thead th {
    background: #f5f8f9;
    color: #5f7080;
    font-size: 0.56rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.beam-hub-material-table thead th:nth-child(1) {
    width: 24%;
}

.beam-hub-material-table thead th:nth-child(2) {
    width: 20%;
}

.beam-hub-material-table thead th:nth-child(3) {
    width: 56%;
}

.beam-hub-material-table tbody tr:last-child th,
.beam-hub-material-table tbody tr:last-child td {
    border-bottom: 0;
}

.beam-hub-material-table tbody th {
    color: #28384a;
    font-size: 0.65rem;
    font-weight: 820;
}

.beam-hub-material-table td > strong,
.beam-hub-material-table td > span {
    display: block;
}

.beam-hub-material-table td > strong {
    color: #28384a;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.64rem;
}

.beam-hub-material-table td > span {
    margin-top: 0.12rem;
    color: #81909d;
    font-size: 0.55rem;
}

.beam-hub-material-reading-guide {
    padding: 0.9rem 1rem;
    border: 1px solid #cfe2e0;
    border-radius: 0.8rem;
    background: #edf7f6;
}

.beam-hub-material-reading-guide > span,
.beam-hub-material-example > span {
    color: var(--beam-hub-brand-dark);
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.beam-hub-material-reading-guide > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 0.6rem;
}

.beam-hub-material-reading-guide article {
    padding: 0.7rem;
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.72);
}

.beam-hub-material-reading-guide article:last-child {
    background: #fff7e8;
}

.beam-hub-material-reading-guide strong {
    color: #2b4650;
    font-size: 0.72rem;
}

.beam-hub-material-reading-guide p {
    margin: 0.28rem 0 0;
    color: #597080;
    font-size: 0.65rem;
    line-height: 1.5;
}

.beam-hub-material-example {
    margin-top: 0.7rem;
    padding: 0.85rem 0.95rem;
    border-left: 3px solid #c48732;
    border-radius: 0.55rem;
    background: #fff9ed;
}

.beam-hub-material-example > span {
    color: #875719;
}

.beam-hub-material-example > strong {
    display: block;
    margin-top: 0.3rem;
    color: #4d402d;
    font-size: 0.72rem;
    line-height: 1.45;
}

.beam-hub-material-example p {
    margin: 0.28rem 0 0;
    color: #6a5d49;
    font-size: 0.64rem;
    line-height: 1.55;
}

.beam-hub-stiffness-terms {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
    margin-top: 0.85rem;
}

.beam-hub-stiffness-terms > div {
    padding: 0.7rem;
    border: 1px solid #dfe7ea;
    border-radius: 0.7rem;
    background: #fafcfc;
}

.beam-hub-stiffness-terms span,
.beam-hub-stiffness-terms strong,
.beam-hub-stiffness-terms small {
    display: block;
}

.beam-hub-stiffness-terms span {
    display: grid;
    width: 2.1rem;
    height: 2.1rem;
    place-items: center;
    border-radius: 0.58rem;
    background: #e4f3f1;
    color: var(--beam-hub-brand-dark);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 0.82rem;
    font-weight: 850;
}

.beam-hub-stiffness-terms strong {
    margin-top: 0.48rem;
    color: #2b3b4d;
    font-size: 0.64rem;
}

.beam-hub-stiffness-terms small {
    margin-top: 0.28rem;
    color: #6b7a89;
    font-size: 0.57rem;
    line-height: 1.48;
}

.beam-hub-material-equation-note {
    margin-top: 0.7rem;
    border: 1px solid #dce5e8;
    border-radius: 0.7rem;
    background: #fff;
}

.beam-hub-material-equation-note summary {
    position: relative;
    padding: 0.75rem 2.8rem 0.75rem 0.85rem;
    color: #405164;
    cursor: pointer;
    font-size: 0.65rem;
    font-weight: 820;
    list-style: none;
}

.beam-hub-material-equation-note summary::-webkit-details-marker {
    display: none;
}

.beam-hub-material-equation-note summary::after {
    position: absolute;
    top: 50%;
    right: 0.9rem;
    color: var(--beam-hub-brand-dark);
    font-size: 1rem;
    transform: translateY(-50%);
    content: "+";
}

.beam-hub-material-equation-note[open] summary::after {
    content: "−";
}

.beam-hub-material-equation-note p {
    margin: 0;
    padding: 0.8rem 0.85rem;
    border-top: 1px solid #e7edef;
    color: #647486;
    font-size: 0.65rem;
    line-height: 1.58;
}

.beam-hub-material-equation-note p strong {
    color: var(--beam-hub-brand-dark);
    font-family: Georgia, "Times New Roman", serif;
}

.beam-hub-classification-source-note {
    margin: 0.75rem 0 0;
    color: #768493;
    font-size: 0.56rem;
    line-height: 1.55;
}

.beam-hub-classification-source-note a {
    color: var(--beam-hub-brand-dark);
    font-weight: 750;
}

.beam-hub-classification-fact-list {
    display: grid;
    gap: 0;
    margin: 0.85rem 0 0;
    border-top: 1px solid #e2e9ec;
}

.beam-hub-classification-fact-list > div {
    display: grid;
    grid-template-columns: 8rem minmax(0, 1fr);
    gap: 1rem;
    padding: 0.78rem 0;
    border-bottom: 1px solid #e2e9ec;
}

.beam-hub-classification-fact-list dt {
    color: #2e3d4f;
    font-size: 0.69rem;
    font-weight: 830;
}

.beam-hub-classification-fact-list dd {
    margin: 0;
}

.beam-hub-classification-fact-list dd strong,
.beam-hub-classification-fact-list dd span {
    display: block;
}

.beam-hub-classification-fact-list dd strong {
    color: #405164;
    font-size: 0.65rem;
}

.beam-hub-classification-fact-list dd span {
    margin-top: 0.2rem;
    color: #687889;
    font-size: 0.62rem;
    line-height: 1.53;
}

.beam-hub-modeling-rule {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
    margin-top: 0.85rem;
    padding: 0.78rem 0.9rem;
    border-left: 3px solid #c48130;
    border-radius: 0.55rem;
    background: #fff8eb;
}

.beam-hub-modeling-rule > span {
    color: #865619;
    font-size: 0.57rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.beam-hub-modeling-rule p {
    margin: 0;
    color: #675c4d;
    font-size: 0.63rem;
    line-height: 1.55;
}

.beam-hub-modeling-rule--analysis {
    border-left-color: #2f7a7b;
    background: #edf7f6;
}

.beam-hub-modeling-rule--analysis > span {
    color: var(--beam-hub-brand-dark);
}

.beam-hub-modeling-rule--analysis p {
    color: #4c6668;
}

.beam-hub-analysis-step__number {
    color: var(--beam-hub-brand-dark);
    font-size: 0.61rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.beam-hub-analysis-step + .beam-hub-analysis-step {
    border-top: 1px solid #dfe8eb;
    border-left: 0;
}

.beam-hub-analysis-step h4 {
    margin: 0.4rem 0 0;
    color: #263648;
    font-size: clamp(1.05rem, 1.8vw, 1.35rem);
    font-weight: 830;
    letter-spacing: -0.025em;
    line-height: 1.25;
}

.beam-hub-analysis-step__intro {
    margin: 0.5rem 0 0;
    color: #657586;
    font-size: 0.69rem;
    line-height: 1.6;
}

.beam-hub-analysis-state-list {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
}

.beam-hub-analysis-state {
    display: grid;
    grid-template-columns: 2.45rem minmax(0, 1fr);
    gap: 0.8rem;
    align-items: start;
    padding: 0.9rem;
    border: 1px solid #d5e5e4;
    border-radius: 0.8rem;
    background: #f5fbfa;
}

.beam-hub-analysis-state > span {
    display: grid;
    min-height: 2.45rem;
    place-items: center;
    border-radius: 0.65rem;
    background: #dff2f0;
    color: var(--beam-hub-brand-dark);
    font-size: 0.63rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.beam-hub-determinacy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
}

.beam-hub-determinacy-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    border: 1px solid #d5e5e4;
    border-radius: 0.8rem;
    background: #fff;
    text-align: center;
}

.beam-hub-determinacy-card--indeterminate {
    border-color: #ead8bb;
}

.beam-hub-determinacy-card__label {
    display: inline-flex;
    align-self: flex-start;
    overflow: hidden;
    align-items: stretch;
    border-radius: 999px;
    background: #e2f2f0;
    color: var(--beam-hub-brand-dark);
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.055em;
    line-height: 1;
    text-transform: uppercase;
}

.beam-hub-determinacy-card__label b,
.beam-hub-determinacy-card__label strong {
    display: flex;
    align-items: center;
    padding: 0.42rem 0.55rem;
}

.beam-hub-determinacy-card__label b {
    background: #cfe9e6;
}

.beam-hub-determinacy-card--indeterminate .beam-hub-determinacy-card__label {
    background: #fff0d4;
    color: #8c5a1c;
}

.beam-hub-determinacy-card--indeterminate .beam-hub-determinacy-card__label b {
    background: #ffe6b9;
}

.beam-hub-determinacy-card__schematic {
    width: 100%;
    margin: 1rem 0 0.75rem;
}

.beam-hub-determinacy-card__schematic svg {
    display: block;
    width: 100%;
    height: auto;
}

.beam-hub-determinacy-card__metrics {
    margin-top: auto;
}

.beam-hub-determinacy-card__metrics strong,
.beam-hub-determinacy-card__metrics small {
    display: block;
}

.beam-hub-determinacy-card__metrics strong {
    color: #2d3d4f;
    font-size: 0.76rem;
}

.beam-hub-determinacy-card__metrics small {
    margin-top: 0.25rem;
    color: #6f7d8d;
    font-size: 0.65rem;
}

.beam-hub-determinacy-card > p {
    width: 100%;
    margin: 0.8rem 0 0;
    padding: 0.55rem;
    border-radius: 0.55rem;
    background: #eaf6f5;
    color: var(--beam-hub-brand-dark);
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    line-height: 1.35;
    text-transform: uppercase;
}

.beam-hub-determinacy-card--indeterminate > p {
    background: #fff0d4;
    color: #8c5a1c;
}

.beam-hub-analysis-state h5 {
    margin: 0;
    color: #2d3d4f;
    font-size: 0.76rem;
    font-weight: 830;
}

.beam-hub-analysis-state p {
    margin: 0.3rem 0 0;
    color: #627284;
    font-size: 0.65rem;
    line-height: 1.55;
}

.beam-hub-analysis-state--nonlinear {
    border-color: #ead8bb;
    background: #fff9ef;
}

.beam-hub-analysis-state--nonlinear > span {
    background: #fff0d4;
    color: #8c5a1c;
}

.beam-hub-classification-chapter__links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 1rem;
    margin-top: auto;
    padding-top: 1rem;
}

.beam-hub-classification-chapter__links a {
    color: var(--beam-hub-brand-dark);
    font-size: 0.66rem;
    font-weight: 820;
    text-decoration: none;
}

.beam-hub-classification-chapter__links a:hover {
    text-decoration: underline;
}

.beam-hub-classification-example {
    display: grid;
    grid-template-columns: auto minmax(18rem, 1fr) minmax(18rem, 0.85fr);
    gap: 1rem 1.35rem;
    align-items: center;
    margin-top: 1rem;
    padding: 1.15rem 1.25rem;
    border: 1px solid #c9dfdd;
    border-radius: 1rem;
    background: linear-gradient(115deg, #eaf6f5, #f8fbfb);
}

.beam-hub-classification-example > span {
    padding: 0.45rem 0.65rem;
    border-radius: 999px;
    background: #fff;
    color: var(--beam-hub-brand-dark);
    font-size: 0.66rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.beam-hub-classification-example strong {
    color: #1f3440;
    font-size: 0.8rem;
    line-height: 1.5;
}

.beam-hub-classification-example p {
    margin: 0;
    color: #5b6e7b;
    font-size: 0.72rem;
    line-height: 1.55;
}

.beam-hub-faq-shell {
    display: grid;
    grid-template-columns: minmax(17rem, 0.65fr) minmax(0, 1fr);
    gap: clamp(2rem, 6vw, 6rem);
    align-items: start;
}

.beam-hub-faq details {
    border-bottom: 1px solid var(--beam-hub-line);
}

.beam-hub-faq details:first-child {
    border-top: 1px solid var(--beam-hub-line);
}

.beam-hub-faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.2rem 0;
    color: var(--beam-hub-ink);
    font-size: 0.95rem;
    font-weight: 780;
    cursor: pointer;
    list-style: none;
}

.beam-hub-faq summary::-webkit-details-marker {
    display: none;
}

.beam-hub-faq summary > span:last-child {
    display: flex;
    width: 1.75rem;
    height: 1.75rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #fff;
    color: var(--beam-hub-brand-dark);
    font-size: 1rem;
    transition: transform 150ms ease;
}

.beam-hub-faq details[open] summary > span:last-child {
    transform: rotate(45deg);
}

.beam-hub-faq details p {
    margin: -0.3rem 0 1.2rem;
    padding-right: 3rem;
    color: var(--beam-hub-muted);
    font-size: 0.86rem;
    line-height: 1.72;
}

.beam-hub-review {
    padding-block: clamp(3rem, 5vw, 4.5rem);
}

.beam-hub-final {
    padding: clamp(3.25rem, 6vw, 5.25rem) 0;
    background: #edf7f6;
    border-top: 1px solid #d8ecea;
}

.beam-hub-final .beam-hub-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 2rem;
}

.beam-hub-final h2 {
    font-size: clamp(2rem, 3.5vw, 3.2rem);
}

.beam-hub-final p {
    max-width: 48rem;
    margin: 0.9rem 0 0;
    color: var(--beam-hub-muted);
    font-size: 0.92rem;
    line-height: 1.7;
}

@media (max-width: 1080px) {
    .beam-hub-hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(22rem, 0.85fr);
        gap: 2.5rem;
    }

    .beam-hub-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .beam-hub-card,
    .beam-hub-card:nth-child(4) {
        grid-column: auto;
    }

    .beam-hub-card:last-child {
        grid-column: 1 / -1;
        width: calc(50% - 0.575rem);
        justify-self: center;
    }

    .beam-hub-support-card {
        grid-template-columns: 6.5rem 1fr;
    }

    .beam-hub-support-card__image img {
        height: 5.5rem;
    }

    .beam-hub-classification-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .beam-hub-preview__inner {
        align-items: flex-start;
        flex-direction: column;
        padding-block: 0.7rem;
    }

    .beam-hub-hero__grid,
    .beam-hub-restraint-intro,
    .beam-hub-formula-bridge__panel,
    .beam-hub-faq-shell {
        grid-template-columns: 1fr;
    }

    .beam-hub-hero__grid {
        padding-top: 2.4rem;
    }

    .beam-hub-hero h1 {
        max-width: 11ch;
    }

    .beam-hub-cover {
        max-width: 40rem;
        transform: none;
    }

    .beam-hub-restraint-model {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-cues {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .beam-hub-classification-cues__intro {
        grid-column: 1 / -1;
    }

    .beam-hub-support-grid {
        grid-template-columns: 1fr;
    }

    .beam-hub-support-card {
        grid-template-columns: 8rem 1fr;
    }

    .beam-hub-support-card__image img {
        height: 6.5rem;
    }

    .beam-hub-warning {
        grid-template-columns: 1fr;
    }

    .beam-hub-warning strong {
        max-width: none;
    }

    .beam-hub-warning a {
        white-space: normal;
    }

    .beam-hub-final .beam-hub-shell {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .beam-hub-shell {
        width: min(100% - 1.25rem, 82rem);
    }

    .beam-hub-breadcrumb {
        overflow-x: auto;
        white-space: nowrap;
    }

    .beam-hub-hero__facts {
        gap: 0.9rem 1.25rem;
    }

    .beam-hub-card-grid,
    .beam-hub-classification-grid {
        grid-template-columns: 1fr;
    }

    .beam-hub-card:last-child {
        grid-column: auto;
        width: auto;
    }

    .beam-hub-card__body > p,
    .beam-hub-classification-grid p {
        min-height: 0;
    }

    .beam-hub-card__diagram {
        padding-inline: 2.5rem;
    }

    .beam-hub-restraint-intro {
        gap: 1.35rem;
    }

    .beam-hub-restraint-rules__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .beam-hub-support-rule {
        grid-template-columns: 1fr;
    }

    .beam-hub-support-rule__identity {
        border-right: 0;
        border-bottom: 1px solid #e4ebee;
    }

    .beam-hub-classification-cues {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-cues__intro {
        grid-column: auto;
    }

    .beam-hub-table-wrap {
        overflow: visible;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .beam-hub-table,
    .beam-hub-table tbody,
    .beam-hub-table tr,
    .beam-hub-table th,
    .beam-hub-table td {
        display: block;
        width: 100%;
    }

    .beam-hub-table thead {
        display: none;
    }

    .beam-hub-table tr {
        overflow: hidden;
        margin-bottom: 0.75rem;
        border: 1px solid var(--beam-hub-line);
        border-radius: 0.9rem;
        background: #fff;
    }

    .beam-hub-table th,
    .beam-hub-table td {
        display: grid;
        grid-template-columns: minmax(7rem, 0.8fr) minmax(0, 1.2fr);
        gap: 0.75rem;
        padding: 0.78rem 0.9rem;
        border-bottom: 1px solid #e8edf1;
    }

    .beam-hub-table th::before,
    .beam-hub-table td::before {
        content: attr(data-label);
        color: #7a8796;
        font-size: 0.62rem;
        font-weight: 850;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .beam-hub-table--comparison tbody th {
        display: block;
        background: #f7fbfb;
    }

    .beam-hub-table--comparison tbody th::before {
        display: none;
    }

    .beam-hub-table__beam-type {
        grid-template-columns: minmax(6rem, 1fr) minmax(7.5rem, 9.5rem);
    }

    .beam-hub-decision-list li {
        grid-template-columns: 2.5rem minmax(0, 1fr);
    }

    .beam-hub-decision-list a {
        grid-column: 2;
        white-space: normal;
    }

    .beam-hub-support-card {
        grid-template-columns: 6.5rem 1fr;
    }

    .beam-hub-support-card__image img {
        height: 5.5rem;
    }

    .beam-hub-terminology {
        grid-template-columns: 1fr;
    }

    .beam-hub-cover figcaption {
        flex-direction: column;
        gap: 0.25rem;
    }

    .beam-hub-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .beam-hub-button {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .beam-hub-v2 *,
    .beam-hub-v2 *::before,
    .beam-hub-v2 *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* V2 compact centered hero and shared explorer */
.beam-hub-breadcrumb {
    justify-content: center;
    padding-top: 0.85rem;
}

.beam-hub-hero__grid {
    display: block;
    padding: clamp(0.8rem, 1.7vw, 1.35rem) 0 clamp(1.2rem, 2.2vw, 1.8rem);
}

.beam-hub-hero__copy {
    max-width: 70rem;
    margin-inline: auto;
    text-align: center;
}

.beam-hub-hero .beam-hub-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.48rem;
    padding: 0.34rem 0.7rem;
    border: 1px solid rgba(47, 122, 123, 0.25);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 4px 14px rgba(38, 91, 94, 0.06);
    letter-spacing: 0.09em;
}

.beam-hub-hero .beam-hub-eyebrow::before {
    width: 0.38rem;
    height: 0.38rem;
    border-radius: 999px;
    background: #58beb8;
    content: "";
}

.beam-hub-hero h1 {
    max-width: none;
    margin-top: 0.55rem;
    font-size: clamp(2.7rem, 4.7vw, 4.6rem);
    line-height: 1;
    white-space: nowrap;
}

.beam-hub-hero__lede {
    max-width: 58rem;
    margin: 0.65rem auto 0;
    font-size: clamp(0.96rem, 1.2vw, 1.08rem);
    line-height: 1.55;
}

.beam-hub-v2 .beam-guide-byline {
    margin: 0.55rem 0 0;
    color: #647386;
    font-size: 0.78rem;
}

.beam-hub-actions {
    justify-content: center;
    margin-top: 0.85rem;
}

.beam-hub-hero .beam-hub-button {
    min-height: 2.75rem;
    padding: 0.62rem 1.05rem;
}

.beam-hub-hero__facts {
    justify-content: center;
    gap: 0.55rem;
    margin-top: 0.75rem;
}

.beam-hub-hero__facts div {
    display: inline-flex;
    align-items: baseline;
    gap: 0.34rem;
    padding: 0.35rem 0.72rem;
    border: 1px solid rgba(47, 122, 123, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 4px 12px rgba(38, 91, 94, 0.04);
}

.beam-hub-hero__facts dt {
    font-size: 0.84rem;
}

.beam-hub-hero__facts dd {
    font-size: 0.72rem;
}

.beam-hub-explorer {
    padding-block: clamp(3.25rem, 5.5vw, 5rem);
    background:
        radial-gradient(circle at 50% 0, rgba(128, 203, 197, 0.16), transparent 25rem),
        #f7fafb;
    border-bottom: 1px solid #e7eef1;
}

.beam-hub-explorer .beam-hub-section-heading {
    max-width: 58rem;
    margin-bottom: 1.65rem;
}

.beam-hub-explorer__selector {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.beam-hub-explorer__selector button {
    display: grid;
    grid-template-rows: 3.4rem auto auto;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.7rem 0.75rem 0.75rem;
    border: 1px solid #d5e0e5;
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.86);
    color: #526174;
    text-align: left;
    cursor: pointer;
    transition: border-color 150ms ease, background 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.beam-hub-explorer__selector button:hover {
    border-color: #8ec9c5;
    transform: translateY(-1px);
}

.beam-hub-explorer__selector button[data-selected="true"] {
    border-color: var(--beam-hub-brand);
    background: #fff;
    color: var(--beam-hub-ink);
    box-shadow: 0 8px 22px rgba(47, 122, 123, 0.13), inset 0 3px 0 var(--beam-hub-brand);
}

.beam-hub-explorer__selector button > span {
    display: flex;
    align-items: center;
    overflow: hidden;
}

.beam-hub-explorer__selector svg {
    display: block;
    width: 100%;
    height: 3.5rem;
}

.beam-hub-explorer__selector strong {
    overflow: hidden;
    color: inherit;
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.beam-hub-explorer__selector small {
    overflow: hidden;
    color: #718092;
    font-size: 0.66rem;
    font-weight: 700;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.beam-hub-explorer__workspace {
    padding: clamp(0.65rem, 1.5vw, 1.1rem);
    border: 1px solid #d9e4e8;
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 18px 55px rgba(33, 66, 71, 0.09);
}

.beam-hub-explorer__workspace > [data-beam-panel].hidden {
    display: none;
}

.beam-hub-explorer__workspace [data-beam-live] > figure,
.beam-hub-explorer__workspace [data-beam-live] > div {
    box-shadow: none;
}

.beam-hub-explorer__note {
    margin: 0.9rem 0 0;
    color: #657487;
    font-size: 0.78rem;
    line-height: 1.6;
    text-align: center;
}

.beam-hub-explorer__note a {
    color: var(--beam-hub-brand-dark);
    font-weight: 800;
}

/* Formula library handoff */
.beam-hub-formula-bridge {
    scroll-margin-top: 5rem;
    padding: clamp(2.75rem, 5vw, 4.75rem) 0;
    border-block: 1px solid #e7eef1;
    background:
        radial-gradient(circle at 12% 0%, rgba(114, 199, 192, 0.15), transparent 24rem),
        #f7fafb;
}

.beam-hub-formula-bridge__panel {
    display: block;
    overflow: hidden;
    padding: 0;
    border: 1px solid #d6e2e6;
    border-radius: 1.25rem;
    background: #fff;
    color: var(--beam-hub-ink);
    box-shadow: 0 20px 55px rgba(24, 54, 61, 0.09);
}

.beam-hub-formula-bridge__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: clamp(1.35rem, 3vw, 2.15rem);
    border-bottom: 1px solid #dfe8eb;
}

.beam-hub-formula-bridge__title {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1.1rem;
    align-items: start;
    max-width: 51rem;
}

.beam-hub-formula-bridge__mark {
    display: flex;
    width: 4rem;
    height: 4rem;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    background: #174a4e;
    color: #d4efec;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.25rem;
    font-style: italic;
    font-weight: 800;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.beam-hub-formula-bridge .beam-hub-kicker {
    color: var(--beam-hub-brand-dark);
}

.beam-hub-formula-bridge h2 {
    margin-top: 0.35rem;
    color: var(--beam-hub-ink);
    font-size: clamp(1.65rem, 3vw, 2.65rem);
    line-height: 1.05;
}

.beam-hub-formula-bridge__title p {
    max-width: 48rem;
    margin: 0.65rem 0 0;
    color: #5d6d7f;
    font-size: 0.84rem;
    line-height: 1.65;
}

.beam-hub-formula-bridge__header-actions {
    display: grid;
    flex: 0 0 auto;
    gap: 0.55rem;
    justify-items: center;
}

.beam-hub-formula-bridge__header-actions > a:last-child {
    color: #647386;
    font-size: 0.68rem;
    font-weight: 750;
    text-decoration: none;
}

.beam-hub-formula-bridge__header-actions > a:last-child:hover {
    color: var(--beam-hub-brand-dark);
    text-decoration: underline;
}

.beam-hub-formula-steps {
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    align-items: center;
    justify-content: center;
    gap: clamp(0.6rem, 2vw, 1.5rem);
    padding: 0.8rem 1rem;
    border-bottom: 1px solid #e1e9ec;
    background: #fbfdfd;
}

.beam-hub-formula-steps span {
    display: inline-flex;
    align-items: center;
    gap: 0.48rem;
    color: #526477;
    font-size: 0.7rem;
    font-weight: 800;
}

.beam-hub-formula-steps b {
    display: inline-flex;
    width: 1.55rem;
    height: 1.55rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
    font-size: 0.67rem;
}

.beam-hub-formula-steps i {
    color: #a5b2bd;
    font-style: normal;
}

.beam-hub-formula-bridge__cases {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
    padding: 1rem;
    background: #f5f8f9;
}

.beam-hub-formula-bridge__cases article {
    min-width: 0;
}

.beam-hub-formula-bridge__cases article > a {
    display: flex;
    height: 100%;
    min-width: 0;
    overflow: hidden;
    flex-direction: column;
    border: 1px solid #d9e3e7;
    border-radius: 0.95rem;
    background: #fff;
    color: var(--beam-hub-ink);
    text-decoration: none;
    box-shadow: 0 5px 16px rgba(24, 54, 61, 0.045);
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.beam-hub-formula-bridge__cases article > a:hover {
    border-color: #8fc6c3;
    color: var(--beam-hub-ink);
    box-shadow: 0 12px 26px rgba(38, 92, 95, 0.11);
    transform: translateY(-2px);
}

.beam-hub-formula-case__visual {
    position: relative;
    padding: 0.8rem 1rem;
    border-bottom: 1px solid #e1e9ec;
    background:
        linear-gradient(180deg, rgba(235, 247, 246, 0.75), #fff);
}

.beam-hub-formula-case__visual > span {
    position: absolute;
    z-index: 1;
    top: 0.65rem;
    left: 0.65rem;
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #174a4e;
    color: #fff;
    font-size: 0.6rem;
    font-weight: 850;
}

.beam-hub-formula-case__visual svg {
    display: block;
    width: 100%;
    height: 6.7rem;
}

.beam-hub-formula-case__heading {
    padding: 1rem 1rem 0.85rem;
}

.beam-hub-formula-case__heading > span {
    color: var(--beam-hub-brand-dark);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.beam-hub-formula-case__heading h3 {
    margin: 0.32rem 0 0;
    color: #1e293b;
    font-size: 0.95rem;
    font-weight: 830;
    line-height: 1.3;
}

.beam-hub-formula-case__heading h3 i {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 700;
}

.beam-hub-formula-bridge__cases dl {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0 1rem;
}

.beam-hub-formula-bridge__cases dl > div {
    display: grid;
    grid-template-columns: minmax(5.1rem, 0.7fr) minmax(0, 1.3fr);
    gap: 0.65rem;
    align-items: baseline;
    padding: 0.58rem 0;
    border-top: 1px solid #e6ecef;
}

.beam-hub-formula-bridge__cases dt {
    color: #6c7b8b;
    font-size: 0.64rem;
    font-weight: 800;
}

.beam-hub-formula-bridge__cases dd {
    margin: 0;
    color: #334155;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.67rem;
    font-weight: 720;
    line-height: 1.45;
}

.beam-hub-formula-bridge__cases .beam-hub-formula-case__result {
    margin-inline: -0.5rem;
    padding-inline: 0.5rem;
    border-radius: 0.5rem;
    background: #edf7f6;
}

.beam-hub-formula-bridge__cases .beam-hub-formula-case__result dt,
.beam-hub-formula-bridge__cases .beam-hub-formula-case__result dd {
    color: var(--beam-hub-brand-dark);
    font-weight: 850;
}

.beam-hub-formula-case__open {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding: 0.85rem 1rem;
    border-top: 1px solid #e1e9ec;
    color: var(--beam-hub-brand-dark);
    font-size: 0.7rem;
    font-weight: 850;
}

.beam-hub-formula-case__open b {
    font-size: 0.9rem;
}

.beam-hub-formula-bridge__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1rem 1.15rem;
    border-top: 1px solid #dce6e9;
    background: #fff;
}

.beam-hub-formula-bridge__footer div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem 0.55rem;
}

.beam-hub-formula-bridge__footer strong,
.beam-hub-formula-bridge__footer span,
.beam-hub-formula-bridge__footer a {
    font-size: 0.69rem;
    line-height: 1.5;
}

.beam-hub-formula-bridge__footer strong {
    color: #334155;
}

.beam-hub-formula-bridge__footer span {
    color: #6b7989;
}

.beam-hub-formula-bridge__footer a {
    flex: 0 0 auto;
    color: var(--beam-hub-brand-dark);
    font-weight: 850;
    text-decoration: none;
}

.beam-hub-formula-bridge__footer a:hover {
    text-decoration: underline;
}

/* Support application schematics */
.beam-hub-support-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.beam-hub-support-card__schematic {
    padding: 0.65rem;
    border-bottom: 1px solid #e4ecef;
    background: #f8fbfc;
}

.beam-hub-support-card__schematic svg {
    display: block;
    width: 100%;
    height: auto;
}

.beam-hub-support-card__copy {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 1.1rem 1.15rem 1.2rem;
}

.beam-hub-support-card__copy > small {
    display: block;
    margin-top: auto;
    padding-top: 0.8rem;
    color: #657487;
    font-size: 0.71rem;
    line-height: 1.55;
}

.beam-hub-support-card__copy > small strong {
    color: #334155;
    font-family: inherit;
}

/* Cross-section and section-properties guide */
.beam-hub-property-story {
    display: grid;
    grid-template-columns: minmax(18rem, 0.72fr) minmax(0, 1.28fr);
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.beam-hub-property-story__equations {
    overflow: hidden;
    border-radius: 1.1rem;
    background: #143f43;
    color: #e5f6f4;
}

.beam-hub-property-story__equations > span {
    display: block;
    padding: 0.9rem 1.15rem;
    border-bottom: 1px solid rgba(199, 231, 228, 0.16);
    color: #a5e3de;
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.beam-hub-property-story__equations > div {
    padding: 1.15rem;
}

.beam-hub-property-story__equations > div + div {
    border-top: 1px solid rgba(199, 231, 228, 0.16);
}

.beam-hub-property-story__equations small {
    display: block;
    color: #b7d8d5;
    font-size: 0.68rem;
    font-weight: 750;
}

.beam-hub-property-story__equations strong {
    display: block;
    margin-top: 0.3rem;
    color: #fff;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: clamp(1.05rem, 2vw, 1.45rem);
}

.beam-hub-property-story__equations p {
    margin: 0.55rem 0 0;
    color: #c7e2df;
    font-size: 0.76rem;
    line-height: 1.6;
}

.beam-hub-property-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    margin: 0;
}

.beam-hub-property-list > div {
    display: grid;
    grid-template-columns: 4.2rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.9rem;
    border: 1px solid var(--beam-hub-line);
    border-radius: 0.9rem;
    background: #fff;
}

.beam-hub-property-list dt {
    color: var(--beam-hub-brand-dark);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.85rem;
    font-weight: 850;
}

.beam-hub-property-list dd {
    margin: 0;
}

.beam-hub-property-list dd strong,
.beam-hub-property-list dd span {
    display: block;
}

.beam-hub-property-list dd strong {
    color: #263548;
    font-size: 0.76rem;
}

.beam-hub-property-list dd span {
    margin-top: 0.2rem;
    color: #677688;
    font-size: 0.69rem;
    line-height: 1.5;
}

.beam-hub-shape-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

.beam-hub-shape-grid article {
    display: grid;
    grid-template-columns: 7.4rem minmax(0, 1fr);
    gap: 0.9rem;
    align-items: center;
    min-width: 0;
    padding: 0.85rem;
    border: 1px solid var(--beam-hub-line);
    border-radius: 1rem;
    background: #fff;
}

.beam-hub-shape-grid__figure {
    border-radius: 0.75rem;
    background: #f6fafb;
}

.beam-hub-shape-grid svg {
    display: block;
    width: 100%;
    height: auto;
}

.beam-hub-shape-grid h3 {
    margin: 0;
    color: #1e293b;
    font-size: 0.88rem;
    font-weight: 830;
}

.beam-hub-shape-grid p {
    margin: 0.38rem 0 0;
    color: #5c6c7e;
    font-size: 0.7rem;
    line-height: 1.5;
}

.beam-hub-shape-grid small {
    display: block;
    margin-top: 0.5rem;
    color: #718092;
    font-size: 0.65rem;
    line-height: 1.45;
}

.beam-hub-shape-grid small strong {
    color: #425266;
}

.beam-hub-axis-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: center;
    margin-top: 1rem;
    padding: 1rem 1.1rem;
    border: 1px solid #e6d4ad;
    border-radius: 0.9rem;
    background: #fffaf0;
}

.beam-hub-axis-note > div {
    display: flex;
    width: 3.2rem;
    height: 3.2rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    background: #fff0ce;
    color: #93611b;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.75rem;
    font-weight: 850;
}

.beam-hub-axis-note p {
    margin: 0;
    color: #675a42;
    font-size: 0.78rem;
    line-height: 1.6;
}

.beam-hub-axis-note strong {
    color: #4d4029;
}

.beam-hub-section-properties__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
}

.beam-hub-section-properties__actions > span {
    max-width: 29rem;
    color: #677688;
    font-size: 0.72rem;
    line-height: 1.5;
}

.beam-hub-classification-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1080px) {
    .beam-hub-explorer__selector {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .beam-hub-classification-chapter__main,
    .beam-hub-classification-chapter__main--analysis {
        grid-template-columns: 1fr;
    }

    #classification-by-material .beam-hub-classification-chapter__main {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-figure,
    .beam-hub-classification-chapter--geometry .beam-hub-classification-figure {
        order: 0;
        border-right: 0;
        border-bottom: 1px solid #dfe8eb;
        border-left: 0;
    }

    .beam-hub-material-visual-column {
        border-right: 0;
        border-bottom: 1px solid #dfe8eb;
    }

    .beam-hub-formula-bridge__cases {
        grid-template-columns: 1fr;
    }

    .beam-hub-formula-bridge__cases article > a {
        display: grid;
        grid-template-columns: minmax(11rem, 0.42fr) minmax(0, 1fr);
        grid-template-areas:
            "visual heading"
            "visual formulas"
            "visual open";
    }

    .beam-hub-formula-case__visual {
        grid-area: visual;
        border-right: 1px solid #e1e9ec;
        border-bottom: 0;
    }

    .beam-hub-formula-case__visual svg {
        height: 100%;
        min-height: 9rem;
        max-height: 12rem;
    }

    .beam-hub-formula-case__heading {
        grid-area: heading;
    }

    .beam-hub-formula-bridge__cases dl {
        grid-area: formulas;
    }

    .beam-hub-formula-case__open {
        grid-area: open;
        align-self: end;
        margin-top: 0;
    }

    .beam-hub-support-card {
        display: flex;
        grid-template-columns: none;
    }

    .beam-hub-shape-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .beam-hub-classification-grid {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-card {
        display: flex;
    }

    .beam-hub-classification-card__visual {
        display: block;
        border-right: 0;
        border-bottom: 1px solid #e4ecef;
    }

    .beam-hub-classification-example {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-example p {
        grid-column: auto;
    }
}

@media (max-width: 820px) {
    .beam-hub-preview__inner {
        align-items: center;
        flex-direction: row;
        padding-block: 0.45rem;
    }

    .beam-hub-hero__grid {
        padding-top: 0.9rem;
    }

    .beam-hub-classification-chapter__header {
        grid-template-columns: 1fr;
        gap: 0.8rem;
    }

    .beam-hub-formula-bridge__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 1.1rem;
    }

    .beam-hub-formula-bridge__header-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-items: start;
    }

    .beam-hub-property-story {
        grid-template-columns: 1fr;
    }

    .beam-hub-support-card {
        display: flex;
        grid-template-columns: none;
    }
}

@media (max-width: 680px) {
    .beam-hub-preview__detail {
        display: none;
    }

    .beam-hub-preview__inner {
        min-height: 2.5rem;
        font-size: 0.75rem;
    }

    .beam-hub-hero h1 {
        max-width: 13ch;
        margin-inline: auto;
        font-size: clamp(2.35rem, 12vw, 3.2rem);
        white-space: normal;
    }

    .beam-hub-hero__facts {
        display: none;
    }

    .beam-hub-classification-chapter__header {
        padding: 1.15rem;
    }

    .beam-hub-classification-details {
        padding: 0.8rem;
    }

    .beam-hub-classification-figure {
        padding: 0.65rem;
    }

    .beam-hub-classification-figure > svg {
        display: none;
    }

    .beam-hub-classification-mobile {
        display: block;
        color: #263548;
    }

    .beam-hub-classification-mobile svg {
        display: block;
        width: 100%;
        height: auto;
    }

    .beam-hub-classification-figure figcaption,
    #classification-by-material .beam-hub-classification-figure figcaption {
        margin-top: 0.8rem;
        padding-inline: 0.15rem;
        font-size: 0.875rem;
        line-height: 1.6;
    }

    .beam-hub-classification-mobile--material {
        overflow: hidden;
        border: 1px solid #d9e5e8;
        border-radius: 0.9rem;
        background: #fff;
    }

    .beam-hub-mobile-material__header,
    .beam-hub-mobile-geometry__header {
        display: flex;
        gap: 0.6rem;
        align-items: center;
        justify-content: space-between;
    }

    .beam-hub-mobile-material__header {
        padding: 0.8rem;
        background: #eaf6f5;
    }

    .beam-hub-mobile-material__header strong,
    .beam-hub-mobile-geometry__header strong {
        color: #235f61;
        font-size: 0.8125rem;
        font-weight: 850;
        letter-spacing: 0.055em;
        line-height: 1.35;
        text-transform: uppercase;
    }

    .beam-hub-mobile-material__header > span,
    .beam-hub-mobile-geometry__header > span {
        flex: 0 0 auto;
        border: 1px solid #cfe2e0;
        border-radius: 999px;
        background: #fff;
        padding: 0.35rem 0.55rem;
        color: #526477;
        font-size: 0.66rem;
        font-weight: 800;
        white-space: nowrap;
    }

    .beam-hub-mobile-material__list {
        padding: 0.25rem 0.8rem;
    }

    .beam-hub-mobile-material__row {
        padding: 0.7rem 0;
        border-bottom: 1px solid #e7eef0;
    }

    .beam-hub-mobile-material__row:last-child {
        border-bottom: 0;
    }

    .beam-hub-mobile-material__row > div:first-child {
        display: flex;
        gap: 0.75rem;
        align-items: baseline;
        justify-content: space-between;
    }

    .beam-hub-mobile-material__row strong {
        color: #263548;
        font-size: 0.8125rem;
        font-weight: 850;
        line-height: 1.35;
    }

    .beam-hub-mobile-material__row > div:first-child span {
        flex: 0 0 auto;
        color: #475569;
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 0.75rem;
        font-weight: 750;
    }

    .beam-hub-mobile-material__track {
        height: 0.58rem;
        margin: 0.45rem 0 0.35rem;
        overflow: hidden;
        border-radius: 999px;
        background: #dfe8eb;
    }

    .beam-hub-mobile-material__track i {
        display: block;
        min-width: 0.65rem;
        height: 100%;
        border-radius: inherit;
        background: #8bd1cb;
    }

    .beam-hub-mobile-material__row--steel .beam-hub-mobile-material__track i {
        width: 100%;
        background: linear-gradient(90deg, #2f7a7b, #8bd1cb);
    }

    .beam-hub-mobile-material__row--aluminum .beam-hub-mobile-material__track i {
        width: 35%;
        background: #76c6bf;
    }

    .beam-hub-mobile-material__row--concrete .beam-hub-mobile-material__track i {
        width: 15%;
        background: #9bd7d2;
    }

    .beam-hub-mobile-material__row--wood .beam-hub-mobile-material__track i {
        width: 6%;
        background: #c8e9e6;
    }

    .beam-hub-mobile-material__row--glulam .beam-hub-mobile-material__track i {
        width: 6%;
        background: #b7e3df;
    }

    .beam-hub-mobile-material__row small {
        display: block;
        color: #235f61;
        font-size: 0.75rem;
        font-weight: 800;
        line-height: 1.3;
    }

    .beam-hub-mobile-material__deflection {
        margin: 0.25rem 0.8rem 0.8rem;
        border: 1px solid #dce6ea;
        border-radius: 0.75rem;
        background: #f8fbfb;
        padding: 0.75rem;
    }

    .beam-hub-mobile-material__deflection > div:first-child {
        display: grid;
        gap: 0.2rem;
    }

    .beam-hub-mobile-material__deflection > div:first-child strong {
        color: #263548;
        font-size: 0.8125rem;
        font-weight: 850;
        text-transform: uppercase;
    }

    .beam-hub-mobile-material__deflection > div:first-child span {
        color: #526477;
        font-size: 0.75rem;
        font-weight: 700;
    }

    .beam-hub-mobile-material__deflection svg {
        margin-top: 0.45rem;
        background: transparent;
    }

    .beam-hub-mobile-material__legend {
        display: grid;
        gap: 0.35rem;
    }

    .beam-hub-mobile-material__legend span {
        display: flex;
        gap: 0.45rem;
        align-items: center;
        color: #526477;
        font-size: 0.75rem;
        font-weight: 750;
    }

    .beam-hub-mobile-material__legend span > i:first-child {
        display: block;
        width: 1.35rem;
        height: 0.18rem;
        border-radius: 999px;
        background: #2f7a7b;
    }

    .beam-hub-mobile-material__legend span:last-child > i:first-child {
        background: #c07826;
    }

    .beam-hub-classification-mobile--geometry {
        display: grid;
        gap: 0.65rem;
    }

    .beam-hub-mobile-geometry__header {
        border: 1px solid #d9e5e8;
        border-radius: 0.8rem;
        background: #eaf6f5;
        padding: 0.75rem;
    }

    .beam-hub-mobile-geometry__header > span {
        border-color: #efd9b7;
        border-radius: 0.55rem;
        background: #fff4df;
        color: #8d5717;
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    }

    .beam-hub-mobile-geometry__list {
        display: grid;
        gap: 0.65rem;
    }

    .beam-hub-mobile-geometry__list article {
        border: 1px solid #dce6ea;
        border-radius: 0.8rem;
        background: #fff;
        padding: 0.8rem;
        box-shadow: 0 1px 2px rgb(15 23 42 / 0.035);
    }

    .beam-hub-mobile-geometry__list h4 {
        display: flex;
        gap: 0.6rem;
        align-items: baseline;
        justify-content: space-between;
        margin: 0;
        color: #235f61;
        font-size: 0.8125rem;
        font-weight: 850;
        letter-spacing: 0.04em;
        line-height: 1.35;
        text-transform: uppercase;
    }

    .beam-hub-mobile-geometry__list h4 span {
        color: #64748b;
        font-size: 0.7rem;
        letter-spacing: 0;
        text-align: right;
        text-transform: none;
    }

    .beam-hub-mobile-geometry__list svg {
        margin: 0.55rem 0 0.45rem;
        border-radius: 0.55rem;
        background: #f8fbfb;
    }

    .beam-hub-mobile-geometry__list article > strong {
        display: block;
        color: #334155;
        font-size: 0.8125rem;
        font-weight: 800;
        line-height: 1.4;
    }

    .beam-hub-mobile-geometry__list p {
        margin: 0.15rem 0 0;
        color: #64748b;
        font-size: 0.75rem;
        line-height: 1.45;
    }

    .beam-hub-equation-spotlight,
    .beam-hub-modeling-rule {
        grid-template-columns: 1fr;
        gap: 0.6rem;
    }

    .beam-hub-material-table-wrap {
        overflow: visible;
        border: 0;
        border-radius: 0;
    }

    .beam-hub-material-table,
    .beam-hub-material-table tbody,
    .beam-hub-material-table tr,
    .beam-hub-material-table th,
    .beam-hub-material-table td {
        display: block;
        width: 100%;
    }

    .beam-hub-material-table thead {
        display: none;
    }

    .beam-hub-material-table tr {
        overflow: hidden;
        margin-bottom: 0.55rem;
        border: 1px solid #dfe7ea;
        border-radius: 0.7rem;
        background: #fff;
    }

    .beam-hub-material-table tbody th {
        padding: 0.7rem 0.8rem;
        border-bottom: 1px solid #e4eaed;
        background: #f5f8f9;
        font-size: 0.7rem;
    }

    .beam-hub-material-table td {
        display: block;
        padding: 0.6rem 0.8rem;
    }

    .beam-hub-material-table td::before {
        display: block;
        margin-bottom: 0.3rem;
        color: #788694;
        font-size: 0.54rem;
        font-weight: 850;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        content: attr(data-label);
    }

    .beam-hub-stiffness-terms {
        grid-template-columns: 1fr;
    }

    .beam-hub-material-reading-guide > div {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-fact-list > div {
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }

    .beam-hub-modeling-rule > span {
        white-space: normal;
    }

    .beam-hub-determinacy-grid {
        grid-template-columns: 1fr;
    }

    .beam-hub-explorer__selector {
        display: flex;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        padding: 0.15rem 0.1rem 0.5rem;
        scroll-padding-inline: 0.1rem;
        scroll-snap-type: x mandatory;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }

    .beam-hub-explorer__selector button {
        min-width: 10.5rem;
        scroll-snap-align: start;
    }

    .beam-hub-explorer__workspace {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .beam-hub-explorer__workspace [data-beam-live] {
        gap: 0.75rem;
    }

    .beam-hub-formula-bridge {
        padding-block: 2.5rem;
    }

    .beam-hub-formula-bridge__header {
        padding: 1.2rem;
    }

    .beam-hub-formula-bridge__title {
        grid-template-columns: 3.15rem minmax(0, 1fr);
        gap: 0.8rem;
    }

    .beam-hub-formula-bridge__mark {
        width: 3.15rem;
        height: 3.15rem;
        border-radius: 0.8rem;
        font-size: 1rem;
    }

    .beam-hub-formula-bridge__header-actions {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .beam-hub-formula-bridge__header-actions > a:last-child {
        padding-block: 0.2rem;
        text-align: left;
    }

    .beam-hub-formula-steps {
        grid-template-columns: 1fr;
        justify-items: start;
        gap: 0.45rem;
        padding: 0.8rem 1.2rem;
    }

    .beam-hub-formula-steps i {
        display: none;
    }

    .beam-hub-formula-bridge__cases {
        padding: 0.7rem;
    }

    .beam-hub-formula-bridge__cases article > a {
        display: flex;
    }

    .beam-hub-formula-case__visual {
        border-right: 0;
        border-bottom: 1px solid #e1e9ec;
    }

    .beam-hub-formula-case__visual svg {
        height: 6.25rem;
        min-height: 0;
        max-height: none;
    }

    .beam-hub-formula-bridge__footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.7rem;
    }

    .beam-hub-support-card {
        display: flex;
        grid-template-columns: none;
    }

    .beam-hub-property-list,
    .beam-hub-shape-grid,
    .beam-hub-classification-grid {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-card {
        display: flex;
    }

    .beam-hub-classification-card__visual {
        display: block;
        border-right: 0;
        border-bottom: 1px solid #e4ecef;
    }

    .beam-hub-classification-card li {
        grid-template-columns: 5.5rem minmax(0, 1fr);
    }

    .beam-hub-classification-example {
        grid-template-columns: 1fr;
    }

    .beam-hub-classification-example p {
        grid-column: auto;
    }

    .beam-hub-classification-example > span {
        justify-self: start;
        white-space: normal;
    }

    .beam-hub-shape-grid article {
        grid-template-columns: 6.5rem minmax(0, 1fr);
    }

    .beam-hub-axis-note {
        grid-template-columns: 1fr;
    }

    .beam-hub-section-properties__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .beam-hub-section-properties__actions > span {
        text-align: center;
    }
}

/* Article frame and persistent guide navigation */
.beam-hub-guide-frame {
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr);
    width: min(100% - 2rem, 98rem);
    margin-inline: auto;
}

.beam-hub-guide-content {
    min-width: 0;
    border-inline: 1px solid #edf1f3;
}

.beam-hub-sidebar {
    position: sticky;
    z-index: 10;
    top: 5.25rem;
    align-self: start;
    max-height: calc(100vh - 6.5rem);
    overflow-y: auto;
    padding: 2.25rem 1.25rem 2.25rem 0;
    scrollbar-color: #cbd8dc transparent;
    scrollbar-width: thin;
}

.beam-hub-sidebar details,
.beam-hub-sidebar summary {
    margin: 0;
}

.beam-hub-sidebar summary {
    display: none;
}

.beam-hub-sidebar__body {
    display: block !important;
}

.beam-hub-sidebar__title {
    margin: 0 0 0.85rem;
    color: #748292;
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.beam-hub-sidebar__group + .beam-hub-sidebar__group {
    margin-top: 1.15rem;
}

.beam-hub-sidebar__group > span {
    display: block;
    margin: 0 0 0.32rem 0.5rem;
    color: #8a96a4;
    font-size: 0.6rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.beam-hub-sidebar__group a {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 1fr);
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.12rem;
    padding: 0.48rem 0.5rem;
    border-radius: 0.58rem;
    color: #586779;
    text-decoration: none;
    transition: color 150ms ease, background 150ms ease;
}

.beam-hub-sidebar__group a i {
    display: grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    border: 1px solid #dfe7ea;
    border-radius: 0.45rem;
    background: #f5f8f9;
    color: #6f7e8e;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.56rem;
    font-style: normal;
    font-weight: 850;
}

.beam-hub-sidebar__group a strong {
    font-size: 0.76rem;
    font-weight: 740;
    line-height: 1.3;
}

.beam-hub-sidebar__group a:hover,
.beam-hub-sidebar__group a[aria-current="location"] {
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
}

.beam-hub-sidebar__group a:hover i,
.beam-hub-sidebar__group a[aria-current="location"] i {
    border-color: #b9dcda;
    background: #dff1ef;
    color: var(--beam-hub-brand-dark);
}

/* Structural beam definition */
.beam-hub-definition {
    padding-top: clamp(3.25rem, 5.5vw, 5.25rem);
}

.beam-hub-definition__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(25rem, 0.72fr);
    align-items: center;
    gap: clamp(2rem, 4vw, 4rem);
}

.beam-hub-definition__copy h2 {
    max-width: 12ch;
    margin: 0.55rem 0 0;
    color: var(--beam-hub-ink);
    font-size: clamp(2.3rem, 4.2vw, 4.25rem);
    font-weight: 830;
    letter-spacing: -0.05em;
    line-height: 1;
}

.beam-hub-definition__text {
    margin-top: 1.35rem;
}

.beam-hub-definition__text p {
    margin: 0;
    color: var(--beam-hub-muted);
    font-size: 0.98rem;
    line-height: 1.75;
}

.beam-hub-definition__text p + p {
    margin-top: 0.85rem;
}

.beam-hub-definition__text strong {
    color: #233044;
    font-weight: 800;
}

.beam-hub-definition__figure {
    overflow: hidden;
    margin: 0;
    border: 1px solid #dbe6e8;
    border-radius: 1.15rem;
    background: #f7fbfb;
    box-shadow: 0 20px 45px rgba(28, 71, 74, 0.09);
}

.beam-hub-definition__figure figcaption {
    display: grid;
    gap: 0.2rem;
    padding: 1rem 1.1rem 0;
}

.beam-hub-definition__figure figcaption span {
    color: var(--beam-hub-brand-dark);
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.beam-hub-definition__figure figcaption strong {
    color: var(--beam-hub-ink);
    font-size: 0.92rem;
    line-height: 1.35;
}

.beam-hub-definition__diagram {
    padding: 0.35rem 1.1rem 0.75rem;
}

.beam-hub-definition__diagram svg {
    display: block;
    width: 100%;
    height: 9.25rem;
}

.beam-hub-definition__actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
    border-top: 1px solid #dfe8ea;
    background: #fff;
}

.beam-hub-definition__actions > div {
    padding: 0.85rem 0.75rem;
}

.beam-hub-definition__actions > div + div {
    border-left: 1px solid #e4eaed;
}

.beam-hub-definition__actions dt {
    display: flex;
    align-items: center;
    gap: 0.38rem;
    color: #243347;
    font-size: 0.68rem;
    font-weight: 850;
}

.beam-hub-definition__actions dt i {
    display: grid;
    width: 1.35rem;
    height: 1.35rem;
    place-items: center;
    border-radius: 0.35rem;
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.62rem;
    font-style: normal;
}

.beam-hub-definition__actions dd {
    margin: 0.38rem 0 0;
    color: #6b7988;
    font-size: 0.63rem;
    line-height: 1.45;
}

.beam-hub-definition__examples {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1.25rem;
    padding: 0.8rem 1rem;
    border: 1px solid #e0e8eb;
    border-radius: 0.8rem;
    background: #fff;
}

.beam-hub-definition__examples > span {
    flex: 0 0 auto;
    color: #718091;
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.beam-hub-definition__examples ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.beam-hub-definition__examples li {
    padding: 0.3rem 0.52rem;
    border-radius: 999px;
    background: #f1f6f7;
    color: #4f6071;
    font-size: 0.67rem;
    font-weight: 750;
}

@media (max-width: 1180px) {
    .beam-hub-guide-frame {
        display: block;
        width: 100%;
    }

    .beam-hub-guide-content {
        border-inline: 0;
    }

    .beam-hub-sidebar {
        position: relative;
        top: auto;
        width: min(100% - 2rem, 82rem);
        max-height: none;
        margin: 1rem auto 0;
        overflow: visible;
        padding: 0;
    }

    .beam-hub-sidebar details {
        overflow: hidden;
        border: 1px solid #dce5e8;
        border-radius: 0.8rem;
        background: #fff;
        box-shadow: 0 8px 24px rgba(29, 61, 65, 0.06);
    }

    .beam-hub-sidebar summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.85rem 1rem;
        color: #243347;
        cursor: pointer;
        font-size: 0.86rem;
        font-weight: 800;
        list-style: none;
    }

    .beam-hub-sidebar summary::-webkit-details-marker {
        display: none;
    }

    .beam-hub-sidebar summary svg {
        width: 1.1rem;
        height: 1.1rem;
        color: #788696;
        transition: transform 150ms ease;
    }

    .beam-hub-sidebar details[open] summary svg {
        transform: rotate(180deg);
    }

    .beam-hub-sidebar__body {
        display: none !important;
        padding: 0.85rem;
        border-top: 1px solid #e5ebed;
    }

    .beam-hub-sidebar details[open] .beam-hub-sidebar__body {
        display: block !important;
    }

    .beam-hub-sidebar__title {
        display: none;
    }

    .beam-hub-sidebar nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
    }

    .beam-hub-sidebar__group + .beam-hub-sidebar__group {
        margin-top: 0;
    }
}

@media (max-width: 900px) {
    .beam-hub-definition__grid {
        grid-template-columns: 1fr;
    }

    .beam-hub-definition__copy h2 {
        max-width: none;
    }
}

@media (max-width: 680px) {
    .beam-hub-sidebar nav {
        grid-template-columns: 1fr;
    }

    .beam-hub-sidebar__body {
        max-height: 70vh;
        overflow-y: auto;
    }

    .beam-hub-definition {
        padding-top: 2.75rem;
    }

    .beam-hub-definition__copy h2 {
        font-size: clamp(2.2rem, 11vw, 3.15rem);
    }

    .beam-hub-definition__actions {
        grid-template-columns: 1fr;
    }

    .beam-hub-definition__actions > div {
        display: grid;
        grid-template-columns: minmax(8.5rem, 0.7fr) minmax(0, 1fr);
        align-items: center;
        gap: 0.75rem;
    }

    .beam-hub-definition__actions > div + div {
        border-top: 1px solid #e4eaed;
        border-left: 0;
    }

    .beam-hub-definition__actions dd {
        margin-top: 0;
    }

    .beam-hub-definition__examples {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.65rem;
    }
}

/* Engineering reference presentation */
.beam-hub-hero {
    border-bottom-color: #dce7e7;
    background:
        radial-gradient(circle at 76% 17%, rgba(71, 184, 184, 0.18), transparent 27rem),
        linear-gradient(135deg, #f1fbfb 0%, #ffffff 46%, #f7fafc 100%);
}

.beam-hub-hero::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
    background-size: 32px 32px;
    content: "";
    mask-image: linear-gradient(to bottom, #000, transparent 92%);
}

.beam-hub-breadcrumb {
    justify-content: center;
    padding-top: 0.7rem;
    text-align: center;
}

.beam-hub-hero__grid {
    display: block;
    padding: 0;
}

.beam-hub-hero__copy {
    max-width: 64rem;
    margin-inline: auto;
    padding-block: 1rem 1.55rem;
    text-align: center;
}

.beam-hub-hero .beam-hub-eyebrow {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    letter-spacing: 0.1em;
}

.beam-hub-hero .beam-hub-eyebrow::before {
    display: none;
}

.beam-hub-hero h1 {
    max-width: 62rem;
    margin: 0.45rem auto 0;
    font-size: clamp(1.95rem, 4vw, 3.1rem);
    line-height: 1.02;
    text-align: center;
    text-wrap: balance;
    white-space: normal;
}

.beam-hub-hero h1 span {
    display: inline;
    margin-left: 0.12em;
    color: #277173;
}

.beam-hub-hero__lede {
    max-width: 54rem;
    margin: 0.55rem auto 0;
    font-size: clamp(0.88rem, 1.4vw, 0.98rem);
    line-height: 1.55;
    text-align: center;
    text-wrap: balance;
}

.beam-hub-hero .beam-hub-actions {
    justify-content: center;
    margin-top: 1rem;
}

.beam-hub-hero .beam-hub-button {
    min-height: 2.8rem;
    padding: 0.72rem 1rem;
    font-size: 0.9rem;
}

.beam-hub-hero .beam-hub-button--primary {
    background: #2f7a7b;
    box-shadow: 0 9px 20px rgba(35, 95, 97, 0.18);
}

.beam-hub-hero .beam-hub-button--secondary {
    border-color: #9fcac7;
    background: rgba(255, 255, 255, 0.82);
}

.beam-hub-hero__meta {
    margin: 0.8rem 0 0;
    color: #6a7888;
    font-size: 0.76rem;
    line-height: 1.55;
}

.beam-hub-hero__meta a {
    color: #405266;
    font-weight: 780;
    text-decoration: underline;
    text-decoration-color: #b9c9d0;
    text-underline-offset: 0.16em;
}

.beam-hub-section {
    padding-block: clamp(3.6rem, 5.7vw, 5.25rem);
}

.beam-hub-section-heading,
.beam-hub-explorer .beam-hub-section-heading {
    max-width: 54rem;
    margin: 0 0 2rem;
    text-align: left;
}

.beam-hub-section-heading > p {
    margin: 0.8rem 0 0;
}

.beam-hub-section-heading h2,
.beam-hub-restraint-intro h2,
.beam-hub-final h2,
.beam-hub-review h2 {
    font-size: clamp(2rem, 3.2vw, 3rem);
    line-height: 1.08;
}

.beam-hub-definition__copy h2 {
    max-width: none;
    font-size: clamp(2.25rem, 3.65vw, 3.55rem);
    line-height: 1.04;
}

.beam-hub-formula-bridge__panel {
    border-radius: 0.9rem;
    box-shadow: 0 8px 24px rgba(24, 54, 61, 0.06);
}

.beam-hub-formula-bridge__mark {
    border-radius: 0.65rem;
    box-shadow: none;
}

.beam-hub-formula-bridge .beam-hub-button--primary,
.beam-hub-section-properties .beam-hub-button--primary {
    border-color: #aacdca;
    background: #fff;
    color: var(--beam-hub-brand-dark);
    box-shadow: none;
}

.beam-hub-formula-bridge .beam-hub-button--primary:hover,
.beam-hub-section-properties .beam-hub-button--primary:hover {
    border-color: var(--beam-hub-brand);
    background: var(--beam-hub-brand-soft);
    color: var(--beam-hub-brand-dark);
}

@media (max-width: 680px) {
    .beam-hub-breadcrumb {
        justify-content: center;
        overflow: visible;
        text-align: center;
        white-space: normal;
    }

    .beam-hub-breadcrumb span[aria-hidden="true"]:last-of-type,
    .beam-hub-breadcrumb span[aria-current="page"] {
        display: none;
    }

    .beam-hub-hero__copy {
        text-align: center;
    }

    .beam-hub-hero h1 {
        max-width: 20rem;
        margin-inline: auto;
        font-size: clamp(2rem, 8.7vw, 2.35rem);
    }

    .beam-hub-hero h1 span {
        display: block;
        margin-left: 0;
    }

    .beam-hub-hero__lede {
        margin-inline: auto;
    }

    .beam-hub-hero .beam-hub-actions {
        justify-content: center;
    }

    .beam-hub-definition__copy h2 {
        font-size: clamp(2.05rem, 9.5vw, 2.75rem);
    }
}

/* Beam support types: instructional sequence */
.beam-hub-supports__heading {
    max-width: 58rem;
}

.beam-hub-support-principle {
    display: grid;
    grid-template-columns: minmax(18rem, 0.78fr) minmax(0, 1.22fr);
    overflow: hidden;
    margin-top: 2rem;
    border: 1px solid #d6e2e5;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.045);
}

.beam-hub-support-principle__copy {
    padding: clamp(1.35rem, 2.5vw, 2rem);
    border-right: 1px solid #e1e9ec;
}

.beam-hub-support-principle__copy h3,
.beam-hub-support-profile-heading h3,
.beam-hub-support-reference__heading h3,
.beam-hub-support-to-model__heading h3,
.beam-hub-support-cautions h3 {
    margin: 0.45rem 0 0;
    color: var(--beam-hub-ink);
    font-size: clamp(1.55rem, 2.5vw, 2.25rem);
    font-weight: 830;
    letter-spacing: -0.04em;
    line-height: 1.08;
}

.beam-hub-support-principle__copy > p,
.beam-hub-support-profile-heading p,
.beam-hub-support-reference__heading p,
.beam-hub-support-to-model__heading p,
.beam-hub-support-cautions header > p {
    margin: 0.75rem 0 0;
    color: var(--beam-hub-muted);
    font-size: 0.9rem;
    line-height: 1.7;
}

.beam-hub-support-principle__copy ol {
    display: grid;
    gap: 0.65rem;
    margin: 1.15rem 0 0;
    padding: 0;
    list-style: none;
}

.beam-hub-support-principle__copy li {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
}

.beam-hub-support-principle__copy li > span {
    display: flex;
    width: 1.85rem;
    height: 1.85rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.52rem;
    background: #e7f5f4;
    color: var(--beam-hub-brand-dark);
    font-size: 0.67rem;
    font-weight: 850;
}

.beam-hub-support-principle__copy li strong,
.beam-hub-support-principle__copy li small {
    display: block;
}

.beam-hub-support-principle__copy li strong {
    color: #29384a;
    font-size: 0.82rem;
    line-height: 1.4;
}

.beam-hub-support-principle__copy li small {
    margin-top: 0.16rem;
    color: #69798a;
    font-size: 0.72rem;
    line-height: 1.5;
}

.beam-hub-support-principle__copy aside {
    margin-top: 1.15rem;
    padding: 0.9rem 1rem;
    border-left: 3px solid #5aa8a4;
    background: #f1f8f7;
}

.beam-hub-support-principle__copy aside strong {
    color: #244b4e;
    font-size: 0.75rem;
}

.beam-hub-support-principle__copy aside p {
    margin: 0.3rem 0 0;
    color: #5c6b7a;
    font-size: 0.7rem;
    line-height: 1.55;
}

.beam-hub-support-principle__figure {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: clamp(1rem, 2vw, 1.5rem);
    background: #f8fbfb;
}

.beam-hub-support-principle__figure svg {
    display: block;
    width: 100%;
    height: auto;
}

.beam-hub-movement-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem 1rem;
    color: #647386;
    font-size: 0.68rem;
    line-height: 1.5;
}

.beam-hub-movement-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.beam-hub-movement-legend i {
    width: 0.58rem;
    height: 0.58rem;
    flex: 0 0 auto;
    border: 2px solid #2f7a7b;
    border-radius: 999px;
    background: #e7f5f4;
}

.beam-hub-movement-legend .is-restrained {
    border-color: #b66a19;
    background: #fff0d7;
}

.beam-hub-support-principle__figure .beam-hub-movement-legend {
    justify-content: center;
    margin-top: 0.7rem;
}

.beam-hub-movement-legend--profiles {
    width: fit-content;
    max-width: 100%;
    margin-top: 1rem;
    border: 1px solid #d7e4e6;
    border-radius: 0.75rem;
    background: #fff;
    padding: 0.65rem 0.8rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.035);
}

.beam-hub-support-profile-heading,
.beam-hub-support-reference__heading,
.beam-hub-support-to-model__heading {
    max-width: 58rem;
    margin-top: clamp(3.5rem, 6vw, 5.25rem);
}

.beam-hub-support-profile-list {
    display: grid;
    gap: 1.2rem;
    margin-top: 1.5rem;
}

.beam-hub-support-profile {
    scroll-margin-top: 7rem;
    overflow: hidden;
    border: 1px solid #d7e2e6;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 9px 25px rgba(15, 23, 42, 0.04);
}

.beam-hub-support-profile__header {
    display: grid;
    grid-template-columns: 8rem minmax(0, 1fr);
    gap: 0.2rem 1rem;
    align-items: start;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e2e9ec;
    background: linear-gradient(90deg, #edf8f7, #fff 70%);
}

.beam-hub-support-profile__header > span {
    grid-row: 1 / span 2;
    color: var(--beam-hub-brand-dark);
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.beam-hub-support-profile__header h3 {
    margin: 0;
    color: var(--beam-hub-ink);
    font-size: 1.2rem;
    font-weight: 830;
    letter-spacing: -0.025em;
}

.beam-hub-support-profile__header p {
    margin: 0;
    color: #58687a;
    max-width: 51rem;
    font-size: 0.75rem;
    line-height: 1.5;
}

.beam-hub-support-profile__body {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(17rem, 0.6fr);
}

.beam-hub-support-profile__figure {
    display: grid;
    grid-template-columns: 9.5rem minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 0;
    min-width: 0;
    margin: 0;
    padding: 1rem;
    border-right: 1px solid #e4eaed;
    background: #f7fafb;
}

.beam-hub-support-profile__ideal,
.beam-hub-support-profile__physical {
    min-width: 0;
}

.beam-hub-support-profile__ideal {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.8rem;
    border: 1px solid #dce6e9;
    border-right: 0;
    border-radius: 0.8rem 0 0 0.8rem;
    background: #fff;
}

.beam-hub-support-profile__ideal > span,
.beam-hub-support-profile__physical > span {
    align-self: flex-start;
    color: #708092;
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.beam-hub-support-profile__ideal svg {
    display: block;
    width: 100%;
    margin-top: 0.7rem;
}

.beam-hub-support-profile__ideal p {
    margin: 0.55rem 0 0;
    color: #536274;
    font-size: 0.66rem;
    line-height: 1.45;
    text-align: center;
}

.beam-hub-support-profile__ideal p strong {
    display: block;
    margin-top: 0.2rem;
    color: #8f5517;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.76rem;
}

.beam-hub-support-profile__physical {
    padding: 0.8rem;
    border: 1px solid #dce6e9;
    border-radius: 0 0.8rem 0.8rem 0;
    background: #fff;
}

.beam-hub-support-profile__physical svg {
    display: block;
    width: 100%;
    height: auto;
    margin-top: 0.35rem;
}

.beam-hub-support-profile__figure figcaption {
    grid-column: 1 / -1;
    margin: 0;
    padding: 0.65rem 0.25rem 0;
    color: #748293;
    font-size: 0.61rem;
    line-height: 1.5;
}

.beam-hub-support-profile__details {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 1.1rem 1.2rem;
}

.beam-hub-support-profile__question {
    margin: 0;
    color: var(--beam-hub-brand-dark);
    font-size: 0.6rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.beam-hub-support-profile__details dl {
    display: grid;
    gap: 0;
    margin: 0.4rem 0 0;
}

.beam-hub-support-profile__details dl > div {
    padding: 0.72rem 0;
    border-bottom: 1px solid #ebeff2;
}

.beam-hub-support-profile__details dt {
    color: #738193;
    font-size: 0.57rem;
    font-weight: 850;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.beam-hub-support-profile__details dd {
    margin: 0.23rem 0 0;
    color: #425165;
    font-size: 0.7rem;
    line-height: 1.5;
}

.beam-hub-support-profile__details dd i {
    font-family: Georgia, "Times New Roman", serif;
}

.beam-hub-support-profile__reaction {
    color: #8a5517;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.78rem;
}

.beam-hub-support-profile__reference-link {
    margin-top: auto;
    padding-top: 0.8rem;
    color: var(--beam-hub-brand-dark);
    font-size: 0.65rem;
    font-weight: 820;
    text-decoration: none;
}

.beam-hub-support-profile__reference-link:hover {
    text-decoration: underline;
}

.beam-hub-support-reference__table i {
    font-family: Georgia, "Times New Roman", serif;
}

.beam-hub-support-reference {
    scroll-margin-top: 7rem;
}

.beam-hub-support-reference__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr));
    gap: 0.75rem;
    margin-top: 1.35rem;
}

.beam-hub-support-reference__grid > article {
    overflow: hidden;
    border: 1px solid #d8e3e6;
    border-radius: 0.9rem;
    background: #fff;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
}

.beam-hub-support-reference__grid article > header {
    display: grid;
    grid-template-columns: 2rem 6rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    padding: 0.8rem;
    border-bottom: 1px solid #e4ebee;
    background: #f4f9f9;
}

.beam-hub-support-reference__grid header > span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 0.55rem;
    background: #dff1ef;
    color: var(--beam-hub-brand-dark);
    font-size: 0.6rem;
    font-weight: 850;
}

.beam-hub-support-reference__grid header > div {
    display: flex;
    height: 3.5rem;
    align-items: center;
    justify-content: center;
}

.beam-hub-support-reference__grid header svg {
    display: block;
    width: 100%;
    max-width: 6rem;
    height: auto;
}

.beam-hub-support-reference__grid h4 {
    margin: 0;
    color: #28384a;
    font-size: 0.82rem;
    font-weight: 830;
    line-height: 1.3;
}

.beam-hub-support-reference__grid dl {
    margin: 0;
    padding: 0 0.9rem;
}

.beam-hub-support-reference__grid dl > div {
    padding: 0.78rem 0;
    border-bottom: 1px solid #e8edef;
}

.beam-hub-support-reference__grid dl > div:last-child {
    border-bottom: 0;
}

.beam-hub-support-reference__grid dt {
    color: #778596;
    font-size: 0.56rem;
    font-weight: 850;
    letter-spacing: 0.065em;
    text-transform: uppercase;
}

.beam-hub-support-reference__grid dd {
    margin: 0.28rem 0 0;
    color: #3f5063;
    font-size: 0.7rem;
    line-height: 1.5;
}

.beam-hub-support-reference__grid dd strong,
.beam-hub-support-reference__grid dd span {
    display: block;
}

.beam-hub-support-reference__grid dd strong {
    color: #2f3e50;
    font-size: 0.72rem;
}

.beam-hub-support-reference__grid dd span {
    margin-top: 0.18rem;
    color: #687789;
    font-size: 0.64rem;
}

.beam-hub-support-reference__grid dd span sub {
    font-size: 0.7em;
}

.beam-hub-support-reference__advanced {
    overflow: hidden;
    margin-top: 0.85rem;
    border: 1px solid #dce5e8;
    border-radius: 0.8rem;
    background: #fff;
}

.beam-hub-support-reference__advanced summary {
    position: relative;
    padding: 0.85rem 3rem 0.85rem 1rem;
    color: #35475a;
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 820;
    list-style: none;
}

.beam-hub-support-reference__advanced summary::-webkit-details-marker {
    display: none;
}

.beam-hub-support-reference__advanced summary::after {
    position: absolute;
    top: 50%;
    right: 1rem;
    color: var(--beam-hub-brand-dark);
    font-size: 1rem;
    transform: translateY(-50%);
    content: "+";
}

.beam-hub-support-reference__advanced[open] summary::after {
    content: "−";
}

.beam-hub-support-reference__advanced > div {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
    padding: 0.9rem 1rem 1rem;
    border-top: 1px solid #e6ecef;
    background: #fbfcfc;
}

.beam-hub-support-reference__advanced p {
    margin: 0;
    color: #627183;
    font-size: 0.67rem;
    line-height: 1.58;
}

.beam-hub-support-reference__advanced p strong {
    color: #344557;
}

.beam-hub-support-to-model {
    scroll-margin-top: 7rem;
}

.beam-hub-support-to-model__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.7rem;
    margin-top: 1.35rem;
}

.beam-hub-support-to-model__grid > a {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 0.85rem;
    border: 1px solid #d8e2e6;
    border-radius: 0.85rem;
    background: #fff;
    color: inherit;
    text-decoration: none;
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.beam-hub-support-to-model__grid > a:hover,
.beam-hub-support-to-model__grid > a:focus-visible {
    border-color: #93c5c1;
    box-shadow: 0 10px 24px rgba(35, 95, 97, 0.09);
    transform: translateY(-2px);
}

.beam-hub-support-to-model__grid a > div {
    display: flex;
    height: 4.4rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.65rem;
    background: #f2f8f8;
}

.beam-hub-support-to-model__grid svg {
    width: 100%;
    max-width: 9.5rem;
    height: 3.6rem;
}

.beam-hub-support-to-model__grid a > span {
    margin-top: 0.7rem;
    color: var(--beam-hub-brand-dark);
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.055em;
    line-height: 1.35;
    text-transform: uppercase;
}

.beam-hub-support-to-model__grid h4 {
    margin: 0.3rem 0 0;
    color: var(--beam-hub-ink);
    font-size: 0.85rem;
    font-weight: 830;
}

.beam-hub-support-to-model__grid p {
    flex: 1 1 auto;
    margin: 0.35rem 0 0;
    color: #647386;
    font-size: 0.65rem;
    line-height: 1.5;
}

.beam-hub-support-to-model__grid a > strong {
    margin-top: 0.65rem;
    color: var(--beam-hub-brand-dark);
    font-size: 0.64rem;
}

.beam-hub-support-to-model__grid a > strong i {
    font-style: normal;
}

.beam-hub-support-cautions {
    scroll-margin-top: 7rem;
    overflow: hidden;
    margin-top: clamp(3.5rem, 6vw, 5.25rem);
    border: 1px solid #d7e3e6;
    border-radius: 1rem;
    background: #fff;
}

.beam-hub-support-cautions > header {
    display: grid;
    grid-template-columns: minmax(12rem, 0.7fr) minmax(18rem, 0.9fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    padding: 1.2rem 1.3rem;
    border-bottom: 1px solid #e1e8eb;
    background: #edf7f6;
}

.beam-hub-support-cautions > header h3,
.beam-hub-support-cautions > header p {
    margin: 0;
}

.beam-hub-support-cautions > header h3 {
    font-size: 1.15rem;
}

.beam-hub-support-cautions > header p {
    font-size: 0.76rem;
}

.beam-hub-support-cautions > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.beam-hub-support-cautions article {
    display: grid;
    grid-template-columns: 2.1rem minmax(0, 1fr);
    column-gap: 0.75rem;
    padding: 1.1rem 1.2rem;
    border-right: 1px solid #e7ecef;
    border-bottom: 1px solid #e7ecef;
}

.beam-hub-support-cautions article:nth-child(2n) {
    border-right: 0;
}

.beam-hub-support-cautions article:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.beam-hub-support-cautions article > span {
    grid-row: 1 / span 2;
    display: flex;
    width: 1.9rem;
    height: 1.9rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.55rem;
    background: #fff1d9;
    color: #8a5618;
    font-size: 0.62rem;
    font-weight: 850;
}

.beam-hub-support-cautions h4 {
    margin: 0;
    color: #29384a;
    font-size: 0.8rem;
    font-weight: 830;
}

.beam-hub-support-cautions article p {
    margin: 0.3rem 0 0;
    color: #657486;
    font-size: 0.7rem;
    line-height: 1.55;
}

.beam-hub-support-cautions footer {
    padding: 0.85rem 1.2rem;
    border-top: 1px solid #e6ecef;
    background: #fafcfc;
    text-align: right;
}

.beam-hub-support-cautions footer a {
    color: var(--beam-hub-brand-dark);
    font-size: 0.72rem;
    font-weight: 820;
    text-decoration: none;
}

.beam-hub-support-cautions footer a:hover {
    text-decoration: underline;
}

@media (max-width: 1080px) {
    .beam-hub-support-principle,
    .beam-hub-support-profile__body {
        grid-template-columns: 1fr;
    }

    .beam-hub-support-principle__copy,
    .beam-hub-support-profile__figure {
        border-right: 0;
        border-bottom: 1px solid #e1e9ec;
    }

    .beam-hub-support-profile__figure {
        grid-template-columns: 11rem minmax(0, 1fr);
    }

    .beam-hub-support-to-model__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .beam-hub-support-profile__header,
    .beam-hub-support-cautions > header {
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }

    .beam-hub-support-profile__header p {
        margin-top: 0.2rem;
    }

    .beam-hub-support-profile__header > span {
        grid-row: auto;
    }

    .beam-hub-support-profile__details dl > div {
        grid-template-columns: 6.5rem minmax(0, 1fr);
    }

    .beam-hub-support-to-model__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .beam-hub-support-cautions > div {
        grid-template-columns: 1fr;
    }

    .beam-hub-support-reference__advanced > div {
        grid-template-columns: 1fr;
    }

    .beam-hub-support-cautions article,
    .beam-hub-support-cautions article:nth-child(2n),
    .beam-hub-support-cautions article:nth-last-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid #e7ecef;
    }

    .beam-hub-support-cautions article:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 520px) {
    .beam-hub-support-principle__copy,
    .beam-hub-support-profile__details {
        padding: 1rem;
    }

    .beam-hub-support-principle__figure,
    .beam-hub-support-profile__figure {
        padding: 0.7rem;
    }

    .beam-hub-support-profile__figure {
        grid-template-columns: 1fr;
    }

    .beam-hub-support-profile__ideal {
        border-right: 1px solid #dce6e9;
        border-bottom: 0;
        border-radius: 0.8rem 0.8rem 0 0;
    }

    .beam-hub-support-profile__ideal svg {
        max-width: 11rem;
    }

    .beam-hub-support-profile__physical {
        border-radius: 0 0 0.8rem 0.8rem;
    }

    .beam-hub-support-profile__details dl > div {
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }

    .beam-hub-movement-legend {
        align-items: flex-start;
        flex-direction: column;
    }

    .beam-hub-support-to-model__grid {
        grid-template-columns: 1fr;
    }

}
