/* A shared buying path for optical components, finished panels and LED bars. */
.product-family-page.product-directory-page .site-header { background:#fff; color:var(--ink); box-shadow:0 1px 0 #14231f0d; }
.product-family-page .family-scope-band { padding-block:1.1rem; border-block-end:1px solid #dce5df; background:#f7f9f7; }
.family-scope-band>.eyebrow,.family-scope-links { max-width:var(--max); margin-inline:auto; }
.family-scope-band>.eyebrow { margin-block-end:.65rem; font-size:.68rem; }
.family-scope-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; }
.family-scope-links a { display:flex; flex-wrap:wrap; align-items:baseline; column-gap:.7rem; row-gap:.2rem; min-width:0; padding:.8rem 1rem; border:1px solid transparent; border-radius:6px; color:#354e4a; }
.family-scope-links strong { font-size:.87rem; line-height:1.4; }
.family-scope-links span { color:#61726d; font-size:.74rem; line-height:1.4; }
.family-scope-links a:hover { background:#eaf1ed; }
.family-scope-links a[aria-current="page"] { border-color:#bad1c7; background:#e6efea; }
.family-scope-links a:focus-visible,.family-choice-grid>a:focus-visible,.family-support-grid>a:focus-visible { outline:3px solid #16777a; outline-offset:4px; }
.product-family-page.product-directory-page .page-hero { padding-block-end:3rem; background:#eaf1ed; color:#14231f; }
.product-family-page.product-directory-page .page-hero-content { max-width:900px; }
.product-family-page.product-directory-page .page-hero h1 { max-width:18ch; color:#14231f; text-wrap:balance; }
.product-family-page.product-directory-page .page-hero .eyebrow,.product-family-page.product-directory-page .page-hero .breadcrumb,.product-family-page.product-directory-page .page-hero .breadcrumb a,.product-family-page.product-directory-page .page-hero .hero-text-link { color:#365951; }
.product-family-page.product-directory-page .page-hero-content>p:not(.eyebrow) { color:#465c54; max-width:62ch; }
.product-family-page.product-directory-page .page-hero .button-light { background:#152924; color:white; }
.family-directory>.section-heading,.family-choice-grid,.family-series-note,.family-related>.section-heading,.family-support-grid,.family-accessory-link,.family-resources>figure,.family-resources>div { min-width:0; }
.family-directory>.section-heading,.family-choice-grid,.family-series-note,.family-related>.section-heading,.family-support-grid,.family-accessory-link { max-width:var(--max); margin-inline:auto; }
.family-directory .section-heading>p:not(.eyebrow) { max-width:72ch; color:#52645d; }
.family-directory { scroll-margin-block-start:7.5rem; }
.family-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.3rem; }
.family-choice-grid>a { display:flex; flex-direction:column; min-width:0; padding:1.15rem; border:1px solid #dbe4de; border-radius:10px; background:#fff; color:var(--ink); }
.family-choice-grid>a:hover { border-color:#84aea0; box-shadow:0 6px 22px #18372a0a; }
.family-choice-grid figure { display:grid; place-items:center; height:13rem; margin:0 0 1.35rem; overflow:hidden; background:#f6f8f6; border-radius:5px; }
.family-choice-grid figure img { width:100%; height:100%; padding:.55rem; object-fit:contain; }
.family-card-label { margin-block-end:.55rem; font-size:.67rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:#50796a; }
.family-choice-grid strong { margin-block-end:.65rem; font-size:clamp(1.3rem,1.9vw,1.65rem); line-height:1.2; letter-spacing:-.02em; }
.family-choice-grid small { display:block; margin-block-end:1rem; color:#52645d; font-size:.88rem; line-height:1.65; }
.family-card-detail { display:block; padding-block-start:.9rem; border-block-start:1px solid #e6ece8; color:#52665e; font-size:.72rem; line-height:1.65; }
.family-choice-grid b { display:block; margin-block-start:auto; padding-block-start:1.1rem; color:#23675b; font-size:.82rem; line-height:1.5; }
.family-series-note { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:2rem; margin-block-start:1.6rem; padding:1.5rem; background:#f0f5f1; border-radius:8px; }
.family-series-note .eyebrow { font-size:.67rem; margin-block-end:.4rem; }
.family-series-note a { display:grid; gap:.5rem; }
.family-series-note strong { color:#1c5148; font-size:1.18rem; }
.family-series-note small,.family-series-note>p { color:#52665e; font-size:.84rem; line-height:1.65; }
.family-series-note b { color:#23675b; font-size:.8rem; }
.family-series-note>p { align-self:center; margin:0; padding-inline-start:1.5rem; border-inline-start:1px solid #ccdbd2; }
.family-related { background:#f6f8f5; }
.family-support-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.6rem; }
.family-support-grid>a { display:flex; flex-direction:column; min-width:0; color:var(--ink); }
.family-support-grid img { width:100%; height:10.5rem; object-fit:contain; margin-block-end:1rem; background:#fff; border:1px solid #e3e9e3; border-radius:6px; }
.family-support-grid strong { font-size:1.12rem; line-height:1.35; }
.family-support-grid small { display:block; margin:.6rem 0 1rem; font-size:.84rem; line-height:1.6; color:#52645d; }
.family-support-grid b { color:#23675b; font-size:.78rem; margin-block-start:auto; }
.family-accessory-link { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1.5rem; margin-block-start:1.8rem; padding-block-start:1.2rem; border-block-start:1px solid #d6e1d8; color:#284f44; }
.family-accessory-link strong { font-size:.95rem; }
.family-accessory-link span { flex:1; min-width:15rem; color:#52645d; font-size:.83rem; line-height:1.6; }
.family-accessory-link b { font-size:.78rem; }
.family-resources { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); align-items:center; gap:2.5rem; }
.family-resources figure { margin:0; }
.family-resources img { width:100%; height:15rem; object-fit:cover; border-radius:7px; }
.family-resources figcaption { margin-block-start:.6rem; color:#63736c; font-size:.73rem; line-height:1.5; }
.family-resources h2 { max-width:20ch; margin:.65rem 0 1.2rem; font-size:clamp(1.6rem,2.7vw,2.4rem); line-height:1.15; }
.family-resource-link { display:grid; gap:.45rem; padding:.9rem 0; border-block:1px solid #dbe4de; }
.family-resource-link strong { color:#1c5148; font-size:1.05rem; }
.family-resource-link small { color:#52645d; font-size:.83rem; line-height:1.55; }
.family-resource-link b { color:#23675b; font-size:.78rem; }
.family-resources .buyer-links { gap:.3rem 1.2rem; margin-block-start:.8rem; }
.family-resources .buyer-links a { font-size:.77rem; }
.family-component-next { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:3rem; align-items:center; background:#f1f5f1; }
.family-component-next h2 { max-width:24ch; margin:.6rem 0 1rem; font-size:clamp(1.7rem,3vw,2.5rem); line-height:1.2; }
.family-component-next p:not(.eyebrow) { max-width:67ch; color:#52645d; line-height:1.7; }
.family-component-next figure { margin:0; }
.family-component-next img { width:100%; height:13rem; object-fit:contain; padding:.8rem; background:#fff; border-radius:7px; }
.family-component-next figcaption { margin-block-start:.55rem; color:#63736c; font-size:.73rem; }
.family-component-next .buyer-links { gap:.2rem 1rem; }
.family-component-next .buyer-links a { font-size:.8rem; }
.family-assembly-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:4rem; }
.family-assembly-intro h2 { max-width:20ch; margin:.6rem 0 1rem; font-size:clamp(1.7rem,3vw,2.4rem); line-height:1.15; }
.family-assembly-intro>div>p:not(.eyebrow) { max-width:60ch; color:#52645d; line-height:1.7; }
.family-assembly-points { display:grid; align-content:center; gap:1rem; }
.family-assembly-points p { display:grid; gap:.35rem; margin:0; padding-inline-start:1rem; border-inline-start:2px solid #b9d1c2; }
.family-assembly-points strong { font-size:.94rem; color:#284f44; }
.family-assembly-points span { font-size:.84rem; color:#52645d; line-height:1.6; }
.product-family-page .family-feature-mini { display:grid; grid-template-columns:12rem minmax(0,1fr); align-items:center; gap:2rem; padding-block:2rem; background:#edf3ef; }
.family-feature-mini figure { margin:0; }
.family-feature-mini img { width:100%; height:11rem; padding:.5rem; object-fit:contain; background:#fff; border-radius:6px; }
.family-feature-mini h2 { margin:.4rem 0 .7rem; font-size:1.55rem; line-height:1.2; }
.family-feature-mini p:not(.eyebrow) { color:#52645d; font-size:.87rem; line-height:1.65; max-width:85ch; }
.family-feature-mini .family-dimensional-note { font-size:.78rem!important; }
.family-feature-mini .buyer-links { margin-block-start:.4rem; gap:.4rem 1.2rem; }
.family-feature-mini .buyer-links a { font-size:.8rem; }
@media(max-width:1000px) {
 .family-scope-links a { display:grid; }
 .family-choice-grid { gap:.8rem; }
 .family-choice-grid>a { padding:.85rem; }
 .family-choice-grid figure { height:10.5rem; }
 .family-support-grid { gap:1rem; }
}
@media(max-width:680px) {
 .product-family-page .family-scope-band { padding-block:1rem; }
 .family-scope-links { gap:.4rem; }
 .family-scope-links a { padding:.7rem .6rem; }
 .family-scope-links strong { font-size:.74rem; }
 .family-scope-links span { font-size:.65rem; }
 .family-choice-grid,.family-support-grid,.family-series-note,.family-resources,.family-component-next,.family-assembly-intro { grid-template-columns:1fr; }
 .family-choice-grid { gap:1.1rem; }
 .family-choice-grid>a { padding:1.1rem; }
 .family-choice-grid figure { height:13rem; }
 .family-choice-grid strong { font-size:1.5rem; }
 .family-series-note { gap:1rem; padding:1.2rem; }
 .family-series-note>p { padding-inline-start:0; padding-block-start:1rem; border-inline-start:0; border-block-start:1px solid #ccdbd2; }
 .family-support-grid { gap:1.7rem; }
 .family-support-grid img { height:12rem; }
 .family-resources,.family-component-next,.family-assembly-intro { gap:1.6rem; }
 .family-component-next figure { max-width:23rem; }
 .product-family-page .family-feature-mini { grid-template-columns:6.5rem minmax(0,1fr); gap:1rem; align-items:start; }
 .family-feature-mini img { height:7rem; }
 .family-feature-mini h2 { font-size:1.25rem; }
 .family-feature-mini .eyebrow { font-size:.62rem; }
}
@media print {
 .family-scope-band { display:none; }
 .family-choice-grid,.family-support-grid { display:block; }
 .family-choice-grid>a,.family-support-grid>a,.family-feature-mini { break-inside:avoid; margin-block-end:1rem; }
 .family-choice-grid figure,.family-support-grid img { height:8rem; }
}
