@font-face{font-family:Hanken;src:url('../uploads/fonts/hanken-grotesk-v12-latin-regular.woff2') format('woff2');font-weight:400;font-display:swap}

@font-face{font-family:Hanken;src:url('../uploads/fonts/hanken-grotesk-v12-latin-600.woff2') format('woff2');font-weight:600 800;font-display:swap}

@font-face{font-family:Space;src:url('../uploads/fonts/space-grotesk-v22-latin-600.woff2') format('woff2');font-weight:600;font-display:swap}

:root{color-scheme:dark;--bg:#100e10;--panel:#1a171c;--text:#e4e3e3;--muted:#b5acb8;--line:#38313c;--accent:#fff287;--amber:#e6b46d}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.65 Hanken,system-ui,sans-serif}
a{color:var(--accent);text-underline-offset:4px}
button,input,select{font:inherit}
button,a,input,select,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{font-family:Space,Hanken,sans-serif;font-weight:600;line-height:1.13}
h1{font-size:clamp(40px,5.3vw,66px);letter-spacing:-2px}
h2{font-size:clamp(29px,3.3vw,40px);letter-spacing:-1px}
h3{font-size:21px;letter-spacing:-.4px}
p{color:var(--muted)}
p+p{margin-top:16px}
strong{font-weight:600;color:var(--text)}
[hidden]{display:none!important}
.page-shell{max-width:1200px;margin:auto;padding:0 40px}
.page-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 0;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:18px;text-decoration:none;font:600 12px Space,sans-serif;letter-spacing:2px}
.brand img{object-fit:contain}
.brand-sub{color:var(--muted);font-family:Hanken,sans-serif;letter-spacing:.3px;margin-left:9px;font-weight:400}
.back-link{font-size:14px;text-decoration:none;white-space:nowrap}
.back-link span{margin-left:8px}
.hero{padding:64px 0 0}
.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.intro{font-size:20px;max-width:700px;margin-top:25px;line-height:1.55}
.guide-nav{display:flex;gap:28px;flex-wrap:wrap;margin-top:37px;font-size:14px}
.guide-nav a{color:var(--text);text-decoration:none;display:flex;gap:10px;padding:8px 0}
.guide-nav span{color:var(--accent);font-size:11px;padding-top:3px}
.guide-nav a:hover,.back-link:hover{text-decoration:underline}
.guide-section{padding-top:64px;scroll-margin-top:24px}
.section-heading{max-width:770px;margin-bottom:28px}
.section-heading p:last-child{margin-top:18px}
.section-heading .eyebrow{margin-bottom:12px}
.profile-options{border:0;padding:0;margin:0 0 22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;min-inline-size:0}
.profile-options legend{color:var(--muted);font-size:13px;margin-bottom:12px}
.profile-card{display:flex;align-items:flex-start;gap:13px;padding:18px;border:1px solid var(--line);border-radius:12px;cursor:pointer;line-height:1.4;background:#151216;transition:background .15s,border-color .15s}
.profile-card input{accent-color:var(--accent);width:16px;height:16px;flex:none;margin:4px 0 0}
.profile-card strong{display:block;font-size:16px}
.profile-card small{display:block;color:var(--muted);font-size:13px;margin-top:6px}
.profile-card:has(input:checked){border-color:#fff2878c;background:#fff28709}
.profile-card:has(input:checked) strong{color:var(--accent)}
.profile-card:hover{border-color:#817149}
.socket-visuals{display:grid;grid-template-columns:1.14fr 1fr;gap:18px}
.diagram-card{border:1px solid var(--line);border-radius:18px;background:radial-gradient(ellipse at 55% 30%,#33233455,transparent 70%),var(--panel);overflow:hidden;min-width:0}
.diagram-heading{display:flex;align-items:center;gap:13px;padding:24px 25px 0}
.diagram-heading h3{font-size:18px;line-height:1.3;letter-spacing:-.2px}
.diagram-heading p{font-size:12px;margin-top:5px}
.diagram-index{display:grid;place-items:center;flex:none;width:30px;height:30px;border:1px solid #6a5869;border-radius:50%;font:600 12px Space,sans-serif;color:#cfb9d1}
.diagram-card svg{width:100%;height:auto;display:block}
.svg-label{fill:#b7abbc;font:12px Hanken,sans-serif;letter-spacing:2px}
.socket-visuals .svg-label{font-size:18px;letter-spacing:1.4px}
.svg-small{fill:#c4b6cc;font:16px Hanken,sans-serif}
.svg-marker{fill:#e4e3e3;font:600 16px Space,sans-serif}
.svg-marker.accent{fill:#fff287}
.svg-measure{fill:#fff287;font:600 23px Space,sans-serif}
.depth-equation{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 25px 25px;padding-top:20px;border-top:1px solid var(--line)}
.depth-equation>div{min-width:0}
.depth-equation div>span{display:block;font-size:10px;line-height:1.5;color:var(--muted)}
.depth-equation strong{display:block;font:600 30px/1.2 Space,sans-serif;margin-top:9px}
.depth-equation strong small{font:400 12px Hanken,sans-serif;color:var(--muted)}
.depth-equation b{font-size:16px;font-weight:400;color:#9a8a9e}
.depth-equation i{display:inline-grid;place-items:center;border:1px solid #7d6d80;border-radius:50%;font-style:normal;width:14px;height:14px;margin-right:4px}
.equation-total strong{color:var(--accent)}
.footprint-result{margin:0 25px;font-size:16px}
.footprint-result strong{color:var(--accent)}
.diagram-note{font-size:12px;line-height:1.5;margin:9px 25px 24px}
.preset-note{font-size:15px;margin:19px 0 0;padding-left:18px;border-left:2px solid #b18c57;max-width:890px}
.example-note{font-size:12px;margin-top:10px;padding-left:20px;color:#a99fae}
.layout-example{display:grid;grid-template-columns:1.2fr 1fr;gap:42px;align-items:center;padding-top:44px}
.layout-example figure{min-width:0}
.layout-example img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:14px;background:#100e10}
.layout-example figcaption{font-size:12px;color:var(--muted);margin-top:10px;line-height:1.6}
.layout-example figcaption a{white-space:nowrap}
.layout-steps .eyebrow{margin-bottom:14px}
.layout-steps h3{font-size:28px;line-height:1.2}
.layout-steps ol{list-style:none;counter-reset:step;padding:0;margin:25px 0 0;display:grid;gap:20px}
.layout-steps li{counter-increment:step;position:relative;padding-left:36px;font-size:15px;line-height:1.6;color:var(--muted)}
.layout-steps li:before{content:counter(step);position:absolute;left:0;top:0;display:grid;place-items:center;width:22px;height:22px;border:1px solid #6d5c6c;border-radius:50%;color:var(--accent);font-size:11px}
.layout-steps strong{display:block;margin-bottom:3px}
.height-workspace{display:grid;grid-template-columns:290px 1fr;gap:25px;align-items:stretch}
.height-controls{padding:25px 23px;border:1px solid var(--line);border-radius:18px;background:#151216}
.range-label{display:flex;justify-content:space-between;gap:15px;font-size:14px;margin:0 0 15px}
.range-label output{color:var(--accent);white-space:nowrap}
.height-controls input[type=range]{display:block;width:100%;margin:0 0 27px;accent-color:var(--accent);cursor:pointer;min-height:24px}
.control-note{font-size:12px;line-height:1.6;margin-top:4px}
.select-label{display:block;font-size:12px;margin:24px 0 8px;color:var(--muted)}
select{width:100%;min-height:44px;padding:9px;color:var(--text);background:#26202a;border:1px solid #514657;border-radius:7px;font-size:13px;cursor:pointer}
.height-figure .diagram-heading{padding-bottom:10px}
.height-key{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;padding:0 20px;font-size:12px;color:var(--muted)}
.height-key span{display:flex;align-items:center;gap:8px}
.swatch{width:10px;height:10px;display:inline-block;border:1px solid #d7c29b}
.swatch.mount{background:#d7c29b}
.swatch.equipment{background:#66516c;border-color:#b19db6}
.swatch.limit{height:12px;width:0;border:0;border-left:2px dashed var(--accent)}
.height-figure .diagram-note{text-align:center;margin-top:16px}
.height-result{display:flex;align-items:center;gap:45px;padding:25px 0 22px;border-bottom:1px solid var(--line)}
.height-result>div>span{display:block;font-size:13px;color:var(--muted)}
.height-result strong{font:600 40px Space,sans-serif;color:var(--accent);display:block;margin-top:5px}
.height-result strong small{font:400 16px Hanken,sans-serif;color:var(--muted)}
.height-result p{font-size:12px;margin-top:4px}
.result-arrow{color:#8d7a8c;font-size:27px}
.height-explanation{font-size:15px;max-width:930px;margin-top:22px}
.references{border-top:1px solid var(--line);margin-top:60px;padding-top:45px}
.references .section-heading h2{font-size:30px}
.reference-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px}
.reference-grid h3{font-size:20px;margin-bottom:18px}
.reference-grid p{font-size:14px;line-height:1.75}
.scope-note{border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin-top:30px;font-size:14px}
.scope-note summary{cursor:pointer;color:var(--text)}
.scope-note p{padding-top:14px}
.guide-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:45px 0 55px}
.guide-footer .eyebrow{margin-bottom:10px}
.guide-footer h2{font-size:30px}
.button{display:inline-flex;align-items:center;gap:25px;justify-content:center;border-radius:40px;background:var(--accent);color:#19151a;padding:14px 24px;text-decoration:none;font-size:15px;font-weight:600;text-align:center}
.button:hover{background:#fff6b3}
.skip-link{position:absolute;top:-100px;left:20px;padding:10px;background:var(--accent);color:#100e10;z-index:20}
.skip-link:focus{top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(min-width:761px){.height-workspace:has(.height-controls[hidden]){grid-template-columns:1fr}
.height-workspace:has(.height-controls[hidden]) .height-figure{max-width:790px}
}

@media(max-width:1000px){.page-shell{padding:0 28px}
.socket-visuals{grid-template-columns:1fr 1fr;gap:14px}
.profile-card{padding:15px 12px;gap:9px}
.profile-card strong{font-size:14px}
.depth-equation{margin-inline:18px}
.depth-equation div>span{font-size:9px}
.depth-equation i{display:none}
.depth-equation strong{font-size:26px}
.layout-example{gap:28px}
.height-workspace{grid-template-columns:260px 1fr;gap:18px}
.height-key{gap:12px}
.diagram-heading{padding:22px 20px 0}
.diagram-heading h3{font-size:16px}
.reference-grid{gap:30px}
}

@media(max-width:760px){body{font-size:16px}
.page-shell{padding:0 20px}
.page-header{padding:20px 0}
.brand{gap:11px;letter-spacing:1.5px}
.brand-sub{display:none}
.hero{padding-top:40px}
h1{letter-spacing:-1.5px}
.intro{font-size:18px;margin-top:22px}
.guide-nav{gap:8px 20px;margin-top:26px;font-size:13px}
.guide-section{padding-top:43px}
.section-heading{margin-bottom:22px}
.profile-options{grid-template-columns:1fr;gap:8px}
.profile-card{padding:13px 16px;align-items:center}
.profile-card input{margin:0}
.profile-card>span{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
.profile-card strong{font-size:14px}
.profile-card small{margin:0;font-size:11px;text-align:right}
.socket-visuals{grid-template-columns:1fr;gap:16px}
.diagram-heading h3{font-size:18px}
.depth-equation{margin-inline:22px}
.depth-equation div>span{font-size:10px}
.depth-equation strong{font-size:30px}
.depth-equation i{display:inline-grid}
.layout-example{grid-template-columns:1fr;gap:24px;padding-top:32px}
.layout-steps{order:-1}
.layout-steps h3{font-size:26px}
.layout-steps ol{gap:15px;margin-top:20px}
.height-workspace{grid-template-columns:1fr;gap:18px}
.height-controls{padding:23px}
.height-controls input[type=range]{margin-bottom:21px}
.height-figure .svg-small{font-size:19px}
.height-figure .svg-label{font-size:15px}
.height-result{gap:21px;justify-content:space-between}
.height-result strong{font-size:35px}
.height-result>div>span{font-size:12px}
.height-result>div:last-child{max-width:60%}
.height-result p{font-size:11px}
.height-key{gap:15px;font-size:11px}
.height-explanation{font-size:14px}
.reference-grid{grid-template-columns:1fr;gap:30px}
.references{margin-top:40px;padding-top:35px}
.references .section-heading h2{font-size:28px}
.guide-footer{align-items:flex-start;flex-direction:column;padding-top:34px}
.button{width:100%}
.guide-footer h2{font-size:28px}
}

@media(max-width:360px){.page-shell{padding:0 16px}
.profile-card{padding:12px}
.profile-card>span{display:block}
.profile-card small{text-align:left;margin-top:3px}
.diagram-heading{padding:19px 16px 0;gap:10px}
.diagram-heading h3{font-size:16px}
.depth-equation{margin-inline:16px;gap:5px}
.depth-equation i{display:none}
.depth-equation div>span{font-size:9px}
.depth-equation strong{font-size:26px}
.height-result{gap:12px}
.result-arrow{font-size:20px}
.height-key{gap:10px;font-size:10px}
.brand{font-size:11px}
.back-link{font-size:13px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*{transition:none!important}
}

/* Connection options: front faces plus the selected internal termination. */
.connection-selector{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:0;border:0;margin:0 0 18px;min-inline-size:0}
.connection-selector legend{font-size:13px;color:var(--muted);margin-bottom:12px}
.connection-choice{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;border:1px solid var(--line);border-radius:12px;background:#171219;padding:13px 10px;cursor:pointer}
.connection-choice input{position:absolute;top:12px;right:12px;accent-color:var(--accent);width:14px;height:14px;margin:0}
.connection-choice img{display:block;width:86px;height:74px;object-fit:contain}
.connection-choice span{font-size:14px;font-weight:600}
.connection-choice:has(input:checked){border-color:#fff28794;background:#fff28709;color:var(--accent)}
.connection-choice:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:4px}
.connection-choice:hover{border-color:#a18c60}
.connection-detail{display:grid;grid-template-columns:1.1fr 1fr;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel)}
.connection-detail+.connection-detail{margin-top:18px}
.connection-details:has(.connection-detail[hidden]) .connection-detail{margin-top:0}
.connection-detail__visual{display:flex;justify-content:center;flex-direction:column;padding:25px 15px;border-right:1px solid var(--line);background:radial-gradient(ellipse at 50% 40%,#51325155,transparent 75%)}
.connection-detail__visual img{width:100%;height:auto;display:block}
.connection-detail__visual figcaption{font-size:12px;text-align:center;padding:15px 12px 0;color:var(--muted)}
.connection-detail__body{padding:28px}
.connection-model{font-size:11px;letter-spacing:1px;color:var(--accent);margin-bottom:12px}
.connection-detail h3{font-size:28px;margin-bottom:19px}
.connection-detail__body>p:not(.connection-model){font-size:15px;line-height:1.7}
.connection-detail__links{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:20px;font-size:13px}
.connection-fit-note{font-size:12px;max-width:940px;line-height:1.7;margin-top:16px;padding-left:17px;border-left:2px solid #a59160}
@media(max-width:900px){.connection-detail{grid-template-columns:1fr 1.1fr}.connection-detail__body{padding:23px}.connection-choice{padding:14px 8px}.connection-choice img{width:72px;height:62px}.connection-choice input{top:9px;right:9px;width:12px;height:12px}.connection-choice span{font-size:13px}}
@media(max-width:760px){.connection-selector{gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.connection-choice{padding:14px 8px}.connection-choice img{width:76px;height:65px}.connection-choice span{font-size:13px}.connection-detail{grid-template-columns:1fr}.connection-detail__visual{padding:26px 10px 20px;border-right:0;border-bottom:1px solid var(--line)}.connection-detail__body{padding:24px}.connection-detail__visual figcaption{font-size:11px;padding-top:8px}.connection-detail__body>p:not(.connection-model){font-size:14px}.connection-detail h3{font-size:26px}.connection-detail__links{font-size:13px}}

/* One connection choice drives the description and both dimension views. */
.connection-detail__body{padding:24px 28px}
.connection-detail h3{margin-bottom:12px}
.connection-detail__links{margin-top:14px}
.connection-detail__visual{padding:18px 15px}
.clearance-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:30px 0 18px;scroll-margin-top:24px}
.clearance-heading .eyebrow{margin-bottom:8px}
.clearance-heading h3{font-size:25px}
.clearance-heading>p{font-size:13px;text-align:right}
.clearance-heading>p span{font-size:11px}
.depth-equation strong{white-space:nowrap;font-size:28px}
.connection-comparison{margin:26px 0 20px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.connection-comparison summary{padding:18px 22px;cursor:pointer;color:var(--text);font-size:15px}
.connection-comparison summary span{display:inline-block;margin-left:15px;color:var(--muted);font-size:12px}
.comparison-scroll{overflow:auto;margin:0 22px 20px}
.connection-comparison table{border-collapse:collapse;width:100%;text-align:left;font-size:14px;min-width:570px}
.connection-comparison caption{text-align:left;font-size:12px;color:var(--muted);padding:0 0 16px;line-height:1.5}
.connection-comparison th,.connection-comparison td{padding:15px 12px;border-top:1px solid var(--line);vertical-align:top}
.connection-comparison thead th{font-size:12px;color:var(--muted);font-weight:400}
.connection-comparison td:last-child{color:var(--accent);white-space:nowrap;font-weight:600}
.connection-comparison small{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-top:4px}
@media(max-width:1000px){.depth-equation strong{font-size:24px}.connection-detail__body{padding:22px}}
@media(max-width:760px){.clearance-heading{display:block;margin-top:26px}.clearance-heading>p{text-align:left;margin-top:10px}.clearance-heading>p br{display:none}.clearance-heading>p span{display:block;margin-top:3px}.clearance-heading h3{font-size:23px}.connection-detail__visual{padding:14px 12px}.connection-detail__visual img{max-width:350px;margin:auto}.connection-detail__visual figcaption{font-size:11px;max-width:290px;margin:auto}.depth-equation strong{font-size:28px}.connection-comparison summary{padding:16px}.connection-comparison summary span{display:block;margin:5px 0 0}.comparison-scroll{margin-inline:16px}}
@media(max-width:360px){.depth-equation strong{font-size:23px}}


/* Internal connection method stays visible beneath every connector type. */
.connection-selector legend span{color:var(--muted);font-size:12px;margin-left:7px}
.connection-choice{text-align:center;justify-content:flex-start}
.connection-choice__method{display:flex;flex-direction:column;justify-content:flex-start;gap:3px;align-self:stretch;border-top:1px solid var(--line);padding-top:10px;margin-top:3px;min-height:49px;font-size:12px;line-height:1.35;color:var(--muted)}
.connection-choice__method b{font-weight:600;color:var(--text)}
.connection-choice__method em{font-style:normal;font-size:11px}
.connection-choice:has(input:checked) .connection-choice__method{border-color:#fff28738}
.connection-choice:has(input:checked) .connection-choice__method b{color:var(--accent)}
@media(max-width:760px){.connection-choice__method{font-size:11px;min-height:48px}.connection-choice__method em{font-size:10px}.connection-selector legend span{display:block;margin:3px 0 0;font-size:11px}}

/* Internal arrangements are selectable, each with an ordering reference. */
.connection-selector legend{color:var(--accent);font-size:12px}
.connection-choice__method{min-height:64px}
.connection-options{margin:22px 0}
.variant-options{border:0;padding:0;margin:0;min-inline-size:0}
.variant-options legend{font-size:13px;color:var(--accent);margin-bottom:13px}
.variant-choices{display:flex;flex-wrap:wrap;gap:9px}
.variant-choice{display:flex;align-items:center;gap:10px;flex:1 1 200px;padding:13px 15px;border:1px solid var(--line);border-radius:9px;background:#18141b;cursor:pointer}
.variant-choice input{accent-color:var(--accent);flex:none;margin:0;width:14px;height:14px}
.variant-choice strong{font:600 13px/1.4 Hanken,sans-serif;display:block}
.variant-choice small{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.variant-choice:has(input:checked){border-color:#fff28790;background:#fff2870a}
.variant-choice:has(input:checked) strong{color:var(--accent)}
.variant-choice:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:3px}
.variant-family-note{font-size:12px;line-height:1.65;margin-top:13px;max-width:990px}
.selected-product{grid-template-columns:180px minmax(0,1fr)}
.selected-product .connection-detail__visual{padding:22px 15px;justify-content:flex-start;align-items:center}
.selected-product .connection-detail__visual img{max-width:140px;height:auto}
.selected-product .connection-detail__visual figcaption{font-size:11px;padding-top:6px}
.selected-product .connection-detail__body{padding:24px 28px}
.selected-product .connection-detail__links{flex-direction:row;flex-wrap:wrap;gap:12px 25px}
.ordering-reference{display:flex;flex-wrap:wrap;align-items:center;gap:9px 17px;margin-top:19px}
.ordering-reference>span{color:var(--muted);font-size:12px}
.ordering-reference code{font:600 18px/1.4 Space,sans-serif;color:var(--accent);overflow-wrap:anywhere}
.ordering-reference button{border:1px solid #66546a;border-radius:6px;background:#302534;color:var(--text);padding:7px 10px;font-size:12px;cursor:pointer;min-height:36px}
.ordering-reference button:hover{border-color:var(--accent)}
.selected-product .order-hint{font-size:12px!important;line-height:1.6!important;margin-top:15px}
.selected-product .mating-reference{font-size:12px!important;line-height:1.6!important;margin-top:12px}
.copy-status:empty{display:none}
.selected-product .copy-status{font-size:12px!important;margin-top:10px;color:var(--accent)}
.selected-assembly{padding:16px 20px;border-left:2px solid #86718d;background:#1a1420;margin-top:15px;font-size:14px;line-height:1.65}
.selected-assembly.has-direction-note{border-color:var(--amber)}
.dimension-sources{font-size:14px;margin-top:20px}
.dimension-sources summary{color:var(--accent);cursor:pointer}
.dimension-sources p{font-size:13px;margin-top:15px}
.connection-comparison table{min-width:750px}
.connection-comparison td:nth-child(2){font-size:12px}
.comparison-help{font-size:12px;margin:0 22px 20px;line-height:1.6}
@media(max-width:900px){.selected-product{grid-template-columns:140px minmax(0,1fr)}.variant-choice{flex-basis:calc(50% - 9px)}}
@media(max-width:760px){.connection-choice__method{min-height:67px}.selected-product{grid-template-columns:1fr}.selected-product .connection-detail__visual{display:none}.selected-product .connection-detail__body{padding:22px}.selected-product h3{font-size:24px}.ordering-reference{gap:9px 14px}.ordering-reference>span{flex-basis:100%}.ordering-reference code{font-size:16px}.ordering-reference button{min-height:40px}.variant-choice{padding:12px;gap:8px}.variant-choice strong{font-size:12px}.variant-choice small{font-size:10px}.variant-family-note{font-size:12px}.selected-assembly{font-size:13px;padding:14px 16px}.comparison-help{margin-inline:16px}}
@media(max-width:360px){.variant-choice{flex-basis:100%}.ordering-reference code{font-size:15px}}

#lead-control { display:block; margin:14px 0; font-size:14px; }
#lead-control[hidden] { display:none; }
#lead-length { display:block; margin-top:8px; max-width:100%; padding:10px; border:1px solid #786c7b; border-radius:8px; background:#28212c; color:#fff; font:inherit; }