@charset "UTF-8";
/* =====================================================================
   Life Care Systems — site theme
   One stylesheet, authored against the site's actual markup.
   Loaded after bootstrap.min.css (v3 grid only); replaces the old
   style.css / style2.css / style_common.css / custom.css / bootstrap2.css
   ===================================================================== */

/* ---------------------------------------------------------------
   1. Tokens
   --------------------------------------------------------------- */
:root {
  /* brand — taken from the logo mark */
  --navy-900: #06172e;
  --navy-800: #0b2545;
  --navy-700: #12305a;
  --navy-600: #1b3f7a;
  --blue-600: #0b5cab;
  --blue-500: #1877d1;
  --blue-100: #e6f0fb;
  --blue-50:  #f3f8fd;

  --orange-600: #d1450b;
  --orange-500: #ea5514;
  --orange-100: #fdeee6;

  --ink-900: #101a26;
  --ink-700: #2d3d50;
  --ink-500: #5b6b7d;
  --ink-400: #7c8b9c;
  --line:    #e2e8f0;
  --line-soft:#eef2f6;
  --surface: #ffffff;
  --surface-2: #f6f8fb;
  --surface-3: #eef3f8;

  --radius-sm: 8px;
  --radius:    12px;
  --radius-lg: 20px;

  --shadow-xs: 0 1px 2px rgba(11,37,69,.06);
  --shadow-sm: 0 2px 8px rgba(11,37,69,.07);
  --shadow-md: 0 8px 24px rgba(11,37,69,.09);
  --shadow-lg: 0 18px 48px rgba(11,37,69,.14);

  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --header-h: 76px;
  --maxw: 1240px;
}

/* Persistent WhatsApp contact with a compact mobile treatment. */
.lcs-whatsapp-float {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 108;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 0 18px 0 14px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 999px;
  background: #087f5b;
  color: #fff !important;
  font: 700 14px/1 Inter, Arial, sans-serif;
  text-decoration: none !important;
  box-shadow: 0 14px 34px rgba(4, 61, 45, .26), 0 3px 10px rgba(4, 61, 45, .18);
  transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.lcs-whatsapp-float:hover,
.lcs-whatsapp-float:focus-visible {
  background: #066c4d;
  color: #fff !important;
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(4, 61, 45, .3), 0 4px 12px rgba(4, 61, 45, .2);
}
.lcs-whatsapp-float:focus-visible { outline: 3px solid rgba(8,127,91,.28); outline-offset: 3px; }
.lcs-whatsapp-float svg { display: block; width: 25px; height: 25px; flex: 0 0 auto; }

@media (max-width: 767px) {
  .lcs-whatsapp-float {
    right: 14px;
    bottom: 76px;
    width: 52px;
    min-height: 52px;
    padding: 0;
    justify-content: center;
  }
  .lcs-whatsapp-float span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  body:not(.has-mobile-rfq) .lcs-whatsapp-float { bottom: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .lcs-whatsapp-float { transition: none; }
}

/* ---------------------------------------------------------------
   2. Base
   --------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--surface-2);
  color: var(--ink-700);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.7;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

body, button, input, select, textarea { font-family: var(--sans); }
p, li, h1, h2, h3, h4, h5, h6, a, span { overflow-wrap: break-word; }

img { max-width: 100%; height: auto; border: 0; vertical-align: middle; }

a { color: var(--blue-600); text-decoration: none; transition: color .18s ease; }
a:hover, a:focus { color: var(--orange-500); text-decoration: none; }

:focus-visible { outline: 3px solid rgba(24,119,209,.45); outline-offset: 2px; border-radius: 4px; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--sans);
  color: var(--navy-800);
  font-weight: 700;
  letter-spacing: -.015em;
  line-height: 1.22;
  margin: 0 0 .6em;
}
h1 { font-size: clamp(30px, 4vw, 44px); font-weight: 800; }
h2 { font-size: clamp(24px, 3vw, 32px); }
h3 { font-size: clamp(19px, 2.2vw, 23px); }
h4 { font-size: 17px; }

p { margin: 0 0 1.05em; }
p:last-child { margin-bottom: 0; }

hr { border: 0; border-top: 1px solid var(--line); margin: 32px 0; }

strong, b { font-weight: 700; color: var(--navy-800); }

ul, ol { margin: 0 0 1.05em; padding-left: 1.15em; }
li { margin-bottom: .35em; }

/* Legacy pages set font-family / colours inline (Tahoma, Verdana …).
   Neutralise only the font, keep everything else authorable. */
[style*="Tahoma"], [style*="tahoma"],
[style*="Verdana"], [style*="verdana"],
[style*="Arial"] { font-family: var(--sans) !important; }

/* the old markup marks section leads with an inline orange underline.
   Inline inside a sentence it stays inline; standing on its own it becomes
   a proper section heading. */
[style*="border-bottom:2px solid #e93d00"],
[style*="border-bottom: 2px solid #e93d00"] {
  color: var(--navy-800) !important;
  font-weight: 700;
  border-bottom: 2px solid var(--orange-500) !important;
  padding-bottom: 1px;
}
.middle_center > [style*="border-bottom:2px solid #e93d00"],
.middle_center > [style*="border-bottom: 2px solid #e93d00"],
.middle_center > p > [style*="border-bottom:2px solid #e93d00"]:only-child,
.middle_center > p > [style*="border-bottom: 2px solid #e93d00"]:only-child {
  display: inline-block !important;
  border-bottom: 0 !important;
  font-size: 19px;
  letter-spacing: -.01em;
  padding-bottom: 9px;
  margin: 28px 0 12px;
  position: relative;
}
.middle_center > [style*="border-bottom:2px solid #e93d00"]::after,
.middle_center > [style*="border-bottom: 2px solid #e93d00"]::after,
.middle_center > p > [style*="border-bottom:2px solid #e93d00"]:only-child::after,
.middle_center > p > [style*="border-bottom: 2px solid #e93d00"]:only-child::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 44px; height: 3px; border-radius: 3px; background: var(--orange-500);
}

/* ---------------------------------------------------------------
   3. Layout — widen bootstrap 3's container, kill legacy floats
   --------------------------------------------------------------- */
.container { width: 100%; max-width: var(--maxw); }
@media (min-width: 1200px) { .container { width: var(--maxw); } }
/* a few pages nest a second .container inside a grid column */
.container .container,
.middle_center .container {
  width: auto !important;
  max-width: none;
  margin: 0;
  padding-left: 0;
  padding-right: 0;
}

section { display: block; }

.main-content { padding: 0; background: transparent; }

/* the content shell used on every inner page */
.row.sub_content {
  background: transparent !important;
  margin-left: -15px;
  margin-right: -15px;
}

/* ---------------------------------------------------------------
   4. Utility bar
   --------------------------------------------------------------- */
#header { display: block; position: relative; z-index: 60; }

#top-bar {
  background: var(--navy-800);
  color: rgba(255,255,255,.78);
  font-size: 13.5px;
  line-height: 1;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
#top-bar .container > .row { display: flex; align-items: center; flex-wrap: wrap; }
#top-bar .top-info { padding-top: 11px; padding-bottom: 11px; }

#top-bar .top-info > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 26px;
  color: rgba(255,255,255,.82);
  letter-spacing: .01em;
  white-space: nowrap;
}
#top-bar .top-info > span img { display: none; }
#top-bar .top-info > span::before {
  content: "";
  width: 15px; height: 15px;
  flex: 0 0 15px;
  background-color: var(--orange-500);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain;   mask-size: contain;
  -webkit-mask-position: center; mask-position: center;
}
#top-bar .top-info > span:nth-of-type(1)::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.654 1.328a.678.678 0 0 0-1.015-.063L1.605 2.3c-.483.484-.661 1.169-.45 1.77a17.6 17.6 0 0 0 4.168 6.608 17.6 17.6 0 0 0 6.608 4.168c.601.211 1.286.033 1.77-.45l1.034-1.034a.678.678 0 0 0-.063-1.015l-2.307-1.794a.68.68 0 0 0-.58-.122l-2.19.547a1.75 1.75 0 0 1-1.657-.459L5.482 8.062a1.75 1.75 0 0 1-.46-1.657l.548-2.19a.68.68 0 0 0-.122-.58z'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.654 1.328a.678.678 0 0 0-1.015-.063L1.605 2.3c-.483.484-.661 1.169-.45 1.77a17.6 17.6 0 0 0 4.168 6.608 17.6 17.6 0 0 0 6.608 4.168c.601.211 1.286.033 1.77-.45l1.034-1.034a.678.678 0 0 0-.063-1.015l-2.307-1.794a.68.68 0 0 0-.58-.122l-2.19.547a1.75 1.75 0 0 1-1.657-.459L5.482 8.062a1.75 1.75 0 0 1-.46-1.657l.548-2.19a.68.68 0 0 0-.122-.58z'/%3E%3C/svg%3E");
}
#top-bar .top-info > span:nth-of-type(2)::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414zM0 4.697v7.104l5.803-3.558zM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586zm3.436-.586L16 11.801V4.697z'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414zM0 4.697v7.104l5.803-3.558zM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586zm3.436-.586L16 11.801V4.697z'/%3E%3C/svg%3E");
}

#top-bar .col-sm-7.top-info { flex: 1 1 auto; min-width: 0; }
#top-bar .col-sm-5.top-info { margin-left: auto; flex: 0 1 auto; }
#top-bar .top-info ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; justify-content: flex-end; gap: 8px;
}
#top-bar .top-info ul li { margin: 0; }
#top-bar .top-info ul li a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: rgba(255,255,255,.09);
  transition: background .2s ease, transform .2s ease;
}
#top-bar .top-info ul li a:hover { background: var(--orange-500); transform: translateY(-2px); }
#top-bar .top-info ul li a img { width: 13px; height: auto; opacity: .95; }

/* ---------------------------------------------------------------
   5. Masthead + primary navigation
   --------------------------------------------------------------- */
.bg-ribbon {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 50;
  transition: box-shadow .25s ease;
}
.bg-ribbon.is-stuck { box-shadow: var(--shadow-md); }

.bg-ribbon #ribbon { width: 100%; }

.ribbonlink-container {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: var(--header-h);
}

/* logo */
.hide-text { overflow: hidden; text-indent: 110%; white-space: nowrap; }
/* the logo link only — the injected quote button is also a direct child */
.ribbonlink-container > a:not(.lcs-headcta) { flex: 0 0 auto; display: block; }
.bg-ribbon .ribboncrest {
  display: block;
  width: 218px; height: 46px;
  margin: 0;
  background: url("../images/ribbon-logo.png") left center / contain no-repeat;
}

/* the old duplicate icon-nav is replaced by the menu below */
.mobiletoggle { display: none !important; }

.ribbonlink-container .nav {
  margin-left: auto;
  padding: 0;
  display: flex;
  align-items: center;
}

#cssmenu > ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; gap: 2px;
}
#cssmenu > ul > li { position: relative; margin: 0; }

#cssmenu > ul > li > a {
  display: block;
  padding: 27px 14px;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: .005em;
  color: var(--ink-700);
  text-transform: uppercase;
  position: relative;
}
#cssmenu > ul > li > a::after {
  content: ""; position: absolute;
  left: 14px; right: 14px; bottom: 20px; height: 2px;
  background: var(--orange-500);
  transform: scaleX(0); transform-origin: left;
  transition: transform .22s ease;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.is-active > a { color: var(--navy-800); }
#cssmenu > ul > li:hover > a::after,
#cssmenu > ul > li.is-active > a::after { transform: scaleX(1); }

/* dropdown */
#cssmenu > ul > li > ul {
  position: absolute;
  top: 100%; left: 0;
  min-width: 264px;
  margin: 0; padding: 8px;
  list-style: none;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  opacity: 0; visibility: hidden;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  z-index: 70;
}
#cssmenu > ul > li:hover > ul { opacity: 1; visibility: visible; transform: translateY(0); }
#cssmenu > ul > li > ul > li { margin: 0; }
#cssmenu > ul > li > ul > li > a {
  display: block;
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  font-size: 14.5px;
  font-weight: 500;
  color: var(--ink-700);
}
#cssmenu > ul > li > ul > li > a:hover {
  background: var(--blue-50);
  color: var(--navy-800);
  padding-left: 18px;
}

/* menu button (injected by lcs.js) */
.lcs-burger {
  display: none;
  margin-left: auto;
  width: 46px; height: 42px;
  align-items: center; justify-content: center;
  flex-direction: column; gap: 5px;
  background: var(--surface-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  cursor: pointer;
  padding: 0;
}
.lcs-burger span {
  display: block; width: 20px; height: 2px; border-radius: 2px;
  background: var(--navy-800);
  transition: transform .25s ease, opacity .2s ease;
}
.lcs-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.lcs-burger.is-open span:nth-child(2) { opacity: 0; }
.lcs-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* quote CTA in the header (injected by lcs.js) */
.lcs-headcta {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 8px;
  margin-left: 18px;
  padding: 11px 20px;
  border-radius: 999px;
  background: var(--orange-500);
  color: #fff !important;
  font-size: 14px; font-weight: 700;
  letter-spacing: .01em;
  box-shadow: 0 6px 16px rgba(234,85,20,.28);
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.lcs-headcta:hover {
  background: var(--orange-600); transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(234,85,20,.34);
}

/* ---------------------------------------------------------------
   6. Page hero (inner pages)
   --------------------------------------------------------------- */
/* the page banner runs full width: widen its own container rather than
   bleeding out of it with 100vw, which overflows by the scrollbar width */
.banner > .container { width: 100%; max-width: none; padding-left: 0; padding-right: 0; }
.banner > .container > .row { margin: 0; }

#inner_banner {
  position: relative;
  overflow: hidden;
  background: var(--navy-800);
  isolation: isolate;
}
#inner_banner img {
  /* the strips carry their own caption on the right third; overflow it away */
  width: 150%;
  max-width: none;
  height: 240px;
  object-fit: cover;
  object-position: left center;
  opacity: .4;
  filter: saturate(.85);
}
#inner_banner::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(100deg, var(--navy-900) 8%, rgba(11,37,69,.86) 46%, rgba(11,37,69,.35) 100%);
}
.page-hero__inner {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; justify-content: center;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 15px;
}
.page-hero__inner h1 {
  color: #fff;
  margin: 0 0 10px;
  font-size: clamp(26px, 3.6vw, 40px);
  max-width: 22ch;
  text-shadow: 0 2px 20px rgba(0,0,0,.25);
}
.page-hero__crumbs {
  font-size: 13.5px;
  color: rgba(255,255,255,.7);
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.page-hero__crumbs a { color: rgba(255,255,255,.86); font-weight: 500; }
.page-hero__crumbs a:hover { color: #fff; }
.page-hero__crumbs em { font-style: normal; color: rgba(255,255,255,.45); }

/* ---------------------------------------------------------------
   7. Content shell
   --------------------------------------------------------------- */
.main-content .container > .row.sub_content { padding: 44px 0 60px; }

/* --- sidebar --- */
.row.sub_content > .col-sm-3 { padding-left: 15px; padding-right: 15px; }

.product-range {
  display: flex; align-items: center;
  margin: 0 0 14px;
}
.product-range img { display: none; }
.product-range span {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--navy-800);
  position: relative;
  padding-bottom: 10px;
}
.product-range span::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 34px; height: 3px; border-radius: 3px; background: var(--orange-500);
}
/* the enquiry image block on the home page reuses .product-range */
.product-range a { display: block; width: 100%; }
.product-range a img { display: block; width: 100%; border-radius: var(--radius); }

