.fastener-page{background:#edf2f4;color:#0c1a27}
.fastener-intro{padding:62px clamp(20px,7vw,110px) 52px;background:#07101a;color:#fff;display:flex;justify-content:space-between;align-items:end;gap:40px}
.fastener-intro h1{font-size:clamp(40px,6vw,78px);line-height:.94;letter-spacing:-.065em;margin:0}.fastener-intro h1 em{font-family:Georgia,serif;font-weight:400}.fastener-intro>p{max-width:430px;margin:0;color:#b8c8d3;font-size:14px;line-height:1.7}
.fastener-catalogue{padding:38px clamp(20px,5vw,82px) 90px}.fastener-toolbar{display:flex;justify-content:flex-end;margin-bottom:18px}.fastener-toolbar input{width:min(100%,370px);padding:13px 15px;border:1px solid #b9c7cf;background:#fff;color:#10283d;font:12px var(--mono);outline:none}.fastener-toolbar input:focus{border-color:#1686fa;box-shadow:0 0 0 3px rgba(22,134,250,.12)}
.fastener-layout{display:grid;grid-template-columns:270px 1fr;gap:24px}.fastener-groups{display:flex;flex-direction:column;gap:8px}.fastener-groups button{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:17px 16px;border:1px solid #c4d0d6;background:#f7f9fa;color:#243c4e;text-align:left;cursor:pointer}.fastener-groups button:hover,.fastener-groups button.is-active{background:#145fc5;border-color:#145fc5;color:#fff}.fastener-groups strong{font-size:14px}.fastener-groups span{font:9px var(--mono);white-space:nowrap;opacity:.75}
.fastener-panel{background:#fff;border:1px solid #c4d0d6}.fastener-panel-head{min-height:105px;padding:22px 26px;display:flex;align-items:end;justify-content:space-between;gap:25px;border-bottom:1px solid #c4d0d6}.fastener-panel-head h2{margin:0 0 7px;font-size:30px;letter-spacing:-.045em}.fastener-panel-head p{margin:0;color:#667b8a;font-size:12px}.fastener-panel-head>span{font:10px var(--mono);color:#145fc5;white-space:nowrap}
.fastener-table-wrap{overflow-x:auto}.fastener-table{width:100%;border-collapse:collapse}.fastener-table th{padding:13px 18px;background:#e8eef2;text-align:left;color:#607584;font:9px var(--mono);letter-spacing:.1em}.fastener-table td{padding:15px 18px;border-top:1px solid #d8e1e6;font-size:13px}.fastener-table td:first-child{width:55px;color:#8a9aa5;font:10px var(--mono)}.fastener-table td:nth-child(2){width:230px}.fastener-table td strong{font:700 12px var(--mono);color:#145fc5}.fastener-table tr:hover td{background:#f4f8fb}.fastener-table .empty-row{text-align:center;padding:45px;color:#718493}
@media(max-width:760px){.fastener-intro{padding:45px 20px 38px;display:block}.fastener-intro>p{margin-top:24px}.fastener-catalogue{padding:24px 20px 65px}.fastener-toolbar input{width:100%}.fastener-layout{grid-template-columns:1fr}.fastener-groups{display:grid;grid-template-columns:1fr 1fr}.fastener-groups button{padding:13px 12px}.fastener-panel-head{align-items:flex-start;flex-direction:column}.fastener-table th,.fastener-table td{padding:13px 12px}.fastener-table td:nth-child(2){width:auto}}