* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: #12263a;
}

button, a { font: inherit; }

.container {
  width: min(1200px, 92%);
  margin: 0 auto;
}


/* HEADER */

.main-header {
  background: #ffffff;
  border-bottom: 1px solid #e8eef2;
  position: relative;
  z-index: 10;
}

.main-nav {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.icon-button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #12263a;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
}

.header-actions { align-items: center; display: flex; gap: 9px; margin-left: auto; }
.language-switcher { position: relative; }
.language-button { background: transparent; border: 0; color: #12263a; cursor: pointer; font-size: 12px; font-weight: 700; min-height: 42px; padding: 0 8px; }
.language-button span { color: #0878b9; font-size: 16px; margin-left: 3px; }
.language-button:hover { color: #0878b9; }
.language-menu { background: white; border: 1px solid #e8eef2; box-shadow: 0 12px 24px rgba(18, 38, 58, .12); display: none; min-width: 74px; padding: 6px; position: absolute; right: 0; top: 44px; z-index: 5; }
.language-menu.open { display: block; }
.language-option { background: transparent; border: 0; color: #12263a; cursor: pointer; display: block; font-size: 12px; padding: 10px; text-align: center; width: 100%; }
.language-option:hover, .language-option.active { background: #eef8fc; color: #0878b9; }
.icon-button { min-height: 42px; min-width: 42px; position: relative; }
.icon-button svg { fill: none; height: 22px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 22px; }
.icon-button:hover { color: #0878b9; }
.cart-count { align-items: center; background: #0878b9; border-radius: 50%; color: white; display: flex; font-size: 9px; height: 16px; justify-content: center; position: absolute; right: 1px; top: 1px; width: 16px; }
.menu-panel { background: #ffffff; border-top: 1px solid #e8eef2; padding: 0; position: relative; }
.menu-toggle { align-items: center; background: #ffffff; border: 0; color: #12263a; cursor: pointer; display: flex; flex-direction: column; gap: 4px; height: 48px; justify-content: center; margin-left: 0; width: 48px; }
.menu-toggle span { background: currentColor; display: block; height: 2px; transition: transform .2s ease, opacity .2s ease; width: 24px; }
.menu-toggle.is-open span:first-child { transform: translateY(6px) rotate(45deg); }
.menu-toggle.is-open span:nth-child(2) { opacity: 0; }
.menu-toggle.is-open span:last-child { transform: translateY(-6px) rotate(-45deg); }
.menu-panel .container { align-items: center; display: flex; flex-direction: row; gap: 34px; justify-content: flex-start; }
.menu-panel .container { display: none; }
.menu-panel.menu-open .container { align-items: flex-start; background: #ffffff; box-shadow: 0 14px 28px rgba(18, 38, 58, .16); display: flex; flex-direction: column; gap: 16px; left: max(4%, calc((100% - 1200px) / 2)); padding: 18px 22px; position: absolute; top: 0; width: 240px; z-index: 20; }
.menu-panel.menu-open a:last-child { margin-left: 0; }
.menu-panel a { color: #12263a; font-size: 15px; font-weight: 600; text-decoration: none; }
.menu-panel a:hover { color: #0878b9; }
.menu-panel a.active, .menu-panel a[aria-current="page"] { color: #0878b9; }
.menu-panel a:last-child { margin-left: auto; }
.nav-icon { display: inline-block; font-size: 17px; line-height: 1; margin-right: 7px; transform: translateY(2px); }
.nav-house svg { fill: none; height: 17px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; vertical-align: -3px; width: 17px; }

.brand {
  align-items: flex-end;
  display: inline-flex;
  height: 58px;
  left: 64px;
  position: absolute;
  text-decoration: none;
}

.brand img {
  display: block;
  height: clamp(42px, 5vw, 50px);
  width: auto;
}

.brand span {
  color: #0b2d45;
  font-size: clamp(21px, 2.1vw, 25px);
  font-weight: 700;
  letter-spacing: .5px;
  line-height: 1;
  margin-left: 10px;
}

/* APPLICATIONS */

.solutions-section {
  background: linear-gradient(135deg, #eef8fc 0%, #ffffff 54%, #dff4fb 100%);
  min-height: calc(100vh - 82px);
  padding: 18px 0 92px;
}

.section-label {
  color: #0878b9;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: 3px;
  margin: 0;
}

.solutions-title {
  color: #12263a;
  font-size: clamp(28px, 3.4vw, 44px);
  font-weight: 600;
  letter-spacing: -3px;
  line-height: .98;
  margin: 8px 0 38px;
}

.solutions-title span { color: #12263a; }
.solutions-title small { color: #526979; display: inline-block; font-size: .38em; font-weight: 600; letter-spacing: 0; margin-top: 10px; }
.solutions-title small em { font-style: italic; font-weight: 500; }

.default-page {
  min-height: calc(100vh - 82px);
  padding-bottom: 100px;
  padding-top: 90px;
}

.default-intro {
  color: #526979;
  font-size: 20px;
  line-height: 1.6;
  max-width: 560px;
}

.control-page { padding-bottom: 100px; padding-top: 78px; }
.control-page-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 45px; }
.control-page-heading .solutions-title { margin-bottom: 0; }
.control-page-heading .default-intro { margin: 0 0 8px; max-width: 360px; }
.control-status { align-items: center; background: #12263a; color: white; display: grid; gap: 18px; grid-template-columns: 1fr auto 1fr; margin-bottom: 20px; padding: 20px 24px; }
.control-status > div { align-items: center; display: flex; gap: 10px; font-size: 13px; }
.status-dot { background: #61d18b; border-radius: 50%; box-shadow: 0 0 0 4px rgba(97, 209, 139, .15); height: 8px; width: 8px; }
.control-status strong { color: #8edaf5; font-size: 15px; }
.status-detail { color: #a5bac7; font-size: 12px; text-align: right; }
.control-grid { display: grid; gap: 14px; grid-template-columns: repeat(5, 1fr); }
.control-card { background: #f3f8fa; border: 1px solid #dcebf0; color: #12263a; display: flex; flex-direction: column; min-height: 142px; padding: 18px; text-decoration: none; transition: background .2s ease, transform .2s ease; }
.control-card:hover { background: #e9ffff; transform: translateY(-4px); }
.control-card-icon { font-size: 27px; margin-bottom: auto; }
.control-card strong { font-size: 16px; }
.control-card > span:last-child { color: #69818e; font-size: 11px; margin-top: 5px; }

.contact-section { background: #f3f8fa; border: 1px solid #dcebf0; margin-top: 30px; padding: 30px; text-align: center; }
.contact-title { color: #12263a; font-size: 20px; font-weight: 600; margin: 0 0 10px; }
.contact-text { color: #526979; font-size: 15px; margin: 0; }
.contact-email-icon { color: #0878b9; display: inline-block; font-size: 16px; margin-right: 8px; }
.contact-text a { color: #12263a; font-weight: 600; text-decoration: underline; }
.about-page { padding-bottom: 80px; padding-top: 58px; }
.about-intro { border-bottom: 1px solid #dcebf0; padding-bottom: 42px; }
.about-name-explanation { color: #526979; font-size: 15px; line-height: 1.65; margin: 0 0 34px; max-width: 820px; }
.about-story { max-width: 820px; padding: 52px 0 16px; }
.about-story h2 { color: #12263a; font-size: 28px; margin: 0 0 18px; }
.about-story p { color: #526979; font-size: 16px; line-height: 1.75; margin: 0 0 18px; }
.about-social-links { align-items: center; display: flex; flex-direction: column; gap: 12px; margin-top: 22px; }
.about-social-links a { color: #0878b9; font-size: 13px; font-weight: 700; text-decoration: none; }
.about-social-links a:hover { color: #0b2d45; text-decoration: underline; }

.intro-video { background: #12263a; color: white; margin: 0 0 55px; position: relative;}

.intro-video-media { display: block; height: auto; width: 100%; }

.intro-video::after { border: 1px solid rgba(255, 255, 255, .24); border-radius: 50%; content: ''; height: 320px;
  position: absolute; right: 13%; top: -75px; width: 320px; }

.intro-video-overlay { inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 28px 38px; position: absolute; z-index: 1; }
.fish-reel-label { color: #8edaf5; font-size: 11px; font-weight: 700; letter-spacing: 2px; }
.intro-video-overlay p { font-size: clamp(24px, 3vw, 42px); letter-spacing: -1px; line-height: .95; margin: 0; }
.intro-video-overlay strong { color: #8edaf5; font-weight: 600; }
.audio-toggle { align-items: center; align-self: flex-end; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .45); color: white; cursor: pointer; display: inline-flex; gap: 8px; padding: 10px 14px; }
.audio-toggle:hover { background: rgba(255, 255, 255, .24); }
.audio-toggle-icon { font-size: 16px; }
.audio-toggle-label { font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }

.build-system-title { color: #0878b9; font-size: 24px; margin: 48px 0 18px; text-align: center; }
.solutions-grid { display: grid; gap: 18px; grid-template-columns: repeat(4, 1fr); }

.solution-card {
  color: #12263a;
  display: flex;
  flex-direction: column;
  min-height: 350px;
  padding: 24px;
  position: relative;
  text-decoration: none;
  transition: box-shadow .25s ease, transform .25s ease;
}

.solution-card:hover { box-shadow: 0 18px 35px rgba(18, 38, 58, .13); transform: translateY(-7px); }
.solution-pool { background: #c6eafa; }
.solution-hydroponics { background: #d4edce; }
.solution-aquarium { background: #d9d5f1; }
.solution-solar { background: #f8dfad; }
.solution-number { font-size: 12px; font-weight: 700; letter-spacing: 2px; }
.solution-icon { font-size: 42px; line-height: 1; margin: 40px 0 25px; }
.solution-card h2 { font-size: 28px; letter-spacing: -1px; margin: 0 0 12px; }
.solution-card p { font-size: 14px; line-height: 1.5; margin: 0; max-width: 220px; }
.solution-link { border-top: 1px solid rgba(18, 38, 58, .3); font-size: 12px; font-weight: 700; margin-top: auto; padding-top: 15px; }
.solution-link strong { float: right; font-size: 18px; font-weight: 400; }
.solution-image { display: block; height: 220px; object-fit: cover; width: 100%; }
.solution-card .solution-link { margin-top: auto; }

/* BYPOOL SECTION */

.bypool-section {
  padding: 30px 0;
  background: #f9fafb;
  border-top: 1px solid #dcebf0;
  margin-top: 40px;
}

.bypool-subtitle {
  font-size: 28px;
  color: #526979;
  margin: 0 0 40px;
  line-height: 1.6;
  max-width: 800px;
}

.bypool-subtitle span {
  display: block;
}

.bypool-title {
  width: 100%;
  font-size: 36px;
  font-weight: 700;
  color: #12263a;
  margin: 0;
  letter-spacing: -0.5px;
  text-align: center;
}

.bypool-svg-full {
  width: 100%;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.bypool-svg-full object {
  width: 100%;
  max-width: 1200px;
  min-height: 600px;
  display: block;
}

.bypool-svg-full object img {
  display: block;
  width: 100%;
}

.bypool-bottom-section {
  display: block;
  width: 100%;
  margin-bottom: 30px;
}

.bypool-text-panel {
  background: #ffffff;
  border: 1px solid #dcebf0;
  border-radius: 8px;
  padding: 24px;
  min-height: auto;
  line-height: 1.6;
}

.bypool-actions {
  display: flex;
  gap: 16px;
  align-items: center;
}

.price-display-full {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: auto;
}

.price-amount {
  font-size: 16px;
  font-weight: 700;
  color: #0b2d45;
}

.add-button-full {
  background: #0878b9;
  color: #ffffff;
  border: 0;
  border-radius: 0;
  padding: 11px 12px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .25s ease;
  width: auto;
  display: block;
}

.add-button-full:hover {
  background: #0b2d45;
}

.add-button-full:active {
  transform: scale(0.98);
}

.products-page { padding-bottom: 100px; padding-top: 55px; }
.products-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 42px; }
.products-title { color: #12263a; font-size: clamp(28px, 3.4vw, 44px); font-weight: 600; letter-spacing: -2px; line-height: .98; margin: 8px 0 0; }
.products-heading .default-intro { margin: 0 0 7px; max-width: 340px; }
.product-family { border-top: 1px solid #dcebf0; margin-top: 28px; padding-top: 18px; }
.product-family-title { color: #0878b9; font-size: 12px; font-weight: 700; letter-spacing: 3px; margin: 0 0 20px; }
.product-category { display: none; }
.product-grid { display: grid; gap: 18px; grid-template-columns: repeat(4, 1fr); }
.product-grid-single { grid-template-columns: minmax(220px, 280px); }
.product-card { background: #ffffff; border: 1px solid #dcebf0; display: flex; flex-direction: column; min-width: 0; transition: box-shadow .2s ease, transform .2s ease; }
.industrial-product-card { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); grid-column: 1 / -1; }
.industrial-specs { display: flex; flex-direction: column; padding: 26px; }
.industrial-heading h3 { color: #12263a; font-size: 28px; letter-spacing: -1px; margin: 0 0 7px; }
.industrial-heading p { color: #526979; font-size: 14px; margin: 0 0 25px; }
.industrial-spec-columns { display: grid; gap: 28px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.industrial-spec-columns dl { margin: 0; }
.industrial-spec-columns dl div { border-top: 1px solid #e8eef2; padding: 13px 0; }
.industrial-spec-columns dt { color: #69818e; font-size: 11px; margin-bottom: 5px; }
.industrial-spec-columns dd { color: #0b2d45; font-size: 14px; font-weight: 700; margin: 0; }
.industrial-specs .product-actions { margin-top: auto; }
.industrial-gallery { display: grid; gap: 8px; grid-template-rows: repeat(2, 1fr); min-height: 100%; }
.industrial-gallery img { background: #ffffff; display: block; height: 100%; min-height: 180px; object-fit: cover; width: 100%; }
.industrial-gallery img[src$="industrial-detail.jpg"] { border-left: 1px solid #dcebf0; }
.product-card:hover { box-shadow: 0 14px 28px rgba(18, 38, 58, .12); transform: translateY(-4px); }
.product-visual { align-items: center; background: #ffffff; color: #0878b9; display: flex; font-size: 58px; height: 170px; justify-content: center; }
.product-visual img { cursor: default; height: 100%; object-fit: contain; width: 100%; }
.product-visual video { cursor: default; height: 100%; object-fit: cover; width: 100%; }
.product-visual-industrial, .product-visual-premium, .product-visual-modular, .product-visual-smart-plug, .product-visual-smart-pump, .product-visual-smart-sens, .product-visual-probes, .product-visual-accessories { background: #ffffff; }
.product-card-body { display: flex; flex: 1; flex-direction: column; padding: 18px; }
.product-category { color: #0878b9; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; margin: 0 0 10px; }
.product-card h2, .product-card h3 { color: #12263a; font-size: 22px; letter-spacing: -.5px; margin: 0 0 8px; }
.product-card-body > p:not(.product-category) { color: #526979; font-size: 13px; line-height: 1.45; margin: 0; }
.product-price { color: #0b2d45; display: block; font-size: 15px; font-weight: 700; margin-top: 18px; }
.product-actions { align-items: center; border-top: 1px solid #e8eef2; display: flex; gap: 12px; justify-content: space-between; margin-top: auto; padding-top: 16px; }
.add-to-cart { background: #0878b9; border: 0; color: #ffffff; cursor: pointer; font-size: 11px; font-weight: 700; min-width: 58px; padding: 11px 12px; }
.add-to-cart:hover { background: #0b2d45; }
.quantity-control { align-items: center; display: none; }
.quantity-control.is-visible { display: inline-flex; }
.quantity-button { align-items: center; background: #eef8fc; border: 1px solid #c8e3ed; color: #0b2d45; cursor: pointer; display: inline-flex; font-size: 17px; height: 32px; justify-content: center; line-height: 1; width: 32px; }
.quantity-button:hover { background: #d9f1f8; }
.quantity-value { align-items: center; background: #ffffff; border-bottom: 1px solid #c8e3ed; border-top: 1px solid #c8e3ed; color: #0b2d45; display: inline-flex; font-size: 12px; font-weight: 700; height: 32px; justify-content: center; min-width: 30px; }
.discover-link { color: #0b2d45; font-size: 11px; font-weight: 700; text-decoration: none; }
.discover-link:hover { color: #0878b9; }
.product-modal { align-items: center; background: rgba(11, 45, 69, .58); display: none; inset: 0; justify-content: center; padding: 20px; position: fixed; z-index: 40; }
.product-modal.is-open { display: flex; }
.product-modal-dialog { background: #ffffff; box-shadow: 0 24px 60px rgba(18, 38, 58, .22); max-height: calc(100vh - 40px); max-width: 900px; overflow-y: auto; padding: 42px; position: relative; width: 100%; }
.product-modal-close { background: transparent; border: 0; color: #0b2d45; cursor: pointer; font-size: 28px; line-height: 1; padding: 4px 8px; position: absolute; right: 12px; top: 10px; }
.product-modal-close:hover { color: #0878b9; }
.product-modal-category { color: #0878b9; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; margin: 0 0 12px; }
.product-modal-dialog h2 { color: #12263a; font-size: 30px; letter-spacing: -1px; margin: 0 36px 14px 0; }
.product-modal-description { color: #526979; font-size: 16px; line-height: 1.6; margin: 0; }
.product-modal-content { display: none; }
.product-modal-dialog--detailed .product-modal-content { display: block; }
.product-modal-dialog--detailed .product-modal-description { margin-bottom: 22px; }
.product-modal-layout { display: grid; gap: 24px; grid-template-columns: minmax(0, 1.1fr) minmax(180px, .9fr); }
.product-modal-spec-table { margin: 0; }
.product-modal-spec-table div { border-top: 1px solid #e8eef2; display: grid; gap: 14px; grid-template-columns: 1fr 1fr; padding: 10px 0; }
.product-modal-spec-table dt { color: #69818e; font-size: 11px; }
.product-modal-spec-table dd { color: #0b2d45; font-size: 12px; font-weight: 700; margin: 0; }
.product-modal-spec-table dd a { color: #0878b9; text-decoration: none; }
.product-modal-spec-table dd a:hover { color: #0b2d45; text-decoration: underline; }
.product-modal-gallery { display: grid; gap: 10px; grid-template-rows: repeat(2, 1fr); }
.product-modal-gallery img { background: #ffffff; cursor: zoom-in; display: block; height: 180px; object-fit: contain; width: 100%; }
.product-visual img.is-zoomable { cursor: zoom-in; }

.image-lightbox { align-items: center; background: rgba(11, 45, 69, .85); display: none; inset: 0; justify-content: center; padding: 40px; position: fixed; z-index: 50; }
.image-lightbox.is-open { display: flex; }
.image-lightbox img { max-height: 100%; max-width: 100%; object-fit: contain; }
.image-lightbox-close { background: transparent; border: 0; color: #ffffff; cursor: pointer; font-size: 32px; line-height: 1; padding: 4px 10px; position: absolute; right: 16px; top: 10px; }
.image-lightbox-close:hover { color: #6fc3ff; }

.configurator-popup { align-items: center; background: rgba(11, 45, 69, .58); display: flex; inset: 0; justify-content: center; padding: 20px; position: fixed; z-index: 30; }
.configurator-popup[hidden] { display: none; }
.configurator-popup-dialog { background: #ffffff; box-shadow: 0 24px 60px rgba(18, 38, 58, .22); max-height: calc(100vh - 40px); max-width: 900px; overflow-y: auto; padding: 36px; position: relative; width: 100%; }
.configurator-popup-close { background: transparent; border: 0; color: #0b2d45; cursor: pointer; font-size: 28px; line-height: 1; padding: 4px 8px; position: absolute; right: 12px; top: 10px; }
.configurator-popup-close:hover { color: #0878b9; }
.configurator-popup-category { color: #0878b9; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; margin: 0 0 12px; }
.configurator-popup-dialog h2 { color: #12263a; font-size: 24px; margin: 0 36px 22px 0; }
.configurator-popup-description { color: #45616f; line-height: 1.6; margin: 0 0 24px; max-width: 720px; }
.configurator-popup-options { display: grid; gap: 24px; grid-template-columns: 1fr; }
.configurator-option { border-top: 1px solid #e8eef2; padding-top: 20px; }
.configurator-option h3 { color: #0878b9; font-size: 20px; margin: 0 0 10px; }
.configurator-option p { color: #526979; font-size: 13px; line-height: 1.5; margin: 0 0 16px; }
.configurator-option > img { background: #f7fafb; display: block; height: 190px; object-fit: contain; width: 100%; }
.configurator-option > img.is-zoomable { cursor: zoom-in; }
.configurator-popup-actions { align-items: center; border-top: 1px solid #e8eef2; display: flex; gap: 12px; justify-content: flex-start; margin-top: 16px; padding-top: 16px; }
.configurator-popup-details-link { background: transparent; border: 0; color: #0878b9; cursor: pointer; font-size: 12px; font-weight: 700; margin-left: auto; padding: 0; }
.configurator-popup-details-link:hover { color: #0b2d45; text-decoration: underline; }
.configurator-popup-add { align-self: end; }
.configurator-popup-details { margin: 18px 0 0; }
.configurator-popup-details div { display: grid; gap: 8px; grid-template-columns: max-content 1fr; padding: 0; }
.configurator-popup-details dt { color: #69818e; font-size: 11px; }
.configurator-popup-details dd { color: #0b2d45; font-size: 12px; font-weight: 700; margin: 0; overflow-wrap: anywhere; }

@media (max-width: 640px) {
  .configurator-popup-dialog { padding: 28px 20px; }
  .configurator-popup-options { grid-template-columns: 1fr; }
  .configurator-option > img { height: 200px; }
  .configurator-popup-actions { align-items: flex-start; }
}


/* CART PAGE */

.cart-page {
  padding-bottom: 80px;
  padding-top: 40px;
}

.cart-layout {
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1fr) 300px;
}

.cart-main {
  background: #ffffff;
  border: 1px solid #dcebf0;
  padding: 18px;
}

.cart-main-header {
  align-items: baseline;
  display: flex;
  justify-content: space-between;
  margin-bottom: 14px;
}

.cart-main-header h1 {
  font-size: 28px;
  letter-spacing: -1px;
  margin: 0;
}

.cart-main-header p {
  color: #526979;
  font-size: 13px;
  margin: 0;
}

.cart-select-all {
  align-items: center;
  background: #f5fbff;
  border: 1px solid #dcebf0;
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
  padding: 10px 12px;
}

.cart-customer {
  border: 1px solid #dcebf0;
  margin-bottom: 18px;
  padding: 16px;
}

.cart-customer h2 {
  color: #12263a;
  font-size: 20px;
  margin: 0 0 14px;
}

.cart-customer-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cart-customer-grid label {
  color: #526979;
  display: grid;
  font-size: 13px;
  gap: 7px;
}

.cart-customer-grid input,
.cart-customer-grid select {
  background: #ffffff;
  border: 1px solid #b9d1db;
  color: #12263a;
  font: inherit;
  min-width: 0;
  padding: 10px;
}

.cart-customer-grid input:focus,
.cart-customer-grid select:focus {
  border-color: #0878b9;
  outline: 2px solid #c8e3ed;
}

.cart-customer-wide {
  grid-column: 1 / -1;
}

.cart-items {
  display: grid;
  gap: 10px;
}

.cart-item {
  align-items: center;
  border: 1px solid #e8eef2;
  display: grid;
  gap: 12px;
  grid-template-columns: auto 72px minmax(0, 1fr) auto auto;
  padding: 12px;
}

.cart-item-check input {
  cursor: pointer;
  height: 16px;
  width: 16px;
}

.cart-item-image-wrap {
  background: #f7fbfd;
  height: 72px;
  overflow: hidden;
  width: 72px;
}

.cart-item-image {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.cart-item-info h3 {
  font-size: 14px;
  margin: 0 0 8px;
}

.cart-item-info p {
  color: #0878b9;
  font-size: 13px;
  font-weight: 700;
  margin: 0;
}

.cart-item-controls {
  align-items: center;
  display: inline-flex;
}

.cart-item-controls button {
  background: #eef8fc;
  border: 1px solid #c8e3ed;
  cursor: pointer;
  height: 32px;
  width: 32px;
}

.cart-item-controls span {
  align-items: center;
  background: #ffffff;
  border-bottom: 1px solid #c8e3ed;
  border-top: 1px solid #c8e3ed;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  height: 32px;
  justify-content: center;
  min-width: 32px;
}

.cart-item-remove {
  background: transparent;
  border: 0;
  color: #526979;
  cursor: pointer;
  font-size: 12px;
  text-decoration: underline;
}

.cart-item-remove:hover {
  color: #0b2d45;
}

.cart-empty {
  color: #69818e;
  font-size: 14px;
  margin: 14px 0 6px;
}

.cart-summary {
  align-self: start;
  background: #ffffff;
  border: 1px solid #dcebf0;
  padding: 16px;
  position: sticky;
  top: 18px;
}

.cart-summary h2 {
  font-size: 20px;
  margin: 0 0 14px;
}

.cart-shipping-field {
  color: #526979;
  display: grid;
  font-size: 13px;
  gap: 7px;
  margin-bottom: 16px;
}

.cart-shipping-field select {
  background: #ffffff;
  border: 1px solid #b9d1db;
  color: #12263a;
  font: inherit;
  padding: 10px;
}

.cart-summary-row {
  align-items: center;
  color: #526979;
  display: flex;
  font-size: 14px;
  justify-content: space-between;
  margin: 0 0 16px;
}

.cart-summary-row strong {
  color: #12263a;
  font-size: 20px;
}

.cart-summary-total {
  border-top: 1px solid #dcebf0;
  color: #12263a;
  margin-top: 8px;
  padding-top: 14px;
}

.cart-summary-total strong {
  font-size: 22px;
}

.cart-checkout-button {
  background: #0878b9;
  border: 0;
  color: #ffffff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  padding: 12px;
  width: 100%;
}

.cart-checkout-button:hover {
  background: #0b2d45;
}

.cart-checkout-button:disabled {
  background: #9cb7c5;
  cursor: not-allowed;
}


/* MOBILE */

@media (max-width: 800px) {

  .main-nav { justify-content: flex-start; }
  .main-nav .brand { left: 64px !important; margin-right: 0; position: absolute !important; transform: none !important; }
  .solutions-section { padding: 15px 0 65px; }
  .solutions-title { letter-spacing: -2px; margin-bottom: 35px; }
  .intro-video { margin-bottom: 35px; }
  .intro-video-overlay { padding: 22px; }
  .intro-video::after { right: -80px; top: 55px; }
  .solutions-grid { grid-template-columns: repeat(2, 1fr); }
  .solution-card { min-height: 315px; padding: 20px; }
  .solution-icon { margin: 28px 0 20px; }
  .bypool-bottom-section { margin-bottom: 20px; }
  .bypool-actions { gap: 12px; }
  .menu-toggle { margin-left: 0; margin-right: 0; }
  .menu-panel.menu-open .container { gap: 16px; justify-content: flex-start; left: 4%; width: min(240px, 92%); }
  .menu-panel a { font-size: 13px; }
  .menu-panel a:last-child { margin-left: 0; }
  .control-page-heading { align-items: start; display: block; }
  .control-page-heading .default-intro { margin-top: 28px; }
  .control-status { grid-template-columns: 1fr; gap: 10px; }
  .status-detail { text-align: left; }
  .control-grid { grid-template-columns: repeat(2, 1fr); }
  .products-page { padding-top: 42px; }
  .products-heading { align-items: start; display: block; }
  .products-heading .default-intro { margin-top: 24px; }
  .product-family { margin-top: 34px; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .industrial-product-card { grid-template-columns: 1fr; }
  .industrial-gallery { grid-template-columns: repeat(2, 1fr); grid-template-rows: 1fr; }
  .industrial-gallery img { min-height: 150px; }
  .product-visual { height: 140px; }
  .product-card-body { padding: 14px; }
  .product-actions { align-items: flex-start; flex-direction: column; }
  .product-modal-dialog { padding: 28px 24px; }
  .product-modal-layout { grid-template-columns: 1fr; }
  .product-modal-gallery { grid-template-columns: repeat(2, 1fr); grid-template-rows: 1fr; }
  .product-modal-gallery img { height: 120px; }
  .cart-layout { grid-template-columns: 1fr; }
  .cart-summary { position: static; }
  .cart-item { grid-template-columns: auto 68px minmax(0, 1fr); }
  .cart-item-controls { grid-column: 2 / span 1; }
  .cart-item-remove { grid-column: 3 / span 1; justify-self: end; }

}

@media (max-width: 520px) {
  .brand { height: 50px; }
  .brand img { height: 36px; }
  .brand span { font-size: 17px; margin-left: 7px; }
  .header-actions { gap: 0; }
  .icon-button { min-width: 34px; }
  .language-button { padding: 0 4px; }
  .control-page { padding-top: 55px; }
  .control-grid { grid-template-columns: 1fr; }
  .solutions-grid { grid-template-columns: 1fr; }
  .solution-card { min-height: 270px; }
  .bypool-section { padding: 40px 0; }
  .bypool-svg-full object { min-height: 400px; }
  .bypool-actions { flex-direction: column; gap: 12px; }
  .product-grid { grid-template-columns: 1fr; }
  .product-grid-single { grid-template-columns: 1fr; }
  .product-visual { height: 180px; }
  .product-actions { align-items: center; flex-direction: row; }
}


/* PRODUCTS PAGE STYLE */
.products-page .product-grid { display: grid; gap: 18px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.products-page .product-grid-single { grid-template-columns: minmax(220px, 280px); }
.products-page .product-card { display: flex; flex-direction: column; min-width: 0; }
.products-page .product-visual { display: flex; height: 170px; overflow: hidden; width: 100%; }
.products-page .product-visual img, .products-page .product-visual video { display: block; height: 100%; object-fit: contain; width: 100%; }
@media (max-width: 800px) {
    .products-page .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .products-page .product-visual { height: 140px; }
}
@media (max-width: 520px) {
    .products-page .product-grid, .products-page .product-grid-single { grid-template-columns: 1fr; }
    .products-page .product-visual { height: 180px; }
}