.pageContent {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xs);
  overflow: hidden;
}

ul.topnav { list-style: none; margin: 0; padding: 6px; }
ul.topnav li { margin: 0; }

ul.topnav > li > a {
  display: block;
  padding: 13px 14px;
  border-radius: var(--radius-sm);
  font-size: 14.5px;
  font-weight: 700;
  color: var(--navy-800);
  position: relative;
}
ul.topnav > li > a:hover { background: var(--blue-50); }
ul.topnav > li + li { border-top: 1px solid var(--line-soft); }

ul.topnav ul { list-style: none; margin: 0 0 8px; padding: 0 6px; }
ul.topnav ul li a {
  display: block;
  padding: 9px 12px 9px 24px;
  border-radius: var(--radius-sm);
  font-size: 13.5px;
  line-height: 1.45;
  font-weight: 500;
  color: var(--ink-500);
  position: relative;
}
ul.topnav ul li a::before {
  content: ""; position: absolute; left: 10px; top: 16px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--line);
  transition: background .18s ease;
}
ul.topnav ul li a:hover { color: var(--navy-800); background: var(--blue-50); }
ul.topnav ul li a:hover::before { background: var(--orange-500); }
ul.topnav ul li.active > a {
  color: var(--navy-800); font-weight: 700; background: var(--blue-100);
}
ul.topnav ul li.active > a::before { background: var(--orange-500); }

/* catalogue call-to-action row (carries a legacy inline background) */
ul.topnav > li[style] {
  background: none !important;
  border-top: 1px solid var(--line-soft);
  padding: 8px 6px 6px;
}
ul.topnav > li[style] > a {
  background: var(--navy-800) !important;
  color: #fff !important;
  text-align: center;
  border-radius: var(--radius-sm);
  font-size: 14px;
}
ul.topnav > li[style] > a:hover { background: var(--orange-500) !important; }

/* --- main column --- */
.middle_center {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xs);
  padding: 34px 36px 38px;
}
.middle_center::after { content: ""; display: table; clear: both; }

.welcome {
  display: block;
  margin: 0 0 22px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line-soft);
}
.welcome img { display: none; }
.welcome span {
  display: block;
  font-size: clamp(21px, 2.4vw, 27px);
  font-weight: 800;
  letter-spacing: -.015em;
  line-height: 1.25;
  color: var(--navy-800);
}
.welcome.is-hero-title { display: none; }

.middle_center p { color: var(--ink-700); }

.details-page {
  float: none;
  margin: 0 0 26px;
  padding: 26px;
  background: var(--surface-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  text-align: center;
}
.details-page img { max-height: 340px; width: auto; mix-blend-mode: multiply; }

/* ---------------------------------------------------------------
   8. Product cards
   --------------------------------------------------------------- */
.our-products {
  display: flex;
  flex-direction: column;
  height: 100%;
  margin-bottom: 24px;
  padding: 16px 16px 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.our-products:hover {
  transform: translateY(-4px);
  border-color: rgba(24,119,209,.35);
  box-shadow: var(--shadow-md);
}
.our-products > a {
  display: flex; align-items: center; justify-content: center;
  height: 158px;
  margin-bottom: 14px;
  padding: 10px;
  background: var(--surface-2);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.our-products > a img {
  max-height: 100%; width: auto;
  mix-blend-mode: multiply;
  transition: transform .3s ease;
}
.our-products:hover > a img { transform: scale(1.05); }

.our-products p { margin: 0 0 10px; font-size: 14px; line-height: 1.5; }
.our-products p strong { display: block; color: var(--navy-800); font-weight: 700; font-size: 14.5px; }
.our-products p strong a {
  display: inline-block;
  margin-top: 6px;
  font-size: 13px; font-weight: 600;
  color: var(--blue-600);
}
.our-products p strong a:hover { color: var(--orange-500); }

.our-products p.request-botton { margin: auto 0 0; padding-top: 8px; }
.our-products p.request-botton a {
  display: block;
  padding: 10px 12px;
  text-align: center;
  border-radius: var(--radius-sm);
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  color: var(--blue-600);
  font-size: 13px; font-weight: 700;
  letter-spacing: .02em;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.our-products p.request-botton a:hover {
  background: var(--orange-500); border-color: var(--orange-500); color: #fff;
}

.middle_center > .col-sm-3 { padding-left: 10px; padding-right: 10px; }

/* ---------------------------------------------------------------
   9. Specification tables
   --------------------------------------------------------------- */
.middle_center table {
  width: 100% !important;
  border-collapse: separate;
  border-spacing: 0;
  margin: 6px 0 28px;
  font-size: 14.5px;
  background: var(--surface);
  border: 1px solid var(--line) !important;
  border-radius: var(--radius);
  overflow: hidden;
}
.middle_center table td,
.middle_center table th {
  padding: 11px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line-soft) !important;
  vertical-align: top;
  text-align: left;
}
.middle_center table tr:last-child td { border-bottom: 0 !important; }
.middle_center table tr:nth-child(even) td { background: var(--surface-2); }
/* icon-led tables (contact details) get a narrow first column */
.middle_center table:has(td:first-child > img) td:first-child,
.middle_center table:has(td:first-child > a > img) td:first-child {
  width: 68px; text-align: center;
}
.middle_center table td:first-child {
  width: 44%;
  color: var(--navy-800);
  font-weight: 600;
  border-right: 1px solid var(--line-soft) !important;
}
.middle_center table td strong { color: var(--navy-800); }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 28px; }
.table-scroll > table { margin-bottom: 0; min-width: 460px; }

/* ---------------------------------------------------------------
   10. Forms
   --------------------------------------------------------------- */
.Query, .enquire-now {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 10px 6px;
}
.middle_center .Query,
.middle_center .enquire-now { border: 0; padding: 0; box-shadow: none; }
.enquire-now { padding: 30px 32px; box-shadow: var(--shadow-xs); margin-bottom: 40px; }

.Query table, .enquire-now table { width: 100% !important; border: 0 !important; }
.Query table td, .enquire-now table td {
  padding: 8px 10px !important;
  border: 0 !important;
  background: transparent !important;
  vertical-align: middle;
}
.Query table td:first-child, .enquire-now table td:first-child {
  width: 32%;
  color: var(--navy-800);
  font-weight: 600;
  font-size: 14.5px;
  border-right: 0 !important;
}

input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], input[type="number"], select, textarea {
  width: 100%;
  max-width: 460px;
  padding: 11px 14px;
  font-family: var(--sans);
  font-size: 15px;
  color: var(--ink-900);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  transition: border-color .18s ease, box-shadow .18s ease;
  height: auto !important;
}
textarea { min-height: 110px; resize: vertical; line-height: 1.6; }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--blue-500);
  box-shadow: 0 0 0 3px rgba(24,119,209,.14);
}
select { width: 100% !important; max-width: 460px; }

input[type="submit"], input[type="button"], button[type="submit"] {
  width: auto !important;
  padding: 12px 30px !important;
  background: var(--orange-500) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-family: var(--sans);
  font-size: 15px !important;
  font-weight: 700;
  letter-spacing: .01em;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(234,85,20,.26);
  transition: background .2s ease, transform .2s ease;
}
input[type="submit"]:hover, input[type="button"]:hover, button[type="submit"]:hover {
  background: var(--orange-600) !important; transform: translateY(-1px);
}
#refresh_captcha { color: var(--blue-600) !important; font-weight: 600 !important; }
#security_code { background: var(--surface-3) !important; font-weight: 700; }

/* ---------------------------------------------------------------
   11. Footer
   --------------------------------------------------------------- */
footer {
  display: block;
  background: var(--navy-900);
  color: rgba(255,255,255,.66);
  font-size: 14.5px;
  margin-top: 0;
}
footer .row.sub_content { padding: 0 !important; background: transparent !important; }
footer a { color: rgba(255,255,255,.72); }
footer a:hover { color: #fff; }

.footer_2 { padding: 54px 0 0; }
#footer-main::after { content: ""; display: table; clear: both; }

.footer-div {
  margin: 0 0 20px;
  padding-bottom: 14px;
  position: relative;
}
.footer-div img { display: none; }
.footer-div span {
  display: block;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.footer-div::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 32px; height: 3px; border-radius: 3px; background: var(--orange-500);
}

footer ul.recent_posts, footer ul.menu {
  list-style: none; margin: 0 0 34px; padding: 0;
}
footer ul.recent_posts li {
  margin-bottom: 10px;
  line-height: 1.6;
  font-size: 14px;
}
footer ul.recent_posts li span[style] { color: var(--orange-500) !important; }
footer ul.recent_posts li strong { color: rgba(255,255,255,.9); font-weight: 600; }

footer ul.menu li { margin: 0 0 2px; }
footer ul.menu li a {
  display: block;
  padding: 6px 0 6px 16px;
  position: relative;
  font-size: 14px;
  text-transform: none;
  transition: padding-left .18s ease, color .18s ease;
}
footer ul.menu li a::before {
  content: ""; position: absolute; left: 0; top: 15px;
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(255,255,255,.25);
  transition: background .18s ease;
}
footer ul.menu li a:hover { padding-left: 21px; }
footer ul.menu li a:hover::before { background: var(--orange-500); }

/* client logo strip */
#slider { overflow: hidden; margin-bottom: 30px; }
#mask-gallery { overflow: hidden; }
ul#gallery {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 8px;
}
ul#gallery li {
  margin: 0;
  flex: 0 0 calc(33.333% - 6px);
  background: rgba(255,255,255,.94);
  border-radius: var(--radius-sm);
  padding: 8px;
  display: flex; align-items: center; justify-content: center;
  min-height: 52px;
  transition: transform .2s ease;
}
ul#gallery li:hover { transform: translateY(-2px); }
ul#gallery li img { max-height: 34px; width: auto; }

.footer_bottom {
  clear: both;
  border-top: 1px solid rgba(255,255,255,.1);
  margin-top: 12px;
}
.footer_bottom .top-info { padding: 22px 15px; }
.footer_bottom p {
  margin: 0;
  font-size: 13.5px;
  color: rgba(255,255,255,.5);
  text-align: center;
}

/* ---------------------------------------------------------------
   12. Buttons
   --------------------------------------------------------------- */
.lcs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 14px 28px;
  border-radius: 999px;
  font-size: 15px; font-weight: 700; letter-spacing: .01em;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.lcs-btn--primary {
  background: var(--orange-500); color: #fff !important;
  box-shadow: 0 8px 20px rgba(234,85,20,.28);
}
.lcs-btn--primary:hover { background: var(--orange-600); transform: translateY(-2px); box-shadow: 0 12px 26px rgba(234,85,20,.34); }
.lcs-btn--ghost {
  background: rgba(255,255,255,.08); color: #fff !important;
  border-color: rgba(255,255,255,.32);
  backdrop-filter: blur(4px);
}
.lcs-btn--ghost:hover { background: rgba(255,255,255,.16); border-color: #fff; transform: translateY(-2px); }
.lcs-btn--outline {
  background: transparent; color: var(--navy-800) !important;
  border-color: var(--line);
}
.lcs-btn--outline:hover { border-color: var(--navy-800); background: var(--surface-2); transform: translateY(-2px); }

/* ---------------------------------------------------------------
   13. Home page
   --------------------------------------------------------------- */
.lcs-section { padding: 76px 0; }
.lcs-section--tint { background: var(--surface-2); }
.lcs-section--white { background: var(--surface); }

.lcs-eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  font-size: 12.5px; font-weight: 800; letter-spacing: .13em;
  text-transform: uppercase; color: var(--orange-500);
  margin-bottom: 14px;
}
.lcs-eyebrow::before {
  content: ""; width: 22px; height: 2px; border-radius: 2px; background: var(--orange-500);
}
.lcs-head { max-width: 720px; margin: 0 auto 46px; text-align: center; }
.lcs-head .lcs-eyebrow { justify-content: center; }
.lcs-head h2 { margin-bottom: 12px; }
.lcs-head p { color: var(--ink-500); font-size: 16.5px; margin: 0; }
.lcs-head--left { margin-left: 0; text-align: left; }

