:root {
  color-scheme: light;
  --canvas: #dfe6ed;
  --paper: #fff;
  --ink: #0b1932;
  --muted: #6e7f91;
  --blue: #2575b9;
  --red: #f20b4e;
  --line: #d8e0e8;
  --gutter: 10px;
  font-family: "Ubuntu", Arial, sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { min-width: 320px; min-height: 100vh; margin: 0; background: var(--canvas); }
button, a { font: inherit; }
button { color: inherit; }

.whatsapp-widget { position: fixed; right: max(24px, env(safe-area-inset-right)); bottom: max(24px, env(safe-area-inset-bottom)); z-index: 90; display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }
.whatsapp-message { position: relative; width: min(300px, calc(100vw - 40px)); padding: 19px 42px 19px 18px; border: 1px solid #e1e5e9; border-radius: 9px; background: #fff; box-shadow: 0 6px 22px #0b193226; }
.whatsapp-message[hidden] { display: none; }
.whatsapp-message::after { position: absolute; right: 22px; bottom: -7px; width: 13px; height: 13px; border-right: 1px solid #e1e5e9; border-bottom: 1px solid #e1e5e9; background: #fff; transform: rotate(45deg); content: ""; }
.whatsapp-message p { margin: 0; color: #656b72; font-size: 15px; font-weight: 500; line-height: 1.45; }
.whatsapp-message-close { position: absolute; top: 4px; right: 4px; display: grid; width: 32px; height: 32px; place-items: center; padding: 0; border: 0; border-radius: 5px; background: transparent; color: #737980; font-size: 20px; cursor: pointer; }
.whatsapp-message-close:hover { background: #f0f3f5; }
.whatsapp-launcher { display: grid; width: 60px; height: 60px; place-items: center; padding: 0; border: 0; border-radius: 50%; background: #25d366; box-shadow: 0 5px 20px #25d36640; cursor: pointer; }
.whatsapp-launcher img { display: block; width: 48px; height: 48px; }
.whatsapp-launcher:focus-visible, .whatsapp-message-close:focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
body.menu-open .whatsapp-widget { visibility: hidden; }
@media (max-width: 760px) {
  .whatsapp-widget { right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); }
}
a { color: inherit; text-decoration: none; }
button:focus-visible, a:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }

.page-shell {
  display: grid;
  grid-template-columns: minmax(350px, 33.1fr) minmax(0, 66.9fr);
  gap: var(--gutter);
  min-height: 100svh;
  padding: var(--gutter);
}
.left-column { display: grid; grid-template-rows: 100px minmax(440px, 1fr) minmax(260px, auto); gap: var(--gutter); min-width: 0; }
.brand-card, .intro-card, .about-card, .visual-panel { border-radius: 21px; overflow: hidden; }
.brand-card { display: flex; flex-direction: column; justify-content: center; padding: 0 38px; background: var(--paper); }
.brand-name {  font-size: calc(clamp(23.1px, 2.42vw, 37.4px) + 2.5px); font-weight: 800; letter-spacing: -1.8px; line-height: 1; }
.brand-caption { margin-top: 5px;  font-size: calc(9px + 2.5px); font-weight: 700; letter-spacing: .07em; color: #586a7c; }
.intro-card { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(42px, 5vw, 82px) clamp(34px, 4vw, 77px); background: var(--paper); }
.eyebrow { margin: 0; color: var(--ink);  font-size: calc(14px + 2.5px); line-height: 1.3; font-weight: 700; letter-spacing: .015em; }
.intro-card .eyebrow { margin-bottom: 27px; }
h1 { max-width: 540px; margin: 0;  font-size: calc(clamp(41.8px, 3.3vw, 61.6px) + 2.5px); font-weight: 500; letter-spacing: -.055em; line-height: 1.08; }
.hero-product-navigation { display: grid; width: 100%; min-height: 0; grid-template-columns: minmax(0, 1fr) 42px; align-items: stretch; gap: 10px; margin-top: 24px; flex: 1 1 0; }
.hero-product-list { display: flex; min-height: 0; max-height: 100%; flex-direction: column; gap: 5px; overflow-y: hidden; overscroll-behavior: contain; scroll-behavior: smooth; scroll-snap-type: y mandatory; scrollbar-width: none; }
.hero-product-list::-webkit-scrollbar { display: none; }
.hero-product-link { display: flex; min-height: 60px; flex: 0 0 auto; align-items: center; padding: 8px 0; border-bottom: 1px solid #e5eaf0; color: var(--ink);  font-size: calc(clamp(20.9px, 2.2vw, 29.7px) + 2.5px); font-weight: 500; letter-spacing: -.045em; line-height: 1.14; scroll-snap-align: start; transition: color .18s ease, padding-left .18s ease; }
.hero-product-link:hover, .hero-product-link:focus-visible { padding-left: 8px; color: var(--blue); }
.hero-product-controls { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; }
.hero-product-controls button { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid #d7e0e8; border-radius: 50%; color: var(--ink); background: #fff;  font-size: 23.1px; line-height: 1; cursor: pointer; transition: color .18s ease, background .18s ease, border-color .18s ease; }
.hero-product-controls button:hover:not(:disabled) { border-color: var(--blue); color: #fff; background: var(--blue); }
.hero-product-controls button:disabled { color: #a9b4bf; background: #f2f5f7; cursor: default; }
.discover-button { position: relative; display: flex; align-items: center; gap: 16px; min-width: 290px; height: 66px; margin-top: 58px; padding: 6px 7px 6px 18px; border-radius: 40px; color: #fff; background: linear-gradient(100deg, #888 0%, #41464d 70%, #20252b 100%);  font-size: calc(17.6px + 2.5px); font-weight: 700; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.discover-button:hover { transform: translateY(-2px); box-shadow: 0 10px 24px #152c4533; }
.button-mark { display: flex; align-items: flex-end; gap: 3px; width: 38px; height: 31px; opacity: .82; }
.button-mark span { display: block; width: 9px; border-radius: 5px 5px 2px 2px; background: #e8edf1; transform: skew(-12deg); }
.button-mark span:nth-child(1) { height: 17px; }.button-mark span:nth-child(2) { height: 29px; }.button-mark span:nth-child(3) { height: 22px; }
.button-arrow { display: grid; place-items: center; width: 52px; height: 52px; margin-left: auto; border-radius: 50%; color: #101722; background: #fff;  font-size: 27.5px; font-weight: 500; }
.about-card { display: flex; height: auto; min-height: 0; max-height: none; flex: 1 1 0; flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; padding: clamp(14px, 1.5vw, 22px) clamp(20px, 3vw, 46px); background: var(--paper); }
.about-copy { max-width: 600px; margin: 0; font-size: calc(clamp(16.5px, 1.1vw, 19.8px) + 2.5px); line-height: 1.58; letter-spacing: -.025em; }
.about-word-cloud { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: flex-start; gap: 6px 12px; }
.about-card .about-word-cloud-tag { display: block; min-width: 0; max-width: 100%; padding: 0; border: 0 !important; border-radius: 0; outline: 0; box-shadow: none !important; color: #647386; background: none !important; font-size: calc(12px + 4.5px); font-weight: 600; line-height: 1.2; text-align: left; overflow-wrap: anywhere; cursor: default; }
.about-card .about-word-cloud-tag::before, .about-card .about-word-cloud-tag::after { display: none !important; content: none !important; }
.about-word-cloud-tag:nth-child(odd) { color: var(--blue); }

.manifesto-section { display: flex; flex-direction: column; justify-content: space-between; min-height: 470px; padding: clamp(48px, 8vw, 120px) clamp(28px, 3.3vw, 64px) 72px; background: var(--canvas); }
.manifesto-kicker { display: grid; grid-template-columns: max-content; gap: 3px; }
.manifesto-kicker .eyebrow {  font-size: calc(15px + 2.5px); font-weight: 600; }
.accent-mark { display: grid; place-items: center; width: 34px; height: 34px; margin-top: 52px; padding: 0; border: 0; border-radius: 9px; background: var(--ink); cursor: pointer; transition: background .2s ease, transform .2s ease; }
.accent-mark:hover { transform: translateY(-1px); background: #17345a; }
.accent-mark i { position: relative; display: block; width: 13px; height: 6px; border-radius: 5px; background: #fff; }
.accent-mark[aria-expanded="false"] i::after { position: absolute; top: 50%; left: 50%; width: 6px; height: 13px; border-radius: 5px; background: #fff; content: ""; transform: translate(-50%, -50%); }
.accent-mark[hidden] { display: none; }
.manifesto-section.is-collapsed { min-height: 0; padding-block: 22px; }
.manifesto-section.is-collapsed .accent-mark,
.systems-section.is-collapsed .accent-mark,
.catalog-hero.is-collapsed .accent-mark,
.product-detail-layout.is-collapsed .accent-mark { margin-top: 0; }
.systems-section.is-collapsed { min-height: 0; padding: 22px 24px; }
.systems-section.is-collapsed .systems-heading { width: auto; padding-top: 0; }
.catalog-hero.is-collapsed { display: block; min-height: 0; }
.catalog-hero.is-collapsed .catalog-hero-copy { min-height: 0; padding: 22px; }
.product-detail-layout.is-collapsed { min-height: 0; grid-template-columns: 1fr; }
.product-detail-layout.is-collapsed .product-detail-copy { padding: 22px; }
.manifesto-section h2 { max-width: 1500px; margin: 29px 0 0; color: var(--ink);  font-size: calc(clamp(35.2px, 2.64vw, 46.2px) + 2.5px); font-weight: 400; letter-spacing: -.045em; line-height: 1.28; }

.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; clip-path: inset(50%); }
.tank-finder { position: relative; z-index: 5; display: grid; width: min(1480px, calc(100% - 48px)); min-height: 330px; grid-template-columns: minmax(300px, 1fr) minmax(330px, .92fr); align-items: center; gap: clamp(20px, 4vw, 68px); margin: 0 auto 12px; padding: 48px clamp(28px, 7.5vw, 120px); overflow: visible; border-radius: 18px; color: #fff; background: linear-gradient(108deg, #285abd 0%, #172747 35%, #17191d 100%); isolation: isolate; }
.tank-finder-copy { position: relative; z-index: 1; }
.tank-finder-copy .eyebrow { margin-bottom: 12px; color: #d1def6;  font-size: calc(12px + 2.5px); letter-spacing: .11em; }
.tank-finder-copy h2 { margin: 0; color: #fff;  font-size: calc(clamp(33px, 3.08vw, 44px) + 2.5px); font-weight: 800; letter-spacing: -.055em; line-height: 1.08; }
.tank-finder-copy > p:last-child { max-width: 510px; margin: 20px 0 0; color: #e3eafa;  font-size: calc(16.5px + 2.5px); line-height: 1.6; }
.tank-finder-form { position: relative; z-index: 2; min-width: 0; }
.tank-finder-controls { display: flex; gap: 9px; }
.tank-finder-controls input { width: 100%; min-width: 0; min-height: 58px; padding: 0 16px; border: 1px solid #ffffffa8; border-radius: 8px; color: var(--ink); background: #fff; font: inherit;  font-size: calc(15px + 2.5px); }
.tank-finder-controls input:focus-visible { outline: 3px solid #78c7ff; outline-offset: 3px; }
.tank-finder-controls button { display: inline-flex; min-width: 98px; min-height: 58px; align-items: center; justify-content: center; gap: 13px; padding: 0 18px; border: 0; border-radius: 8px; color: #121923; background: #fff;  font-size: calc(15px + 2.5px); font-weight: 800; cursor: pointer; transition: background .2s ease, transform .2s ease; }
.tank-finder-controls button span { color: var(--blue);  font-size: 19.8px; }
.tank-finder-controls button:hover { transform: translateY(-2px); background: #edf5ff; }
.tank-finder-results[hidden] { display: none; }
.tank-finder-results { position: static; display: grid; max-height: min(300px, 48svh); margin-top: 8px; overflow: auto; border: 1px solid #dfe6ec; border-radius: 10px; color: var(--ink); background: #fff; box-shadow: 0 18px 44px #08152945; }
.tank-finder-result { display: grid; gap: 3px; padding: 12px 15px; border-bottom: 1px solid #e8edf1; color: #263a4f;  font-size: calc(14px + 2.5px); line-height: 1.45; }
.tank-finder-result-name { font-weight: 700; }
.tank-finder-result-group { color: #6e7f91; font-size: calc(12px + 2.5px); }
.tank-finder-result:last-child { border-bottom: 0; }
.tank-finder-result:hover { color: var(--blue); background: #f0f6fc; }
.tank-finder-empty { margin: 0; padding: 14px 15px; color: #66798c;  font-size: calc(14px + 2.5px); line-height: 1.5; }
.contact-inquiry { display: grid; width: min(1480px, calc(100% - 48px)); min-height: 480px; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(28px, 6vw, 92px); margin: 28px auto 36px; padding: clamp(34px, 5.5vw, 82px) clamp(28px, 7.5vw, 120px); border: 1px solid #d4dfef; border-radius: 18px; color: var(--ink); background: linear-gradient(90deg, #edf2ff 0%, #e5edfb 52%, #dfe8f7 76%, #cdd9ed 100%); }
.contact-inquiry-copy .eyebrow { margin: 0 0 12px; color: #536a82; font-size: 13px; font-weight: 800; letter-spacing: .11em; }
.contact-inquiry-copy h2 { max-width: 470px; margin: 0; color: var(--ink); font-size: clamp(34px, 3.2vw, 48px); font-weight: 800; letter-spacing: -.055em; line-height: 1.08; }
.contact-inquiry-copy > p:last-child { max-width: 470px; margin: 20px 0 0; color: #41556d; font-size: 17px; line-height: 1.6; }
.contact-inquiry-form { display: grid; gap: 20px; min-width: 0; }
.contact-inquiry-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 14px; }
.contact-field { display: grid; min-width: 0; gap: 7px; }
.contact-field label, .contact-captcha label { color: #263a4f; font-size: 14px; font-weight: 700; }
.contact-field input, .contact-field textarea, .contact-captcha input, .contact-product-trigger, .contact-product-search { width: 100%; min-width: 0; min-height: 52px; padding: 13px 15px; border: 1px solid #c6d2e2; border-radius: 8px; color: var(--ink); background: #fff; font: inherit; font-size: 16px; }
.contact-field textarea { min-height: 112px; resize: vertical; }
.contact-field input:focus-visible, .contact-field textarea:focus-visible, .contact-captcha input:focus-visible, .contact-product-trigger:focus-visible, .contact-product-search:focus-visible { outline: 3px solid #8dd3ff; outline-offset: 3px; }
.contact-field-product { position: relative; z-index: 3; }
.contact-product-trigger { display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: left; cursor: pointer; }
.contact-product-trigger > span { width: 9px; height: 9px; flex: 0 0 9px; border-right: 1.5px solid #536a82; border-bottom: 1.5px solid #536a82; font-size: 0; transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; }
.contact-product-trigger[aria-expanded="true"] > span { transform: rotate(225deg) translateY(-2px); }
.contact-product-menu { position: absolute; z-index: 20; top: calc(100% + 7px); left: 0; display: flex; width: 100%; max-height: 340px; flex-direction: column; gap: 7px; padding: 9px; overflow: hidden; border: 1px solid #c6d2e2; border-radius: 10px; background: #fff; box-shadow: 0 12px 30px #10243a30; }
.contact-product-menu[hidden] { display: none; }
.contact-product-search { min-height: 42px; flex: 0 0 auto; padding: 9px 12px; background: #f8fafd; }
.contact-product-options { min-height: 0; overflow: auto; overscroll-behavior: contain; }
.contact-product-option-group > p { position: sticky; top: 0; z-index: 1; margin: 0; padding: 8px 10px 5px; color: #536a82; background: #fff; font-size: 12px; font-weight: 800; }
.contact-product-option { padding: 9px 10px; border-radius: 6px; color: #263a4f; font-size: 14px; line-height: 1.4; cursor: pointer; }
.contact-product-option:hover, .contact-product-option:focus, .contact-product-option[aria-selected="true"] { outline: 0; color: var(--ink); background: #eaf1fb; }
.contact-product-empty { margin: 0; padding: 12px 10px; color: #64778b; font-size: 14px; }
.contact-field-message { grid-column: 1 / -1; }
.contact-inquiry-bottom { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.contact-captcha { display: grid; grid-template-columns: minmax(0, 1fr) 84px; align-items: center; gap: 12px; }
.contact-captcha input { min-height: 48px; padding: 10px 12px; }
.contact-inquiry-submit { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; gap: 14px; padding: 0 21px; border: 0; border-radius: 8px; color: var(--ink); background: #fff; font: inherit; font-weight: 800; cursor: pointer; transition: background .18s ease, transform .18s ease; }
.contact-inquiry-submit:hover { transform: translateY(-1px); background: #eaf2fb; }
.contact-inquiry-submit:focus-visible { outline: 3px solid #8dd3ff; outline-offset: 3px; }
.contact-inquiry-submit span { color: var(--blue); }
.contact-inquiry-note { grid-column: 1 / -1; margin: -8px 0 0; color: #526477; font-size: 13px; line-height: 1.5; }
.contact-honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; }

.systems-section { position: relative; display: flex; min-height: min(880px, 100svh); overflow: hidden; align-items: flex-start; justify-content: space-between; padding: clamp(48px, 6vw, 100px) clamp(30px, 4.2vw, 82px); isolation: isolate; background: #e8edf2; }
.systems-background, .systems-wash { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; }
.systems-background { object-fit: cover; object-position: center 52%; transition: opacity .25s ease; }
.systems-background.is-changing { opacity: .38; }
.systems-wash { z-index: -1; background: linear-gradient(90deg, #e5eaf0b3 0%, #e5eaf07a 31%, #e5eaf000 62%), linear-gradient(0deg, #e5eaf044, transparent 36%); }
.systems-heading { position: relative; z-index: 1; width: min(48%, 630px); padding-top: 12px; }
.systems-heading .eyebrow { color: #3a526b;  font-size: calc(14px + 2.5px); letter-spacing: .08em; }
.systems-heading .accent-mark { margin-top: 30px; }
.systems-heading h2 { max-width: 600px; margin: 26px 0 17px; color: var(--ink);  font-size: calc(clamp(46.2px, 4.84vw, 79.2px) + 2.5px); font-weight: 600; letter-spacing: -.065em; line-height: .99; }
.systems-description { max-width: 410px; min-height: 75px; margin: 0; color: #33495d;  font-size: calc(clamp(15.4px, 1.21vw, 19.8px) + 2.5px); line-height: 1.55; }
.visual-panel { position: relative; display: flex; min-height: 730px; height: calc(100svh - 20px); align-items: center; justify-content: center; isolation: isolate; background: #f4f6f8; }
.visual-panel::before { position: absolute; z-index: -1; inset: 0; content: ""; background: radial-gradient(ellipse at 50% 52%, #fff 0%, #f7f9fb 48%, #edf2f6 100%); }
.visual-lines { position: absolute; z-index: -1; inset: 0; opacity: .42; background: repeating-linear-gradient(174deg, transparent 0 20px, #c9d4dd 21px, transparent 22px 27px); mask-image: linear-gradient(130deg, #000 0 48%, transparent 90%); }
.top-actions { position: absolute; z-index: 5; top: 20px; right: 20px; display: flex; align-items: center; gap: 10px; }
.quote-button, .language-button, .menu-button, .close-button { display: grid; place-items: center; height: 60px; border: 0; cursor: pointer; }
.quote-button { min-width: 117px; padding: 0 20px; border-radius: 40px; background: #fff; color: #131820;  font-size: calc(14px + 2.5px); font-weight: 800; transition: background .2s ease, color .2s ease; }
.quote-button:hover { background: var(--blue); color: #fff; }
.language-button { width: 72px; border-radius: 50%; color: #fff; background: #050505;  font-size: calc(15.4px + 2.5px); font-weight: 800; }
.menu-button, .close-button { position: relative; width: 60px; border-radius: 50%; background: var(--red); transition: transform .2s ease; }
.menu-button:hover, .close-button:hover { transform: rotate(6deg); }
.menu-button span { position: absolute; width: 23px; height: 2px; border-radius: 2px; background: #fff; transition: transform .2s ease; }
.menu-button span:first-child { transform: translateY(-4px); }.menu-button span:last-child { transform: translateY(4px); }
.tank-art { position: absolute; inset: 0; width: auto; height: auto; overflow: hidden; }
.hero-product-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 59% center; }
.spec-cards { position: absolute; z-index: 2; bottom: 88px; left: 32px; display: flex; gap: 9px; }
.spec-card { display: flex; width: 128px; height: 92px; flex-direction: column; justify-content: space-between; padding: 13px 14px; border: 1px solid #fff; border-radius: 13px; color: #596d82; background: #f3f6f8c9; box-shadow: 0 3px 14px #33516b0c; backdrop-filter: blur(8px); }
.spec-card strong { font-size: calc(26.4px + 2.5px); font-weight: 500; letter-spacing: -.04em; }
.spec-card span { font-size: calc(11px + 2.5px); font-weight: 800; }

.menu-overlay { position: fixed; z-index: 20; inset: 10px; overflow: auto; border: 1px solid #e6ebef; border-radius: 20px; background: #fff; box-shadow: 0 15px 70px #142b421c; animation: menu-in .35s cubic-bezier(.2,.75,.2,1) both; }
.menu-overlay[hidden] { display: none; }
.menu-topbar { position: relative; z-index: 3; display: flex; align-items: center; gap: 10px; min-height: 112px; padding: 25px 42px; }
.menu-brand { display: flex; flex-direction: column; margin-right: auto;  font-size: calc(31.9px + 2.5px); font-weight: 800; letter-spacing: -1.6px; }.menu-brand span { margin-top: 3px;  font-size: calc(9px + 2.5px); letter-spacing: .08em; color: #667789; }
.close-button { width: 60px; height: 60px; }
.close-button span { position: absolute; width: 25px; height: 2px; border-radius: 2px; background: #fff; }.close-button span:first-child { transform: rotate(45deg); }.close-button span:last-child { transform: rotate(-45deg); }
.menu-content { position: relative; display: grid; min-height: calc(100% - 112px); grid-template-columns: minmax(350px, 1fr) minmax(400px, 1.1fr); align-items: center; padding: 20px 5vw 52px; }
.menu-illustration { position: relative; display: grid; place-items: center; width: min(42vw, 590px); aspect-ratio: 1; overflow: hidden; }
.menu-illustration-ring { position: absolute; border: 3px solid #dfe4e8; border-radius: 50%; }
.menu-illustration-ring::after { position: absolute; content: ""; inset: 13%; border: 1px solid #e8ecef; border-radius: 50%; }
.menu-illustration-ring--outer { width: 90%; aspect-ratio: 1; }.menu-illustration-ring--inner { width: 68%; aspect-ratio: 1; border-width: 2px; }
.menu-tank { position: relative; z-index: 1; width: 36%; height: 60%; border: 2px solid #c7d0d8; border-radius: 48% 48% 24% 24% / 15% 15% 10% 10%; background: linear-gradient(100deg, #f4f6f8, #fff 50%, #e9edf0); }
.menu-tank::before { position: absolute; top: -6%; left: 13%; width: 74%; height: 14%; border: 2px solid #c7d0d8; border-radius: 50%; content: ""; background: #fff; }
.menu-tank::after { position: absolute; top: 38%; left: 37%; width: 26%; height: 17%; border: 1px solid #e1e5e8; border-radius: 5px; content: ""; }
.menu-tank span { position: absolute; top: -13%; left: 42%; width: 16%; height: 12%; border: 2px solid #c7d0d8; border-bottom: 0; }
.menu-tank i { position: absolute; bottom: -8%; left: 38%; width: 24%; height: 9%; border: 2px solid #c7d0d8; border-radius: 0 0 6px 6px; }
.menu-illustration > b { position: absolute; width: 19%; height: 2px; background: var(--red); transform-origin: center; }.menu-illustration > b:nth-of-type(1) { top: 25%; left: 21%; transform: rotate(48deg); }.menu-illustration > b:nth-of-type(2) { right: 13%; bottom: 34%; transform: rotate(-34deg); }.menu-illustration > b:nth-of-type(3) { left: 19%; bottom: 20%; transform: rotate(23deg); }
.menu-nav { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; padding: 0 4px; }
.menu-nav .eyebrow { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; color: #8491a0;  font-size: calc(14px + 2.5px); font-weight: 600; }
.menu-dash { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; color: #fff; background: #dfe6ed;  font-size: 24.2px; }
.menu-nav a { position: relative; color: var(--ink);  font-size: calc(clamp(30.8px, 3.58vw, 59.4px) + 2.5px); font-weight: 500; letter-spacing: -.055em; line-height: 1.25; transition: color .2s ease, transform .2s ease; }
.menu-nav a:hover { color: var(--blue); transform: translateX(-6px); }
.menu-footer { position: absolute; right: 5vw; bottom: 22px; left: 5vw; display: flex; justify-content: space-between; padding-top: 15px; border-top: 1px solid #edf0f3; color: #8592a0;  font-size: calc(11px + 2.5px); font-weight: 800; letter-spacing: .09em; }
body.menu-open { overflow: hidden; }

@keyframes slow-turn { to { transform: rotate(360deg); } }
@keyframes menu-in { from { opacity: 0; transform: translateY(8px) scale(.995); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 1100px) {
  .page-shell { grid-template-columns: minmax(300px, 38fr) minmax(0, 62fr); }
  .left-column { grid-template-rows: 88px minmax(390px, 1fr) 230px; }
  .intro-card { padding-inline: 38px; }
  .discover-button { margin-top: 38px; }
  .visual-panel { min-height: 680px; }
}
@media (max-width: 760px) {
  .page-shell { display: flex; flex-direction: column; gap: 9px; padding: 9px; }
  .left-column { display: contents; }
  .brand-card { order: 0; min-height: 76px; padding-inline: 23px; border-radius: 16px; }
  .brand-name {  font-size: calc(28.6px + 2.5px); }
  .visual-panel { order: 1; min-height: 660px; height: min(78svh, 780px); border-radius: 17px; }
  .top-actions { top: 13px; right: 13px; gap: 7px; }
  .hero-product-image { object-position: 75% center; }
  .spec-cards { bottom: 58px; left: 15px; gap: 5px; }
  .spec-card { width: clamp(84px, 26vw, 117px); height: 76px; padding: 10px; }
  .spec-card strong { font-size: calc(20.9px + 2.5px); }
  .spec-card span { font-size: calc(9px + 2.5px); }
  .quote-button { min-width: 90px; height: 48px; padding-inline: 13px;  font-size: calc(12px + 2.5px); }
  .language-button, .menu-button { width: 48px; height: 48px;  font-size: calc(14px + 2.5px); }
  .menu-button span { width: 19px; }
  .intro-card { order: 2; min-height: 500px; padding: 58px 28px; border-radius: 17px; }
  .intro-card .eyebrow { margin-bottom: 20px; }
  h1 { max-width: 580px;  font-size: calc(clamp(39.6px, 9.9vw, 57.2px) + 2.5px); }
  .hero-product-navigation { grid-template-columns: minmax(0, 1fr) 40px; gap: 8px; margin-top: 20px; }
  .hero-product-link { min-height: 56px;  font-size: calc(clamp(20.9px, 5.61vw, 29.7px) + 2.5px); }
  .hero-product-controls button { width: 38px; height: 38px; }
  .discover-button { margin-top: 38px; }
  .about-card { order: 3; min-height: 410px; gap: 22px; padding: 37px 28px; border-radius: 17px; }.about-copy { font-size: calc(16.5px + 2.5px); }.about-word-cloud { gap: 8px 14px; }.about-word-cloud-tag { font-size: calc(15px + 2.5px); }
  .menu-overlay { inset: 6px; border-radius: 16px; }
  .menu-topbar { min-height: 88px; gap: 7px; padding: 16px; }.menu-brand {  font-size: calc(24.2px + 2.5px); }.menu-brand span {  font-size: calc(8px + 2.5px); }
  .menu-topbar .language-button, .close-button { width: 45px; height: 45px; }.close-button span { width: 20px; }
  .menu-content { display: flex; min-height: calc(100% - 88px); align-items: stretch; justify-content: center; padding: 13px 24px 56px; }
  .menu-illustration { position: absolute; bottom: 5%; left: -14%; width: 72vw; max-width: 420px; opacity: .32; }
  .menu-nav { align-items: flex-end; justify-content: center; gap: 5px; width: 100%; padding-bottom: 18px; }
  .menu-nav .eyebrow { margin-bottom: 12px;  font-size: calc(12px + 2.5px); }.menu-dash { width: 27px; height: 27px; }
  .menu-nav a {  font-size: calc(clamp(29.7px, 8.8vw, 46.2px) + 2.5px); }
  .menu-footer { right: 24px; bottom: 15px; left: 24px;  font-size: calc(9px + 2.5px); }
  .manifesto-section { min-height: 430px; padding: 55px 24px 48px; }
  .manifesto-kicker .eyebrow {  font-size: calc(13px + 2.5px); }
  .accent-mark { width: 30px; height: 30px; margin-top: 36px; }
  .manifesto-section h2 { margin-top: 24px;  font-size: calc(clamp(30.8px, 7.7vw, 39.6px) + 2.5px); line-height: 1.22; }
  .systems-section { min-height: 940px; padding: 45px 24px 24px; }
  .systems-background { height: 63%; object-fit: cover; object-position: center 46%; }
  .systems-wash { background: linear-gradient(180deg, #e5eaf0b5 0%, #e5eaf026 70%, #e5eaf040 100%); }
  .systems-heading { width: 100%; padding-top: 0; }
  .systems-heading h2 { max-width: 470px; margin-top: 20px;  font-size: calc(clamp(41.8px, 9.9vw, 57.2px) + 2.5px); }
  .systems-heading .accent-mark { margin-top: 20px; }
  .systems-description { max-width: 355px; min-height: 65px;  font-size: calc(15.4px + 2.5px); }
  .system-tabs { position: absolute; right: 16px; bottom: 20px; left: 16px; width: auto; height: 300px; margin: 0; }
  .system-tab { min-height: 0; padding: 17px 20px; }
  .system-tab-number {  font-size: calc(16.5px + 2.5px); }
  .system-tab-title {  font-size: calc(15.4px + 2.5px); }
}
@media (max-width: 390px) {
  .visual-panel { min-height: 590px; }.quote-button { min-width: 78px; }.top-actions { right: 9px; gap: 5px; }
  .menu-topbar { padding-inline: 12px; }.menu-brand {  font-size: calc(20.9px + 2.5px); }
  .menu-nav a {  font-size: calc(29.7px + 2.5px); }
  .systems-section { min-height: 900px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

.catalog-page { display: flex; min-height: 100svh; flex-direction: column; gap: var(--gutter); padding: var(--gutter); }
.catalog-header { display: flex; min-height: 100px; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 30px 14px 38px; border-radius: 21px; background: var(--paper); }
.catalog-brand { display: flex; min-width: 0; flex-direction: column; }
.catalog-brand .brand-name {  font-size: calc(clamp(26.4px, 2.42vw, 37.4px) + 2.5px); }
.catalog-actions { display: flex; align-items: center; gap: 10px; }
.catalog-actions .quote-button { border: 1px solid #e6ebef; }
.catalog-hero { display: grid; min-height: min(680px, 82svh); grid-template-columns: minmax(350px, .76fr) minmax(0, 1.24fr); gap: var(--gutter); }
.catalog-hero-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(34px, 5vw, 78px); border-radius: 21px; background: var(--paper); }
.catalog-hero-copy > .eyebrow { color: #4e6780; letter-spacing: .09em; }
.catalog-hero-copy .accent-mark { margin-top: 26px; }
.catalog-hero h1 { max-width: 520px; margin-top: 28px;  font-size: calc(clamp(44px, 4.18vw, 70.4px) + 2.5px); }
.catalog-hero-copy > p:not(.eyebrow) { max-width: 490px; margin: 24px 0 0; color: #52667b;  font-size: calc(clamp(16.5px, 1.27vw, 19.8px) + 2.5px); line-height: 1.65; }
.catalog-hero-copy .discover-button { margin-top: 35px; }
.catalog-hero-image-wrap { position: relative; min-height: 570px; overflow: hidden; border-radius: 21px; background: #e9edf1; }
.catalog-hero-image { display: block; width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: 70% center; }
.catalog-image-caption { position: absolute; right: 24px; bottom: 23px; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid #ffffffa8; border-radius: 24px; color: #50667c; background: #ffffffb8; backdrop-filter: blur(10px);  font-size: calc(11px + 2.5px); font-weight: 800; letter-spacing: .08em; }
.catalog-image-caption span { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; color: var(--red); background: #fff; }
.catalog-areas { padding: clamp(54px, 7vw, 100px) clamp(22px, 4vw, 76px) clamp(45px, 6vw, 78px); border-radius: 21px; background: var(--canvas); }
.catalog-section-heading { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; row-gap: 12px; margin-bottom: 32px; }
.catalog-section-heading .eyebrow { grid-column: 1 / -1; color: #526a82; letter-spacing: .09em; }
.catalog-section-heading h2 { margin: 0;  font-size: calc(clamp(39.6px, 3.96vw, 61.6px) + 2.5px); font-weight: 500; letter-spacing: -.06em; line-height: 1.05; }
.catalog-section-heading > p:last-child { max-width: none; margin: 0; color: #50647a;  font-size: calc(16.5px + 2.5px); line-height: 1.6; text-align: left; }
.catalog-section-heading.product-category-heading { grid-template-columns: minmax(0, 1fr); align-items: start; row-gap: 14px; }
.product-category-heading h1 { width: 100%; max-width: none; margin: 0; font-size: clamp(28px, 4.2vw, 64px); white-space: nowrap; }
.product-category-heading [data-page-description] { max-width: none; margin: 0; color: #50647a; font-size: clamp(15px, 1.25vw, 18px); line-height: 1.6; }
.product-category-heading [data-page-description] span { display: block; }
.catalog-section-heading.product-group-heading { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 14px; }
.product-group-heading h1 { width: 100%; max-width: none; font-size: clamp(28px, 4.2vw, 64px); white-space: nowrap; }
.catalog-section-heading.product-group-heading > p:last-child { max-width: none; margin: 0; font-size: clamp(14px, 1.25vw, 18px); line-height: 1.6; }
.product-group-heading [data-group-description] span { display: block; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.catalog-card { min-width: 0; overflow: hidden; border: 1px solid #fff; border-radius: 17px; background: #fff; box-shadow: 0 8px 28px #30475b0b; }
.catalog-card > img { display: block; width: 100%; aspect-ratio: 1.45; object-fit: cover; object-position: center; background: #e8edf2; }
.catalog-card-copy { position: relative; min-height: 190px; padding: 24px 25px 25px; }
.catalog-card-number { color: var(--red);  font-size: calc(15px + 2.5px); font-weight: 600; }
.catalog-card h3 { margin: 16px 0 9px;  font-size: calc(clamp(19px, 1.55vw, 23.4px) + 2.5px); font-weight: 600; letter-spacing: -.04em; line-height: 1.16; }
.catalog-card p { max-width: 390px; margin: 0; color: #65778a;  font-size: calc(15.4px + 2.5px); line-height: 1.55; }
.catalog-footer { display: flex; min-height: 84px; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 28px; border-radius: 17px; background: #fff; color: #65778a;  font-size: calc(12px + 2.5px); font-weight: 800; letter-spacing: .08em; }
.catalog-footer a:first-child { color: var(--ink);  font-size: calc(17.6px + 2.5px); letter-spacing: -.03em; }
.catalog-footer a:last-child { color: var(--red); }
.product-faq { align-self: center; width: min(100%, 1120px); margin: 24px auto 18px; padding: clamp(26px, 4vw, 52px); border: 1px solid #e2e9ef; border-radius: 18px; color: var(--ink); background: #fff; box-shadow: 0 12px 36px #172b400d; text-align: left; }
.product-faq > .eyebrow { margin: 0 0 10px; color: #526a82; font-size: 13px; font-weight: 800; letter-spacing: .1em; }
.product-faq h2 { margin: 0 0 22px; color: var(--ink); font-size: clamp(27px, 3vw, 38px); font-weight: 700; letter-spacing: -.04em; line-height: 1.15; }
.product-faq-list { border-top: 1px solid #e2e9ef; }
.product-faq-list details { padding: 18px 2px; border-bottom: 1px solid #e2e9ef; }
.product-faq-list summary { color: var(--ink); font-size: clamp(16px, 1.5vw, 19px); font-weight: 700; line-height: 1.45; cursor: pointer; }
.product-faq-list summary::marker { color: var(--blue); }
.product-faq-list details > p { max-width: 78ch; margin: 12px 0 0; color: #526477; font-size: 16px; line-height: 1.65; }
.product-faq-list summary:focus-visible { border-radius: 3px; outline: 3px solid var(--blue); outline-offset: 4px; }

@media (max-width: 760px) {
  .catalog-page { gap: 9px; padding: 9px; }
  .catalog-header { min-height: 132px; flex-wrap: wrap; gap: 8px; padding: 15px 18px; border-radius: 16px; }
  .catalog-brand { width: 100%; }
  .catalog-brand .brand-name {  font-size: calc(27.5px + 2.5px); }
  .catalog-actions { gap: 7px; margin-left: auto; }
  .catalog-actions .quote-button { min-width: 92px; height: 48px; padding: 0 12px;  font-size: calc(12px + 2.5px); }
  .catalog-actions .language-button, .catalog-actions .menu-button { width: 48px; height: 48px; }
  .catalog-hero { display: flex; flex-direction: column; gap: 9px; }
  .catalog-hero-copy { min-height: 510px; padding: 42px 28px; border-radius: 17px; }
  .catalog-hero h1 { max-width: 540px;  font-size: calc(clamp(39.6px, 9.9vw, 57.2px) + 2.5px); }
  .catalog-hero-copy > p:not(.eyebrow) {  font-size: calc(16.5px + 2.5px); }
  .catalog-hero-copy .discover-button { min-width: min(290px, 100%); gap: 12px;  font-size: calc(15.4px + 2.5px); }
  .catalog-hero-image-wrap { min-height: 500px; border-radius: 17px; }
  .catalog-hero-image { object-position: 72% center; }
  .catalog-areas { padding: 48px 18px 24px; border-radius: 17px; }
  .catalog-section-heading { display: block; margin-bottom: 22px; }
  .catalog-section-heading.product-category-heading { display: grid; row-gap: 12px; }
  .product-category-heading h1 { font-size: clamp(20px, 6vw, 36px); }
  .product-category-heading [data-page-description] { font-size: 15px; }
  .catalog-section-heading h2 { margin-top: 14px;  font-size: calc(clamp(37.4px, 8.8vw, 44px) + 2.5px); }
  .catalog-section-heading > p:last-child { margin: 13px 0 0;  font-size: calc(15.4px + 2.5px); }
  .catalog-grid { grid-template-columns: 1fr; gap: 10px; }
  .catalog-card { border-radius: 15px; }
  .catalog-card > img { aspect-ratio: 1.48; }
  .catalog-card-copy { min-height: 155px; padding: 20px 21px 22px; }
  .catalog-card h3 { margin-top: 11px;  font-size: calc(20px + 2.5px); }
  .catalog-card p {  font-size: calc(15.4px + 2.5px); }
  .catalog-footer { min-height: 76px; padding: 12px 18px;  font-size: calc(10px + 2.5px); }
  .catalog-footer span { display: none; }
  .product-faq { width: 100%; margin: 15px auto 8px; padding: 23px 19px; border-radius: 15px; }
  .product-faq h2 { margin-bottom: 16px; }
  .product-faq-list details { padding: 15px 1px; }
  .product-faq-list details > p { font-size: 15px; }
}

/* Product catalog navigation and detail pages */
.menu-product-tree { position: relative; z-index: 2; max-height: calc(100svh - 250px); overflow: auto; padding: 0 14px 20px 0; scrollbar-color: #aebbc7 transparent; scrollbar-width: thin; overscroll-behavior: contain; cursor: grab; user-select: none; -webkit-user-select: none; }
.menu-product-tree.is-dragging { cursor: grabbing; }
.menu-tree-catalog + .menu-tree-catalog { margin-top: 34px; }
.menu-tree-catalog-title { margin: 0 0 16px; padding: 10px 0 12px; border-bottom: 1px solid #e5eaee; color: #6f7f8e; font-size: calc(13px + 2.5px); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.menu-tree-categories { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); align-items: stretch; gap: 14px; }
.menu-tree-category { min-width: 0; padding: 0 0 15px; border-bottom: 1px solid #e5eaee; }
.menu-tree-category-title { display: block; padding: 2px 0 10px; color: #182b3e; font-size: calc(13px + 5.5px); font-weight: 800; line-height: 1.35; }
.menu-tree-group { padding-top: 10px; border-top: 1px solid #e5eaee; }
.menu-tree-group + .menu-tree-group { margin-top: 8px; }
.menu-tree-group-title { display: block; padding: 2px 0; color: var(--blue); font-size: calc(11px + 5.5px); font-weight: 700; line-height: 1.35; }
.menu-tree-products { display: grid; gap: 3px; margin: 5px 0 0; padding: 0 0 0 10px; list-style: none; }
.menu-tree-product { display: block; padding: 4px 0; color: #586f85; font-size: calc(11px + 2.5px); line-height: 1.35; overflow-wrap: anywhere; }
.menu-tree-product:hover { color: #1767a8; }
.menu-tree-category-title:hover, .menu-tree-group-title:hover { color: #1767a8; }
.menu-product-tree a:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.catalog-link-card { display: block; min-height: 202px; transition: transform .2s ease, box-shadow .2s ease; }
.catalog-link-card:hover { transform: translateY(-3px); box-shadow: 0 14px 32px #30475b15; }
.catalog-link-card:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.catalog-link-card .catalog-card-copy { display: flex; min-height: 200px; flex-direction: column; align-items: flex-start; }
.catalog-link-card-heading { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) 112px; align-items: start; gap: 14px; }
.catalog-link-card-heading > div { min-width: 0; }
.catalog-link-card h2 { margin: 16px 0 8px;  font-size: calc(clamp(18.5px, 1.6vw, 24.2px) + 2.5px); font-weight: 600; letter-spacing: -.04em; line-height: 1.16; }
.catalog-card-cta { display: flex; width: 100%; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 18px; color: var(--blue);  font-size: calc(15px + 2.5px); font-weight: 800; }
.catalog-card-cta b { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: white; background: var(--blue);  font-size: 19.8px; }
.catalog-empty { grid-column: 1 / -1; padding: 28px; border: 1px solid white; border-radius: 14px; color: #52667b; background: #fff; }
.detail-section { min-height: 50vh; }
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; padding: 12px 8px 4px; color: #6c7e90;  font-size: calc(15px + 2.5px); }
.breadcrumbs a:hover { color: var(--blue); }
.breadcrumbs span:last-child { color: var(--ink); }
.product-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 12px; overflow: visible; }
.product-item-card { min-height: 202px; }
.product-item-card .catalog-card-copy { display: flex; min-height: 200px; flex-direction: column; align-items: stretch; }
.product-item-card-heading { display: grid; grid-template-columns: minmax(0, 1fr) 112px; align-items: start; gap: 14px; }
.product-item-card-heading-copy { min-width: 0; }
.product-item-card h2 { overflow-wrap: anywhere; font-size: calc(clamp(18.5px, 1.5vw, 24.2px) + 2.5px); line-height: 1.16; }
.product-item-card-image { position: relative; display: grid; width: 112px; aspect-ratio: 1; place-items: center; margin-top: 4px; padding: 5px; overflow: hidden; border-radius: 9px; background: #f4f7f9; }
.product-item-card-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.product-detail-layout { display: grid; min-height: min(680px, 78svh); grid-template-columns: 1fr 1fr; gap: var(--gutter); }
.product-detail-image, .product-detail-copy { position: relative; overflow: hidden; border-radius: 21px; background: #fff; }
.product-detail-image img { width: 100%; height: 100%; min-height: 500px; object-fit: cover; }
.product-detail-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(30px, 5vw, 78px); }
.product-detail-copy h1 { max-width: 700px; margin-top: 22px;  font-size: calc(clamp(35.2px, 4.07vw, 61.6px) + 2.5px); font-weight: 500; letter-spacing: -.055em; line-height: 1.12; }
.product-detail-description { display: grid; gap: 3px; margin: 16px 0 0; color: #34495e; font-size: clamp(15px, 1.25vw, 17px); line-height: 1.55; }
.product-detail-description span { display: block; }
.product-detail-note { margin: 24px 0; color: #596d80;  font-size: calc(17.6px + 2.5px); line-height: 1.7; }
.product-detail-meta { display: grid; gap: 5px; margin: 6px 0 28px; color: #758597;  font-size: calc(14px + 2.5px); }
.product-detail-meta strong { color: var(--ink);  font-size: calc(16.5px + 2.5px); }
@media (max-width: 1100px) {
  .menu-content { grid-template-columns: minmax(180px, .7fr) minmax(230px, .8fr) minmax(290px, 1fr); gap: 14px; }
  .menu-illustration { width: 100%; }
}
@media (max-width: 760px) {
  .menu-content { display: flex; min-height: calc(100% - 88px); flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 18px; padding: 13px 18px 56px; }
  .menu-nav { align-items: flex-end; justify-content: center; gap: 5px; width: 100%; padding-bottom: 14px; }
  .menu-product-tree { max-height: 48vh; width: 100%; padding: 12px; }
  .menu-product-section > summary {  font-size: calc(15.4px + 2.5px); }
  .menu-product-category > summary, .menu-product-group > summary {  font-size: calc(14px + 2.5px); }
  .product-detail-layout { grid-template-columns: 1fr; gap: 9px; }
  .product-detail-image, .product-detail-copy { border-radius: 17px; }
  .product-detail-image img { min-height: 370px; max-height: 54svh; }
  .product-detail-copy { min-height: 420px; padding: 34px 25px; }
  .product-detail-copy h1 {  font-size: calc(clamp(35.2px, 9.35vw, 50.6px) + 2.5px); }
  .product-detail-description { gap: 5px; margin-top: 13px; font-size: 15px; }
  .product-list { grid-template-columns: 1fr; }
  .catalog-link-card-heading, .product-item-card-heading { grid-template-columns: minmax(0, 1fr) 104px; gap: 10px; }
  .product-item-card-image { width: 104px; }
  .catalog-link-card h2, .product-item-card h2 { font-size: calc(18px + 2.5px); }
}

@media (max-width: 1100px) and (min-width: 761px) {
  .product-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.product-groups-section { overflow: hidden; padding: clamp(58px, 7vw, 100px) 0 clamp(48px, 6vw, 84px); background: #eef4f8; }
.product-groups-heading { max-width: 1180px; margin: 0 auto 36px; padding: 0 32px; }
.product-groups-heading .eyebrow, .product-rail-heading .eyebrow { color: #597087;  font-size: calc(13px + 2.5px); letter-spacing: .1em; }
.product-groups-heading h2 { margin: 13px 0 6px;  font-size: calc(clamp(37.4px, 3.96vw, 57.2px) + 2.5px); font-weight: 600; letter-spacing: -.06em; }
.product-groups-heading > p:last-child { margin: 0; color: #607487;  font-size: calc(clamp(15.4px, 1.27vw, 18.7px) + 2.5px); }
.product-showcase-layout { display: grid; max-width: 1360px; min-height: 430px; grid-template-columns: minmax(230px, .65fr) minmax(0, 1.8fr); gap: 22px; margin: 0 auto; padding: 0 32px; }
.product-group-nav { display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.product-group-tab { position: relative; display: flex; width: 100%; min-height: 44px; align-items: center; padding: 10px 14px 10px 18px; border: 0; border-left: 2px solid transparent; border-radius: 0; color: #172d42; background: transparent; text-align: left;  font-size: calc(16.5px + 2.5px); font-weight: 700; cursor: pointer; transition: color .2s ease, border-color .2s ease; }
.product-group-tab:hover, .product-group-tab:focus-visible { border-left-color: var(--red); color: var(--blue); background: transparent; }
.product-group-tab.is-active { border-left-color: var(--red); color: var(--ink); background: transparent; }
.product-group-tab.is-active:hover { color: var(--blue); }
.product-group-tab:focus-visible { outline-offset: -2px; }
.product-feature { position: relative; min-width: 0; min-height: 430px; overflow: hidden; border: 1px solid #fff; border-radius: 18px; background: radial-gradient(ellipse at 72% 48%, #fff 0%, #f2f6f9 70%); }
.product-feature-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: left center; transition: opacity .25s ease; }
.product-feature-copy { position: absolute; z-index: 1; top: 50%; right: 22px; bottom: auto; left: auto; display: flex; width: min(340px, 36%); flex-direction: column; align-items: flex-start; padding: 22px 24px; border: 1px solid #fff; border-radius: 14px; background: #fffffff0; box-shadow: 0 12px 30px #253c5114; backdrop-filter: blur(8px); transform: translateY(-50%); }
.product-feature-index { align-self: flex-end; margin-bottom: 12px; color: var(--red);  font-size: calc(14px + 2.5px); font-weight: 700; }
.product-feature-copy .eyebrow { color: #708195;  font-size: calc(11px + 2.5px); letter-spacing: .1em; }
.product-feature-copy h3 { margin: 10px 0 6px;  font-size: calc(clamp(24.2px, 2.09vw, 29.7px) + 2.5px); font-weight: 600; letter-spacing: -.045em; line-height: 1.15; }
.product-feature-copy > p:not(.eyebrow) { margin: 0; color: #65788a;  font-size: calc(15px + 2.5px); line-height: 1.5; }
.product-feature-link { display: flex; align-items: center; gap: 16px; margin-top: 17px; color: var(--blue);  font-size: calc(14px + 2.5px); font-weight: 800; }
.product-feature-link span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; color: #fff; background: var(--blue);  font-size: 17.6px; }
.product-rail-heading { display: flex; max-width: 1180px; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 54px auto 17px; padding: 0 32px; }
.product-rail-heading h3 { margin: 7px 0 0;  font-size: calc(clamp(24.2px, 2.31vw, 31.9px) + 2.5px); font-weight: 600; letter-spacing: -.045em; }
.product-rail-controls { display: flex; gap: 8px; }
.product-rail-arrow { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid #d2dce5; border-radius: 50%; color: var(--ink); background: #fff;  font-size: 23.1px; cursor: pointer; transition: color .2s ease, background .2s ease, border-color .2s ease; }
.product-rail-arrow:hover { border-color: var(--blue); color: #fff; background: var(--blue); }
.product-rail { display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; padding: 0 max(32px, calc((100vw - 1116px) / 2)) 18px; scroll-snap-type: x mandatory; scrollbar-width: none; cursor: grab; user-select: none; -webkit-overflow-scrolling: touch; }
.product-rail::-webkit-scrollbar { display: none; }
.product-rail.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.product-rail-card { display: flex; flex: 0 0 clamp(220px, 22vw, 270px); min-height: 365px; flex-direction: column; overflow: hidden; border: 1px solid #e3eaf0; border-radius: 15px; background: #fff; scroll-snap-align: start; transition: transform .2s ease, box-shadow .2s ease; }
.product-rail-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px #263c5016; }
.product-rail-image { position: relative; display: block; aspect-ratio: 1.15; overflow: hidden; background: #f4f7f9; }
.product-rail-image img { display: block; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; pointer-events: none; }
.product-rail-card-copy { display: flex; min-height: 150px; flex: 1; flex-direction: column; align-items: flex-start; padding: 15px 17px 14px; }
.product-rail-number { color: var(--red);  font-size: calc(12px + 2.5px); font-weight: 700; }
.product-rail-name { display: -webkit-box; margin-top: 8px; overflow: hidden; color: var(--ink);  font-size: calc(15px + 2.5px); font-weight: 700; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.product-rail-card-link { display: flex; width: 100%; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 12px; color: #586f85;  font-size: calc(13px + 2.5px); font-weight: 700; }
.product-rail-card-link b { color: var(--blue);  font-size: 18.7px; }
.product-image-note { max-width: 1116px; margin: 0 auto; padding: 0 32px; color: #758698;  font-size: calc(13px + 2.5px); }
.all-products-link { display: flex; width: fit-content; align-items: center; gap: 14px; margin: 19px auto 0; padding: 12px 17px; border: 1px solid #d5dfe7; border-radius: 30px; color: var(--ink); background: #fff;  font-size: calc(14px + 2.5px); font-weight: 800; }
.all-products-link span { color: var(--red);  font-size: 19.8px; }
.all-products-link:hover { border-color: var(--blue); }

/* Wide site navigation and full-screen product menu */
.site-header { position: sticky; top: 0; z-index: 12; display: grid; min-height: 88px; grid-template-columns: minmax(180px, 1fr) auto auto auto auto; align-items: center; gap: clamp(14px, 2.4vw, 36px); padding: 12px clamp(20px, 4.7vw, 88px); background: #fff; }
.site-brand { display: flex; min-width: 0; flex-direction: column; color: var(--ink); }
.site-brand > span {  font-size: calc(clamp(24.2px, 2.2vw, 33px) + 2.5px); font-weight: 800; letter-spacing: -.06em; line-height: 1; }
.site-brand small { margin-top: 5px; color: #607286;  font-size: calc(9px + 2.5px); font-weight: 700; letter-spacing: .07em; }
.site-nav { display: flex; align-items: center; gap: clamp(16px, 2vw, 31px); }
.site-nav > a { padding: 10px 0; color: #111b27; background: transparent;  font-size: calc(17.6px + 2.5px); font-weight: 700; white-space: nowrap; }
.site-nav > a:hover { color: var(--blue); }
.header-cta { display: grid; min-width: 100px; min-height: 48px; place-items: center; padding: 0 17px; border-radius: 30px; color: #fff; background: var(--red);  font-size: calc(13px + 2.5px); font-weight: 800; text-transform: uppercase; transition: none; }
.header-cta:hover { background: var(--red); transform: none; }
.header-search { position: relative; display: grid; place-items: center; }
.search-button { display: grid; width: 46px; height: 46px; place-items: center; padding: 0; border: 0; border-radius: 0; color: var(--ink); background: transparent; cursor: pointer; transition: color .18s ease; }
.search-button:hover, .search-button[aria-expanded="true"] { color: var(--blue); }
.search-button svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 2.7; }
.site-search-panel[hidden] { display: none; }
.site-search-panel { position: fixed; z-index: 18; inset: 88px 0 auto; display: block; width: 100%; padding: 22px clamp(20px, 4.7vw, 88px) 34px; border: 0; border-radius: 0 0 14px 14px; background: #fff; box-shadow: 0 12px 30px #172b4018; animation: search-panel-in .18s ease both; }
.site-search-panel-inner { width: min(100%, 1438px); margin-inline: auto; }
.site-search-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 19px; }
.site-search-heading h2 { margin: 0; color: #202124; font-size: calc(clamp(28px, 3.1vw, 54px) + 2.5px); font-weight: 700; letter-spacing: -.065em; line-height: 1.08; }
.site-search-close { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px; padding: 8px 0 8px 12px; border: 0; color: #292b2f; background: transparent; cursor: pointer; font: inherit; font-size: calc(13px + 2.5px); font-weight: 700; text-transform: uppercase; }
.site-search-close b { font-size: 20px; font-weight: 400; line-height: 1; }
.site-search-close:hover { color: var(--blue); }
.site-search-field { display: flex; min-height: 60px; align-items: center; gap: 14px; padding: 0 22px; border: 1px solid #e7e4e1; border-radius: 15px; background: #fff; }
.site-search-field svg { width: 21px; height: 21px; flex: 0 0 auto; fill: none; stroke: #92979c; stroke-linecap: round; stroke-width: 2.1; }
.site-search-field input { width: 100%; min-height: 56px; padding: 0; border: 0; outline: 0; color: #202124; background: transparent; font: inherit; font-size: calc(17px + 2.5px); }
.site-search-field input::placeholder { color: #77777b; opacity: 1; }
.site-search-field:focus-within { border-color: #b9c8d8; box-shadow: 0 0 0 3px #287bb51c; }
.site-search-results { display: grid; max-height: min(340px, 50svh); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; margin-top: 12px; overflow: auto; }
.site-search-results[hidden] { display: none; }
.site-search-results p { grid-column: 1 / -1; margin: 3px 0; color: #718293; font-size: calc(15px + 2.5px); line-height: 1.5; }
.site-search-result { padding: 12px 2px; border-bottom: 1px solid #e3e4e4; color: #304356; font-size: calc(15px + 2.5px); line-height: 1.4; }
.site-search-result:hover { color: var(--blue); }
@keyframes search-panel-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.site-header .menu-button { display: flex; width: 46px; height: 46px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.site-header .menu-button:hover { background: transparent; transform: none; }
.site-header .menu-button span { position: static; width: 24px; height: 2.5px; border-radius: 3px; background: var(--ink); transform: none; transition: background .18s ease; }
.site-header .menu-button:hover span { background: var(--blue); }
.page-shell { min-height: calc(100svh - 108px); grid-template-columns: minmax(340px, 33.1fr) minmax(0, 66.9fr); }
.left-column { display: flex; height: max(650px, calc(100svh - 108px)); flex-direction: column; gap: var(--gutter); }
.intro-card { height: auto; min-height: 0; flex: 2 1 0; padding-block: clamp(26px, 3vw, 44px); }
.visual-panel { min-height: 650px; height: max(650px, calc(100svh - 108px)); }
.menu-overlay { inset: 0; overflow-y: auto; border: 0; border-radius: 0; box-shadow: none; animation: menu-in .22s ease both; }
.menu-topbar { min-height: 125px; padding: 28px clamp(24px, 4.7vw, 88px); }
.menu-brand {  font-size: calc(33px + 2.5px); }
.menu-brand span {  font-size: calc(10px + 2.5px); }
.menu-topbar .close-button { display: grid; width: 48px; height: 48px; place-items: center; border: 0; border-radius: 50%; background: transparent; }
.menu-topbar .close-button:hover { background: #f0f4f7; transform: none; }
.menu-topbar .close-button span { width: 27px; background: #111; }
.menu-columns { min-height: calc(100svh - 160px); padding: 34px clamp(24px, 4.7vw, 88px) 42px; }
.menu-products-column { min-height: 0; }
.menu-products-column h2 { margin: 0 0 20px; color: #101820;  font-size: calc(clamp(24.2px, 2.2vw, 33px) + 2.5px); font-weight: 800; letter-spacing: -.04em; }
body.menu-open { overflow: hidden; }

@media (max-width: 1060px) {
  .site-header { grid-template-columns: minmax(140px, 1fr) auto auto auto auto; gap: 13px; }
  .site-nav { gap: 17px; }
  .site-nav > a {  font-size: calc(15.4px + 2.5px); }
  .header-cta { min-width: 84px; }
  .menu-tree-categories { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
}
@media (max-width: 760px) {
  .site-header { min-height: 74px; grid-template-columns: 1fr auto auto auto; gap: 8px; padding: 10px 15px; }
  .site-brand > span {  font-size: calc(23.1px + 2.5px); }
  .site-brand small {  font-size: calc(8px + 2.5px); }
  .site-nav { display: none; }
  .search-button { width: 40px; height: 40px; }
  .search-button svg { width: 23px; height: 23px; stroke-width: 2.7; }
  .site-search-panel { inset-block-start: 74px; padding: 20px 16px 25px; border-radius: 0 0 12px 12px; }
  .site-search-heading { align-items: flex-start; gap: 10px; margin-bottom: 15px; }
  .site-search-heading h2 { max-width: 620px; font-size: calc(clamp(25px, 6.4vw, 34px) + 2.5px); line-height: 1.12; }
  .site-search-close { gap: 5px; padding: 4px 0 4px 4px; font-size: calc(10px + 2.5px); }
  .site-search-close b { font-size: 17px; }
  .site-search-field { min-height: 54px; gap: 11px; padding: 0 15px; border-radius: 12px; }
  .site-search-field input { min-height: 50px; font-size: calc(15px + 2.5px); }
  .site-search-results { max-height: min(45svh, 360px); grid-template-columns: 1fr; }
  .site-search-result { padding: 11px 2px; font-size: calc(14px + 2.5px); }
  .header-cta { min-width: 78px; min-height: 43px; padding: 0 12px;  font-size: calc(11px + 2.5px); }
  .site-header .menu-button { width: 43px; height: 43px; }
  .page-shell { display: flex; min-height: 0; flex-direction: column; gap: 9px; padding: 9px; }
  .left-column { display: contents; }
  .intro-card { order: 1; height: 620px; min-height: 620px; padding: 48px 26px; border-radius: 17px; }
  .visual-panel { order: 0; height: 620px; min-height: 620px; border-radius: 17px; }
  .about-card { order: 2; height: auto; min-height: 290px; max-height: none; gap: 0; padding: 25px 20px; border-radius: 17px; }
  .about-word-cloud { gap: 3px 8px; }
  .about-card .about-word-cloud-tag { font-size: calc(clamp(12px, 2.3vw, 14.5px) + 6px); }
  .quote-button, .language-button { display: none; }
  .menu-overlay { inset: 0; }
  .menu-topbar { min-height: 82px; padding: 14px 18px; }
  .menu-brand {  font-size: calc(24.2px + 2.5px); }
  .menu-brand span {  font-size: calc(8px + 2.5px); }
  .menu-topbar .close-button { width: 42px; height: 42px; }
  .menu-topbar .close-button span { width: 22px; }
  .menu-columns { min-height: 0; padding: 10px 20px 30px; }
  .menu-products-column h2 { margin-bottom: 12px;  font-size: calc(22px + 2.5px); }
  .menu-product-tree { max-height: calc(100svh - 150px); padding-right: 6px; }
  .menu-tree-catalog + .menu-tree-catalog { margin-top: 20px; }
  .menu-tree-catalog-title {  font-size: calc(12px + 2.5px); }
  .menu-tree-categories { grid-template-columns: 1fr; gap: 10px; }
  .menu-tree-category { padding: 0 0 12px; }
  .menu-tree-category-title { font-size: calc(13px + 5.5px); }
  .menu-tree-group-title { font-size: calc(11px + 5.5px); }
}
@media (prefers-reduced-motion: reduce) {
  .site-nav *, .menu-overlay { scroll-behavior: auto; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media (max-width: 760px) {
  .product-groups-section { padding: 49px 0 42px; }
  .product-groups-heading { margin-bottom: 23px; padding: 0 20px; }
  .product-groups-heading h2 {  font-size: calc(clamp(37.4px, 8.8vw, 44px) + 2.5px); }
  .product-showcase-layout { display: flex; min-height: 0; flex-direction: column-reverse; gap: 12px; padding: 0 14px; }
  .product-group-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; padding: 1px 2px 8px; }
  .product-group-tab { min-height: 42px; padding: 9px 8px 9px 12px;  font-size: calc(14px + 2.5px); line-height: 1.35; }
  .product-feature { min-height: 360px; border-radius: 15px; }
  .product-feature-image { object-fit: cover; object-position: left center; }
  .product-feature-copy { top: auto; right: 12px; bottom: 12px; left: auto; width: min(220px, calc(100% - 24px)); padding: 15px 16px; transform: none; }
  .product-rail-heading { margin: 35px 0 14px; padding: 0 20px; }
  .product-rail-heading h3 {  font-size: calc(24.2px + 2.5px); }
  .product-rail-arrow { width: 39px; height: 39px; }
  .product-rail { gap: 9px; padding: 0 14px 15px; }
  .product-rail-card { flex-basis: min(76vw, 285px); min-height: 350px; }
  .product-image-note { padding: 0 20px; }
  .all-products-link { margin-top: 16px; }
}

/* Product cards lead into the dark engineering story, like the reference layout. */
.product-groups-section { overflow: visible; padding-bottom: 92px; }
.product-rail-heading { margin-top: 64px; }
.product-rail { position: relative; z-index: 2; gap: 14px; padding: 0 4vw 22px; }
.product-rail-card { flex-basis: clamp(290px, 25vw, 360px); min-height: 470px; border-radius: 17px; }
.product-rail-image { aspect-ratio: 1.08; }
.product-rail-image img { padding: 14px 18px 20px; object-fit: contain; }
.product-rail-card-copy { min-height: 166px; padding: 18px 20px 16px; }
.product-rail-name { display: block; width: 100%; overflow: hidden;  font-size: calc(17.6px + 2.5px); line-height: 1.35; white-space: nowrap; text-overflow: ellipsis; -webkit-line-clamp: unset; }
.product-image-note { position: relative; z-index: 2; margin: 14px auto -42px; padding-inline: 4vw; color: #758698; }
.product-rail-controls .all-products-link { margin: 0 4px 0 0; padding: 10px 13px; border-color: #d2dce5; color: var(--ink); background: #fff;  font-size: calc(12px + 2.5px); white-space: nowrap; }

.engineering-section {
  position: relative;
  z-index: 1;
  width: min(1480px, calc(100% - 48px));
  min-height: 760px;
  margin: -210px auto 150px;
  padding: 215px clamp(30px, 7.5vw, 120px) 80px;
  overflow: visible;
  border-radius: 0 0 34px 34px;
  color: #fff;
  background: #101521 url("assets/tank-production-workshop.png") center 44% / cover no-repeat;
  isolation: isolate;
}
.engineering-section::before { position: absolute; z-index: -1; inset: 0; border-radius: inherit; content: ""; background: linear-gradient(90deg, #0c111be8 0%, #101521d9 48%, #101521b8 100%); }
.engineering-tabs { position: relative; z-index: 2; display: flex; gap: 24px; width: min(54%, 650px); margin-bottom: 42px; }
.engineering-tab { position: relative; padding: 0 0 12px; border: 0; color: #ffffff65; background: transparent;  font-size: calc(clamp(22px, 2.2vw, 33px) + 2.5px); font-weight: 800; letter-spacing: -.04em; cursor: pointer; transition: color .2s ease; }
.engineering-tab::after { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; border-radius: 3px; background: transparent; content: ""; }
.engineering-tab:hover, .engineering-tab.is-active { color: #fff; }
.engineering-tab.is-active::after { background: #fff; }
.engineering-panel { position: relative; display: grid; min-height: 405px; grid-template-columns: minmax(220px, .8fr) minmax(280px, .8fr); gap: 8%; }
.engineering-subnav { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 13px; padding-top: 88px; }
.engineering-subtopic { display: inline-flex; align-items: center; gap: 11px; padding: 4px 0; border: 0; color: #ffffffa8; background: transparent;  font-size: calc(16.5px + 2.5px); font-weight: 700; text-align: left; cursor: pointer; transition: color .2s ease; }
.engineering-subtopic::before { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: transparent; content: ""; }
.engineering-subtopic:hover, .engineering-subtopic.is-active { color: #fff; }
.engineering-subtopic.is-active::before { background: #00b8ff; box-shadow: 0 0 14px #00b8ff88; }
.engineering-copy { position: relative; z-index: 2; justify-self: end; width: min(100%, 390px); padding-top: 8px; text-align: center; }
.engineering-copy .eyebrow { color: #b7c9db;  font-size: calc(13px + 2.5px); letter-spacing: .11em; }
.engineering-copy h2 { margin: 16px 0 20px;  font-size: calc(clamp(33px, 3.52vw, 52.8px) + 2.5px); font-weight: 700; letter-spacing: -.055em; line-height: 1.04; }
.engineering-copy > p:not(.eyebrow) { margin: 0 auto; color: #e5ebf2;  font-size: calc(17.6px + 2.5px); line-height: 1.65; }
.engineering-link { display: inline-flex; align-items: center; gap: 20px; margin-top: 30px; padding: 14px 20px; border-radius: 8px; color: #101521; background: #fff;  font-size: calc(15px + 2.5px); font-weight: 800; transition: transform .2s ease, background .2s ease; }
.engineering-link:hover { transform: translateY(-2px); background: #eaf5fc; }
.engineering-link span { color: var(--blue);  font-size: 19.8px; }

.site-footer { position: relative; z-index: 2; width: 100%; margin-top: 72px; padding: clamp(30px, 5vw, 76px) clamp(22px, 6vw, 100px) 24px; color: var(--ink); background: #fff; }
.catalog-page .site-footer { width: calc(100% + 2 * var(--gutter)); margin: 0 calc(-1 * var(--gutter)) calc(-1 * var(--gutter)); }
.site-footer-inner { width: min(1480px, 100%); margin-inline: auto; }
.site-footer-wordmark { display: block; width: fit-content; max-width: 100%; margin: 0 auto clamp(38px, 5.6vw, 84px); color: var(--ink);  font-size: calc(clamp(46.2px, 10.12vw, 140.8px) + 2.5px); font-style: italic; font-weight: 800; letter-spacing: -.09em; line-height: .92; text-align: center; text-transform: uppercase; white-space: nowrap; }
.site-footer-columns { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(18px, 3vw, 48px); }
.site-footer-column { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: 11px; }
.site-footer-column h2 { margin: 0 0 3px; color: #4387bc;  font-size: calc(19.8px + 2.5px); font-weight: 800; line-height: 1.3; }
.site-footer-column a { color: #667381;  font-size: calc(17.6px + 2.5px); font-weight: 400; line-height: 1.45; transition: color .18s ease; }
.site-footer-column a:hover { color: var(--blue); }
.site-footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 46px; padding-top: 18px; border-top: 1px solid #e1e6eb; color: #687583;  font-size: calc(15px + 2.5px); font-weight: 600; }
.site-footer-bottom a { color: var(--ink); font-weight: 800; }
.site-footer-bottom a:hover { color: var(--blue); }
.site-footer-signup { margin-top: 32px; padding-top: clamp(28px, 4vw, 54px); border-top: 1px solid #e1e6eb; }
.site-footer-signup-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "brand catalog" "tagline catalog"; align-items: center; gap: 8px 28px; }
.site-footer-signup-brand { grid-area: brand; width: fit-content; color: var(--ink);  font-size: calc(clamp(30.8px, 4.4vw, 55px) + 2.5px); font-weight: 800; letter-spacing: -.07em; line-height: 1; }
.site-footer-signup-tagline { grid-area: tagline; margin: 0; color: #8a99a8;  font-size: calc(15px + 2.5px); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.site-footer-signup-catalog { grid-area: catalog; justify-self: end; color: var(--ink);  font-size: calc(16.5px + 2.5px); font-weight: 800; }
.site-footer-signup-catalog span, .site-footer-signup-contact a span { margin-left: 8px; color: var(--blue); }
.site-footer-signup-bottom { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(260px, 1.1fr); align-items: end; gap: 32px; margin-top: clamp(36px, 5vw, 68px); }
.site-footer-newsletter { width: min(100%, 650px); }
.site-footer-newsletter-title { margin: 0 0 10px; color: var(--ink); font-size: calc(17.6px + 2.5px); font-weight: 800; }
.site-footer-newsletter-controls { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 12px; }
.site-footer-newsletter-controls input { min-width: 0; min-height: 58px; flex: 1; padding: 0 18px; border: 1px solid #e1e6eb; border-radius: 7px; color: var(--ink); background: #fff; font: inherit;  font-size: calc(16.5px + 2.5px); }
.site-footer-newsletter-controls #footer-callback-phone { font-size: 16px; }
.site-footer-newsletter-controls input:disabled { color: #7c8792; background: #f7f9fb; }
.site-footer-newsletter-controls button { min-width: 132px; min-height: 58px; border: 0; border-radius: 7px; color: var(--ink); background: #edf4f8; font: inherit;  font-size: calc(17.6px + 2.5px); font-weight: 800; }
.site-footer-newsletter-controls button:disabled { cursor: not-allowed; }
.site-footer-newsletter > p { margin: 9px 0 0; color: #8793a0;  font-size: calc(14px + 2.5px); }
.site-footer-signup-contact { justify-self: end; text-align: right; }
.site-footer-signup-contact p { margin: 0 0 14px; color: #667381;  font-size: calc(17.6px + 2.5px); font-weight: 600; }
.site-footer-signup-contact a { color: var(--ink);  font-size: calc(18.7px + 2.5px); font-weight: 800; }
.site-footer-signup a:hover { color: var(--blue); }

@media (max-width: 1100px) {
  .site-footer-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
  .site-footer-signup-top { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 24px; }
}

@media (max-width: 760px) {
  .product-groups-section { padding-bottom: 58px; }
  .product-rail-heading { align-items: flex-start; flex-direction: column; gap: 14px; margin-top: 42px; }
  .product-rail-controls { align-self: stretch; justify-content: flex-end; gap: 7px; }
  .product-rail { gap: 10px; padding: 0 14px 18px; }
  .product-rail-card { flex-basis: min(84vw, 340px); min-height: 440px; }
  .product-rail-image { aspect-ratio: 1.05; }
  .product-rail-image img { padding: 12px 16px 18px; }
  .product-rail-card-copy { min-height: 155px; padding: 16px 17px 14px; }
  .product-image-note { padding-inline: 20px; }
  .product-rail-controls .all-products-link { gap: 7px; margin-right: 0; padding: 9px 10px;  font-size: calc(11px + 2.5px); }
  .engineering-section { width: calc(100% - 18px); min-height: 800px; margin: -60px auto 180px; padding: 150px 24px 62px; border-radius: 0 0 22px 22px; background-position: 56% center; }
  .engineering-section::before { background: linear-gradient(180deg, #0c111bdb, #101521e8 55%, #101521b8); }
  .engineering-tabs { width: 100%; gap: 20px; margin-bottom: 28px; }
  .engineering-tab {  font-size: calc(24.2px + 2.5px); }
  .engineering-panel { min-height: 0; grid-template-columns: 1fr; gap: 16px; }
  .engineering-subnav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; padding-top: 4px; }
  .engineering-subtopic { gap: 7px;  font-size: calc(14px + 2.5px); }
  .engineering-subtopic::before { width: 7px; height: 7px; flex-basis: 7px; }
  .engineering-copy { justify-self: stretch; width: 100%; padding-top: 12px; text-align: left; }
  .engineering-copy h2 { max-width: 460px; margin: 10px 0 12px;  font-size: calc(clamp(30.8px, 7.7vw, 41.8px) + 2.5px); }
  .engineering-copy > p:not(.eyebrow) { margin: 0;  font-size: calc(15.4px + 2.5px); line-height: 1.5; }
  .engineering-link { margin-top: 20px; }
  .site-footer { margin-top: 38px; padding: 34px 20px 18px; }
  .catalog-page .site-footer { width: calc(100% + 18px); margin: 0 -9px -9px; }
  .site-footer-wordmark { margin-bottom: 36px;  font-size: calc(clamp(31.9px, 9.24vw, 59.4px) + 2.5px); letter-spacing: -.085em; }
  .site-footer-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 18px; }
  .site-footer-column { gap: 9px; }
  .site-footer-column h2 {  font-size: calc(17.6px + 2.5px); }
  .site-footer-column a {  font-size: calc(15.4px + 2.5px); }
  .site-footer-bottom { align-items: flex-start; flex-direction: column; gap: 11px; margin-top: 34px;  font-size: calc(14px + 2.5px); }
  .site-footer-signup { margin-top: 28px; padding-top: 27px; }
  .site-footer-signup-top { grid-template-columns: 1fr; grid-template-areas: "brand" "tagline" "catalog"; align-items: start; gap: 12px; }
  .site-footer-signup-brand {  font-size: calc(clamp(33px, 8.8vw, 48.4px) + 2.5px); }
  .site-footer-signup-tagline {  font-size: calc(12px + 2.5px); }
  .site-footer-signup-catalog { justify-self: start; margin-top: 5px;  font-size: calc(15.4px + 2.5px); }
  .site-footer-signup-bottom { grid-template-columns: 1fr; gap: 26px; margin-top: 32px; }
  .site-footer-newsletter-controls { gap: 8px; }
  .site-footer-newsletter-controls input { min-height: 52px; padding-inline: 12px;  font-size: calc(15px + 2.5px); }
  .site-footer-newsletter-controls button { min-width: 88px; min-height: 52px;  font-size: calc(15.4px + 2.5px); }
  .site-footer-signup-contact { justify-self: start; text-align: left; }
  .site-footer-signup-contact p {  font-size: calc(15.4px + 2.5px); }
  .site-footer-signup-contact a {  font-size: calc(16.5px + 2.5px); }
}

@media (max-width: 760px) {
  .site-footer-newsletter-controls { grid-template-columns: 1fr; gap: 10px; }
  .site-footer-newsletter-controls button { width: 100%; }
}

@media (max-width: 980px) {
  .tank-finder { grid-template-columns: minmax(0, 1fr) minmax(260px, .92fr); gap: 22px; padding: 38px clamp(24px, 5vw, 54px); }
}
@media (max-width: 760px) {
  .tank-finder { width: calc(100% - 18px); min-height: 0; grid-template-columns: minmax(0, 1fr); gap: 22px; margin-bottom: 9px; padding: 32px 22px; overflow: visible; border-radius: 15px; }
  .tank-finder-copy { max-width: 100%; }
  .tank-finder-copy .eyebrow {  font-size: calc(11px + 2.5px); }
  .tank-finder-copy h2 {  font-size: calc(clamp(29.7px, 8.8vw, 39.6px) + 2.5px); }
  .tank-finder-copy > p:last-child { margin-top: 13px;  font-size: calc(15px + 2.5px); }
  .tank-finder-form { grid-column: auto; }
  .tank-finder-controls { gap: 7px; }
  .tank-finder-controls input { min-height: 52px; padding-inline: 12px;  font-size: calc(14px + 2.5px); }
  .tank-finder-controls button { min-width: 78px; min-height: 52px; gap: 8px; padding-inline: 12px;  font-size: calc(14px + 2.5px); }
  .contact-inquiry { width: calc(100% - 18px); min-height: 0; grid-template-columns: minmax(0, 1fr); gap: 28px; margin: 20px auto 26px; padding: 34px 27px; border-radius: 16px; }
  .contact-inquiry-copy h2 { max-width: 560px; font-size: clamp(32px, 7vw, 42px); }
  .contact-inquiry-copy > p:last-child { margin-top: 13px; font-size: 16px; }
  .contact-inquiry-fields { gap: 13px 10px; }
  .contact-inquiry-bottom { align-items: stretch; flex-direction: column; }
  .contact-inquiry-submit { min-height: 52px; }
}

/* The first showcase now presents production and quality topics. */
.systems-engineering-showcase {
  display: grid;
  scroll-margin-top: 96px;
  grid-template-columns: minmax(240px, .85fr) minmax(300px, 1fr);
  align-items: center;
  gap: clamp(36px, 8vw, 130px);
}
.systems-engineering-nav { position: relative; z-index: 2; grid-column: 1; grid-row: 1; align-self: center; }
.systems-engineering-showcase .engineering-tabs { display: flex; width: auto; gap: 22px; margin: 0 0 25px; }
.systems-engineering-showcase .engineering-tab { color: #17273e85;  font-size: calc(clamp(20.9px, 1.98vw, 29.7px) + 2.5px); }
.systems-engineering-showcase .engineering-tab:hover,
.systems-engineering-showcase .engineering-tab.is-active { color: var(--ink); }
.systems-engineering-showcase .engineering-tab.is-active::after { background: var(--ink); }
.systems-engineering-showcase .engineering-subnav { gap: 12px; padding-top: 0; }
.systems-engineering-showcase .engineering-subtopic { color: #172d42; }
.systems-engineering-showcase .engineering-subtopic:hover,
.systems-engineering-showcase .engineering-subtopic.is-active { color: var(--blue); }
.systems-engineering-showcase .engineering-subtopic.is-active::before { background: var(--blue); box-shadow: 0 0 12px #287db755; }
.systems-engineering-showcase .engineering-copy { grid-column: 2; grid-row: 1; align-self: center; justify-self: end; width: fit-content; max-width: min(500px, 100%); padding: clamp(24px, 2.5vw, 38px); border: 1px solid #ffffffa8; border-radius: 20px; background: #ffffffb8; box-shadow: 0 18px 48px #10243a24; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); text-align: left; }
.systems-engineering-showcase .engineering-copy .eyebrow { color: #536a80; font-size: calc(15px + 2.5px); }
.systems-engineering-showcase .engineering-copy h2 { color: var(--ink);  font-size: calc(clamp(37.4px, 3.74vw, 55px) + 2.5px); line-height: 1.08; }
.systems-engineering-showcase .engineering-copy > p:not(.eyebrow) { margin: 0; color: #263a4f; font-size: calc(19px + 2.5px); line-height: 1.6; }
.systems-engineering-showcase .engineering-link { color: var(--ink); }
.systems-engineering-showcase .systems-background { height: 100%; object-position: center; }
.systems-engineering-showcase .systems-background.is-changing { opacity: .65; }
.systems-engineering-showcase .systems-wash { background: linear-gradient(90deg, #f3f8fc99 0%, #f3f8fc4d 44%, #f3f8fc1f 100%), linear-gradient(0deg, #e7f1f733, #fff2 55%); }

.about-story-showcase { display: flex; width: min(1480px, calc(100% - 48px)); min-height: 630px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 18px; margin: -220px auto 0; padding: clamp(170px, 14vw, 240px) clamp(42px, 7vw, 100px) 78px; overflow: visible; border-radius: 22px; }
.about-story-showcase .eyebrow { margin: 0; color: #a9cee5; font-size: calc(14px + 2.5px); font-weight: 700; letter-spacing: .08em; }
.about-story-showcase h2 { margin: 0; color: #fff; font-size: calc(clamp(42px, 5vw, 68px) + 2.5px); letter-spacing: -.05em; line-height: 1.05; }
.about-story-showcase > p:last-of-type { max-width: 72ch; margin: 0; color: #f0f4f8; font-size: calc(clamp(18px, 1.6vw, 23px) + 2.5px); line-height: 1.65; }
.about-statistics-band { width: 100%; margin: 0; padding: 36px 24px 52px; background: transparent; }
.about-statistics { display: grid; width: min(1480px, 100%); grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0 auto; padding: 26px 36px 30px; border: 1px solid #d9e0e6; border-radius: 18px; background: #f5f7f9; list-style: none; }
.about-statistics li { position: relative; min-width: 0; text-align: center; }
.about-stat-value { margin: 0; color: transparent; font-family: Arial, Helvetica, sans-serif; font-size: clamp(48px, 6.5vw, 88px); font-weight: 300; letter-spacing: 0; line-height: 1; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1.2px #888; }
.about-stat-value::after { display: inline-block; margin-left: .03em; color: transparent; content: "+"; font-family: Arial, Helvetica, sans-serif; font-weight: 300; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1.2px #888; }
.about-statistics h3 { margin: 12px 0 0; color: #2b3037; font-size: clamp(13px, 1.25vw, 17px); font-weight: 700; line-height: 1.3; }
.application-cards-section { display: grid; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 auto clamp(58px, 7vw, 104px); padding: 48px 5px 0; background: var(--canvas); }
.application-cards-label { grid-column: 1 / -1; width: min(1480px, calc(100% - 48px)); margin: 0 auto 30px; color: var(--ink); font-size: calc(13px + 2.5px); font-weight: 800; letter-spacing: .04em; }
.application-card { --application-copy-offset: 106px; display: flex; min-width: 0; min-height: 340px; flex-direction: column; align-items: stretch; padding: clamp(28px, 3.2vw, 50px); border-radius: 9px; color: var(--ink); background: #f7f9ff; }
.application-card--heating { background: #fff9f2; }
.application-card--closed-loop { background: #f0f1ff; }
.application-card--pressure { background: #f7f9ff; }
.application-card-heading { display: grid; min-height: 66px; grid-template-columns: 66px minmax(0, 1fr); align-items: center; gap: clamp(18px, 2.2vw, 40px); }
.application-card-icon { display: grid; width: 66px; height: 66px; place-items: center; border: 1px solid currentColor; border-radius: 9px; color: #3155ff; }
.application-card--heating .application-card-icon { color: #f26800; }
.application-card-icon svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.application-card-heading h2 { margin: 0; color: var(--ink); font-size: calc(clamp(21px, 1.8vw, 29px) + 2.5px); font-weight: 700; letter-spacing: -.045em; line-height: 1.15; text-wrap: balance; }
.application-card > p { max-width: 42ch; margin: 36px 0 0 var(--application-copy-offset); color: #263a4f; font-size: calc(clamp(16px, 1.22vw, 19px) + 2.5px); line-height: 1.5; }
.application-card > a { display: inline-flex; width: fit-content; align-items: center; gap: 11px; margin: auto 0 0 var(--application-copy-offset); padding-top: 22px; color: var(--blue); font-size: calc(14px + 2.5px); font-weight: 700; text-decoration: none; }
.application-card > a:hover { color: var(--ink); }
.application-card > a:focus-visible { border-radius: 3px; outline: 3px solid var(--blue); outline-offset: 4px; }
.application-card > a span { color: var(--blue); font-size: 18px; }

@media (max-width: 1100px) and (min-width: 761px) {
  .application-cards-section { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .application-card { --application-copy-offset: 88px; }
  .application-card-heading { grid-template-columns: 58px minmax(0, 1fr); gap: 18px; }
  .application-card-icon { width: 58px; height: 58px; }
  .systems-engineering-showcase { grid-template-columns: minmax(190px, .8fr) minmax(250px, 1fr); gap: 28px; }
  .systems-engineering-showcase .engineering-tabs { flex-wrap: wrap; gap: 10px 18px; }
  .systems-engineering-showcase .engineering-tab {  font-size: calc(22px + 2.5px); }
  .systems-engineering-showcase .engineering-subnav { gap: 9px; }
  .systems-engineering-showcase .engineering-copy h2 {  font-size: calc(37.4px + 2.5px); }
}
@media (max-width: 760px) {
  .systems-engineering-showcase { min-height: 0; scroll-margin-top: 78px; grid-template-columns: minmax(0, 1fr); grid-template-areas: "nav" "copy"; gap: 28px; padding: 45px 24px 36px; }
  .systems-engineering-nav { grid-area: nav; }
  .systems-engineering-showcase .engineering-tabs { flex-wrap: wrap; gap: 10px 20px; margin-bottom: 15px; }
  .systems-engineering-showcase .engineering-tab {  font-size: calc(22px + 2.5px); }
  .systems-engineering-showcase .engineering-subnav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 12px; }
  .systems-engineering-showcase .engineering-subtopic { gap: 7px;  font-size: calc(14px + 2.5px); }
  .systems-engineering-showcase .engineering-subtopic::before { width: 7px; height: 7px; flex-basis: 7px; }
  .systems-engineering-showcase .engineering-copy { grid-area: copy; justify-self: start; width: fit-content; max-width: 100%; padding: 24px; border-radius: 16px; }
  .systems-engineering-showcase .engineering-copy h2 { margin: 12px 0;  font-size: calc(clamp(33px, 8.8vw, 44px) + 2.5px); }
  .systems-engineering-showcase .engineering-link { margin-top: 17px; }
  .application-cards-section { width: 100%; grid-template-columns: minmax(0, 1fr); gap: 8px; margin-bottom: 46px; padding: 36px 9px 0; }
  .application-cards-label { width: calc(100% - 30px); margin-bottom: 18px; }
  .application-card { --application-copy-offset: 74px; min-height: 250px; padding: 24px 20px; border-radius: 8px; }
  .application-card-heading { min-height: 56px; grid-template-columns: 56px minmax(0, 1fr); gap: 18px; }
  .application-card-icon { width: 56px; height: 56px; }
  .application-card-icon svg { width: 29px; height: 29px; }
  .application-card-heading h2 { font-size: calc(clamp(21px, 6vw, 27px) + 2.5px); }
  .application-card > p { max-width: 44ch; margin-top: 22px; font-size: calc(16px + 2.5px); }
  .application-card > a { margin-top: auto; padding-top: 18px; }
  .about-story-showcase { width: calc(100% - 18px); min-height: 500px; gap: 15px; margin: -55px auto 0; padding: 88px 24px 42px; border-radius: 15px; }
  .about-story-showcase h2 { font-size: calc(clamp(36px, 9vw, 48px) + 2.5px); }
  .about-story-showcase > p:last-of-type { font-size: calc(17px + 2.5px); line-height: 1.55; }
  .about-statistics-band { padding: 28px 12px 38px; }
  .about-statistics { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 6px; padding: 20px 8px 24px; border-radius: 14px; }
  .about-stat-value { font-size: clamp(45px, 12vw, 62px); }
  .about-statistics h3 { margin-top: 8px; font-size: 13px; }
  .mobile-right-arrow { font-size: 0 !important; }
  .mobile-right-arrow::after { display: inline-block; content: "→"; font: 700 19px/1 Arial, sans-serif; }
}

.product-image-logo { position: absolute; z-index: 1; top: 50%; left: 50%; width: 68%; max-width: 340px; max-height: 34%; padding: 0 !important; object-fit: contain !important; mix-blend-mode: normal !important; opacity: .92; pointer-events: none; transform: translate(-50%, -50%); }
.product-item-card-image .product-image-logo, .product-rail-image .product-image-logo, .product-detail-image .product-image-logo { width: 68%; height: auto; min-height: 0; max-height: 34%; }