:root{
  --ink:#0c1425; --ink2:#16304f; --accent:#f5a609; --accent-d:#d98d03;
  --green:#17a34a; --green-d:#128a3e; --bg:#edf0f4; --card:#ffffff;
  --line:#dde3ea; --text:#1c2733; --muted:#64748b; --link:#0a58c9;
  --shadow-sm:0 1px 2px rgba(16,24,40,.05),0 4px 14px -6px rgba(16,24,40,.12);
  --shadow-md:0 2px 4px rgba(16,24,40,.06),0 14px 30px -12px rgba(16,24,40,.25);
  --r:14px;
}
*{box-sizing:border-box}
::selection{background:#ffe1a1}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;margin:0;color:var(--text);background:var(--bg);line-height:1.55;-webkit-font-smoothing:antialiased}
.wrap{max-width:1140px;margin:0 auto;padding:0 18px}
a{color:var(--link)}

/* ---------- header ---------- */
.site-header{background:linear-gradient(100deg,#0a1120 0%,#12263f 60%,#173a5e 100%);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 4px 18px rgba(7,12,22,.35)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:12px;padding-bottom:12px;flex-wrap:wrap;gap:10px}
.logo{color:#fff;text-decoration:none;font-weight:800;font-size:21px;letter-spacing:.4px;display:flex;align-items:center;gap:10px}
.logo-mark{background:var(--accent);color:#131a26;font-weight:900;border-radius:9px;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;font-size:19px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.18)}
.logo small{display:block;font-size:11px;font-weight:600;color:#9fb6cf;letter-spacing:1.6px;text-transform:uppercase;line-height:1.1}
.logo b{line-height:1.05}
.site-header nav{display:flex;flex-wrap:wrap;gap:2px}
.site-header nav a{color:#cfdcee;text-decoration:none;font-size:14.5px;font-weight:600;padding:7px 12px;border-radius:999px;transition:.15s}
.site-header nav a:hover{color:#fff;background:rgba(255,255,255,.12)}

main.wrap{padding-top:24px;padding-bottom:44px}
h1{font-size:29px;margin:10px 0 10px;line-height:1.2;letter-spacing:-.2px}
h2{font-size:21px;margin:28px 0 12px;font-weight:800;letter-spacing:-.2px}
.box h2:first-child,.hero + .box h2:first-child{margin-top:2px}
h2.fam{font-size:18px;color:#374151;border-bottom:2px solid var(--line);padding-bottom:6px}
h3{font-size:16px;margin:16px 0 4px}
.lead{font-size:16.5px;color:#3c4c5f;max-width:780px}
.muted{color:var(--muted);font-size:14px}

/* ---------- hero (homepage) ---------- */
.hero{background:radial-gradient(900px 340px at 85% -60px,rgba(245,166,9,.28),transparent 60%),linear-gradient(115deg,#0a1120 0%,#12263f 55%,#1a4066 100%);color:#fff;border-radius:20px;padding:38px 36px 30px;margin:6px 0 20px;box-shadow:var(--shadow-md)}
.hero-badge{display:inline-block;border:1.5px solid rgba(245,166,9,.75);color:#ffcf6b;border-radius:999px;padding:4px 14px;font-size:12.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase}
.hero h1{color:#fff;font-size:40px;margin:16px 0 10px;line-height:1.12;letter-spacing:-.5px}
.hero h1 .hl{color:var(--accent)}
.hero-lead{color:#c3d3e6;font-size:17px;max-width:720px;margin:0 0 22px}
.hero-search{background:#fff;border-radius:14px;padding:7px;display:flex;gap:8px;box-shadow:0 14px 34px -10px rgba(0,0,0,.45)}
.hero-search input{flex:1;min-width:200px;border:0;outline:0;padding:12px 14px;font-size:16.5px;color:var(--text);background:transparent}
.hero-search button{border:0;border-radius:10px;background:var(--accent);color:#181f2a;font-size:16.5px;font-weight:800;padding:12px 30px;cursor:pointer;transition:.15s}
.hero-search button:hover{background:var(--accent-d);color:#fff}
.hero-stats{display:flex;flex-wrap:wrap;gap:14px 38px;margin-top:24px}
.hero-stats .stat b{display:block;font-size:24px;color:#fff;line-height:1.1}
.hero-stats .stat span{font-size:13px;color:#93a9c2;letter-spacing:.4px}

/* ---------- category tiles ---------- */
.cat-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0 4px}
.cat-tile{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;text-decoration:none;color:var(--text);box-shadow:var(--shadow-sm);transition:.16s;display:block}
.cat-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:#c3cede}
.cat-tile .ic{width:44px;height:44px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:900;letter-spacing:.5px;margin-bottom:10px;color:#5b4636}
.cat-tile .nm{font-weight:800;font-size:17px}
.cat-tile .ct{color:var(--muted);font-size:13.5px}
.cat-tile .go{color:var(--accent-d);font-weight:700;font-size:13.5px;margin-top:6px;display:inline-block}
.ic-engine{background:#fff1e2;color:#b35c00}.ic-chassis{background:#e3eefc;color:#1c5fa8}.ic-body{background:#e2f6e5;color:#22763a}.ic-elec{background:#f3e4fb;color:#7d2ba0}

/* ---------- generic boxes & forms ---------- */
.box{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;margin:18px 0;box-shadow:var(--shadow-sm)}
.search-form{display:flex;gap:10px;flex-wrap:wrap}
.search-form input{flex:1;min-width:240px;padding:12px 14px;border:1.5px solid #cbd5e1;border-radius:10px;font-size:16px;outline:0}
.search-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(245,166,9,.25)}
.search-form button,.filter-form button{padding:12px 24px;border:0;border-radius:10px;background:var(--ink);color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:.15s}
.search-form button:hover,.filter-form button:hover{background:var(--ink2)}
.filter-form{display:flex;gap:14px;flex-wrap:wrap;align-items:end;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow-sm)}
.filter-form label{display:flex;flex-direction:column;font-size:13px;font-weight:600;color:#4b5563;gap:4px}
.filter-form select{padding:9px 10px;border:1.5px solid #cbd5e1;border-radius:9px;font-size:15px}

/* ---------- product cards ---------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:16px;margin:12px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:7px;box-shadow:var(--shadow-sm);transition:.16s;position:relative;overflow:hidden}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--accent),#f7c948)}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:#c3cede}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.card-cat{font-size:11.5px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;color:#8494a7}
.card-oe{color:var(--ink);font-weight:800;font-size:19px;text-decoration:none;letter-spacing:.2px;line-height:1.15}
.card-oe:hover{color:var(--link)}
.card-name{font-size:14.5px;font-weight:600;color:#33475b;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{color:#54687c;font-size:13px}
.card-meta .pill{background:#eef3f8;border-radius:999px;padding:1px 9px;margin-right:5px;display:inline-block}
.card-fit{font-size:13.5px;color:#43566b;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card-cross{color:#8595a7;font-size:12.5px}
.badge{align-self:flex-start;background:#fff3d1;color:#8a5a00;border:1px solid #f0d48a;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:700}
.badge-src{background:#fff3d1;color:#8a5a00}
.btn-quote{display:inline-block;background:linear-gradient(180deg,#1db85a,#149a47);color:#fff!important;padding:11px 18px;border-radius:10px;text-decoration:none;font-weight:700;border:0;cursor:pointer;margin-top:auto;align-self:flex-start;font-size:15px;box-shadow:0 6px 14px -6px rgba(20,154,71,.55);transition:.15s;text-align:center}
.card .btn-quote{align-self:stretch}
.btn-quote.big{font-size:16.5px;padding:13px 30px}
.btn-quote:hover{background:linear-gradient(180deg,#17a34a,#128a3e);transform:translateY(-1px)}
.btn-secondary{display:inline-block;border:1.5px solid var(--link);color:var(--link);padding:9px 16px;border-radius:10px;text-decoration:none;font-weight:700;background:#fff}
.btn-secondary:hover{background:#eef4fd}

/* ---------- chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 4px}
.chip{display:inline-block;background:#fff;color:#24344a;border:1px solid #c9d4e0;border-radius:999px;padding:5px 13px;font-size:13.5px;font-weight:600;text-decoration:none;transition:.13s}
.chip:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* ---------- part page ---------- */
.crumbs{color:var(--muted);font-size:13.5px;margin-bottom:8px}
.crumbs a{color:var(--link);text-decoration:none;font-weight:600}
.spec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:16px 0}
.spec{background:#fff;border:1px solid var(--line);border-top:4px solid var(--ink2);border-radius:12px;padding:12px 15px;box-shadow:var(--shadow-sm)}
.spec span{display:block;color:var(--muted);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;margin-bottom:3px}
.spec b{font-size:16.5px}
.table-scroll{overflow-x:auto;border-radius:12px;box-shadow:var(--shadow-sm)}
.fit-table{border-collapse:collapse;width:100%;background:#fff}
.fit-table th,.fit-table td{border-bottom:1px solid var(--line);padding:10px 13px;text-align:left;font-size:14.5px;vertical-align:top}
.fit-table th{background:var(--ink);color:#fff;font-weight:700;border-bottom:0}
.fit-table tbody tr:nth-child(even){background:#f7fafc}
.fit-table tbody tr:hover{background:#fff6e0}
.cross-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
.cross-list a{background:#eef3f8;border:1px solid #d5dfea;border-radius:9px;padding:6px 13px;text-decoration:none;color:var(--link);font-weight:700}
.cross-list a:hover{background:#dfeafb}
.notice{background:#fffaf0;border:1px solid #f0d48a;border-left:5px solid var(--accent);border-radius:12px;padding:15px 17px;margin:16px 0}
.warn{background:#fef2f2;border:2px solid #dc2626;color:#7f1d1d;border-radius:12px;padding:14px 16px;margin:14px 0}
.quote-box{background:linear-gradient(180deg,#f2fdf5,#ffffff);border:1.5px solid #a7e8bd}
.faq{background:#fff;border:1px solid var(--line);border-radius:14px;padding:6px 20px;box-shadow:var(--shadow-sm)}
.faq h3{color:var(--ink);margin:16px 0 3px}
.faq p{margin-top:2px;color:#3c4c5f}

/* ---------- forms ---------- */
.inquiry-form{display:grid;grid-template-columns:1fr 1fr;gap:13px;max-width:740px}
.inquiry-form label{display:flex;flex-direction:column;font-size:13px;font-weight:600;color:#4b5563;gap:5px}
.inquiry-form label.full{grid-column:1/-1}
.inquiry-form input,.inquiry-form textarea{padding:11px 12px;border:1.5px solid #cbd5e1;border-radius:10px;font-size:15px;outline:0;font-family:inherit}
.inquiry-form input:focus,.inquiry-form textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(245,166,9,.22)}
.inquiry-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.errors{color:#b91c1c}
.ref{font-size:20px;color:var(--green)}

/* ---------- pager / footer ---------- */
.pager{display:flex;gap:6px;flex-wrap:wrap;margin:22px 0}
.pager a,.pager .cur{padding:7px 13px;border-radius:9px;text-decoration:none;font-weight:600}
.pager a{background:#fff;border:1px solid #cbd5e1;color:var(--link)}
.pager a:hover{border-color:var(--ink);color:var(--ink)}
.pager .cur{background:var(--ink);color:#fff}
.site-footer{background:linear-gradient(100deg,#0a1120,#12263f);color:#9db1c7;margin-top:36px}
.site-footer .wrap{padding-top:30px;padding-bottom:14px;font-size:14px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:26px}
.site-footer h4{color:#fff;margin:0 0 10px;font-size:15px;letter-spacing:.4px}
.site-footer a{color:#c3d3e6;text-decoration:none;display:block;padding:3px 0}
.site-footer a:hover{color:#fff}
.site-footer .brandline{font-size:19px;font-weight:800;color:#fff;letter-spacing:.4px}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:22px;padding-top:12px;font-size:12.5px;color:#7e93ab}
.result{margin-top:12px}

@media (max-width:860px){ .cat-tiles{grid-template-columns:repeat(2,1fr)} .foot-grid{grid-template-columns:1fr 1fr} }
@media (max-width:640px){
  .inquiry-form{grid-template-columns:1fr}
  h1{font-size:24px}
  .hero{padding:26px 20px 22px}
  .hero h1{font-size:29px}
  .hero-search{flex-direction:column}
  .hero-search button{width:100%}
  .site-header nav a{margin-left:0;padding:6px 9px}
  .cat-tiles{grid-template-columns:1fr}
}
.pager .gap{padding:7px 2px;color:var(--mut);font-weight:700}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.catbar{margin:14px 0 4px}