/* --- hero --- */
.lcs-hero {
  position: relative;
  background: var(--navy-900);
  overflow: hidden;
  isolation: isolate;
}
.lcs-hero__slides { position: absolute; inset: 0; z-index: 0; }
.lcs-hero__slide {
  position: absolute; inset: 0;
  opacity: 0;
  transition: opacity 1s ease, transform 7s linear;
  transform: scale(1.05);
}
.lcs-hero__slide.is-active { opacity: 1; transform: scale(1); }
.lcs-hero__slide img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  /* the stock banners all place their subject on the left and fade out to the
     right; mirroring them puts the subject clear of the headline */
  transform: scaleX(-1);
}
.lcs-hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(95deg, var(--navy-900) 16%, rgba(6,23,46,.93) 40%, rgba(6,23,46,.62) 66%, rgba(6,23,46,.24) 100%);
}
.lcs-hero__inner {
  position: relative; z-index: 2;
  padding: 96px 0 92px;
  max-width: 640px;
}
.lcs-hero__badge {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 16px 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.9);
  font-size: 13px; font-weight: 600;
  margin-bottom: 24px;
}
.lcs-hero__badge b {
  color: #fff; background: var(--orange-500);
  border-radius: 999px; padding: 3px 10px; font-size: 11.5px;
  letter-spacing: .06em; text-transform: uppercase;
}
.lcs-hero h1 {
  color: #fff;
  font-size: clamp(34px, 4.6vw, 54px);
  line-height: 1.1;
  margin-bottom: 20px;
}
.lcs-hero h1 em { font-style: normal; color: #ffb38a; }
.lcs-hero p {
  color: rgba(255,255,255,.78);
  font-size: 17.5px;
  line-height: 1.7;
  max-width: 54ch;
  margin-bottom: 32px;
}
.lcs-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 40px; }
.lcs-hero__marks { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.lcs-hero__inner > *:last-child { margin-bottom: 0; }
.lcs-hero__marks span {
  display: inline-flex; align-items: center; gap: 9px;
  color: rgba(255,255,255,.72); font-size: 14px; font-weight: 500;
}
.lcs-hero__marks span::before {
  content: ""; width: 18px; height: 18px; flex: 0 0 18px; border-radius: 50%;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.3);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffb38a'%3E%3Cpath d='M12.7 4.3a1 1 0 0 1 0 1.4l-5.5 5.5a1 1 0 0 1-1.4 0L3.3 8.7a1 1 0 1 1 1.4-1.4l1.8 1.8 4.8-4.8a1 1 0 0 1 1.4 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 13px;
}
.lcs-hero__dots { display: flex; gap: 9px; margin-top: 34px; }
.lcs-hero__dots button {
  width: 40px; border: 0; padding: 0;
  background: transparent; cursor: pointer;
  transition: width .2s ease;
}
.lcs-hero__dots button.is-active { width: 56px; }

/* --- stat strip --- */
.lcs-stats {
  position: relative; z-index: 4;
  margin-top: -46px; margin-bottom: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
}
.lcs-stat { padding: 30px 26px; text-align: center; }
.lcs-stat + .lcs-stat { border-left: 1px solid var(--line-soft); }
.lcs-stat b {
  display: block;
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 800;
  color: var(--navy-800);
  letter-spacing: -.02em;
  line-height: 1.1;
  margin-bottom: 6px;
}
.lcs-stat span { font-size: 13.5px; color: var(--ink-500); font-weight: 500; }

/* --- category cards --- */
.lcs-grid { display: grid; gap: 26px; }
.lcs-grid--4 { grid-template-columns: repeat(4, 1fr); }
.lcs-grid--3 { grid-template-columns: repeat(3, 1fr); }
.lcs-grid--2 { grid-template-columns: repeat(2, 1fr); }

.lcs-cat {
  display: flex; flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.lcs-cat:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: rgba(24,119,209,.3); }
.lcs-cat__media {
  position: relative;
  height: 190px; overflow: hidden;
  background: linear-gradient(160deg, var(--blue-50) 0%, var(--surface-3) 100%);
  border-bottom: 1px solid var(--line-soft);
  display: flex; align-items: center; justify-content: center;
  padding: 18px;
}
.lcs-cat__media img {
  position: relative;
  z-index: 1;
  max-width: 100%; max-height: 100%; width: auto; height: auto;
  object-fit: contain; mix-blend-mode: multiply;
  transition: transform .75s cubic-bezier(.22,.7,.3,1);
}
.lcs-cat:hover .lcs-cat__media img { transform: scale(1.07); }
html.lcs-js .lcs-cat .lcs-cat__media::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(135deg, #eef4f9, #f8fafc);
  transform: translateY(0);
  transition: transform .78s cubic-bezier(.76,0,.24,1);
}
html.lcs-js .lcs-cat.is-in .lcs-cat__media::after { transform: translateY(-102%); }
html.lcs-js .lcs-cat:not(.is-in) .lcs-cat__media img { transform: scale(1.1); }
.lcs-cat__body { padding: 24px 24px 26px; display: flex; flex-direction: column; flex: 1; }
.lcs-cat__body h3 { font-size: 18.5px; margin-bottom: 8px; min-height: 2.44em; }
.lcs-cat__body p { font-size: 14.5px; color: var(--ink-500); margin-bottom: 18px; }
.lcs-cat__link {
  margin-top: auto;
  font-size: 14px; font-weight: 700; color: var(--blue-600);
  display: inline-flex; align-items: center; gap: 7px;
}
.lcs-cat__link::after {
  content: "→"; transition: transform .2s ease; font-size: 15px;
}
.lcs-cat:hover .lcs-cat__link { color: var(--orange-500); }
.lcs-cat:hover .lcs-cat__link::after { transform: translateX(4px); }

/* --- split (about) --- */
.lcs-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.lcs-split__media { position: relative; }
.lcs-split__media img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: 26% center;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}
.lcs-split__badge {
  position: absolute; right: -18px; bottom: -22px;
  background: var(--navy-800); color: #fff;
  border-radius: var(--radius);
  padding: 20px 24px;
  box-shadow: var(--shadow-lg);
  max-width: 210px;
}
.lcs-split__badge b { display: block; color: #fff; font-size: 32px; font-weight: 800; line-height: 1; margin-bottom: 5px; }
.lcs-split__badge span { font-size: 13.5px; color: rgba(255,255,255,.7); }

.lcs-ticks { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 11px; }
.lcs-ticks li {
  position: relative; padding-left: 32px; margin: 0;
  font-size: 15px; color: var(--ink-700);
}
.lcs-ticks li::before {
  content: ""; position: absolute; left: 0; top: 3px;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--blue-100);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230b5cab'%3E%3Cpath d='M12.7 4.3a1 1 0 0 1 0 1.4l-5.5 5.5a1 1 0 0 1-1.4 0L3.3 8.7a1 1 0 1 1 1.4-1.4l1.8 1.8 4.8-4.8a1 1 0 0 1 1.4 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 14px;
}

/* --- feature cards --- */
.lcs-feature {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 30px 28px;
  transition: transform .22s ease, box-shadow .22s ease;
}
.lcs-feature:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.lcs-feature__icon {
  width: 48px; height: 48px; border-radius: var(--radius);
  background: var(--blue-50); color: var(--blue-600);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 18px;
  font-size: 21px; font-weight: 800;
}
.lcs-feature h3 { font-size: 17.5px; margin-bottom: 8px; }
.lcs-feature p { font-size: 14.5px; color: var(--ink-500); margin: 0; }

