/* Inner pages in the redesign's look (2026-09-28). Tokens match the homepage:
   navy #0A2A6B, ink #0E1424, body #3B4457, muted #5B6478, line #E3E6EC, bg #F7F8FA.
   Loaded after bootstrap.css (kept for grid/form classes) and the homepage's base styles. */

a:hover, a:focus { text-decoration: none; }
img { max-width: 100%; height: auto; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.screen-reader-text:focus { clip: auto; width: auto; height: auto; z-index: 100; top: 8px; left: 8px; background: #fff; padding: 8px 12px; border-radius: 6px; }

/* Layout: same 1200px / 32px frame as the homepage sections */
.site-content { padding: clamp(48px, 6vw, 80px) 0 clamp(56px, 7vw, 96px); }
.site-content > .container { width: auto; max-width: 1200px; padding: 0 32px; margin: 0 auto; }
.site-content .content-left-wrap { float: none; width: auto; padding: 0; }
.site-content .entry-content { max-width: 860px; }

/* Type */
.site-content, .site-content p, .site-content li { font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', system-ui, sans-serif; font-size: 17px; line-height: 1.65; color: #3B4457; }
.site-content .entry-header { margin: 0 0 28px; }
.site-content h1.entry-title { margin: 0; font-family: 'Manrope', 'Manrope Fallback', sans-serif; font-weight: 800; font-size: clamp(34px, 4.4vw, 52px); line-height: 1.08; letter-spacing: -0.03em; color: #0E1424; text-wrap: pretty; }
.site-content h2 { margin: 44px 0 14px; font-family: 'Manrope', 'Manrope Fallback', sans-serif; font-weight: 800; font-size: clamp(24px, 2.6vw, 30px); line-height: 1.2; letter-spacing: -0.02em; color: #0E1424; }
.site-content h3 { margin: 28px 0 8px; font-family: 'Manrope', 'Manrope Fallback', sans-serif; font-weight: 700; font-size: 19px; line-height: 1.3; color: #0E1424; }
.site-content p { margin: 0 0 16px; }
.site-content ul, .site-content ol { padding-left: 22px; margin: 0 0 16px; }
.site-content li { margin-bottom: 8px; }
.site-content strong { color: #0E1424; font-weight: 600; }
.site-content .entry-content a { color: #0A2A6B; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(10, 42, 107, 0.35); }
.site-content .entry-content a:hover { color: #06183F; text-decoration-color: currentColor; }
.site-content p.geo-summary { font-size: 19px !important; line-height: 1.6; color: #0E1424; }
.site-content em { color: #5B6478; }

/* Tables (comparison pages, supply tracking, mall comparison) */
.site-content table { width: 100%; border-collapse: collapse; margin: 8px 0 24px; font-size: 15px; background: #fff; border: 1px solid #E3E6EC; border-radius: 10px; overflow: hidden; }
.site-content th, .site-content td { padding: 12px 16px; border-top: 1px solid #E3E6EC; text-align: left; vertical-align: top; line-height: 1.5; color: #3B4457; }
.site-content thead th, .site-content tr:first-child th { border-top: 0; background: #F7F8FA; font-family: 'Manrope', 'Manrope Fallback', sans-serif; font-weight: 700; font-size: 14px; color: #0E1424; }
@media (max-width: 700px) { .site-content table { display: block; overflow-x: auto; } }

/* Testimonials */
.site-content blockquote { margin: 0 0 20px; padding: 4px 0 4px 20px; border-left: 3px solid #0A2A6B; font-size: 17px; }
.site-content blockquote p { color: #0E1424; }
.site-content blockquote p:last-child { font-size: 15px; color: #5B6478; margin-bottom: 0; }

/* Mall page enquiry form (kept, restyled as a card) */
.contact-us { max-width: 1200px; margin: 0 auto 72px; padding: 0 32px; }
.contact-us > .container { width: auto; max-width: none; padding: clamp(28px, 4vw, 44px); background: #fff; border: 1px solid #E3E6EC; border-radius: 10px; }
.contact-us .section-header h2, .contact-us .white-text { margin: 0 0 20px; font-family: 'Manrope', 'Manrope Fallback', sans-serif; font-weight: 800; font-size: clamp(24px, 2.6vw, 30px); color: #0E1424 !important; text-align: left; }
.contact-us .form-control { height: 46px; margin-bottom: 14px; border: 1px solid #C9CFD9; border-radius: 6px; box-shadow: none; font-size: 15px; color: #0E1424; }
.contact-us textarea.form-control { height: auto; min-height: 120px; }
.contact-us .form-control:focus { border-color: #0A2A6B; box-shadow: 0 0 0 3px rgba(10, 42, 107, 0.12); }
.contact-us [style*="color: white"] { color: #0E1424 !important; }
.contact-us .custom-button, .contact-us .red-btn { background: #0A2A6B; border: 0; color: #fff; padding: 13px 24px; border-radius: 6px; font-family: 'Manrope', 'Manrope Fallback', sans-serif; font-weight: 700; font-size: 15px; }
.contact-us .custom-button:hover, .contact-us .red-btn:hover { background: #06183F; }
.contact-us .custom-button[disabled] { opacity: 0.55; }
/* Form layout: the old theme positioned these with <br>s, floats and a -304px margin; lay out with flex instead */
.contact-us .row { margin: 0; }
.contact-us .contact-form { display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; }
.contact-us .contact-form > div[class*="col-"] { float: none; padding: 0; width: auto; min-height: 0; }
.contact-us .contact-form > .col-lg-4 { flex: 1 1 220px; }
.contact-us .contact-form > .col-lg-2 { flex: 0 0 120px; }
.contact-us .contact-form > .col-lg-2:last-of-type { flex: 0 0 160px; }
.contact-us .contact-form > .col-lg-1 { flex: 0 0 auto; width: auto !important; margin: 0 0 14px !important; font-style: normal !important; font-weight: 700; }
.contact-us .contact-form br { display: none; }
.contact-us #captcha-error-message { flex: 1 0 100%; order: 9; margin: 0 0 12px !important; padding: 0; border-radius: 6px; font-size: 14px; }
.contact-us #captcha-error-message:not(:empty) { padding: 8px 12px; }
.contact-us .contact-form > button { order: 10; margin-top: 4px; }
@media (max-width: 600px) {
  .contact-us .contact-form > .col-lg-2 { flex: 0 0 84px; }
  .contact-us .contact-form > .col-lg-2:last-of-type { flex: 1 0 100%; }
}