/* ============================================================
   RFQ / Contact — Contact Sales page (cs-)
   Container width matches the homepage (.lem2-container = 90%),
   so content, header and footer share the same left/right edge.
   All selectors are prefixed with cs- to avoid clashing with the
   global site CSS.
   ============================================================ */

.cs-page { --cs-blue:#0860cb; --cs-blue-dark:#004ca9; --cs-navy:#102743; --cs-muted:#64738a; --cs-line:#dbe5ef;
  color:var(--cs-navy); background:#fbfcfe; line-height:1.55;
  font-family:Inter,"Segoe UI",Arial,sans-serif; overflow-x:hidden; }
.cs-page a { text-decoration:none; }
.cs-page h2, .cs-page h3 { color:#102947; }

/* ---------- Breadcrumb strip (same look as About pages) ---------- */
.cs-crumbbar { background:#fff; border-bottom:1px solid #eceff3; padding:11px 0; }
.cs-crumb { font-size:12.5px; color:#6b7280; display:flex; align-items:center; flex-wrap:wrap; }
.cs-crumb a { color:#6b7280; text-decoration:none; }
.cs-crumb a:hover { color:#0055a4; text-decoration:none; }
.cs-crumb .fa-house { font-size:11px; color:#4b5563; margin-right:8px; }
.cs-crumb .fa-angle-right { margin:0 9px; font-size:10px; color:#9ca3af; }
.cs-crumb-current { color:#1f2937; font-weight:700; }

/* ---------- Hero banner ---------- */
.cs-hero { background:linear-gradient(100deg,#123a60 0%,#1a4a78 55%,#2a5c8b 100%); color:#fff; padding:36px 0; }
.cs-hero h1 { color:#fff; font-size:32px; line-height:1.15; margin:0 0 8px; letter-spacing:-.6px; }
.cs-hero p { margin:0; font-size:15px; color:#d8e6f5; }

/* ---------- Layout ---------- */
.cs-main { padding:26px 0 34px; }
.cs-layout { display:grid; grid-template-columns:1.62fr 1fr; gap:20px; align-items:start; }
.cs-panel { border:1px solid var(--cs-line); border-radius:8px; background:#fff; padding:26px 28px; }
.cs-panel h2 { font-size:25px; margin:0 0 8px; }
.cs-panel > p { margin:0 0 22px; font-size:14px; color:var(--cs-muted); }

/* ---------- Inquiry form ---------- */
.cs-fields { display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
.cs-field { margin-bottom:20px; }
.cs-field label { display:block; font-size:13px; font-weight:700; margin-bottom:8px; color:#1c3350; }
.cs-field .cs-req { color:#d93c51; display:inline; }
.cs-field input, .cs-field select, .cs-field textarea { display:block; width:100%; box-sizing:border-box; border:1px solid #cbd8e8; border-radius:5px; background:#fbfcfe; padding:11px 13px; font-size:14px; color:#18324e; font-family:inherit; outline:none; }
.cs-field input:focus, .cs-field select:focus, .cs-field textarea:focus { border-color:#2774d6; box-shadow:0 0 0 3px #2774d61f; background:#fff; }
.cs-field textarea { min-height:132px; resize:vertical; line-height:1.5; }
.cs-select-wrap { position:relative; }
.cs-select-wrap > i { position:absolute; top:50%; transform:translateY(-50%); color:#7c8ea6; pointer-events:none; }
.cs-select-wrap > .fa-globe { left:13px; font-size:13px; }
.cs-select-wrap > .fa-chevron-down { right:13px; font-size:10px; }
.cs-select-wrap select { -webkit-appearance:none; -moz-appearance:none; appearance:none; padding-left:13px; padding-right:34px; cursor:pointer; }
.cs-select-wrap.has-lead select { padding-left:36px; }
.cs-hint { font-size:12px; color:#6e8198; margin-top:6px; }
.cs-page .cs-btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; border:1px solid var(--cs-blue); background:var(--cs-blue); color:#fff; border-radius:7px; padding:13px 26px; font-family:inherit; font-size:14px; font-weight:700; cursor:pointer; transition:.15s; }
.cs-page .cs-btn:hover { background:var(--cs-blue-dark); border-color:var(--cs-blue-dark); color:#fff; }

/* ---------- Sidebar ---------- */
.cs-aside { display:flex; flex-direction:column; gap:16px; }
.cs-aside .cs-panel { padding:20px 22px; }
.cs-aside h3 { font-size:18px; margin:0; }
.cs-aside p { margin:4px 0 0; font-size:13px; color:var(--cs-muted); }
.cs-a-title { display:flex; align-items:center; gap:13px; margin-bottom:14px; }
.cs-icon { width:44px; height:44px; flex:0 0 44px; border-radius:50%; background:#e9f2fd; color:var(--cs-blue); display:grid; place-items:center; font-size:17px; }
.cs-detail { display:grid; gap:10px; font-size:13.5px; color:#31455f; word-break:break-word; padding-left:57px; }
.cs-detail a { color:var(--cs-blue); }
.cs-detail a:hover { text-decoration:underline; }
.cs-detail i { color:var(--cs-blue); width:15px; display:inline-block; }
.cs-company strong { display:block; font-size:13.5px; color:#102947; margin-bottom:5px; }
.cs-support { background:#eef5fd; border-color:#d3e4f8 !important; }

/* Product line contacts (kept from the previous contact page) */
.cs-lines { list-style:none; margin:0; padding:0 0 0 57px; display:grid; gap:9px; font-size:13.5px; }
.cs-lines li { display:flex; justify-content:space-between; align-items:center; gap:10px; border-bottom:1px dashed #e2ebf6; padding-bottom:8px; }
.cs-lines li:last-child { border-bottom:0; padding-bottom:0; }
.cs-lines span { color:#31455f; }
.cs-lines a { color:var(--cs-blue); font-weight:600; }

/* ---------- Responsive ---------- */
@media (max-width:1000px) {
  .cs-layout { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .cs-fields { grid-template-columns:1fr; gap:0; }
  .cs-panel { padding:20px; }
  .cs-hero { padding:28px 0; }
  .cs-hero h1 { font-size:26px; }
  .cs-hero p { font-size:14px; }
  .cs-lines { font-size:13px; }
}