/* --- client logos --- */
.lcs-logos { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.lcs-logos div {
  flex: 0 0 calc(12.5% - 14px);
  min-width: 118px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  height: 88px;
  display: flex; align-items: center; justify-content: center;
  padding: 10px;
  filter: grayscale(1); opacity: .72;
  transition: filter .25s ease, opacity .25s ease, transform .25s ease;
}
.lcs-logos div:hover { filter: none; opacity: 1; transform: translateY(-3px); }
.lcs-logos img { max-height: 100%; max-width: 100%; width: auto; object-fit: contain; }

/* --- CTA band --- */
.lcs-cta {
  background: linear-gradient(115deg, var(--navy-800) 0%, var(--navy-600) 55%, var(--blue-600) 100%);
  border-radius: var(--radius-lg);
  padding: 52px 56px;
  display: flex; align-items: center; justify-content: space-between; gap: 36px;
  position: relative; overflow: hidden;
}
.lcs-cta::before {
  content: ""; position: absolute; right: -60px; top: -80px;
  width: 320px; height: 320px; border-radius: 50%;
  background: rgba(255,255,255,.06);
}
.lcs-cta__text { position: relative; z-index: 1; }
.lcs-cta h2 { color: #fff; margin-bottom: 8px; }
.lcs-cta p { color: rgba(255,255,255,.78); margin: 0; font-size: 16px; }
.lcs-cta__actions { position: relative; z-index: 1; flex: 0 0 auto; display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------------------------------------------------------------
   14. Floating helpers
   --------------------------------------------------------------- */
.lcs-top {
  position: fixed; right: 22px; bottom: 88px; z-index: 90;
  width: 44px; height: 44px; border-radius: 50%;
  border: 0; padding: 0; cursor: pointer;
  background: var(--navy-800); color: #fff;
  box-shadow: var(--shadow-md);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; visibility: hidden; transform: translateY(12px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s, background .2s ease;
}
.lcs-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.lcs-top:hover { background: var(--orange-500); }
.lcs-top svg { width: 17px; height: 17px; }

/* reveal-on-scroll */
.lcs-reveal { opacity: 1; }
html.lcs-js .lcs-reveal { opacity: 0; transform: translateY(20px); }
html.lcs-js .lcs-reveal.is-in { opacity: 1; transform: none; transition: opacity .6s ease, transform .6s cubic-bezier(.22,.7,.3,1); }
@media (prefers-reduced-motion: reduce) {
  .lcs-reveal, html.lcs-js .lcs-reveal, html.lcs-js .lcs-reveal.is-in { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* ---------------------------------------------------------------
   15. Card grid (built by lcs.js from the legacy .col-sm-3 cards)
   --------------------------------------------------------------- */
.lcs-cardgrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  margin: 26px 0 10px;
  clear: both;
}
.lcs-cardgrid > .col-sm-3,
.lcs-cardgrid > .col-md-3,
.lcs-cardgrid > div {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
}
.lcs-cardgrid .our-products { margin-bottom: 0; }

/* ---------------------------------------------------------------
   16. Misc legacy blocks kept usable
   --------------------------------------------------------------- */
.line_div { display: none; }
.carousel-intro { padding: 0; }

/* certificate / gallery thumbnails */
.middle_center img[src*="certificate"],
.middle_center img[src*="ce-certificate"] {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 8px;
  background: var(--surface);
}

/* Google map embeds */
iframe[src*="google.com/maps"], iframe[src*="maps.google"] {
  width: 100% !important;
  border: 0;
  border-radius: var(--radius);
  box-shadow: var(--shadow-xs);
}

/* ---------------------------------------------------------------
   17. Responsive
   --------------------------------------------------------------- */
/* The nav only clears one row above ~1300px. Rather than let it wrap into two
   rows, tighten it and drop the header quote button - "Quotation" is already a
   nav item, so nothing is lost. */
@media (max-width: 1299px) {
  #cssmenu > ul > li > a { padding: 26px 9px; font-size: 13.5px; letter-spacing: 0; }
  #cssmenu > ul > li > a::after { left: 9px; right: 9px; }
  .lcs-headcta { display: none; }
  .bg-ribbon .ribboncrest { width: 190px; }
}
@media (max-width: 1199px) {
  .lcs-cardgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 991px) {
  :root { --header-h: 68px; }

  /* nav collapses into the injected menu button */
  .lcs-burger { display: flex; }
  .ribbonlink-container { flex-wrap: wrap; gap: 0; }
  .ribbonlink-container .nav {
    order: 3;
    flex: 0 0 100%;
    margin: 0;
    display: block;
    max-height: 0;
    overflow: hidden;
    transition: max-height .32s ease;
  }
  .ribbonlink-container .nav.is-open { max-height: 78vh; overflow-y: auto; }
  #cssmenu { padding: 6px 0 16px; }
  #cssmenu > ul { display: block; }
  #cssmenu > ul > li { border-top: 1px solid var(--line-soft); }
  #cssmenu > ul > li > a { padding: 14px 4px; }
  #cssmenu > ul > li > a::after { display: none; }
  #cssmenu > ul > li > ul {
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: 0; border-radius: 0;
    min-width: 0; padding: 0 0 8px 12px;
    display: none;
  }
  #cssmenu > ul > li.is-expanded > ul { display: block; }
  .lcs-headcta { display: none; }

  .lcs-hero__inner { padding: 68px 0 72px; max-width: none; }
  .lcs-stats { grid-template-columns: repeat(2, 1fr); }
  .lcs-stat:nth-child(3) { border-left: 0; }
  .lcs-stat:nth-child(n+3) { border-top: 1px solid var(--line-soft); }
  .lcs-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lcs-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lcs-split { grid-template-columns: 1fr; gap: 40px; }
  .lcs-split__badge { right: 16px; bottom: -18px; }
  .lcs-cta { flex-direction: column; align-items: flex-start; padding: 40px 32px; }
  .lcs-section { padding: 58px 0; }
  .lcs-logos div { flex: 0 0 calc(25% - 12px); }

  .middle_center { padding: 26px 22px 30px; }
  .main-content .container > .row.sub_content { padding: 32px 0 46px; }
  .lcs-cardgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* sidebar drops BELOW the content on tablets and down; the row has to
     become a flex column for `order` to move it past the main column */
  .main-content .row.sub_content { display: flex; flex-direction: column; }
  .row.sub_content > .col-sm-3 {
    width: 100%; float: none; margin-top: 30px; order: 2;
  }
  .row.sub_content > .col-sm-9,
  .row.sub_content > .col-md-9,
  .row.sub_content > .col-lg-9 { width: 100%; float: none; order: 1; }

  #inner_banner img { height: 200px; }
  #top-bar .top-info > span { margin-right: 16px; font-size: 12.5px; }
}

@media (max-width: 767px) {
  body { font-size: 15.5px; }
  #top-bar .container > .row { justify-content: center; }
  #top-bar .col-sm-5.top-info { margin-left: 0; }
  #top-bar .top-info ul { justify-content: center; }
  #top-bar .hidden-xs { display: none !important; }

  .bg-ribbon .ribboncrest { width: 172px; height: 38px; }
  .ribbonlink-container { min-height: 64px; }

  .lcs-hero__inner { padding: 54px 0 62px; }
  .lcs-hero__cta .lcs-btn { flex: 1 1 100%; }
  .lcs-stats { margin-top: -30px; grid-template-columns: 1fr 1fr; }
  .lcs-stat { padding: 20px 14px; }
  .lcs-grid--4, .lcs-grid--3, .lcs-grid--2 { grid-template-columns: 1fr; }
  .lcs-cta { padding: 32px 24px; }
  .lcs-cta__actions { width: 100%; }
  .lcs-cta__actions .lcs-btn { flex: 1 1 100%; }
  .lcs-logos div { flex: 0 0 calc(50% - 8px); }
  .lcs-section { padding: 46px 0; }

  .middle_center { padding: 22px 18px 26px; border-radius: var(--radius); }
  .pageContent { border-radius: var(--radius); }
  .lcs-cardgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .our-products { padding: 12px 12px 14px; }
  .our-products > a { height: 118px; }
  .our-products p strong { font-size: 13.5px; }

  #inner_banner img { height: 168px; }
  .page-hero__inner h1 { font-size: 24px; }

  /* stacked spec tables */
  .middle_center table td:first-child { width: 42%; }
  .middle_center table { font-size: 13.5px; }
  .middle_center table td, .middle_center table th { padding: 9px 11px !important; }

  /* forms stack */
  .Query table, .Query tbody, .Query tr, .Query td,
  .enquire-now table, .enquire-now tbody, .enquire-now tr, .enquire-now td {
    display: block; width: 100% !important;
  }
  .Query table td:first-child, .enquire-now table td:first-child { padding-bottom: 2px !important; }
  input[type="text"], input[type="email"], select, textarea { max-width: 100%; }

  footer .col-sm-6 { width: 100%; }
  .footer_2 { padding: 40px 0 0; }
  ul#gallery li { flex: 0 0 calc(33.333% - 6px); }
}

@media (max-width: 479px) {
  .lcs-cardgrid { grid-template-columns: 1fr; }
  .lcs-stats { grid-template-columns: 1fr; }
  .lcs-stat + .lcs-stat { border-left: 0; border-top: 1px solid var(--line-soft); }
}

/* ---------------------------------------------------------------
   18. Print
   --------------------------------------------------------------- */
@media print {
  #top-bar, .bg-ribbon, footer, .lcs-top, .lcs-burger, #inner_banner, .pageContent { display: none !important; }
  .middle_center { border: 0; box-shadow: none; padding: 0; }
  body { background: #fff; }
}

/* ---------------------------------------------------------------
   19. Sidebar accordion state (driven by lcs.js)
   --------------------------------------------------------------- */
ul.topnav > li.has-children > a { padding-right: 38px; }
ul.topnav > li.has-children > a::after {
  content: "";
  position: absolute; right: 14px; top: 50%;
  width: 8px; height: 8px; margin-top: -6px;
  border-right: 2px solid var(--ink-400);
  border-bottom: 2px solid var(--ink-400);
  transform: rotate(45deg);
  transition: transform .22s ease, border-color .22s ease;
}
ul.topnav > li.has-children.is-open > a::after {
  transform: rotate(-135deg); margin-top: -2px;
  border-color: var(--orange-500);
}
ul.topnav > li.has-children > ul { display: none; }
ul.topnav > li.has-children.is-open > ul { display: block; }

/* ---------------------------------------------------------------
   20. Certificate gallery (quality page)
   --------------------------------------------------------------- */
.certificate {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 20px;
  margin: 26px 0 8px;
}
.certificate a {
  display: flex; align-items: center; justify-content: center;
  height: 320px;
  padding: 14px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.certificate a:hover {
  border-color: rgba(24,119,209,.4);
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}
.certificate a img {
  width: auto !important; height: auto !important;
  max-width: 100%; max-height: 100%;
  object-fit: contain;
}

/* ---------------------------------------------------------------
   21. Product quote call-to-action (detail + end of listing)
   --------------------------------------------------------------- */
.lcs-product-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  flex-wrap: wrap;
  margin: 0 0 30px;
  padding: 24px 28px;
  background: linear-gradient(115deg, var(--blue-50) 0%, var(--surface-2) 100%);
  border: 1px solid var(--blue-100);
  border-left: 4px solid var(--orange-500);
  border-radius: var(--radius);
}
.lcs-product-cta__text { flex: 1 1 320px; }
.lcs-product-cta__text strong {
  display: block;
  font-size: 17px;
  font-weight: 700;
  color: var(--navy-800);
  margin-bottom: 4px;
  letter-spacing: -.01em;
}
.lcs-product-cta__text span { font-size: 14.5px; color: var(--ink-500); }
.lcs-product-cta__actions { display: flex; gap: 12px; flex-wrap: wrap; flex: 0 0 auto; }
.lcs-product-cta__actions .lcs-btn { padding: 12px 22px; font-size: 14.5px; }

/* the band closing a category listing */
.lcs-listing-cta {
  clear: both;
  margin: 34px 0 0;
  padding: 30px 32px;
  border-radius: var(--radius);
  background: linear-gradient(115deg, var(--navy-800) 0%, var(--navy-600) 100%);
  display: flex; align-items: center; justify-content: space-between;
  gap: 26px; flex-wrap: wrap;
}
.lcs-listing-cta__text { flex: 1 1 320px; }
.lcs-listing-cta strong {
  display: block; color: #fff; font-size: 19px; font-weight: 700;
  margin-bottom: 5px; letter-spacing: -.01em;
}
.lcs-listing-cta span { font-size: 14.5px; color: rgba(255,255,255,.74); }
.lcs-listing-cta__actions { display: flex; gap: 12px; flex-wrap: wrap; }

@media (max-width: 767px) {
  .lcs-product-cta, .lcs-listing-cta { padding: 20px; }
  .lcs-product-cta__actions, .lcs-listing-cta__actions { width: 100%; }
  .lcs-product-cta__actions .lcs-btn, .lcs-listing-cta__actions .lcs-btn { flex: 1 1 100%; }
}

/* the honeypot: off-screen for people, irresistible to bots */
.lcs-hp {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 1px; height: 1px;
  overflow: hidden;
}

/* security code row */
#lcs_captcha_img { border: 1px solid var(--line); }
#refresh_captcha {
  display: inline-block;
  margin-left: 10px;
  color: var(--blue-600) !important;
  font-weight: 600 !important;
  cursor: pointer;
}
#refresh_captcha:hover { color: var(--orange-500) !important; }
#captcha_code { max-width: 130px; }

/* the hero now ships in the HTML, so it needs its own centred wrapper */
.page-hero__wrap {
  width: 100%;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 15px;
}
.page-hero__inner { padding: 0; }
.page-hero__crumbs em { font-style: normal; color: rgba(255,255,255,.4); margin: 0 2px; }

/* ---------------------------------------------------------------
   22. Product panel — image beside the pitch, detail underneath
   --------------------------------------------------------------- */
.lcs-pd {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: 38px;
  align-items: stretch;
  margin: 0 0 38px;
  padding-bottom: 34px;
  border-bottom: 1px solid var(--line-soft);
}

.lcs-pd__media {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  min-height: 320px;
  padding: 28px;
  position: sticky;
  top: 96px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  background:
    radial-gradient(120% 90% at 50% 0%, #fff 0%, #fbfcfe 62%, var(--surface-2) 100%);
  overflow: hidden;
}
.lcs-pd__media::after {
  content: "";
  position: absolute; left: 12%; right: 12%; bottom: 22px; height: 16px;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(11,37,69,.16), transparent 70%);
}
.lcs-pd__media img {
  position: relative; z-index: 1;
  max-height: 288px; width: auto;
  /* many source photos are shot on white and blend away; the ones shot on a
     coloured backdrop get a rounded edge so they read as a photo, not a stray
     rectangle sitting on the panel */
  border-radius: 10px;
  mix-blend-mode: multiply;
  transition: transform .4s cubic-bezier(.22,.7,.3,1);
}
.lcs-pd__media:hover img { transform: scale(1.04); }

.lcs-pd__info { padding-top: 6px; }
.lcs-pd__eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 11.5px; font-weight: 800; letter-spacing: .13em;
  text-transform: uppercase; color: var(--orange-500);
  margin-bottom: 14px;
}
.lcs-pd__eyebrow::before {
  content: ""; width: 18px; height: 2px; border-radius: 2px; background: var(--orange-500);
}
.lcs-pd__lead {
  font-size: 17px;
  line-height: 1.72;
  color: var(--ink-700);
  margin-bottom: 26px;
}
.lcs-pd__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 26px; }

.lcs-pd__trust {
  list-style: none; margin: 0; padding: 20px 0 0;
  border-top: 1px solid var(--line-soft);
  display: grid; gap: 10px;
}
.lcs-pd__trust li {
  position: relative; padding-left: 26px; margin: 0;
  font-size: 14px; color: var(--ink-500);
}
.lcs-pd__trust li::before {
  content: ""; position: absolute; left: 0; top: 5px;
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--blue-100);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230b5cab'%3E%3Cpath d='M12.7 4.3a1 1 0 0 1 0 1.4l-5.5 5.5a1 1 0 0 1-1.4 0L3.3 8.7a1 1 0 1 1 1.4-1.4l1.8 1.8 4.8-4.8a1 1 0 0 1 1.4 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 11px;
}

/* --- detail below the fold --- */
.lcs-pd__body > p { font-size: 16px; line-height: 1.78; margin-bottom: 26px; }

.lcs-pd__h {
  font-size: 19px;
  font-weight: 700;
  color: var(--navy-800);
  letter-spacing: -.01em;
  margin: 30px 0 14px;
  padding-bottom: 9px;
  position: relative;
}
.lcs-pd__h::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 40px; height: 3px; border-radius: 3px; background: var(--orange-500);
}

.lcs-chips { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 8px; }
.lcs-chip {
  display: inline-flex; align-items: center;
  padding: 8px 15px;
  border-radius: 999px;
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  color: var(--navy-700);
  font-size: 13.5px; font-weight: 600;
}

.lcs-note {
  display: block;
  margin: 30px 0 0;
  padding: 20px 22px;
  border-radius: var(--radius);
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--blue-500);
}
.lcs-note strong {
  display: block; color: var(--navy-800); font-size: 15px; margin-bottom: 5px;
}
.lcs-note span { font-size: 14.5px; color: var(--ink-500); line-height: 1.65; }

@media (max-width: 991px) {
  .lcs-pd { grid-template-columns: 1fr; gap: 26px; }
  .lcs-pd__media { min-height: 240px; padding: 22px; }
  .lcs-pd__media img { max-height: 220px; }
}
@media (max-width: 767px) {
  .lcs-pd__lead { font-size: 16px; }
  .lcs-pd__actions .lcs-btn { flex: 1 1 100%; }
  .lcs-pd__h { font-size: 17.5px; }
}

/* category page lead + group notes */
.lcs-lead {
  font-size: 17.5px;
  line-height: 1.72;
  color: var(--ink-700);
}
.lcs-group-note {
  font-size: 14.5px;
  color: var(--ink-500);
  margin: -4px 0 18px;
  max-width: 76ch;
}
.middle_center > h2.lcs-pd__h { clear: both; margin-top: 42px; }
.middle_center > h2.lcs-pd__h:first-of-type { margin-top: 34px; }

/* ---------------------------------------------------------------
   23. Related products (built by lcs.js from the sidebar siblings)
   --------------------------------------------------------------- */
.lcs-related { margin-top: 38px; padding-top: 4px; }
.lcs-related__row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}
.lcs-related__item {
  display: flex; align-items: center; gap: 10px;
  padding: 15px 18px;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--navy-800) !important;
  font-size: 14.5px; font-weight: 600;
  line-height: 1.4;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.lcs-related__item::after {
  content: "→";
  margin-left: auto;
  color: var(--ink-400);
  transition: transform .2s ease, color .2s ease;
}
.lcs-related__item:hover {
  border-color: rgba(24,119,209,.4);
  transform: translateY(-2px);
  box-shadow: var(--shadow-sm);
}
.lcs-related__item:hover::after { color: var(--orange-500); transform: translateX(3px); }
.lcs-related__all { margin: 16px 0 0; }
.lcs-related__all a {
  font-size: 14px; font-weight: 700; color: var(--blue-600);
  display: inline-flex; align-items: center; gap: 7px;
}
.lcs-related__all a::after { content: "→"; transition: transform .2s ease; }
.lcs-related__all a:hover { color: var(--orange-500); }
.lcs-related__all a:hover::after { transform: translateX(4px); }

/* the quote form is the single path from a product page, so the primary
   button stands alone rather than sharing the row with a call link */
.lcs-pd__actions .lcs-btn--primary,
.lcs-product-cta__actions .lcs-btn--primary { min-width: 210px; justify-content: center; }

/* ---------------------------------------------------------------
   24. Footer alignment
   The home page wraps its footer in <footer><div class="container">,
   but the other 176 pages go straight to .footer_2 with no container,
   so the footer ran full-bleed while the page content above it sat in
   a 1200px column. Matching .footer_2 only when it is a DIRECT child of
   <footer> targets exactly those pages and leaves the home page alone.
   --------------------------------------------------------------- */
footer > .footer_2 {
  max-width: var(--maxw);
  margin-left: auto;
  margin-right: auto;
}

/* the masthead logo is a span now rather than a heading; keep its box */
.bg-ribbon span.ribboncrest { display: block; }

/* ---------------------------------------------------------------
   25. FAQ blocks
   <details>/<summary> so the answers are in the HTML for crawlers and
   readable without JavaScript, while still collapsing for the reader.
   --------------------------------------------------------------- */
