:root { --ink:#202527; --muted:#667074; --line:#d9ddde; --wash:#f3f5f5; --accent:#086b6e; font-family:Inter,ui-sans-serif,system-ui,sans-serif; color:var(--ink); background:#fff; }
* { box-sizing:border-box } [hidden] { display:none !important; } body { margin:0; } button,input,textarea { font:inherit } button { cursor:pointer } .shell { width:min(1180px,calc(100% - 48px)); margin:auto } .notice { padding:9px 0; background:var(--ink); color:#eef1f1; font-size:12px; letter-spacing:.04em } .notice span { opacity:.5; margin:0 8px }.site-header { position:sticky; top:0; z-index:2; background:#fff; border-bottom:1px solid var(--line) }.nav { min-height:76px; display:flex; justify-content:space-between; align-items:center; gap:25px }.brand { display:flex; align-items:center; gap:10px; color:inherit; text-decoration:none; font-weight:800; letter-spacing:.12em; font-size:18px }.brand b { display:grid; place-items:center; width:33px; height:33px; color:white; background:var(--accent) }.brand small { display:block; margin-top:2px; color:var(--muted); font-size:7px; letter-spacing:.2em }.nav nav { display:flex; align-items:center; gap:19px; font-size:12px }.nav a,.selection-link { color:inherit; text-decoration:none; border:0; background:none }.selection-link em { display:inline-grid; place-items:center; min-width:19px; height:19px; margin-left:4px; border-radius:50%; color:#fff; background:var(--ink); font-size:10px; font-style:normal }.hero { min-height:580px; display:grid; grid-template-columns:1.15fr .75fr; gap:80px; align-items:center }.eyebrow { margin:0 0 16px; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.16em }.hero h1,.section h2,.workflow h2,.quality h2,.support h2,.dialog-head h2 { margin:0; font-size:clamp(42px,5vw,72px); line-height:.98; letter-spacing:-.06em; font-weight:560 }.lede { max-width:600px; margin:28px 0; color:var(--muted); font-size:17px; line-height:1.65 }.actions { display:flex; gap:10px }.button { display:inline-flex; min-height:46px; align-items:center; justify-content:center; border:1px solid var(--ink); padding:0 18px; color:var(--ink); background:#fff; text-decoration:none; font-size:13px; font-weight:700 }.button.solid { color:#fff; background:var(--ink) }.selection-panel { min-height:330px; padding:28px; border:1px solid var(--line); background:var(--wash) }.selection-panel strong { font-size:25px; letter-spacing:-.03em }.selection-panel p:not(.eyebrow) { color:var(--muted); font-size:13px; line-height:1.55 }.selection-panel ol { min-height:94px; padding:0; list-style:none }.selection-panel li { display:flex; justify-content:space-between; padding:9px 0; border-top:1px solid var(--line); font-size:12px }.selection-panel li button,.text-button { border:0; padding:0; background:none; color:var(--accent); font-size:12px; font-weight:700 }.metrics { border-block:1px solid var(--line); background:var(--wash) }.metric-grid { display:grid; grid-template-columns:repeat(4,1fr) }.metric-grid div { min-height:128px; display:grid; align-content:center; gap:7px; padding-left:25px; border-left:1px solid var(--line) }.metric-grid div:first-child { padding-left:0; border:0 }.metric-grid strong { font-size:27px; letter-spacing:-.04em }.metric-grid span { color:var(--muted); font-size:11px }.section,.support { padding:110px 0 }.section-head { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:38px }.section h2 { font-size:clamp(35px,3.6vw,55px); max-width:700px }.search { display:grid; width:280px; gap:8px; color:var(--muted); font-size:10px; font-weight:700; letter-spacing:.1em }.search input { border:0; border-bottom:1px solid var(--ink); padding:9px 0; outline:0 }.filters { display:flex; flex-wrap:wrap; gap:7px }.filters button { border:1px solid var(--line); padding:9px 12px; background:#fff; font-size:11px }.filters button.active { color:#fff; border-color:var(--ink); background:var(--ink) }.catalog-status { margin:25px 0 13px; color:var(--muted); font-size:12px }.catalog-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line) }.product-card { min-height:250px; display:flex; flex-direction:column; padding:20px; border-right:1px solid var(--line); border-bottom:1px solid var(--line) }.product-code { color:var(--accent); font:700 10px ui-monospace,monospace; letter-spacing:.04em }.product-card h3 { margin:35px 0 7px; font-size:17px; letter-spacing:-.025em }.product-meta,.product-description { margin:0; color:var(--muted); font-size:11px; line-height:1.55 }.product-description { margin-top:13px }.card-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:18px }.mode { color:var(--muted); font-size:10px }.add-button { border:1px solid var(--ink); padding:8px 10px; background:#fff; font-size:10px; font-weight:700 }.add-button:disabled { border-color:var(--line); color:var(--muted); background:var(--wash) }.workflow { padding:110px 0; background:var(--ink); color:#fff }.workflow h2 { max-width:880px; font-size:clamp(37px,4vw,58px) }.workflow .eyebrow { color:#bbc2c3 }.steps { display:grid; grid-template-columns:repeat(3,1fr); margin-top:55px; border-top:1px solid #596264; border-left:1px solid #596264 }.steps article { min-height:220px; padding:22px; border-right:1px solid #596264 }.steps span { color:#aab4b5; font-size:10px }.steps h3 { margin:72px 0 10px; font-size:22px }.steps p,.support p { color:#aeb6b8; font-size:13px; line-height:1.6 }.quality { padding:110px 0; background:var(--wash) }.quality-grid { display:grid; grid-template-columns:1fr .85fr; gap:100px }.quality h2 { font-size:clamp(34px,3.5vw,53px) }.quality dl { margin:0 }.quality dl div { display:grid; grid-template-columns:1fr 1.2fr; padding:15px 0; border-top:1px solid var(--line); font-size:12px }.quality dt { color:var(--muted) }.quality dd { margin:0; font-weight:700 }.support { max-width:850px; margin-left:max(24px,calc((100% - 1180px)/2)) }.support h2 { font-size:clamp(38px,4vw,58px) }.support p { max-width:640px; color:var(--muted) }footer { padding:22px 0; border-top:1px solid var(--line); color:var(--muted); font-size:11px } footer .shell { display:flex; justify-content:space-between } dialog { width:min(570px,calc(100% - 30px)); border:1px solid var(--line); box-shadow:0 25px 70px #0005 } dialog::backdrop { background:#15202288 } #rfq-form { display:grid; gap:16px; padding:25px }.dialog-head { display:flex; justify-content:space-between; gap:20px; margin-bottom:5px }.dialog-head h2 { font-size:32px }.close { border:0; background:none; font-size:27px }#rfq-form label { display:grid; gap:7px; color:var(--muted); font-size:11px; font-weight:700 }#rfq-form input,#rfq-form textarea { border:1px solid var(--line); padding:11px; color:var(--ink) }#rfq-form textarea { min-height:100px; resize:vertical }.form-error { min-height:18px; margin:0; color:#a32727; font-size:12px }.form-error.success { color:var(--accent) }#rfq-submit:disabled { opacity:.5; cursor:not-allowed }@media (max-width:800px) { .nav nav a { display:none }.hero,.quality-grid { grid-template-columns:1fr; gap:35px }.hero { padding:70px 0 }.metric-grid,.catalog-grid,.steps { grid-template-columns:1fr 1fr }.metric-grid div:nth-child(3) { padding-left:0; border-left:0 }.section-head { display:block }.search { width:100%; margin-top:26px }.product-card { min-height:220px } }@media (max-width:520px) { .shell { width:min(100% - 30px,1180px) }.nav { min-height:65px }.notice { font-size:10px }.metric-grid,.catalog-grid,.steps { grid-template-columns:1fr }.metric-grid div { padding-left:0; border-left:0; border-bottom:1px solid var(--line) }.quality,.section,.workflow,.support { padding:72px 0 }footer .shell { gap:10px; flex-direction:column } }