.lcs-faq { clear: both; margin: 46px 0 0; }
.lcs-faq__item {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  margin-bottom: 10px;
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.lcs-faq__item[open] { border-color: rgba(24,119,209,.35); box-shadow: var(--shadow-xs); }
.lcs-faq__item > summary {
  cursor: pointer;
  list-style: none;
  padding: 17px 52px 17px 20px;
  font-size: 15.5px;
  font-weight: 650;
  color: var(--navy-800);
  position: relative;
  line-height: 1.5;
}
.lcs-faq__item > summary::-webkit-details-marker { display: none; }
.lcs-faq__item > summary::after {
  content: "";
  position: absolute; right: 20px; top: 50%;
  width: 9px; height: 9px; margin-top: -6px;
  border-right: 2px solid var(--ink-400);
  border-bottom: 2px solid var(--ink-400);
  transform: rotate(45deg);
  transition: transform .22s ease, border-color .22s ease;
}
.lcs-faq__item[open] > summary::after {
  transform: rotate(-135deg); margin-top: -2px; border-color: var(--orange-500);
}
.lcs-faq__item > summary:hover { background: var(--blue-50); }
.lcs-faq__a {
  padding: 0 20px 18px;
  border-top: 1px solid var(--line-soft);
}
.lcs-faq__a p {
  margin: 14px 0 0;
  font-size: 15px;
  line-height: 1.72;
  color: var(--ink-700);
}
@media (max-width: 767px) {
  .lcs-faq__item > summary { padding: 15px 44px 15px 16px; font-size: 15px; }
  .lcs-faq__a { padding: 0 16px 16px; }
}

.lcs-visually-hidden {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---------------------------------------------------------------
   27. Product search
   --------------------------------------------------------------- */
/* the search and the social list share the right-hand column of the utility
   bar, so that column has to be a flex row - otherwise they stack and overlap */
#top-bar .col-sm-5.top-info {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex-wrap: nowrap;
}
#top-bar .col-sm-5.top-info ul { flex: 0 0 auto; margin: 0; }
.lcs-search { position: relative; flex: 0 1 240px; min-width: 0; margin: 0; }
.lcs-search input[type="search"] {
  width: 100%;
  max-width: none;
  padding: 7px 13px 7px 34px;
  font-size: 13.5px;
  height: auto !important;
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.08)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%237c8b9c'%3E%3Cpath d='M11.7 10.3a6 6 0 1 0-1.4 1.4l3 3a1 1 0 0 0 1.4-1.4zM7 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8'/%3E%3C/svg%3E")
    no-repeat 11px center / 14px;
}
.lcs-search input[type="search"]::placeholder { color: rgba(255,255,255,.55); }
.lcs-search input[type="search"]:focus {
  background-color: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.4);
  box-shadow: 0 0 0 3px rgba(255,255,255,.10);
  outline: none;
}
.lcs-search__results {
  display: none;
  position: absolute; top: calc(100% + 8px); right: 0;
  width: min(420px, 88vw);
  max-height: 70vh; overflow-y: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  z-index: 80;
  padding: 6px;
}
.lcs-search.is-open .lcs-search__results { display: block; }
.lcs-search__hit {
  display: flex; align-items: center; gap: 12px;
  padding: 9px 10px;
  border-radius: var(--radius-sm);
  color: var(--ink-700) !important;
}
.lcs-search__hit:hover { background: var(--blue-50); }
.lcs-search__thumb {
  flex: 0 0 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: var(--surface-2);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.lcs-search__thumb img { max-width: 100%; max-height: 100%; width: auto; mix-blend-mode: multiply; }
.lcs-search__text { min-width: 0; }
.lcs-search__name {
  display: block; font-size: 14px; font-weight: 650; color: var(--navy-800);
  line-height: 1.35;
}
.lcs-search__cat { display: block; font-size: 12.5px; color: var(--ink-400); margin-top: 2px; }
.lcs-search__none { margin: 0; padding: 16px; font-size: 14px; color: var(--ink-500); }

/* below ~1200 the contact strip and the search compete for the same row.
   The email is also in the footer and on the contact page, so it gives way
   first and the search keeps a usable width. */
@media (max-width: 1199px) {
  #top-bar .col-sm-7.top-info > span:nth-of-type(2) { display: none; }
  .lcs-search { flex-basis: 230px; min-width: 190px; }
}
@media (max-width: 991px) {
  #top-bar .col-sm-7.top-info { display: none; }
  .lcs-search { flex-basis: 260px; min-width: 200px; }
}
@media (max-width: 767px) {
  /* stack instead of squeezing: search on its own row above the social icons */
  #top-bar .col-sm-5.top-info { flex-wrap: wrap; justify-content: center; gap: 10px; }
  #top-bar .col-sm-5.top-info .lcs-search { flex: 1 1 100%; order: -1; }
  #top-bar .col-sm-5.top-info ul { flex: 1 1 100%; justify-content: center; }
  .lcs-search__results { width: min(420px, 92vw); left: 50%; right: auto; transform: translateX(-50%); }
}

/* the results panel is its own surface, independent of the bar it hangs from */
.lcs-search__results, .lcs-search__results * { color: var(--ink-700); }
.lcs-search__results .lcs-search__name { color: var(--navy-800); }
.lcs-search__results .lcs-search__cat  { color: var(--ink-400); }
.lcs-search__results span::before { content: none !important; }

/* ---------------------------------------------------------------
   28. Mobile pass
   Touch targets, legible minimum text, and comfortable spacing.
   Measured against a 390px viewport: every interactive element
   should clear ~44px, and nothing should sit below 13px.
   --------------------------------------------------------------- */
@media (max-width: 991px) {

  /* --- touch targets --- */
  ul.topnav > li > a { padding: 15px 14px; }
  ul.topnav ul li a { padding: 13px 12px 13px 24px; }
  ul.topnav ul li a::before { top: 20px; }

  footer ul.menu li a { padding: 12px 0 12px 16px; }
  footer ul.menu li a::before { top: 21px; }

  #top-bar .top-info ul li a { width: 40px; height: 40px; }
  #top-bar .top-info ul li a img { width: 15px; }

  .lcs-search input[type="search"] { padding: 12px 14px 12px 38px; font-size: 15px; }

  .page-hero__crumbs { gap: 6px 10px; }
  .page-hero__crumbs a { padding: 6px 0; display: inline-block; }

  /* the "Features" link under a product card was a 20px text link */
  .our-products p strong a {
    display: inline-block;
    margin-top: 8px;
    padding: 9px 0;
    font-size: 14px;
  }

  #cssmenu > ul > li > a { padding: 16px 4px; }
  #cssmenu > ul > li > ul > li > a { padding: 13px 14px; }

  .lcs-related__item { padding: 16px 18px; }
  .lcs-faq__item > summary { padding: 16px 46px 16px 16px; }

  /* --- legibility --- */
  .lcs-eyebrow, .lcs-pd__eyebrow { font-size: 13px; }
  .lcs-stat span, .lcs-search__cat, .page-hero__crumbs { font-size: 13px; }
  .footer_bottom p, footer ul.recent_posts li { font-size: 14px; }
}

@media (max-width: 767px) {
  /* --- rhythm: tighter cards, roomier text --- */
  body { font-size: 16px; line-height: 1.72; }
  .lcs-section { padding: 42px 0; }
  .middle_center { padding: 20px 16px 24px; }
  .main-content .container > .row.sub_content { padding: 24px 0 36px; }

  h1 { font-size: clamp(24px, 7vw, 30px); }
  h2 { font-size: clamp(20px, 5.4vw, 25px); }
  .lcs-pd__h { font-size: 18px; }
  .lcs-lead { font-size: 16.5px; }

  /* product panel reads better as one column with the image capped */
  .lcs-pd { gap: 20px; padding-bottom: 26px; margin-bottom: 28px; }
  .lcs-pd__media { min-height: 0; padding: 18px; position: static; }
  .lcs-pd__media img { max-height: 210px; }
  .lcs-pd__lead { font-size: 16px; margin-bottom: 20px; }
  .lcs-pd__trust { padding-top: 16px; }

  /* full-width primary actions are easier to hit */
  .lcs-pd__actions .lcs-btn,
  .lcs-product-cta__actions .lcs-btn { width: 100%; }

  /* spec tables scroll rather than squeeze; hint that they do */
  .table-scroll { position: relative; }
  .table-scroll > table { min-width: 420px; }
  .middle_center table td:first-child { width: 45%; }

  /* two product cards per row stays readable down to ~360px */
  .lcs-cardgrid { gap: 12px; }
  .our-products > a { height: 104px; }
  .our-products p strong { font-size: 13.5px; line-height: 1.4; }
  .our-products p.request-botton a { padding: 11px 10px; }

  .lcs-related__row { grid-template-columns: 1fr; }
  .lcs-chips { gap: 8px; }

  footer .footer-div { margin-bottom: 14px; }
  .footer_2 { padding: 34px 0 0; }
}

@media (max-width: 400px) {
  .lcs-cardgrid { grid-template-columns: 1fr; }
  .our-products > a { height: 150px; }
  .middle_center { padding: 18px 14px 22px; }
}

/* --- remaining touch targets --- */
@media (max-width: 991px) {
  /* footer client logos wrap an image with no padding of their own */
  ul#gallery li { min-height: 46px; padding: 6px; }
  ul#gallery li a { display: flex; align-items: center; justify-content: center;
                    width: 100%; min-height: 34px; }

  .our-products p strong a { padding: 11px 0; }

  /* contact links in the footer were bare text */
  footer ul.recent_posts li a { display: inline-block; padding: 8px 0; }
}

/* The hero dots are a 4px bar by design. Give each an invisible 44px hit area
   so they can actually be tapped, without changing how they look. */
.lcs-hero__dots { gap: 0; }
.lcs-hero__dots button {
  position: relative;
  background-clip: content-box;
  padding: 20px 5px;
  height: 44px;
  box-sizing: border-box;
}
.lcs-hero__dots button::before {
  content: "";
  position: absolute; left: 5px; right: 5px; top: 50%; margin-top: -2px;
  height: 4px; border-radius: 4px;
  background: rgba(255,255,255,.28);
  transition: background .2s ease;
}
.lcs-hero__dots button.is-active::before,
.lcs-hero__dots button[aria-current="true"]::before { background: var(--orange-500); }
@media (max-width: 991px) {
  ul#gallery li a { min-height: 40px; }
  .lcs-related__all a { padding: 10px 0; }
  .page-hero__crumbs a { padding: 8px 0; }
}

/* =====================================================================
   29. 2026 refinement — global medtech identity and conversion layer
   ===================================================================== */

/* Brand descriptor gives the legacy mark context without inventing a new
   logo. It is deliberately quiet: the equipment remains the visual lead. */
.lcs-brandline {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  padding-left: 18px;
  border-left: 1px solid var(--line);
  line-height: 1.25;
}
.lcs-brandline b {
  color: var(--navy-800);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .105em;
  text-transform: uppercase;
}
.lcs-brandline small { color: var(--ink-400); font-size: 10.5px; margin-top: 3px; }

@media (max-width: 1499px) and (min-width: 1200px) {
  .lcs-brandline { display: none; }
  .ribbonlink-container { gap: 12px; }
  #cssmenu > ul > li > a { padding-left: 11px; padding-right: 11px; }
  .lcs-headcta { margin-left: 4px; padding-left: 18px; padding-right: 18px; }
}

/* Hero: product-led presentation over a restrained technical grid. */
.lcs-hero > .container {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(300px, .78fr);
  gap: clamp(42px, 6vw, 92px);
  align-items: center;
}
/* Bootstrap 3's clearfix pseudo-elements become anonymous grid items unless
   disabled, which would otherwise swap the two hero columns. */
.lcs-hero > .container::before,
.lcs-hero > .container::after { display: none; content: none; }
.lcs-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  opacity: .14;
  background-image:
    linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 55%, #000);
  mask-image: linear-gradient(90deg, transparent, #000 55%, #000);
}
.lcs-hero__slides { opacity: .28; }
.lcs-hero__slide img { filter: saturate(.65) contrast(1.05); }
.lcs-hero::after {
  background:
    radial-gradient(circle at 78% 44%, rgba(24,119,209,.24), transparent 28%),
    linear-gradient(95deg, var(--navy-900) 10%, rgba(6,23,46,.98) 47%, rgba(6,23,46,.78) 100%);
}
.lcs-hero__inner { max-width: 700px; }
.lcs-hero h1 { font-size: clamp(40px, 4.3vw, 62px); letter-spacing: -.035em; }
.lcs-hero h1 em { color: #ffad7d; }
.lcs-hero__badge { backdrop-filter: blur(10px); }

.lcs-hero-product {
  --product-x: 0px;
  --product-y: 0px;
  --surface-x: 0px;
  --surface-y: 0px;
  position: relative;
  isolation: isolate;
  display: block;
  min-width: 0;
  padding: 15px 0 8px;
  color: #fff !important;
  border: 0;
  background: transparent;
  transform: none;
}
.lcs-hero-product:hover { transform: none; }
.lcs-hero-product__label {
  position: relative;
  z-index: 5;
  display: inline-flex;
  margin: 0 0 9px 24px;
  padding: 7px 11px;
  color: rgba(255,255,255,.74);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 999px;
  background: rgba(5,24,47,.36);
  backdrop-filter: blur(9px);
}
.lcs-hero-product__media {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 330px;
  padding: 24px 24px 48px;
  overflow: visible;
  perspective: 900px;
}
.lcs-hero-product__media::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 3% 3% 9%;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 48% 52% 45% 55% / 52% 40% 60% 48%;
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.98), transparent 34%),
    linear-gradient(145deg, #f8fbff 4%, #dbe8f3 62%, #bdcfe0 100%);
  box-shadow: 0 40px 80px rgba(0,0,0,.27), inset -20px -26px 50px rgba(52,93,131,.12);
  translate: var(--surface-x) var(--surface-y);
  transition: translate .7s cubic-bezier(.22,.7,.3,1);
  animation: lcs-stage-morph 15s ease-in-out infinite alternate;
}
.lcs-hero-product__media::after {
  content: "";
  position: absolute;
  z-index: 3;
  inset: 3% 3% 9%;
  border-radius: 48% 52% 45% 55% / 52% 40% 60% 48%;
  background: linear-gradient(112deg, #e8f0f7, #f9fbfd 72%);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .36s cubic-bezier(.76,0,.24,1);
}
.lcs-hero-product__media img {
  position: relative;
  z-index: 2;
  width: auto;
  max-height: 298px;
  mix-blend-mode: multiply;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 24px;
  background: #f7f9fb;
  box-shadow: 0 24px 52px rgba(11,37,69,.22);
  filter: none;
  translate: var(--product-x) var(--product-y);
  transform: rotate(-1.2deg);
  transition: opacity .28s ease, translate .75s cubic-bezier(.22,.7,.3,1), transform .5s cubic-bezier(.22,.7,.3,1);
}
.lcs-hero-product:hover .lcs-hero-product__media img { transform: rotate(0) scale(1.018); }
.lcs-hero-product__foot {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: calc(100% - 36px);
  margin: -24px auto 0;
  padding: 16px 2px 9px;
  color: #fff;
}
.lcs-hero-product__foot > span { min-width: 0; }
.lcs-hero-product__foot b { display: block; color: #fff; font-size: 20px; }
.lcs-hero-product__foot small { display: block; color: rgba(255,255,255,.58); font-size: 11.5px; margin-top: 2px; }
.lcs-hero-product__foot em { flex: 0 0 auto; color: #ffad7d; font-size: 12px; font-style: normal; font-weight: 750; }
.lcs-hero-product__label,
.lcs-hero-product__foot { transition: opacity .2s ease, transform .25s ease; }
.lcs-hero-product.is-changing .lcs-hero-product__label,
.lcs-hero-product.is-changing .lcs-hero-product__foot { opacity: 0; transform: translateY(7px); }
.lcs-hero-product.is-changing .lcs-hero-product__media img { opacity: 0; transform: translateX(22px) scale(.96); }
.lcs-hero-product.is-changing .lcs-hero-product__media::after { transform: scaleX(1); transform-origin: left; }
.lcs-hero-product__sequence { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 9px; margin: 5px 5px 0; color: rgba(255,255,255,.42); font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.lcs-hero-product__sequence i { position: relative; height: 1px; overflow: hidden; background: rgba(255,255,255,.15); }
.lcs-hero-product__sequence b { position: absolute; inset: 0; background: linear-gradient(90deg, #ff8b50, #ffbd97); transform: scaleX(0); transform-origin: left; }
.lcs-hero-product.is-counting .lcs-hero-product__sequence b { animation: lcs-product-progress 6s linear forwards; }
.lcs-hero-product.is-paused .lcs-hero-product__sequence b { animation-play-state: paused; }

/* International supply story — abstract network artwork stays honest and
   crisp at every resolution, while real product photography remains primary. */
.lcs-export { background: var(--navy-900); overflow: hidden; }
.lcs-export__panel {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(360px, .88fr);
  gap: clamp(48px, 7vw, 96px);
  align-items: center;
}
.lcs-export h2 { color: #fff; font-size: clamp(30px, 3.5vw, 45px); letter-spacing: -.03em; }
.lcs-export__copy > p { max-width: 64ch; color: rgba(255,255,255,.68); font-size: 16.5px; }
.lcs-export__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 34px 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.12);
}
.lcs-export__facts > div { display: flex; gap: 14px; min-width: 0; padding: 20px; background: rgba(255,255,255,.055); }
.lcs-export__facts b { color: #ffad7d; font-size: 11px; letter-spacing: .08em; }
.lcs-export__facts span { min-width: 0; color: rgba(255,255,255,.58); font-size: 12.5px; line-height: 1.5; }
.lcs-export__facts strong { display: block; margin-bottom: 3px; color: #fff; font-size: 14px; }
.lcs-export__visual {
  --near-x: 0px;
  --near-y: 0px;
  --far-x: 0px;
  --far-y: 0px;
  position: relative;
  min-height: 430px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lcs-globe {
  position: relative;
  z-index: 3;
  width: 220px;
  height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 50%;
  background:
    linear-gradient(90deg, transparent 48%, rgba(255,255,255,.14) 49%, rgba(255,255,255,.14) 51%, transparent 52%),
    linear-gradient(transparent 48%, rgba(255,255,255,.14) 49%, rgba(255,255,255,.14) 51%, transparent 52%),
    radial-gradient(circle at 35% 28%, rgba(71,157,232,.72), rgba(24,74,130,.48) 52%, rgba(9,34,67,.86));
  box-shadow: inset -24px -18px 40px rgba(0,0,0,.24), 0 24px 80px rgba(24,119,209,.2);
  translate: var(--near-x) var(--near-y);
  transition: translate .45s cubic-bezier(.22,.7,.3,1);
}
.lcs-globe::before, .lcs-globe::after { content: ""; position: absolute; inset: 18px 58px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; }
.lcs-globe::after { inset: 58px 18px; }
.lcs-globe span { color: #fff; font-size: 52px; font-weight: 800; line-height: 1; letter-spacing: -.05em; }
.lcs-globe small { color: rgba(255,255,255,.68); text-align: center; font-size: 11px; line-height: 1.35; letter-spacing: .1em; text-transform: uppercase; }
.lcs-orbit { position: absolute; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }
.lcs-orbit--one { width: 340px; height: 340px; }
.lcs-orbit--two { width: 430px; height: 225px; transform: rotate(-18deg); }
.lcs-orbit--one,
.lcs-orbit--two { translate: var(--far-x) var(--far-y); transition: translate .65s cubic-bezier(.22,.7,.3,1); }
.lcs-export__tag {
  position: absolute;
  z-index: 4;
  padding: 9px 13px 9px 27px;
  color: rgba(255,255,255,.82);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  background: rgba(11,37,69,.82);
  box-shadow: 0 12px 28px rgba(0,0,0,.2);
  backdrop-filter: blur(8px);
  font-size: 11.5px;
  font-weight: 650;
  translate: var(--near-x) var(--near-y);
  transition: translate .5s cubic-bezier(.22,.7,.3,1);
}
.lcs-export__tag::before { content: ""; position: absolute; left: 12px; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: #ff8b50; box-shadow: 0 0 0 4px rgba(234,85,20,.14); }
.lcs-export__tag--a { left: 0; top: 90px; }
.lcs-export__tag--b { right: 0; top: 178px; }
.lcs-export__tag--c { left: 20px; bottom: 70px; }

/* Four-step procurement journey. */
.lcs-journey { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); overflow: hidden; }
.lcs-journey > div { position: relative; min-width: 0; padding: 31px 27px 30px; }
.lcs-journey > div + div { border-left: 1px solid var(--line); }
.lcs-journey > div + div::before { content: ""; position: absolute; left: -6px; top: 42px; width: 11px; height: 11px; border-top: 2px solid var(--blue-500); border-right: 2px solid var(--blue-500); transform: rotate(45deg); background: var(--surface); }
.lcs-journey span { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin-bottom: 20px; border-radius: 50%; color: var(--blue-600); background: var(--blue-50); font-size: 12px; font-weight: 800; }
.lcs-journey h3 { font-size: 17px; margin-bottom: 8px; }
.lcs-journey p { color: var(--ink-500); font-size: 13.5px; line-height: 1.6; }
.lcs-cta__kicker { display: block; margin-bottom: 9px; color: #ffb38a; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }

/* Product decision panel and section navigation applied site-wide by JS. */
.middle_center.is-product-detail { min-width: 0; }
.lcs-pd__name { margin-bottom: 14px; font-size: clamp(25px, 3vw, 37px); letter-spacing: -.03em; }
.lcs-pd .lcs-chips { margin: 0 0 24px; }
.lcs-product-nav {
  position: sticky;
  top: calc(var(--header-h) + 10px);
  z-index: 15;
  display: flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  margin: -12px 0 34px;
  padding: 7px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(12px);
}
.lcs-product-nav a { flex: 0 0 auto; padding: 8px 14px; border-radius: 999px; color: var(--ink-500); font-size: 12.5px; font-weight: 650; }
.lcs-product-nav a:hover { color: var(--navy-800); background: var(--blue-50); }
.lcs-product-nav a:last-child { margin-left: auto; color: #fff; background: var(--orange-500); }
.is-product-detail > p { max-width: 78ch; }
.is-product-detail > ul, .is-product-detail > ol, .is-product-detail > dl { max-width: 82ch; }
.is-product-detail .table-scroll { max-width: 100%; }
.is-product-detail .table-scroll > table { width: 100% !important; }

/* The mobile RFQ is intentionally text-only and occupies less space than a
   chat bubble. It never appears on an enquiry form. */
.lcs-mobile-rfq { display: none; }

/* Systemic overflow protection. Bootstrap's legacy negative margins and old
   inline widths must never make content disappear beyond a phone viewport. */
.row > [class*="col-"],
.middle_center,
.main-content,
.page-hero__wrap,
.lcs-hero__inner,
.lcs-grid > *,
.lcs-cardgrid > *,
.lcs-cta > *,
.lcs-export__panel > * { min-width: 0; }
.middle_center img, .middle_center table, .middle_center iframe { max-width: 100%; }

@media (max-width: 1199px) {
  .lcs-brandline { display: none; }
  .lcs-hero > .container { grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr); gap: 38px; }
  .lcs-hero-product__media { min-height: 260px; }
}

@media (max-width: 991px) {
  .lcs-hero > .container { display: block; }
  .lcs-hero-product { display: none; }
  .lcs-hero__inner { max-width: 720px; }
  .lcs-export__panel { grid-template-columns: 1fr; }
  .lcs-export__visual { min-height: 370px; }
  .lcs-journey { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lcs-journey > div:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .lcs-journey > div:nth-child(4) { border-top: 1px solid var(--line); }
  .lcs-journey > div:nth-child(3)::before { display: none; }
  .lcs-pd__media { position: static; }
}

@media (max-width: 767px) {
  body.has-mobile-rfq { padding-bottom: 64px; }
  .container { width: 100% !important; max-width: 100%; padding-left: 18px; padding-right: 18px; }
  .row.sub_content { margin-left: -9px; margin-right: -9px; }
  .row.sub_content > [class*="col-"] { padding-left: 9px; padding-right: 9px; }

  #top-bar .col-sm-5.top-info { width: 100%; padding: 8px 18px; flex-wrap: nowrap; }
  #top-bar .col-sm-5.top-info .lcs-search { flex: 1 1 auto; order: 0; min-width: 0; }
  #top-bar .col-sm-5.top-info ul { display: none; }
  .lcs-search input[type="search"] { min-width: 0; padding-top: 9px; padding-bottom: 9px; font-size: 14px; }
  .lcs-search__results { left: 0; right: auto; width: min(420px, calc(100vw - 36px)); transform: none; }

  .ribbonlink-container { width: 100%; flex-wrap: wrap; }
  .ribbonlink-container > a:not(.lcs-headcta) { min-width: 0; }
  .bg-ribbon .ribboncrest { width: 158px; }
  .lcs-burger { flex: 0 0 46px; }
  .ribbonlink-container .nav { min-width: 0; }

  .lcs-hero__inner { width: 100%; padding: 55px 0 70px; }
  .lcs-hero h1 { font-size: clamp(32px, 10vw, 42px); }
  .lcs-hero p { font-size: 16px; line-height: 1.65; }
  .lcs-hero__marks { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .lcs-hero__dots { margin-top: 22px; }
  .lcs-stats { width: 100%; }

  .middle_center { width: 100%; max-width: 100%; overflow: hidden; }
  .page-hero__wrap { width: 100%; }
  .page-hero__inner h1 { max-width: 100%; overflow-wrap: anywhere; }
  .page-hero__crumbs { max-width: 100%; }

  .lcs-export__facts { grid-template-columns: 1fr; }
  .lcs-export__visual { min-height: 330px; transform: scale(.84); margin: -25px -28px; }
  .lcs-export__tag--a { left: 0; }
  .lcs-export__tag--b { right: 0; }
  .lcs-export__tag--c { left: 4px; }
  .lcs-journey { grid-template-columns: 1fr; }
  .lcs-journey > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .lcs-journey > div + div::before { display: none; }

  .lcs-pd { width: 100%; }
  .lcs-pd__name { font-size: 25px; }
  .lcs-pd__media { width: 100%; min-width: 0; }
  .lcs-pd__media img { max-width: 100%; }
  .lcs-product-nav { top: 72px; margin: -8px 0 28px; border-radius: var(--radius); }
  .lcs-product-nav a:last-child { margin-left: 0; }

  .lcs-mobile-rfq {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 110;
    display: block;
    padding: 9px 16px max(9px, env(safe-area-inset-bottom));
    border-top: 1px solid rgba(255,255,255,.14);
    background: rgba(6,23,46,.96);
    box-shadow: 0 -8px 30px rgba(6,23,46,.2);
    backdrop-filter: blur(12px);
  }
  .lcs-mobile-rfq a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    color: #fff !important;
    border-radius: 999px;
    background: var(--orange-500);
    font-size: 14px;
    font-weight: 750;
  }
  body.has-mobile-rfq .lcs-top { bottom: 76px; right: 76px; }
}

@media (max-width: 420px) {
  .lcs-hero__badge { align-items: flex-start; border-radius: var(--radius); }
  .lcs-stat { min-width: 0; }
  .lcs-export__visual { transform: scale(.72); margin: -55px -60px; }
}

/* =====================================================================
   30. Product discovery, RFQ workspace and refined enquiry experience
   ===================================================================== */

.lcs-faq-legacy[hidden] {
  display: none !important;
}

/* About page: an editorial, export-ready company story. */
.lcs-about-page .main-content .row.sub_content > .col-sm-3 { display: none; }
.lcs-about-page .main-content .row.sub_content > .col-lg-9 { width: 100%; }
.lcs-about-page .main-content .middle_center { padding: 28px; }
.lcs-about { display: grid; gap: 28px; margin-bottom: 42px; }
.lcs-about h2 { margin: 8px 0 14px; color: var(--navy-900); font-size: clamp(27px, 3vw, 42px); line-height: 1.12; letter-spacing: -.035em; }
.lcs-about p { margin: 0; color: var(--ink-600); font-size: 16px; line-height: 1.75; }
.lcs-about__lead {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(230px, .65fr);
  gap: 42px;
  overflow: hidden;
  padding: clamp(30px, 5vw, 56px);
  border-radius: 26px;
  color: #fff;
  background:
    radial-gradient(circle at 92% 8%, rgba(66,137,211,.38), transparent 30%),
    linear-gradient(135deg, #061b34 0%, #0c315a 100%);
  box-shadow: 0 24px 60px rgba(5,31,60,.16);
}
.lcs-about__lead::after { content: ""; position: absolute; right: -95px; bottom: -120px; width: 330px; height: 330px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; box-shadow: 0 0 0 48px rgba(255,255,255,.025), 0 0 0 96px rgba(255,255,255,.02); pointer-events: none; }
.lcs-about__lead h2 { max-width: 650px; color: #fff; }
.lcs-about__lead p { max-width: 690px; color: rgba(255,255,255,.72); }
.lcs-about__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.lcs-about__lead .lcs-btn--outline { border-color: rgba(255,255,255,.34); color: #fff !important; }
.lcs-about__signal { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, 1fr); align-content: center; border: 1px solid rgba(255,255,255,.14); border-radius: 20px; background: rgba(255,255,255,.07); backdrop-filter: blur(8px); }
.lcs-about__signal div { min-width: 0; padding: 24px 20px; }
.lcs-about__signal div:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.12); }
.lcs-about__signal div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.12); }
.lcs-about__signal strong { display: block; color: #fff; font-size: clamp(25px, 3vw, 38px); line-height: 1; letter-spacing: -.035em; }
.lcs-about__signal span { display: block; margin-top: 8px; color: rgba(255,255,255,.62); font-size: 11px; line-height: 1.35; }
.lcs-about__principles { padding: clamp(30px, 4vw, 48px); border: 1px solid var(--line); border-radius: 26px; background: #fff; }
.lcs-about__principles .lcs-section-heading { max-width: 680px; }
.lcs-about__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 28px; }
.lcs-about__cards article { min-width: 0; padding: 26px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg, #fff, #f6f9fc); }
.lcs-about__cards article > span { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; color: var(--orange-600); background: var(--orange-50); font-size: 11px; font-weight: 800; }
.lcs-about__cards h3 { margin: 22px 0 10px; color: var(--navy-800); font-size: 18px; }
.lcs-about__cards p { font-size: 14px; line-height: 1.65; }
.lcs-about__range { display: grid; grid-template-columns: minmax(230px, .8fr) minmax(0, 1.2fr); gap: clamp(30px, 5vw, 62px); padding: clamp(30px, 4vw, 48px); border-radius: 26px; background: #eef4fa; }
.lcs-about__range nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lcs-about__range nav a { position: relative; min-width: 0; padding: 20px 42px 20px 20px; border: 1px solid transparent; border-radius: 15px; color: var(--navy-800); background: rgba(255,255,255,.78); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.lcs-about__range nav a::after { content: "\2197"; position: absolute; top: 20px; right: 18px; color: var(--orange-500); font-size: 18px; }
.lcs-about__range nav a:hover { transform: translateY(-2px); border-color: #cad9e8; box-shadow: 0 12px 25px rgba(7,35,67,.08); }
.lcs-about__range nav span, .lcs-about__range nav b { display: block; }
.lcs-about__range nav span { font-weight: 800; }
.lcs-about__range nav b { margin-top: 6px; color: var(--ink-500); font-size: 11px; font-weight: 500; line-height: 1.45; }
.lcs-about__global { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; align-items: center; gap: 28px; padding: 30px 34px; border: 1px solid #f3d2c2; border-radius: 24px; background: linear-gradient(120deg, #fff8f4, #fff); }
.lcs-about__global h2 { margin-bottom: 9px; font-size: clamp(24px, 2.5vw, 34px); }
.lcs-about__global p { font-size: 14px; line-height: 1.6; }
.lcs-about__global-mark { display: flex; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 1; border-radius: 50%; color: #fff; background: var(--orange-500); box-shadow: 0 12px 25px rgba(234,85,20,.22); }
.lcs-about__global-mark span { font-size: 29px; font-weight: 800; line-height: 1; }
.lcs-about__global-mark small { margin-top: 4px; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.lcs-about__global > a { white-space: nowrap; color: var(--orange-600); font-weight: 800; }
.lcs-about__global > a span { margin-left: 5px; transition: transform .2s ease; }
.lcs-about__global > a:hover span { display: inline-block; transform: translateX(4px); }

@media (max-width: 991px) {
  .lcs-about__lead, .lcs-about__range { grid-template-columns: 1fr; }
  .lcs-about__cards { grid-template-columns: 1fr; }
  .lcs-about__global { grid-template-columns: 90px 1fr; }
  .lcs-about__global > a { grid-column: 2; }
}

@media (max-width: 575px) {
  .lcs-contact-card, .lcs-contact-card tbody { display: block; width: 100% !important; }
  .lcs-contact-card tr { display: grid; grid-template-columns: 54px minmax(0, 1fr); width: 100%; }
  .lcs-contact-card td { display: block; width: auto !important; min-width: 0; white-space: normal !important; overflow-wrap: anywhere !important; word-break: break-word !important; }
  .lcs-contact-card td[colspan] { grid-column: 1 / -1; }
  .lcs-contact-card td:first-child:not([colspan]) { width: auto !important; min-width: 0; }
  .lcs-contact-card td:last-child:not([colspan]) { padding-right: 26px !important; }
  .lcs-about-page .main-content .middle_center { padding: 14px; }
  .lcs-about { gap: 18px; }
  .lcs-about__lead, .lcs-about__principles, .lcs-about__range, .lcs-about__global { padding: 24px 20px; border-radius: 20px; }
  .lcs-about__lead { gap: 26px; }
  .lcs-about__signal { grid-template-columns: 1fr 1fr; }
  .lcs-about__signal div { padding: 18px 15px; }
  .lcs-about__actions .lcs-btn { width: 100%; }
  .lcs-about__range nav { grid-template-columns: 1fr; }
  .lcs-about__global { grid-template-columns: 68px minmax(0, 1fr); gap: 16px; }
  .lcs-about__global > a { grid-column: 1 / -1; white-space: normal; }
  .lcs-about__global-mark span { font-size: 22px; }
  .lcs-about__global-mark small { font-size: 8px; }
}

/* Product finder */
.lcs-finder {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: var(--surface);
  box-shadow: var(--shadow-md);
}
.lcs-finder__intro {
  position: relative;
  padding: clamp(34px, 4.5vw, 58px);
  overflow: hidden;
  color: rgba(255,255,255,.7);
  background:
    radial-gradient(circle at 10% 100%, rgba(24,119,209,.45), transparent 36%),
    linear-gradient(145deg, var(--navy-900), var(--navy-700));
}
.lcs-finder__intro::after {
  content: "";
  position: absolute;
  right: -80px;
  bottom: -95px;
  width: 230px;
  height: 230px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  box-shadow: 0 0 0 38px rgba(255,255,255,.025), 0 0 0 76px rgba(255,255,255,.018);
}
.lcs-finder__intro h2 { position: relative; z-index: 1; color: #fff; font-size: clamp(28px, 3vw, 40px); letter-spacing: -.03em; }
.lcs-finder__intro p { position: relative; z-index: 1; font-size: 15px; line-height: 1.72; }
.lcs-finder__prompts { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.lcs-finder__prompts button {
  padding: 8px 12px;
  color: rgba(255,255,255,.82);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  font-size: 11.5px;
  font-weight: 650;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.lcs-finder__prompts button:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.13); }
.lcs-finder__tool { min-width: 0; padding: clamp(30px, 4vw, 52px); }
.lcs-finder__tool label { display: block; margin-bottom: 11px; color: var(--navy-800); font-size: 13px; font-weight: 750; }
.lcs-finder__controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.lcs-finder__controls input { max-width: none; min-width: 0; padding-left: 43px; background: var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%237c8b9c'%3E%3Cpath d='M11.7 10.3a6 6 0 1 0-1.4 1.4l3 3a1 1 0 0 0 1.4-1.4zM7 11a4 4 0 1 1 0-8 4 4 0 0 1 0 8'/%3E%3C/svg%3E") no-repeat 16px center / 16px; }
.lcs-finder__status { margin: 15px 0 0; color: var(--ink-400); font-size: 12.5px; }
.lcs-finder__results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
.lcs-finder-card { display: grid; grid-template-columns: 82px minmax(0, 1fr); min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.lcs-finder-card__media { display: flex; align-items: center; justify-content: center; min-height: 106px; padding: 9px; background: var(--surface-2); }
.lcs-finder-card__media img { max-height: 82px; width: auto; mix-blend-mode: multiply; }
.lcs-finder-card__copy { min-width: 0; padding: 13px 13px 11px; }
.lcs-finder-card__copy > span { display: block; overflow: hidden; color: var(--ink-400); font-size: 9.5px; font-weight: 700; letter-spacing: .07em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.lcs-finder-card h3 { margin: 4px 0 8px; font-size: 13px; line-height: 1.35; }
.lcs-finder-card h3 a { color: var(--navy-800); }
.lcs-finder-card__actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.lcs-finder-card__actions a, .lcs-finder-card__actions button { padding: 0; color: var(--blue-600); border: 0; background: transparent; font-size: 10.5px; font-weight: 750; cursor: pointer; }
.lcs-finder-card__actions button { color: var(--orange-600); }

/* RFQ basket trigger and drawer */
.lcs-rfq-trigger {
  position: relative;
  flex: 0 0 43px;
  width: 43px;
  height: 43px;
  margin-left: 12px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--navy-800);
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--surface-2);
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.lcs-rfq-trigger:hover { transform: translateY(-1px); border-color: var(--blue-500); background: var(--blue-50); }
.lcs-rfq-trigger svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lcs-rfq-trigger b { position: absolute; right: -4px; top: -5px; min-width: 19px; height: 19px; padding: 0 4px; display: flex; align-items: center; justify-content: center; color: #fff; border: 2px solid #fff; border-radius: 999px; background: var(--orange-500); font-size: 9px; line-height: 1; }
.lcs-rfq-shade { position: fixed; inset: 0; z-index: 198; visibility: hidden; opacity: 0; background: rgba(4,17,34,.54); backdrop-filter: blur(2px); transition: opacity .28s ease, visibility .28s; }
.lcs-rfq-shade.is-open { visibility: visible; opacity: 1; }
.lcs-rfq-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 200;
  width: min(470px, 100vw);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: var(--surface);
  box-shadow: -30px 0 80px rgba(6,23,46,.2);
  transform: translateX(104%);
  transition: transform .38s cubic-bezier(.22,.75,.28,1);
}
.lcs-rfq-drawer.is-open { transform: translateX(0); }
body.lcs-drawer-open { overflow: hidden; }
.lcs-rfq-drawer__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 30px; border-bottom: 1px solid var(--line); }
.lcs-rfq-drawer__head span { color: var(--orange-500); font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.lcs-rfq-drawer__head h2 { margin: 5px 0 0; font-size: 23px; }
.lcs-rfq-close { flex: 0 0 40px; width: 40px; height: 40px; padding: 0; color: var(--ink-500); border: 1px solid var(--line); border-radius: 50%; background: var(--surface-2); font-size: 25px; line-height: 1; cursor: pointer; }
.lcs-rfq-drawer__body { overflow-y: auto; padding: 20px 30px; }
.lcs-rfq-drawer__foot { padding: 20px 30px 30px; border-top: 1px solid var(--line); }
.lcs-rfq-drawer__foot p { margin-bottom: 14px; color: var(--ink-400); font-size: 12px; }
.lcs-rfq-send { width: 100%; }
.lcs-rfq-send.is-disabled { pointer-events: none; filter: grayscale(.4); opacity: .48; }
.lcs-rfq-empty { min-height: 330px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px; text-align: center; }
.lcs-rfq-empty > span { width: 56px; height: 56px; margin-bottom: 16px; display: flex; align-items: center; justify-content: center; color: var(--blue-600); border-radius: 50%; background: var(--blue-50); font-size: 27px; font-weight: 300; }
.lcs-rfq-empty strong { font-size: 17px; }
.lcs-rfq-empty p { max-width: 27ch; margin-top: 7px; color: var(--ink-400); font-size: 13px; }
.lcs-rfq-item { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 13px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.lcs-rfq-item__thumb { width: 64px; height: 58px; display: flex; align-items: center; justify-content: center; padding: 6px; border-radius: var(--radius-sm); background: var(--surface-2); }
.lcs-rfq-item__thumb img { max-width: 100%; max-height: 100%; width: auto; mix-blend-mode: multiply; }
.lcs-rfq-item__copy { min-width: 0; }
.lcs-rfq-item__copy a { display: block; color: var(--navy-800); font-size: 13px; font-weight: 700; line-height: 1.4; }
.lcs-rfq-item__copy small { display: block; margin-top: 3px; color: var(--ink-400); font-size: 10.5px; }
.lcs-rfq-remove { padding: 7px; color: var(--ink-400); border: 0; background: transparent; font-size: 10px; cursor: pointer; }
.lcs-rfq-remove:hover { color: #b42318; }
.lcs-btn--quiet { color: var(--blue-600) !important; border-color: var(--blue-100); background: var(--blue-50); box-shadow: none; cursor: pointer; }
.lcs-btn--quiet:hover, .lcs-btn--quiet.is-added { color: #fff !important; border-color: var(--blue-600); background: var(--blue-600); }
.lcs-card-rfq { width: 100%; margin-top: 7px; padding: 9px 10px; color: var(--blue-600); border: 1px solid var(--blue-100); border-radius: 999px; background: var(--blue-50); font-size: 11px; font-weight: 750; cursor: pointer; }
.lcs-card-rfq:hover, .lcs-card-rfq.is-added { color: #fff; border-color: var(--blue-600); background: var(--blue-600); }

/* Form presentation */
.middle_center .lcs-form-shell, .lcs-form-shell { overflow: hidden; padding: 0 !important; border: 1px solid var(--line) !important; border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.lcs-form-intro { padding: 30px 34px 26px; color: rgba(255,255,255,.7); background: linear-gradient(120deg, var(--navy-900), var(--navy-700)); }
.lcs-form-intro span { color: #ffad7d; font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.lcs-form-intro h2 { margin: 6px 0 8px; color: #fff; font-size: 27px; }
.lcs-form-intro h2 { height: auto !important; overflow: visible !important; white-space: normal !important; line-height: 1.2 !important; }
.lcs-form-intro p { max-width: 62ch; margin: 0; color: rgba(255,255,255,.68); font-size: 13.5px; line-height: 1.65; }
.lcs-contact-card { table-layout: fixed; }
.lcs-contact-card td { overflow-wrap: anywhere; word-break: break-word; }
.lcs-contact-card td:first-child:not([colspan]) { width: 68px !important; }
.lcs-contact-card td:last-child:not([colspan]) { width: auto !important; }
.lcs-form-table { display: block; padding: 25px 28px 15px; }
.lcs-form-table tbody { display: block; }
.lcs-form-table tr { display: grid; grid-template-columns: minmax(135px, 190px) minmax(0, 1fr); align-items: center; gap: 18px; margin-bottom: 13px; }
.lcs-form-table tr[style*="display:none"] { display: none !important; }
.lcs-form-table tr:first-child:has(h2) { display: none; }
.lcs-form-table td { display: block; width: auto !important; min-width: 0; padding: 0 !important; }
.lcs-form-table input:not([type="submit"]), .lcs-form-table select, .lcs-form-table textarea { width: 100% !important; max-width: none; background-color: var(--surface-2); }
.lcs-form-table textarea { min-height: 95px; }
.lcs-form-table td:has(#captcha_code) { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.lcs-form-table #captcha_code { flex: 0 0 110px; }
.lcs-form-table input[type="submit"] { min-width: 190px; min-height: 48px; }
.lcs-form-table input[type="submit"].is-sending { opacity: .72; }
.lcs-form-assurance { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 24px; padding: 15px 24px; border-top: 1px solid var(--line); background: var(--surface-2); }
.lcs-form-assurance span { position: relative; padding-left: 18px; color: var(--ink-500); font-size: 11.5px; font-weight: 600; }
.lcs-form-assurance span::before { content: ""; position: absolute; left: 0; top: 4px; width: 10px; height: 10px; border-radius: 50%; background: var(--blue-500); box-shadow: inset 0 0 0 3px var(--blue-100); }

/* Lightweight local motion: no render-blocking library, and disabled for
   visitors who request reduced motion. */
@keyframes lcs-product-progress { to { transform: scaleX(1); } }
@keyframes lcs-stage-morph {
  from { border-radius: 48% 52% 45% 55% / 52% 40% 60% 48%; }
  to { border-radius: 54% 46% 52% 48% / 44% 55% 45% 56%; }
}
.lcs-hero__inner { translate: 0 var(--hero-copy-shift, 0px); opacity: var(--hero-copy-opacity, 1); transition: translate .08s linear, opacity .08s linear; }
.lcs-hero-product { translate: 0 var(--hero-product-shift, 0px); }

@media (max-width: 1199px) {
  .lcs-finder { grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); }
  .lcs-finder__results { grid-template-columns: 1fr; }
  .lcs-rfq-trigger { margin-left: 8px; }
}

@media (max-width: 991px) {
  .lcs-finder { grid-template-columns: 1fr; }
  .lcs-finder__results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ribbonlink-container { width: 100%; }
  .ribbonlink-container > a:not(.lcs-headcta) { order: 0; }
  .lcs-rfq-trigger { order: 1; margin-left: auto; margin-right: 10px; }
  .lcs-burger { order: 2; margin-left: 0; margin-right: 0; }
  .ribbonlink-container .nav { order: 3; }
}

@media (max-width: 767px) {
  .lcs-finder { border-radius: var(--radius-lg); }
  .lcs-finder__intro, .lcs-finder__tool { padding: 28px 22px; }
  .lcs-finder__controls { grid-template-columns: 1fr; }
  .lcs-finder__controls .lcs-btn { width: 100%; }
  .lcs-finder__results { grid-template-columns: 1fr; }
  .lcs-rfq-trigger { flex-basis: 40px; width: 40px; height: 40px; margin-right: 8px; }
  .lcs-rfq-drawer__head { padding: 24px 20px; }
  .lcs-rfq-drawer__body { padding: 14px 20px; }
  .lcs-rfq-drawer__foot { padding: 17px 20px max(22px, env(safe-area-inset-bottom)); }
  .lcs-form-intro { padding: 25px 21px 22px; }
  .lcs-form-table { padding: 22px 20px 10px; }
  .lcs-form-table tr { display: block; margin-bottom: 17px; }
  .lcs-form-table td:first-child { margin-bottom: 6px; }
  .lcs-form-table input[type="submit"] { width: 100% !important; }
  .lcs-form-assurance { justify-content: flex-start; padding: 15px 20px; }
}

/* Homepage kinetic hero: the visual rhythm is based on the user's marquee
   and magnifying-dock references, implemented locally for this PHP site. */
.lcs-hero--marquee {
  height: clamp(780px, calc(100svh - 105px), 900px);
  min-height: 780px;
  background: #06172e;
}
.lcs-hero--marquee::before {
  inset: 0;
  opacity: 1;
  background:
    radial-gradient(circle at 17% 32%, rgba(31,112,187,.18), transparent 27%),
    radial-gradient(circle at 82% 74%, rgba(234,85,20,.15), transparent 28%);
  -webkit-mask-image: none;
  mask-image: none;
}
.lcs-hero--marquee::after {
  background: linear-gradient(180deg, rgba(6,23,46,.82), #06172e 68%, rgba(6,23,46,.78));
}
.lcs-hero--marquee > .container {
  position: relative;
  z-index: 4;
  display: block;
}
.lcs-hero--marquee .lcs-hero__inner {
  width: min(920px, 100%);
  max-width: none;
  margin: 0 auto;
  padding: clamp(52px, 7vh, 78px) 0 310px;
  text-align: center;
}
.lcs-hero--marquee .lcs-hero__badge { margin-bottom: 18px; animation: lcs-hero-rise .65s .05s both cubic-bezier(.17,.55,.55,1); }
.lcs-hero--marquee h1 {
  max-width: 920px;
  margin: 0 auto 17px;
  font-size: clamp(45px, 5vw, 68px);
  line-height: 1.01;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.lcs-word {
  display: inline-block;
  font-style: normal;
  opacity: 0;
  transform: translateY(20px) scale(.98);
  animation: lcs-word-rise .7s var(--word-delay, .14s) both cubic-bezier(.17,.55,.55,1);
}
.lcs-hero--marquee .lcs-hero__inner > p {
  max-width: 69ch;
  margin: 0 auto 22px;
  font-size: 16.5px;
  line-height: 1.62;
  animation: lcs-hero-rise .7s .62s both cubic-bezier(.17,.55,.55,1);
}
.lcs-hero--marquee .lcs-hero__cta {
  justify-content: center;
  margin-bottom: 20px;
  animation: lcs-hero-rise .7s .72s both cubic-bezier(.17,.55,.55,1);
}
.lcs-hero--marquee .lcs-hero__cta .lcs-btn { transition: translate .25s cubic-bezier(.22,.7,.3,1), scale .25s cubic-bezier(.22,.7,.3,1), background .2s ease, box-shadow .2s ease; }
.lcs-hero--marquee .lcs-hero__cta .lcs-btn:hover { scale: 1.045; }
.lcs-hero--marquee .lcs-hero__cta .lcs-btn:active { scale: .96; }
.lcs-hero--marquee .lcs-hero__marks { justify-content: center; gap: 8px 22px; animation: lcs-hero-rise .7s .8s both cubic-bezier(.17,.55,.55,1); }
.lcs-hero--marquee .lcs-hero__marks span { font-size: 12.5px; }
.lcs-hero--marquee .lcs-hero__marks span::before { width: 16px; height: 16px; flex-basis: 16px; }

.lcs-hero-dock-wrap {
  min-height: 88px;
  margin-top: 13px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  animation: lcs-hero-rise .7s .88s both cubic-bezier(.17,.55,.55,1);
}
.lcs-hero-dock-wrap > span { margin-bottom: 7px; color: rgba(255,255,255,.46); font-size: 9px; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
.lcs-hero-dock {
  height: 57px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  box-shadow: 0 18px 46px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.1);
  backdrop-filter: blur(14px);
}
.lcs-hero-dock a {
  --dock-size: 42px;
  --dock-lift: 0px;
  position: relative;
  width: var(--dock-size);
  height: var(--dock-size);
  flex: 0 0 var(--dock-size);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #d9e8f5;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.07));
  transform: translateY(var(--dock-lift));
  box-shadow: 0 6px 16px rgba(0,0,0,.17);
  transition: width .18s cubic-bezier(.2,1.35,.35,1), height .18s cubic-bezier(.2,1.35,.35,1), flex-basis .18s cubic-bezier(.2,1.35,.35,1), transform .18s cubic-bezier(.2,1.35,.35,1), background .18s ease, color .18s ease;
}
.lcs-hero-dock a:hover,
.lcs-hero-dock a:focus-visible { color: #fff; background: linear-gradient(145deg, #f26a2a, #e64c0b); outline: 0; }
.lcs-hero-dock svg { width: 48%; height: 48%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lcs-hero-dock small {
  position: absolute;
  left: 50%;
  top: -35px;
  padding: 5px 8px;
  color: var(--navy-900);
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 7px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 8px 20px rgba(0,0,0,.2);
  opacity: 0;
  transform: translate(-50%, 5px) scale(.96);
  transition: opacity .16s ease, transform .18s ease;
  pointer-events: none;
  white-space: nowrap;
  font-size: 10px;
  font-weight: 700;
}
.lcs-hero-dock a:hover small,
.lcs-hero-dock a:focus-visible small { opacity: 1; transform: translate(-50%, 0) scale(1); }

.lcs-product-marquee {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 5px;
  height: 294px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  padding: 28px 0 25px;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 15%, #000 100%);
  mask-image: linear-gradient(to bottom, transparent, #000 15%, #000 100%);
}
.lcs-product-marquee::before,
.lcs-product-marquee::after { content: ""; position: absolute; z-index: 4; top: 0; bottom: 0; width: clamp(35px, 7vw, 120px); pointer-events: none; }
.lcs-product-marquee::before { left: 0; background: linear-gradient(90deg, #06172e, transparent); }
.lcs-product-marquee::after { right: 0; background: linear-gradient(-90deg, #06172e, transparent); }
.lcs-product-marquee__track {
  --marquee-half-gap: 9px;
  --marquee-duration: 38s;
  display: flex;
  width: max-content;
  gap: 18px;
  will-change: transform;
  animation: lcs-marquee-left var(--marquee-duration) linear infinite;
}
.lcs-product-marquee__track.is-building { animation-play-state: paused; }
.lcs-product-marquee:hover .lcs-product-marquee__track,
.lcs-product-marquee:focus-within .lcs-product-marquee__track { animation-play-state: paused; }
.lcs-product-marquee__group { display: flex; align-items: flex-end; gap: 18px; flex-shrink: 0; }
.lcs-marquee-card {
  width: 190px;
  height: 238px;
  flex: 0 0 190px;
  display: flex;
  flex-direction: column;
  padding: 10px 10px 13px;
  color: var(--navy-900) !important;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 19px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 23px 55px rgba(0,0,0,.28);
  transform: rotate(-2.2deg);
  transition: transform .35s cubic-bezier(.22,.7,.3,1), box-shadow .25s ease;
}
.lcs-marquee-card:nth-child(even) { transform: rotate(2.4deg) translateY(5px); }
.lcs-marquee-card:nth-child(3n) { transform: rotate(-.7deg) translateY(-4px); }
.lcs-marquee-card:hover,
.lcs-marquee-card:focus-visible { z-index: 2; transform: translateY(-13px) rotate(0) scale(1.035); box-shadow: 0 32px 72px rgba(0,0,0,.38); outline: 3px solid rgba(255,139,80,.45); outline-offset: 3px; }
.lcs-marquee-card > span { height: 174px; margin-bottom: 10px; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 13px; background: linear-gradient(150deg, #fbfcfd, #eaf0f5); }
.lcs-marquee-card img { max-width: 94%; max-height: 94%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; transition: transform .4s cubic-bezier(.22,.7,.3,1); }
.lcs-marquee-card:hover img { transform: scale(1.055); }
.lcs-marquee-card b { overflow: hidden; color: var(--navy-900); font-size: 13.5px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.lcs-marquee-card small { overflow: hidden; margin-top: 3px; color: var(--ink-500); font-size: 9.5px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.lcs-hero--marquee + section .lcs-stats { margin-top: -25px; }

@keyframes lcs-word-rise { to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes lcs-hero-rise { from { opacity: 0; transform: translateY(13px); } to { opacity: 1; transform: translateY(0); } }
@keyframes lcs-marquee-left { to { transform: translateX(calc(-50% - var(--marquee-half-gap))); } }

@media (max-width: 991px) {
  .lcs-hero--marquee { height: 850px; min-height: 850px; }
  .lcs-hero--marquee .lcs-hero__inner { max-width: 760px; padding: 52px 0 295px; }
  .lcs-hero--marquee h1 { font-size: clamp(40px, 7vw, 58px); }
  .lcs-product-marquee { height: 270px; }
  .lcs-marquee-card { width: 174px; height: 219px; flex-basis: 174px; }
  .lcs-marquee-card > span { height: 156px; }
}

@media (max-width: 767px) {
  .lcs-hero--marquee { height: auto; min-height: 0; }
  .lcs-hero--marquee .lcs-hero__inner { padding: 48px 0 0; }
  .lcs-hero--marquee h1 { font-size: clamp(34px, 9.5vw, 43px); line-height: 1.04; }
  .lcs-hero--marquee .lcs-hero__inner > p { font-size: 15.5px; line-height: 1.56; }
  .lcs-hero--marquee .lcs-hero__cta { display: grid; grid-template-columns: 1fr; margin-bottom: 0; }
  .lcs-hero--marquee .lcs-hero__marks { display: none; }
  .lcs-hero-dock-wrap { display: none; }
  .lcs-product-marquee { position: relative; left: auto; right: auto; bottom: auto; height: 253px; margin-top: 0; padding-bottom: 22px; }
  .lcs-product-marquee__track,
  .lcs-product-marquee__group { gap: 13px; }
  .lcs-product-marquee__track { --marquee-half-gap: 6.5px; }
  .lcs-marquee-card { width: 157px; height: 202px; flex-basis: 157px; padding: 8px 8px 11px; border-radius: 16px; }
  .lcs-marquee-card > span { height: 141px; margin-bottom: 8px; }
  .lcs-marquee-card b { font-size: 12px; }
  .lcs-marquee-card small { font-size: 8.5px; }
  .lcs-hero--marquee + section .lcs-stats { margin-top: -18px; }
}

@media (min-width: 520px) and (max-width: 767px) {
  .lcs-hero--marquee .lcs-hero__inner { padding-bottom: 4px; }
  .lcs-product-marquee { padding-bottom: 38px; }
}

@media (prefers-reduced-motion: reduce) {
  .lcs-hero-product, .lcs-globe, .lcs-hero-product__media::before,
  .lcs-hero-product__sequence b, .lcs-orbit { animation: none; }
  .lcs-rfq-drawer, .lcs-rfq-shade { transition: none; }
  html.lcs-js .lcs-cat .lcs-cat__media::after { display: none; }
  html.lcs-js .lcs-cat:not(.is-in) .lcs-cat__media img { transform: none; }
  .lcs-word, .lcs-hero--marquee .lcs-hero__badge, .lcs-hero--marquee .lcs-hero__inner > p,
  .lcs-hero--marquee .lcs-hero__cta, .lcs-hero--marquee .lcs-hero__marks,
  .lcs-hero-dock-wrap { opacity: 1; transform: none; animation: none; }
  .lcs-product-marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .lcs-product-marquee__track { animation: none; }
  .lcs-product-marquee__group[aria-hidden="true"] { display: none; }
}