:root {
    --secteo: #46c9ec;
    --blue: #1396b9;
    --blue-dark: #1c788f;
    --blue-light: #e5f7fc;
    --yellow: #ffd300;
    --yellow-dark: #efc600;
    --text: #4b4b4d;
    --muted: #727274;
    --line: #e9e9e9;
    --light: #f8f9fa;
    --white: #fff;
    --radius-small: 10px;
    --radius: 20px;
    --radius-large: 34px;
    --container: min(1180px, calc(100% - 40px));
    --heading-1-size: clamp(1.75rem, 1.55rem + 1vw, 2.375rem);
    --heading-2-size: clamp(1.375rem, 1.23rem + .48vw, 1.75rem);
    --heading-3-size: clamp(1.0625rem, 1rem + .24vw, 1.25rem);
    --heading-4-size: 1rem;
    --home-display-size: var(--heading-1-size);
    --home-section-title-size: var(--heading-2-size);
    --home-subtitle-size: clamp(1.05rem, 1rem + .2vw, 1.2rem);
    --home-copy-size: clamp(.9375rem, .91rem + .1vw, 1rem);
    --section-space: clamp(56px, 4.7vw, 72px);
    --section-space-compact: clamp(44px, 3.9vw, 60px);
    --section-heading-gap: clamp(28px, 2.35vw, 36px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; color: var(--text); background: #fff; font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; font-size: var(--home-copy-size); line-height: 1.58; -webkit-font-smoothing: antialiased; }
body.is-locked { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, textarea { font: inherit; }
button { color: inherit; }
.shell { width: var(--container); margin: 0 auto; }
.narrow { max-width: 920px; }
.text-center { text-align: center; }
.content-section { padding: var(--section-space) 0; }
.light-section { padding: var(--section-space) 0; background: var(--light); }

h1, h2, h3, h4 { margin: 0; line-height: 1.2; letter-spacing: -.015em; text-wrap: balance; }
h1 { margin-bottom: 16px; font-size: var(--heading-1-size); font-style: italic; font-weight: 600; }
h2 { margin-bottom: 18px; font-size: var(--heading-2-size); font-style: italic; font-weight: 600; }
h3 { margin-bottom: 12px; font-size: var(--heading-3-size); font-style: normal; font-weight: 700; }
h4 { margin-bottom: 10px; font-size: var(--heading-4-size); font-weight: 700; }
p { margin: 0 0 20px; }
.lead { color: #3e484b; font-size: 18px; line-height: 1.55; }
.center-title { margin-bottom: var(--section-heading-gap); color: var(--blue); font-style: italic; font-weight: 600; text-align: center; }
.centered-copy { max-width: 750px; margin-inline: auto; text-align: center; }
.center-action { margin-top: 28px; text-align: center; }

.button { min-height: 41px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 25px; border: 1px solid transparent; border-radius: 999px; font-size: 15px; font-weight: 700; line-height: 25px; cursor: pointer; transition: background .18s, color .18s, border-color .18s, transform .18s, box-shadow .18s; }
.button:hover { transform: translateY(-1px); }
.button--blue { background: var(--yellow); color: #303031; box-shadow: none; }
.button--blue:hover { background: var(--yellow-dark); box-shadow: none; }
.button--yellow { background: var(--yellow); color: #333; }
.button--yellow:hover { background: var(--yellow-dark); }
.button--outline { background: transparent; border-color: #aebcc0; color: var(--text); }
.button--outline:hover { border-color: var(--blue); color: var(--blue); }
.button-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--blue); font-weight: 700; }
.text-link:hover { text-decoration: underline; }
.skip-link { position: fixed; z-index: 500; top: 12px; left: 12px; padding: 10px 18px; border-radius: 20px; background: var(--yellow); color: #303031; font-weight: 700; transform: translateY(-160%); transition: transform .18s; }
.skip-link:focus { transform: none; }
.visually-hidden { width: 1px; height: 1px; position: absolute; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

/* Subtle motion is added progressively by JavaScript; all content remains visible without it. */
.has-motion .motion-reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease var(--reveal-delay, 0ms), transform .7s cubic-bezier(.22,1,.36,1) var(--reveal-delay, 0ms); }
.has-motion .motion-reveal.is-visible { opacity: 1; transform: none; }

/* Header */
.site-header { position: sticky; z-index: 50; top: 0; box-shadow: 0 20px 24px -30px rgba(0,0,0,.75); transition: box-shadow .28s ease; }
.site-header.header-enter { opacity: 0; transform: translateY(-30px); }
.site-header.header-enter.is-ready { opacity: 1; transform: none; }
.site-header.is-scrolled { box-shadow: 0 20px 24px -30px rgba(0,0,0,.75); }
.header-main { height: 130px; position: relative; background: var(--secteo); color: white; transition: height .5s ease; }
.header-main::after { width: 100%; height: 8px; position: absolute; z-index: -1; bottom: -8px; left: 0; box-shadow: inset 0 11px 8px -10px #132124; content: ''; }
.site-header.is-scrolled .header-main { height: 100px; }
.header-main__inner { --header-gutter: 35px; --controls-indent: 35px; width: 100%; height: 100%; display: flex; align-items: center; padding: 0; }
.site-logo { width: min(290px, calc(16.6667vw - var(--header-gutter))); position: relative; margin-right: 0; margin-left: var(--header-gutter); flex: 0 0 auto; transition: width .5s ease, margin .5s ease; }
.site-logo img { width: 100%; height: auto; object-fit: contain; }
.site-header.is-scrolled .site-logo { width: 180px; margin-right: calc(16.6667vw - var(--header-gutter) - 180px); }
.header-desktop { min-width: 0; height: 100%; display: flex; flex: 1; align-items: flex-start; justify-content: center; padding-top: 30px; transition: padding .5s ease; }
.site-header.is-scrolled .header-desktop { padding-top: 10px; }
.main-nav { min-width: 0; min-height: 46px; display: flex; align-items: flex-start; }
.main-nav__item { display: flex; position: relative; align-items: flex-start; }
.main-nav__item > a, .main-nav__link { display: block; padding: 8px 15px; color: white; font-size: 18px; font-weight: 400; line-height: 1.5; text-shadow: 0 1px 2px rgba(9,75,91,.34); white-space: nowrap; transition: color .18s ease; }
.main-nav__toggle { width: 18px; height: 24px; position: absolute; z-index: 2; top: 11px; right: 1px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: white; cursor: pointer; opacity: .72; }
.main-nav__toggle svg { width: 10px; transition: transform .2s ease; }
.main-nav__item:hover .main-nav__toggle, .main-nav__item:focus-within .main-nav__toggle, .main-nav__item.is-open .main-nav__toggle { opacity: 1; }
.main-nav__item:hover .main-nav__toggle svg, .main-nav__item:focus-within .main-nav__toggle svg, .main-nav__item.is-open .main-nav__toggle svg { transform: rotate(180deg); }
.main-nav__item.is-active > a, .main-nav__link.is-active { font-weight: 600; }
.main-nav__item:hover > a, .main-nav__item:focus-within > a, .main-nav__link:hover, .main-nav__link:focus { color: white; text-decoration: underline; text-underline-offset: 5px; }
.mega-menu { visibility: hidden; opacity: 0; position: absolute; z-index: 10; top: 46px; left: -30px; min-width: 300px; display: flex; gap: 0; padding: 30px 30px 20px; background: var(--secteo); color: white; transition: opacity .2s ease, visibility 0s linear .2s; }
.main-nav__item:hover .mega-menu, .main-nav__item:focus-within .mega-menu, .main-nav__item.is-open .mega-menu { visibility: visible; opacity: 1; transition-delay: 0s; }
.mega-menu > div { padding-right: 15px; }
.mega-menu > div + div { padding-right: 0; padding-left: 15px; border-left: 1px solid rgba(255,255,255,.34); }
.mega-menu strong { display: block; margin: 0; padding: 0 20px 10px; color: rgba(255,255,255,.9); font-size: 16px; font-weight: 700; line-height: 24px; text-transform: none; white-space: nowrap; }
.mega-menu a { display: block; padding: 8px 20px; color: white; font-size: 18px; font-weight: 400; line-height: 27px; white-space: nowrap; }
.mega-menu a:hover, .mega-menu a:focus { color: white; text-decoration: underline; text-underline-offset: 5px; }
.header-controls { min-width: 0; height: 46px; display: flex; flex: 1; align-items: center; justify-content: flex-end; padding-right: var(--header-gutter); padding-left: var(--controls-indent); }
.header-search { min-width: 0; height: 32px; display: flex; flex: 1; align-items: center; margin-right: 30px; overflow: hidden; border: 1px solid white; border-radius: 16px; transition: background .18s ease, box-shadow .18s ease; }
.header-search__input { min-width: 0; width: 100%; height: 30px; padding: 4px 13px; border: 0; outline: 0; background: transparent; color: white; font-size: 14px; line-height: 20px; }
.header-search__input::placeholder { color: white; opacity: 1; }
.header-search > button { width: 42px; height: 30px; display: grid; place-items: center; flex: 0 0 42px; padding: 0; border: 0; border-left: 1px solid rgba(255,255,255,.55); background: transparent; color: white; cursor: pointer; }
.header-search > button svg { width: 20px; height: 20px; }
.header-search:hover { background: rgba(255,255,255,.08); }
.header-search:focus-within { background: rgba(255,255,255,.12); box-shadow: 0 0 0 3px rgba(255,255,255,.38); }
.header-search > button:hover { background: rgba(255,255,255,.14); }
.header-controls .header-login, .header-controls .header-contact { flex: 0 0 auto; padding: 8px 0; color: white; font-size: 14px; font-weight: 400; line-height: 21px; white-space: nowrap; }
.header-controls .header-login { padding-right: 30px; }
.header-controls .header-login:hover, .header-controls .header-contact:hover { color: white; text-decoration: underline; text-underline-offset: 4px; }
.header-actions { display: none; margin-left: auto; align-items: center; gap: 4px; }
.header-icon, .mobile-toggle { width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 50%; background: transparent; color: white; cursor: pointer; transition: background .2s, transform .2s; }
.header-icon:hover, .mobile-toggle:hover { background: rgba(255,255,255,.14); transform: scale(1.08); }
.header-login { display: flex; align-items: center; gap: 6px; padding: 8px; font-size: 14px; }
.header-actions .header-login { color: white; font-weight: 500; }
.mobile-toggle { display: none; }
.mobile-nav { position: fixed; z-index: 102; top: 0; right: 0; bottom: 0; width: min(460px, 100vw); overflow-y: auto; background: white; color: var(--text); box-shadow: -12px 0 30px rgba(0,0,0,.2); transform: translateX(100%); transition: transform .25s; }
.mobile-nav.is-open { transform: none; }
.mobile-nav__head { height: 82px; position: sticky; z-index: 3; top: 0; display: grid; grid-template-columns: 48px 1fr 48px; align-items: center; padding: 0 20px; background: var(--secteo); box-shadow: 0 3px 8px rgba(19,33,36,.2); }
.mobile-nav__head a { justify-self: center; }
.mobile-nav__head img { width: 205px; height: auto; object-fit: contain; }
.mobile-nav__head button { width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border: 0; background: none; color: white; cursor: pointer; }
.mobile-nav nav { padding: 12px 30px 35px; }
.mobile-nav__item, .mobile-nav__link { border-bottom: 1px solid #e7ecee; }
.mobile-nav__row { min-height: 52px; display: grid; grid-template-columns: 1fr 48px; align-items: center; }
.mobile-nav__row > a, .mobile-nav__link { color: var(--text); font-size: 19px; font-weight: 400; }
.mobile-nav__row > a { padding: 12px 0; }
.mobile-nav__row > button { width: 44px; height: 44px; display: grid; place-items: center; justify-self: end; padding: 0; border: 0; background: transparent; color: var(--blue); cursor: pointer; }
.mobile-nav__row > button svg { transition: transform .2s ease; }
.mobile-nav__item.is-open .mobile-nav__row > button svg { transform: rotate(180deg); }
.mobile-nav__item.is-active > .mobile-nav__row > a, .mobile-nav__link.is-active { color: var(--blue); font-weight: 700; }
.mobile-nav__submenu { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .24s ease; }
.mobile-nav__submenu > div { overflow: hidden; }
.mobile-nav__item.is-open .mobile-nav__submenu { grid-template-rows: 1fr; }
.mobile-nav__group { padding: 5px 0 13px 18px; border-left: 2px solid var(--blue); }
.mobile-nav__group + .mobile-nav__group { padding-top: 11px; }
.mobile-nav__submenu strong { display: block; margin-bottom: 5px; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.mobile-nav__submenu a { display: block; padding: 7px 0; color: var(--text); font-size: 15px; }
.mobile-nav__link { min-height: 52px; display: flex; align-items: center; justify-content: space-between; padding: 12px 4px 12px 0; }
.mobile-nav__link svg { color: var(--blue); }
.mobile-nav__login { margin-top: 12px; border: 0; color: var(--blue); font-weight: 700; }
.mobile-nav a:hover, .mobile-nav a:focus-visible { color: var(--blue); }
.mobile-overlay { visibility: hidden; opacity: 0; position: fixed; z-index: 101; inset: 0; background: rgba(0,0,0,.55); transition: .2s; }
.mobile-overlay.is-open { visibility: visible; opacity: 1; }

/* Global page path embedded in the blue header */
.site-breadcrumb-bar { height: 32px; position: absolute; z-index: 4; right: 0; bottom: 0; left: var(--breadcrumb-start, calc(16.6667vw + 15px)); overflow: hidden; background: transparent; }
.site-breadcrumbs { width: calc(100% - 20px); height: 100%; display: flex; align-items: center; gap: 8px; margin: 0; overflow: hidden; color: white; font-size: 12px; font-style: italic; text-shadow: 0 1px 2px rgba(9,75,91,.34); text-transform: uppercase; white-space: nowrap; }
.site-breadcrumbs a, .site-breadcrumbs > span:not(.site-breadcrumbs__separator) { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.site-breadcrumbs a { flex: 0 0 auto; transition: color .18s; }
.site-breadcrumbs a:hover { color: var(--yellow); }
.site-breadcrumbs [aria-current="page"] { color: rgba(255,255,255,.9); }
.site-breadcrumbs__separator { flex: 0 0 auto; color: rgba(255,255,255,.85); }
.has-site-breadcrumbs .page-hero { padding-top: 20px; }
.has-site-breadcrumbs .installer-intro { padding-top: 16px; }
.has-site-breadcrumbs .catalog-main { padding-top: 20px; }

/* Homepage */
.home-slider { height: 580px; position: relative; overflow: hidden; background: var(--blue-light); }
.home-slide { visibility: hidden; opacity: 0; position: absolute; inset: 0; display: grid; grid-template-columns: 1fr 1fr; transition: opacity .45s; }
.home-slide.is-active { visibility: visible; opacity: 1; }
.home-slide > img { width: 100%; height: 100%; object-fit: cover; object-position: var(--slide-position, center); transform: scale(1.018); transition: transform 7s ease-out; }
.home-slide.is-active > img { transform: scale(1); }
.home-slide__overlay { display: none; }
.home-slide__content { width: auto; display: flex; align-items: flex-start; justify-content: center; margin: 0; padding: 46px clamp(46px, 5.2vw, 84px) 70px; overflow: hidden; background: var(--blue-light); }
.home-slide__content > div { width: min(680px, 100%); max-height: 100%; display: flex; align-items: flex-start; flex-direction: column; margin: 0; padding: 0; }
.home-slide__eyebrow { display: block; margin-bottom: 12px; color: var(--blue); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.home-slide__eyebrow, .home-slide h2 { flex: 0 0 auto; }
.home-slide__eyebrow, .home-slide h2, .home-slide p, .home-slide .button { opacity: 0; transform: translateY(16px); transition: opacity .5s ease, transform .55s cubic-bezier(.22,1,.36,1); }
.home-slide.is-active .home-slide__eyebrow, .home-slide.is-active h2, .home-slide.is-active p, .home-slide.is-active .button { opacity: 1; transform: none; }
.home-slide.is-active p { transition-delay: .08s; }
.home-slide.is-active .button { transition-delay: .15s; }
.home-slide h2 { margin-bottom: 14px; color: var(--blue); font-size: var(--home-display-size); }
.home-slide p { height: auto; margin-bottom: 12px; color: var(--text); font-size: var(--home-copy-size); line-height: 1.5; }
.home-slide__teaser { flex: 0 0 auto; margin-bottom: 22px; }
.home-slide__teaser p:last-child { margin-bottom: 0; }
.home-slide .button { min-width: 168px; height: 43px; min-height: 43px; flex: 0 0 43px; align-self: flex-start; padding-right: 26px; padding-left: 26px; white-space: nowrap; }
.slider-arrow { position: absolute; z-index: 3; top: calc(50% - 32px); width: 50px; height: 64px; display: grid; place-items: center; border: 0; border-radius: 0; background: rgba(19,150,185,.1); color: var(--yellow); cursor: pointer; }
.slider-arrow:hover { background: rgba(19,150,185,.24); }
.slider-arrow--left { left: 20px; }
.slider-arrow--right { right: 20px; }
.slider-dots { position: absolute; z-index: 4; bottom: 22px; left: 75%; display: flex; gap: 13px; transform: translateX(-50%); }
.slider-dots button { width: 17px; height: 17px; padding: 0; border: 0; border-radius: 50%; background: var(--text); color: transparent; font-size: 0; cursor: pointer; }
.slider-dots button.is-active { background: var(--yellow); }
.welcome .narrow { max-width: 900px; }
.welcome h1 { margin-bottom: 13px; color: var(--blue); font-size: var(--home-display-size); }
.welcome h2 { margin-bottom: 18px; font-size: var(--home-subtitle-size); font-style: normal; font-weight: 500; }
.welcome p { font-size: var(--home-copy-size); }
.welcome p a { color: var(--blue); font-weight: 700; }
.solution-section { padding: var(--section-space-compact) 0; background: var(--blue); color: white; }
.solution-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(25px, 5vw, 70px); }
.solution-card { min-height: 0; display: grid; grid-template-columns: 62px 1fr; grid-template-rows: auto auto auto; column-gap: 17px; padding: 12px 0; color: white; text-align: left; }
.solution-card:hover h2, .solution-card:hover span { color: var(--yellow); }
.solution-card img { width: 50px; height: 62px; grid-row: 1 / 4; margin: 0; object-fit: contain; }
.solution-card h2 { margin: 0 0 4px; color: white; font-size: var(--heading-3-size); font-style: normal; font-weight: 700; }
.solution-card p { margin: 0; color: rgba(255,255,255,.92); font-size: 14px; line-height: 1.45; }
.solution-card span { color: white; font-size: 13px; font-weight: 600; }
.solution-action { margin-top: 26px; text-align: center; }
.finder-banner { padding: 44px 0; background: var(--blue-light); }
.finder-banner__inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.finder-banner h2 { margin-bottom: 5px; color: var(--blue); }
.finder-banner p { margin: 0; }
.two-column { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
.two-column--wide { grid-template-columns: .65fr 1.35fr; align-items: start; }
.partner-preview__image { position: relative; }
.partner-preview__image img, .content-image img { width: 100%; max-height: 430px; object-fit: cover; border-radius: 72px 8px; }
.image-play { position: absolute; bottom: 14px; left: 14px; padding: 9px 16px; background: var(--yellow); color: #333; border-radius: 999px; font-weight: 700; }
.partner-preview h2, .company-intro h2 { color: var(--blue); }
.customer-story { display: grid; grid-template-columns: 44% 56%; background: var(--secteo); }
.customer-story__image { min-height: 420px; position: relative; overflow: hidden; }
.customer-story__image img { width: 100%; height: 100%; object-fit: cover; }
.customer-story__play { width: 58px; height: 58px; position: absolute; top: 50%; left: 50%; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: var(--yellow); box-shadow: 0 6px 18px rgba(0,0,0,.18); cursor: pointer; transform: translate(-50%,-50%); transition: transform .18s, background .18s; }
.customer-story__play:hover { background: white; transform: translate(-50%,-50%) scale(1.05); }
.customer-story__play span { margin-left: 4px; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 14px solid #303031; }
.customer-story__copy { display: flex; align-items: center; padding: clamp(38px, 4.4vw, 64px); background: var(--blue); color: white; }
.customer-story__copy > div { max-width: 560px; }
.customer-story__copy h2 { margin: 0 0 20px; color: white; font-size: var(--home-section-title-size); }
.customer-story__copy p { margin-bottom: 18px; color: white; font-size: var(--home-copy-size); line-height: 1.55; }
.section-kicker { color: var(--yellow); font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.partner-strip { padding: var(--section-space-compact) 0; background: var(--blue); color: white; }
.partner-strip__inner { max-width: 620px; }
.partner-strip h2 { margin-bottom: 28px; color: white; font-size: var(--home-section-title-size); }
.partner-strip p { margin: 0 0 25px; color: white; font-size: var(--home-copy-size); }
.company-intro { border-top: 1px solid var(--line); }
.company-intro .two-column--wide { display: block; }
.company-intro .two-column--wide > div:last-child { margin-top: 22px; columns: 2 360px; column-gap: 55px; }
.company-intro .two-column--wide > div:last-child p { break-inside: avoid; }
.company-intro h2 { margin-bottom: 5px; }
.company-intro h3 { margin-bottom: 0; color: #555; }
.check-list { display: grid; gap: 8px; margin: 24px 0 28px; padding: 0; list-style: none; }
.check-list li { display: flex; align-items: flex-start; gap: 9px; }
.check-list svg { flex: 0 0 auto; margin-top: 3px; color: var(--blue); }
.manufacturer-section { padding: 45px 0; background: var(--blue); color: white; }
.manufacturer-section h2 { margin-bottom: 28px; text-align: center; }
.manufacturer-row { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); align-items: center; gap: 38px; }
.manufacturer-row a { min-width: 0; }
.manufacturer-row img { max-width: 100%; max-height: 66px; margin: auto; object-fit: contain; }
.manufacturer-section--home { min-height: 130px; display: flex; align-items: center; padding: 24px 0; background: linear-gradient(90deg, rgba(19,150,185,0), var(--blue) 13%, var(--blue) 87%, rgba(19,150,185,0)); }
.manufacturer-section--home h2 { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.manufacturer-section--home .shell { width: min(1340px, calc(100% - 70px)); overflow: hidden; }
.manufacturer-section--home .manufacturer-row { display: flex; align-items: center; justify-content: space-between; gap: clamp(18px, 1.5vw, 28px); overflow: visible; }
.manufacturer-section--home .manufacturer-row::-webkit-scrollbar { display: none; }
.manufacturer-section--home .manufacturer-row a { --home-logo-width: clamp(120px, 10.9vw, 145px); width: var(--home-logo-width); min-width: var(--home-logo-width); height: 82px; display: grid; flex: 0 0 var(--home-logo-width); place-items: center; }
.manufacturer-section--home .manufacturer-row a[data-home-brand="jablotron"], .manufacturer-section--home .manufacturer-row a[data-home-brand="ajax"], .manufacturer-section--home .manufacturer-row a[data-home-brand="optex"] { --home-logo-width: clamp(132px, 12vw, 160px); }
.manufacturer-section--home .manufacturer-row a[data-home-brand="grundig"] { --home-logo-width: clamp(136px, 12.4vw, 165px); }
.manufacturer-section--home .manufacturer-row a[data-home-brand="reconeyez"] { --home-logo-width: clamp(86px, 7.9vw, 105px); }
.manufacturer-section--home .manufacturer-row img { width: 100%; max-width: 100%; max-height: 72px; }
.manufacturer-section--home .manufacturer-row img[src$="reconeyez-logo.webp"] { filter: brightness(0) invert(1); }

/* Manufacturer landing pages */
.manufacturer-page { --brand-accent: var(--blue); --brand-dark: var(--blue-dark); --brand-soft: var(--blue-light); }
.manufacturer-hero { min-height: 520px; position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; overflow: hidden; background: var(--brand-soft); }
.manufacturer-hero__image { min-height: 520px; position: relative; overflow: hidden; clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%); background: #dce8eb; }
.manufacturer-hero__image::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(15,38,45,.48)); content: ''; }
.manufacturer-hero__image img { width: 100%; height: 100%; object-fit: cover; object-position: right center; transition: transform .7s cubic-bezier(.22,1,.36,1); }
.manufacturer-hero:hover .manufacturer-hero__image img { transform: scale(1.018); }
.manufacturer-hero__image-label { position: absolute; z-index: 1; right: 9%; bottom: 30px; padding: 7px 13px; border: 1px solid rgba(255,255,255,.6); border-radius: 18px; background: rgba(16,45,53,.42); color: white; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; backdrop-filter: blur(5px); }
.manufacturer-hero__copy { max-width: 760px; display: flex; flex-direction: column; justify-content: center; padding: var(--section-space-compact) clamp(42px, 5.2vw, 92px); background: radial-gradient(circle at 85% 15%, rgba(255,255,255,.82), transparent 42%); }
.manufacturer-hero__meta { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; }
.manufacturer-hero__meta .section-kicker { color: var(--brand-accent); }
.manufacturer-hero__meta > span:last-child { padding-left: 11px; border-left: 1px solid color-mix(in srgb, var(--brand-accent) 38%, transparent); color: var(--muted); font-size: 11px; font-weight: 600; }
.manufacturer-hero h1 { margin-bottom: 7px; color: var(--brand-accent); font-size: var(--heading-1-size); }
.manufacturer-hero h2 { margin-bottom: 0; color: #303031; font-size: var(--home-subtitle-size); font-style: normal; font-weight: 500; }
.manufacturer-hero__text { max-width: 680px; }
.manufacturer-hero p { margin-bottom: 11px; color: var(--text); font-size: var(--home-copy-size); line-height: 1.55; }
.distributor-badge { width: fit-content; display: inline-flex; align-items: center; gap: 10px; margin: 18px 0; padding: 7px 15px 7px 7px; border: 1px solid color-mix(in srgb, var(--brand-accent, var(--blue)) 32%, white); border-radius: 999px; background: rgba(255,255,255,.88); color: #303031; box-shadow: 0 8px 22px rgba(42,74,82,.1); }
.distributor-badge__icon { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 34px; border-radius: 50%; background: var(--brand-accent, var(--blue)); color: white; }
.distributor-badge > span:last-child { display: grid; line-height: 1.12; }
.distributor-badge small { margin-bottom: 3px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.distributor-badge strong { font-size: 13px; font-weight: 800; }
.distributor-badge em { margin-top: 2px; color: var(--muted); font-size: 10px; font-style: normal; font-weight: 600; }
.manufacturer-hero .button-row { margin-top: 12px; }
.manufacturer-systems { position: relative; padding: var(--section-space) 0 calc(var(--section-space) + 18px); background: linear-gradient(145deg, white, var(--brand-soft)); }
.manufacturer-systems::before { width: 86px; height: 4px; position: absolute; top: 0; left: calc(50% - 43px); border-radius: 0 0 4px 4px; background: var(--brand-accent); content: ''; }
.manufacturer-systems__heading { max-width: 650px; margin: 0 auto var(--section-heading-gap); text-align: center; }
.manufacturer-systems__heading > span { display: block; margin-bottom: 5px; color: var(--brand-accent); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.manufacturer-systems__heading h2 { margin-bottom: 8px; color: var(--blue); }
.manufacturer-systems__heading p { margin: 0; color: var(--muted); font-size: 14px; }
.manufacturer-system-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 32px; }
.manufacturer-page--ajax .manufacturer-system-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.manufacturer-page--optex .manufacturer-system-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.manufacturer-page--optex .manufacturer-system-card:nth-child(4) { grid-column: 2; }
.manufacturer-system-grid--single { grid-template-columns: minmax(0, 760px); justify-content: center; }
.manufacturer-system-card { min-width: 0; height: 100%; position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid color-mix(in srgb, var(--brand-accent) 15%, white); border-radius: 28px 7px; background: white; box-shadow: 0 14px 34px rgba(31,75,85,.12); transition: transform .25s ease, box-shadow .25s ease; }
.manufacturer-system-card:hover { transform: translateY(-4px); box-shadow: 0 20px 42px rgba(31,75,85,.17); }
.manufacturer-system-card__image { height: 255px; display: block; overflow: hidden; background: #e5edf0; }
.manufacturer-system-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.manufacturer-system-card__image--contain img { padding: 12px; object-fit: contain; }
.manufacturer-system-card__image:hover img { transform: scale(1.025); }
.manufacturer-system-card__body { position: relative; display: flex; flex: 1; flex-direction: column; padding: 27px 32px 31px; }
.manufacturer-system-card__heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 12px; margin-bottom: 5px; }
.manufacturer-system-card__number { color: color-mix(in srgb, var(--brand-accent) 18%, white); font-size: 36px; font-style: italic; font-weight: 800; line-height: .95; }
.manufacturer-system-card h3 { min-width: 0; margin: 0; color: var(--brand-accent); font-size: clamp(1.25rem, 1.1rem + .35vw, 1.5rem); font-style: italic; font-weight: 650; }
.manufacturer-system-card__title-link { color: inherit; text-decoration: none; }
.manufacturer-system-card__title-link:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.manufacturer-system-card h4 { margin-bottom: 16px; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.manufacturer-system-card ul { display: grid; gap: 8px; margin: 0 0 23px; padding: 0; list-style: none; }
.manufacturer-system-card li { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; }
.manufacturer-system-card li svg { flex: 0 0 auto; margin-top: 3px; color: var(--brand-accent); }
.manufacturer-system-card .text-link { margin-top: auto; color: var(--brand-accent); }
.manufacturer-system-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: auto; padding-top: 2px; }
.manufacturer-system-card__actions .text-link { margin-top: 0; }
.manufacturer-system-card__actions .button { min-height: 39px; padding: 6px 18px; font-size: 13px; line-height: 1.25; }
.manufacturer-cta { padding: var(--section-space-compact) 0; background: linear-gradient(115deg, var(--brand-dark), var(--blue)); color: white; }
.manufacturer-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 45px; }
.manufacturer-cta__inner > div { max-width: 720px; }
.manufacturer-cta h2 { margin: 4px 0 10px; color: white; }
.manufacturer-cta p { margin: 0; color: white; font-size: 14px; }
.manufacturer-cta .button { flex: 0 0 auto; }
.manufacturer-cta .section-kicker { color: var(--yellow); }
.protect-hero { min-height: 320px; display: flex; align-items: center; padding: var(--section-space-compact) 0; }
.protect-hero::after { background: linear-gradient(90deg, rgba(13,120,149,.98) 0%, rgba(13,120,149,.82) 48%, rgba(13,120,149,.3) 100%), var(--page-image) center 52% / cover no-repeat; }
.protect-hero .section-kicker { display: block; margin-bottom: 8px; color: var(--yellow); }
.protect-hero .distributor-badge { margin-bottom: 0; }
.distributor-badge--exclusive { border-color: rgba(255,211,0,.72); }
.distributor-badge--exclusive .distributor-badge__icon { background: var(--yellow); color: #303031; }
.protect-partnership { background: linear-gradient(135deg, white 60%, #fff8d8); }
.protect-partnership .section-kicker { display: block; margin-bottom: 6px; color: var(--blue); }
.protect-partnership .content-image img { border-radius: 46px 8px; box-shadow: 0 16px 36px rgba(33,76,87,.13); }
.news-teasers { padding: var(--section-space) 0; }
.section-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--section-heading-gap); }
.section-title h2 { margin: 0; color: var(--blue); font-style: italic; font-weight: 600; }
.section-title > a { display: inline-flex; align-items: center; gap: 7px; color: var(--blue); font-weight: 700; }
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.news-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: 0 8px 22px rgba(40,68,76,.06); }
.news-card > a { display: block; height: 210px; overflow: hidden; }
.news-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.news-card:hover img { transform: scale(1.025); }
.news-card > div { padding: 24px; }
.news-card small, .news-list small { color: var(--blue); font-size: 12px; font-weight: 700; }
.news-card h3 { min-height: 52px; margin: 8px 0 12px; font-size: var(--heading-3-size); }
.news-card p { color: var(--muted); font-size: 14px; }

/* Inner pages */
.page-hero { padding: 32px 0 28px; background: white; border-bottom: 0; border-radius: 0; }
.page-hero.page-hero--small { padding-bottom: 8px; }
.page-hero--small h1 { margin-bottom: 0; }
.page-hero--image { position: relative; overflow: hidden; background: var(--blue); color: white; }
.page-hero--image::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(13,120,149,.97), rgba(13,120,149,.72)), var(--page-image) center/cover; content: ''; }
.page-hero--image .shell { position: relative; z-index: 1; }
.page-hero nav { display: flex; gap: 8px; margin-bottom: 13px; color: var(--muted); font-size: 12px; }
.page-hero--image nav { color: rgba(255,255,255,.94); }
.page-hero h1 { margin-bottom: 8px; color: var(--blue); font-style: italic; font-weight: 600; }
.page-hero--image h1 { color: white; }
.page-hero p { max-width: 670px; margin: 0; font-size: var(--home-copy-size); }
.page-intro { align-items: start; }
.page-intro h2, .content-copy h2 { color: var(--blue); }
.info-box { padding: 31px; background: var(--blue-light); border-left: 4px solid var(--blue); border-radius: 0 var(--radius) var(--radius) 0; }
.info-box h3 { color: var(--blue); }
.plain-links { margin: 0; padding: 0; list-style: none; }
.plain-links a { display: flex; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid #cfe5eb; color: var(--blue); }
.topic-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.topic-grid--three { grid-template-columns: repeat(3, 1fr); }
.topic-card { min-height: 280px; padding: 29px 25px; overflow: hidden; background: var(--blue); color: white; border-radius: 38px 7px; box-shadow: 0 8px 22px rgba(17,91,110,.1); }
.topic-card:nth-child(even) { border-radius: 7px 38px; }
.topic-card:hover { background: var(--blue-dark); }
.topic-card img { width: 145px; height: 62px; margin-bottom: 25px; object-fit: contain; object-position: left center; }
.topic-card h3 { margin-bottom: 10px; }
.topic-card p { margin: 0; color: rgba(255,255,255,.86); font-size: 14px; }
.content-copy { max-width: 980px; }
.copy-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 45px; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.feature-grid > div { padding: 26px; background: white; border-top: 3px solid var(--blue); border-radius: var(--radius); box-shadow: 0 7px 20px rgba(40,68,76,.06); }
.feature-grid h3 { color: var(--blue); }
.feature-grid p { margin: 0; color: var(--muted); font-size: 15px; }
.link-card-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.link-card-grid > a { padding: 29px; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 7px 20px rgba(40,68,76,.05); }
.link-card-grid > a:hover { border-color: var(--blue); background: var(--blue-light); }
.link-card-grid h3 { color: var(--blue); }
.link-card-grid span { display: inline-flex; align-items: center; gap: 7px; color: var(--blue); font-weight: 700; }
.company-facts { display: grid; gap: 12px; }
.company-facts div { display: grid; grid-template-columns: 155px 1fr; align-items: center; padding: 22px; background: var(--blue-light); border-left: 4px solid var(--blue); border-radius: 0 var(--radius) var(--radius) 0; }
.company-facts strong { color: var(--blue); font-size: 24px; }
.company-facts span { color: var(--muted); }

/* About page – based on the established SECTEO company presentation */
.about-page { font-family: inherit; font-size: var(--home-copy-size); }
.about-hero { min-height: 610px; position: relative; display: flex; align-items: center; padding: 78px 0 86px; overflow: hidden; background: #147f9c url('../images/ueber-uns-hero.webp') center / cover no-repeat; color: white; }
.about-hero::before { position: absolute; inset: 0; background: rgba(5, 78, 96, .88); content: ''; }
.about-hero__inner { position: relative; z-index: 1; }
.about-hero__heading { max-width: 560px; margin-bottom: 28px; }
.about-hero__heading > p { margin: 0 0 4px; color: white; font-style: italic; font-weight: 600; }
.about-hero h1 { margin: 0; color: white; }
.about-hero__columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(45px, 7vw, 95px); }
.about-hero__columns > div { min-width: 0; }
.about-hero__columns p { color: white; }
.about-hero__columns a:not(.button) { color: white; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(255,255,255,.58); text-underline-offset: 3px; }
.about-hero__columns a:not(.button):hover { color: var(--yellow); text-decoration-color: currentColor; }
.about-hero__quote { margin-top: 30px; font-style: italic; }
.about-products { padding: var(--section-space) 0; background: white; }
.about-section-copy { max-width: 760px; }
.about-page .about-hero__columns p, .about-page .about-section-copy > p, .about-page .feature-grid p, .about-page .link-card-grid p { font-family: inherit; font-size: var(--home-copy-size); line-height: 1.58; }
.about-section-copy h2 { color: var(--blue); }
.about-section-copy a { color: var(--blue); font-weight: 700; }
.about-section-copy a:hover { text-decoration: underline; }
.about-expertise .about-section-copy { margin-bottom: 34px; }
.about-expertise .feature-grid { margin-bottom: 18px; }
.about-company { padding: var(--section-space) 0 0; background: white; }
.about-company .about-section-copy { margin-bottom: 40px; }
.about-gallery { position: relative; overflow: hidden; background: #142c33; }
.about-gallery__track { display: flex; height: clamp(300px, 27.8vw, 400px); overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
.about-gallery__track::-webkit-scrollbar { display: none; }
.about-gallery__track:focus-visible { outline: 3px solid var(--yellow); outline-offset: -3px; }
.about-gallery figure { min-width: calc(100% / 3); height: 100%; flex: 0 0 calc(100% / 3); margin: 0; scroll-snap-align: start; }
.about-gallery img { width: 100%; height: 100%; object-fit: cover; }
.about-gallery__button { width: 54px; height: 72px; position: absolute; z-index: 2; top: 50%; display: grid; place-items: center; padding: 0; border: 0; background: rgba(19,150,185,.78); color: var(--yellow); cursor: pointer; transform: translateY(-50%); transition: background .18s, opacity .18s; }
.about-gallery__button:hover { background: var(--blue); }
.about-gallery__button:disabled { opacity: .28; cursor: default; }
.about-gallery__button--previous { left: 20px; }
.about-gallery__button--next { right: 20px; }

.news-page > .page-hero { background: linear-gradient(135deg, white 35%, var(--blue-light)); }
.news-archive-hero { position: relative; padding: clamp(62px, 6vw, 92px) 0; overflow: hidden; background: linear-gradient(125deg, #117f9d 0%, var(--blue) 56%, #46c9ec 100%); color: white; }
.news-archive-hero::before, .news-archive-hero::after { position: absolute; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; content: ''; pointer-events: none; }
.news-archive-hero::before { width: 390px; height: 390px; top: -250px; right: 8%; }
.news-archive-hero::after { width: 220px; height: 220px; right: -70px; bottom: -145px; }
.news-archive-hero__inner { position: relative; z-index: 1; display: flex; align-items: flex-end; justify-content: space-between; gap: 45px; }
.news-archive-hero__copy { max-width: 760px; }
.news-archive-hero__eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; color: var(--yellow); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.news-archive-hero__eyebrow > span { width: 28px; height: 3px; border-radius: 2px; background: var(--yellow); }
.news-archive-hero h1 { margin-bottom: 18px; color: white; font-size: var(--home-display-size); line-height: 1.05; }
.news-archive-hero p { max-width: 650px; margin: 0; color: rgba(255,255,255,.86); font-size: clamp(16px, 1.5vw, 19px); }
.news-archive-hero__count { min-width: 165px; display: flex; align-items: center; gap: 14px; padding: 18px 22px; border: 1px solid rgba(255,255,255,.3); border-radius: 28px 7px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.news-archive-hero__count strong { color: var(--yellow); font-size: 42px; line-height: 1; }
.news-archive-hero__count span { color: white; font-size: 12px; font-weight: 700; letter-spacing: .06em; line-height: 1.35; text-transform: uppercase; }
.news-archive-section { background: linear-gradient(180deg, #f7fbfc 0%, white 420px); }
.news-archive-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 32px; }
.news-archive-heading > div > span { display: block; margin-bottom: 5px; color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.news-archive-heading h2 { margin: 0; color: var(--text); font-size: var(--heading-1-size); }
.news-archive-heading > p { margin: 0 0 4px; color: var(--muted); font-size: 14px; }
.news-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 28px; }
.news-list article { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(19,150,185,.13); border-radius: 28px 7px; background: white; box-shadow: 0 12px 30px rgba(31,75,85,.09); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
.news-list article:nth-child(even):not(.news-list__item--featured) { border-radius: 7px 28px; }
.news-list article:hover { border-color: rgba(19,150,185,.3); transform: translateY(-5px); box-shadow: 0 20px 42px rgba(31,75,85,.15); }
.news-list .news-list__image { height: 235px; display: block; flex: 0 0 auto; overflow: hidden; background: var(--blue-light); }
.news-list img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s cubic-bezier(.22,1,.36,1); }
.news-list article:hover img { transform: scale(1.045); }
.news-list__body { min-height: 285px; display: flex; flex: 1; align-items: flex-start; flex-direction: column; padding: 27px 28px 29px; }
.news-list small { display: inline-flex; align-items: center; gap: 7px; color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.news-list small::before { width: 7px; height: 7px; border-radius: 50%; background: var(--yellow); content: ''; }
.news-list h2 { margin: 10px 0 14px; color: var(--blue); font-size: var(--heading-3-size); }
.news-list h2 a { transition: color .18s ease; }
.news-list h2 a:hover { color: var(--blue-dark); }
.news-list p { display: -webkit-box; margin-bottom: 24px; overflow: hidden; color: var(--muted); font-size: 14px; line-height: 1.58; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.news-card__link { display: inline-flex; align-items: center; gap: 11px; margin-top: auto; color: var(--text); font-size: 14px; font-weight: 750; }
.news-card__link > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--yellow); color: #303031; transition: background .18s ease, transform .18s ease; }
.news-card__link:hover > span { background: var(--yellow-dark); transform: translateX(3px); }
.news-list__item--featured { grid-column: 1 / -1; }
.news-list__item--featured.has-image { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(340px, .7fr); min-height: 430px; border-radius: 40px 9px; }
.news-list__item--featured .news-list__image { width: 100%; height: 100%; min-height: 430px; }
.news-list__item--featured .news-list__body { min-height: 100%; justify-content: center; padding: clamp(34px, 4vw, 54px); }
.news-list__item--featured h2 { margin: 13px 0 18px; font-size: clamp(1.55rem, 2.3vw, 2.25rem); }
.news-list__item--featured p { font-size: 15px; -webkit-line-clamp: 6; }
.news-detail-section { padding: 44px 0 72px; background: linear-gradient(145deg, #f8fbfc, var(--blue-light)); }
.news-detail-layout { width: min(1220px, calc(100% - 48px)); margin: 0 auto; }
.news-detail { padding: clamp(35px, 3.5vw, 58px); overflow: hidden; border: 1px solid rgba(19,150,185,.12); border-radius: 38px 10px; background: rgba(229,247,252,.92); box-shadow: 0 18px 45px rgba(31,75,85,.12); }
.news-detail__back { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 25px; color: var(--muted); font-size: 12px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; transition: color .18s ease; }
.news-detail__back:hover { color: var(--blue); }
.news-detail__eyebrow { display: block; margin-bottom: 8px; color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.news-detail > h1 { max-width: 950px; margin-bottom: 30px; color: var(--blue); font-size: var(--heading-1-size); }
.news-detail__date { display: block; margin-top: -20px; margin-bottom: 30px; color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.news-detail__content { display: grid; grid-template-areas: "media body"; grid-template-columns: minmax(235px, .8fr) minmax(0, 1.7fr); align-items: start; gap: clamp(28px, 2.6vw, 48px); }
.news-detail__media { grid-area: media; }
.news-detail__image-button { width: 100%; position: relative; display: block; padding: 0; overflow: hidden; border: 0; border-radius: 28px 7px; background: white; box-shadow: 0 14px 32px rgba(30,68,78,.14); cursor: zoom-in; }
.news-detail__image-button img { width: 100%; height: auto; display: block; transition: transform .3s ease; }
.news-detail__image-button > span { width: 46px; height: 46px; position: absolute; right: 14px; bottom: 14px; display: grid; place-items: center; border-radius: 50%; background: rgba(19,150,185,.92); color: white; box-shadow: 0 6px 18px rgba(20,59,69,.22); transition: background .18s ease, transform .18s ease; }
.news-detail__image-button:hover img { transform: scale(1.025); }
.news-detail__image-button:hover > span { background: var(--blue); transform: scale(1.06); }
.news-detail__image-button:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.news-detail__media .button { width: min(230px, 100%); margin: 20px auto 0; }
.news-detail__body { grid-area: body; padding: clamp(25px, 2.2vw, 36px); border: 1px solid rgba(255,255,255,.9); border-radius: 8px 28px; background: rgba(255,255,255,.82); color: var(--text); font-size: 15px; line-height: 1.62; box-shadow: 0 9px 25px rgba(31,75,85,.07); }
.news-detail__body p { margin-bottom: 18px; }
.news-detail__body p > strong:only-child { color: var(--blue); font-size: 17px; }
.news-detail__body ul { margin: -4px 0 22px; padding: 0; list-style: none; }
.news-detail__body li { position: relative; margin-bottom: 7px; padding-left: 19px; }
.news-detail__body li::before { width: 7px; height: 7px; position: absolute; top: .6em; left: 0; border-radius: 50%; background: var(--yellow); content: ''; }
.news-detail__body a { color: var(--blue); font-weight: 650; text-decoration: underline; }
.news-related { margin-top: 44px; }
.news-related__head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.news-related__head span { display: block; margin-bottom: 3px; color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.news-related__head h2 { margin: 0; color: var(--blue); }
.news-related__head > a, .news-related-card__link { display: inline-flex; align-items: center; gap: 7px; color: var(--blue); font-size: 13px; font-weight: 750; }
.news-related__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.news-related-card { min-width: 0; overflow: hidden; border: 1px solid rgba(19,150,185,.13); border-radius: 25px 7px; background: white; box-shadow: 0 10px 28px rgba(31,75,85,.09); transition: transform .2s ease, box-shadow .2s ease; }
.news-related-card:hover { transform: translateY(-3px); box-shadow: 0 15px 34px rgba(31,75,85,.14); }
.news-related-card__image { height: 170px; display: block; overflow: hidden; }
.news-related-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.news-related-card:hover img { transform: scale(1.025); }
.news-related-card > div { min-height: 176px; display: flex; align-items: flex-start; flex-direction: column; padding: 21px 23px 23px; }
.news-related-card > div > span { color: var(--blue); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.news-related-card h3 { margin: 7px 0 18px; color: var(--blue); font-size: 18px; line-height: 1.25; }
.news-related-card__link { margin-top: auto; }
.news-image-modal { position: fixed; z-index: 200; inset: 0; display: grid; place-items: center; padding: 28px; background: rgba(7,25,30,.9); animation: news-image-fade .2s ease; }
.news-image-modal__dialog { max-width: min(1400px, 100%); max-height: 100%; position: relative; display: grid; place-items: center; }
.news-image-modal__dialog img { max-width: 100%; max-height: calc(100vh - 56px); display: block; object-fit: contain; border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.45); }
.news-image-modal__close { width: 46px; height: 46px; position: absolute; z-index: 1; top: 12px; right: 12px; display: grid; place-items: center; padding: 0 0 4px; border: 0; border-radius: 50%; background: rgba(255,255,255,.94); color: var(--text); font-size: 34px; line-height: 1; box-shadow: 0 5px 18px rgba(0,0,0,.24); cursor: pointer; }
.news-image-modal__close:hover { background: var(--yellow); }
@keyframes news-image-fade { from { opacity: 0; } }
.api-news-section .section-title { margin-bottom: 26px; }
.api-news-section .section-title p { margin: 5px 0 0; color: var(--muted); }
.api-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.api-news-card { min-height: 245px; padding: 25px; background: white; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 7px 20px rgba(40,68,76,.05); }
.api-news-card small { color: var(--blue); font-size: 12px; font-weight: 700; }
.api-news-card h3 { margin: 8px 0 12px; font-size: var(--heading-3-size); }
.api-news-card h3 a:hover { color: var(--blue); }
.api-news-card p { color: var(--muted); font-size: 14px; }
.api-news-loading { height: 245px; background: #e4ebed; animation: pulse 1s infinite alternate; }
.training-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.training-grid article { padding: 25px; background: white; border-top: 3px solid var(--blue); border-radius: var(--radius); }
.training-grid small { color: var(--blue); font-weight: 700; }
.training-grid h3 { margin: 8px 0; }

@supports (content-visibility: auto) {
    .content-section, .light-section, .customer-story, .partner-strip, .manufacturer-systems, .manufacturer-cta, .solution-section, .company-intro, .news-list article, .news-related, .accessory-section, .system-detail, .system-flow, .system-selection, .system-panels, .system-grade, .system-applications, .system-components, .system-faq { content-visibility: auto; contain-intrinsic-size: auto 520px; }
}

/* Installer page – mirrors the established SECTEO errichter layout */
.installer-page { background: white; }
.installer-overview { min-height: 875px; display: grid; grid-template-columns: repeat(16, minmax(0, 1fr)); grid-template-rows: 360px 515px; overflow: hidden; }
.installer-benefits { grid-column: 1 / 5; grid-row: 1 / 3; display: flex; align-items: center; padding: 70px clamp(45px, 5.2vw, 100px); background: var(--blue); color: white; }
.installer-benefits > div { max-width: 310px; }
.installer-benefits h2 { margin: 0 0 25px; color: white; font-size: var(--heading-2-size); font-style: italic; font-weight: 600; }
.installer-benefits p { margin: 0 0 14px; color: white; font-size: 15px; font-weight: 400; line-height: 1.55; }
.installer-benefits p:last-of-type { margin-bottom: 0; }
.installer-more, .installer-brochure, .installer-training-teaser em { min-height: 41px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 7px 28px; border-radius: 24px; background: var(--yellow); color: #303031; font-size: 14px; font-style: italic; font-weight: 700; line-height: 1.25; transition: background .18s, transform .18s; }
.installer-more { min-width: 203px; margin-top: 25px; }
.installer-more:hover, .installer-brochure:hover, .installer-training-teaser:hover em { background: white; transform: translateY(-1px); }
.installer-intro { grid-column: 5 / 12; grid-row: 1; padding: 0 clamp(42px, 5.2vw, 100px) 30px; background: white; }
.installer-eyebrow { margin: 0 0 7px; color: #303031; font-size: 15px; font-style: italic; font-weight: 700; }
.installer-intro h1 { margin: 0 0 12px; color: var(--blue); font-size: var(--heading-1-size); font-style: italic; font-weight: 600; }
.installer-intro > p:not(.installer-eyebrow) { margin: 0 0 14px; color: #303031; font-size: 15px; line-height: 1.55; }
.installer-intro-image { grid-column: 12 / 17; grid-row: 1; position: relative; display: flex; align-items: center; justify-content: center; background: url('../images/errichter-partner.webp') center / cover no-repeat; }
.installer-brochure { min-width: 296px; }
.installer-training-teaser { grid-column: 5 / 13; grid-row: 2; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; background: url('../images/errichter-schulungen.webp') center / cover no-repeat; color: white; }
.installer-training-teaser::before { position: absolute; inset: 0; background: rgba(27, 41, 49, .52); content: ''; transition: background .25s; }
.installer-training-teaser:hover::before { background: rgba(17, 45, 55, .61); }
.installer-training-teaser > span { width: min(460px, calc(100% - 60px)); position: relative; z-index: 1; display: grid; justify-items: start; }
.installer-training-teaser strong { margin-bottom: 28px; font-size: var(--heading-2-size); font-style: italic; font-weight: 600; line-height: 1.2; }
.installer-training-teaser small { font-size: 15px; line-height: 1.55; }
.installer-training-teaser em { min-width: 202px; margin-top: 50px; justify-self: start; }
.installer-video-card { grid-column: 13 / 17; grid-row: 2; display: grid; grid-template-rows: 1fr 1.05fr; min-width: 0; }
.installer-video-card__image { width: 100%; position: relative; display: block; padding: 0; overflow: hidden; border: 0; background: #e8e8e8 url('../images/errichter-video.webp') center / cover no-repeat; color: inherit; cursor: pointer; }
.installer-video-card__image::after { position: absolute; inset: 0; background: rgba(20, 28, 32, .37); content: ''; transition: background .2s; }
.installer-video-card__image:hover::after { background: rgba(20, 28, 32, .22); }
.installer-play { width: 73px; height: 73px; position: absolute; z-index: 2; top: 50%; left: 50%; border-radius: 50%; background: var(--yellow); transform: translate(-50%, -50%); transition: transform .18s, background .18s; }
.installer-play::after { position: absolute; top: 50%; left: 53%; border-top: 13px solid transparent; border-bottom: 13px solid transparent; border-left: 19px solid #424244; content: ''; transform: translate(-50%, -50%); }
.installer-video-card__image:hover .installer-play { background: white; transform: translate(-50%, -50%) scale(1.05); }
.installer-video-card__copy { display: flex; flex-direction: column; justify-content: center; padding: 35px clamp(45px, 5.2vw, 100px); background: #e5f7fc; }
.installer-video-card__copy h2 { margin-bottom: 25px; color: var(--blue); font-size: var(--heading-2-size); }
.installer-video-card__copy p { margin: 0; color: #303031; font-size: 15px; line-height: 1.55; }

.installer-training { display: grid; grid-template-columns: 5fr 7fr; align-items: stretch; background: white; }
.installer-training__intro { position: relative; min-height: 790px; padding: 0 clamp(50px, 10.4vw, 200px); overflow: hidden; background: var(--blue) url('../images/errichter-schulungen.webp') 42% center / cover no-repeat; color: white; }
.installer-training__intro::before { position: absolute; inset: 0; background: rgba(4, 88, 108, .9); content: ''; }
.installer-training__intro-inner { max-width: 380px; position: sticky; z-index: 1; top: 125px; padding: 65px 0 80px; }
.installer-training__eyebrow { margin: 0 0 2px; color: white; font-size: 14px; font-style: italic; font-weight: 700; }
.installer-training__intro h2 { margin: 0 0 32px; color: white; font-size: var(--heading-2-size); }
.installer-training__intro p { margin-bottom: 18px; color: white; font-size: 15px; line-height: 1.5; }
.installer-training__events { min-width: 0; padding: 95px clamp(55px, 7.8vw, 150px) 110px; }
.installer-training__events > h2 { margin: 0 0 28px; color: var(--blue); font-size: var(--heading-1-size); }
.installer-training__events > p:not(.training-status) { margin-bottom: 28px; color: #303031; font-size: 15px; }
.training-select-wrap { width: min(402px, 100%); position: relative; }
.training-select-wrap::after { position: absolute; top: 50%; right: 18px; border-top: 7px solid #1598ba; border-right: 6px solid transparent; border-left: 6px solid transparent; content: ''; pointer-events: none; transform: translateY(-35%); }
.training-select-wrap select { width: 100%; height: 44px; padding: 5px 45px 5px 14px; appearance: none; border: 1px solid var(--blue); border-radius: 22px; outline: 0; background: white; color: var(--blue); font-size: 15px; }
.training-select-wrap select:focus { box-shadow: 0 0 0 3px rgba(21, 152, 186, .15); }
.training-status { min-height: 24px; margin: 20px 0 8px; color: #707070; font-size: 14px; }
.training-status:empty { min-height: 0; margin: 20px 0 0; }
.training-events { margin-top: 4px; }
.training-empty { max-width: 590px; margin: 22px 0 0; padding: 17px 20px; border-left: 3px solid #1598ba; background: #eef9fc; color: #555; font-size: 14px; }
.training-month { margin: 32px 0 0; }
.training-month h3 { margin: 0 0 7px; color: var(--blue); font-size: var(--heading-4-size); font-style: italic; }
.training-event { border-bottom: 1px solid #c7c7c7; }
.training-event:first-of-type { border-top: 1px solid #c7c7c7; }
.training-event__toggle { width: 100%; min-height: 48px; display: grid; grid-template-columns: auto 1fr 26px; gap: 8px; align-items: center; padding: 10px 0; border: 0; background: transparent; color: #303031; text-align: left; cursor: pointer; }
.training-event__date { font-size: 14px; font-weight: 700; white-space: nowrap; }
.training-event__title { min-width: 0; font-size: 14px; }
.training-event__title strong { margin-right: 5px; color: var(--blue); }
.training-event__chevron { width: 10px; height: 10px; justify-self: end; border-right: 2px solid #1598ba; border-bottom: 2px solid #1598ba; transform: rotate(45deg) translateY(-3px); transition: transform .2s; }
.training-event__toggle[aria-expanded="true"] .training-event__chevron { transform: rotate(225deg) translate(-2px, -2px); }
.training-event__details { padding: 8px 0 28px; }
.training-event__details[hidden] { display: none; }
.training-event__description { margin-bottom: 20px; color: #555; font-size: 14px; }
.training-event__description p { margin-bottom: 11px; }
.training-event__description ul { margin: 8px 0 16px; padding-left: 20px; }
.training-event__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 28px; margin: 0 0 22px; }
.training-event__facts div { display: grid; grid-template-columns: 120px 1fr; gap: 9px; padding-bottom: 7px; border-bottom: 1px solid #ededed; }
.training-event__facts dt { color: var(--blue); font-size: 13px; font-weight: 700; }
.training-event__facts dd { margin: 0; font-size: 13px; }
.training-event__register { min-height: 39px; display: inline-flex; align-items: center; justify-content: center; padding: 6px 25px; border-radius: 22px; background: var(--yellow); color: #303031; font-size: 14px; font-style: italic; font-weight: 700; }
.training-event__register:hover { background: var(--yellow-dark); }

/* Catalog */
.catalog-section { min-height: 720px; padding: 0 0 80px; background: white; }
.catalog-layout { width: 100%; display: grid; grid-template-columns: 25% 75%; align-items: start; }
.catalog-sidebar { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; align-items: flex-start; padding: 50px 50px 60px; background: white; }
.catalog-sidebar h2 { margin: 28px 0 7px; color: var(--muted); font-size: 12px; font-style: normal; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.catalog-search { width: min(296px, 100%); height: 30px; display: grid; grid-template-columns: 1fr 39px; align-items: center; overflow: hidden; border: 1px solid var(--secteo); border-radius: 16px; color: var(--blue); }
.catalog-search input { width: 100%; height: 28px; min-width: 0; padding: 3px 12px; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 14px; }
.catalog-search input::placeholder { color: var(--blue); opacity: 1; }
.catalog-search > span:last-child { height: 28px; display: grid; place-items: center; border-left: 1px solid var(--secteo); }
.catalog-search:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(8,117,143,.2); }
.catalog-primary-groups { width: 100%; display: flex; flex-direction: column; }
.catalog-primary-groups a, .catalog-subgroups a { width: 100%; display: block; margin: 0; padding: 8px 12px; border: 0; background: transparent; color: var(--blue); text-align: left; text-decoration: none; font-size: 15px; line-height: 1.45; cursor: pointer; transition: color .18s, background .18s, box-shadow .18s; }
.catalog-primary-groups a:hover { border-radius: 0 16px 16px 0; background: #f4fafc; color: var(--blue-dark); }
.catalog-primary-groups a.is-active { padding-left: 18px; border-radius: 0 18px 18px 0; background: var(--blue-light); color: var(--blue-dark); box-shadow: inset 4px 0 0 var(--blue); font-weight: 800; }
.catalog-primary-groups a.is-active:hover { background: #dff4f9; color: var(--blue-dark); }
.catalog-primary-groups a:focus-visible { border-radius: 0 16px 16px 0; outline: 2px solid var(--blue); outline-offset: 2px; }
.catalog-subgroups a:hover, .catalog-subgroups a.is-active { color: var(--muted); background: transparent; }
.catalog-primary-intro { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.catalog-section--new { padding-top: 38px; background: linear-gradient(180deg, #f7fbfc 0, white 300px); }
.catalog-section--new .catalog-layout { display: block; }
.catalog-section--new .catalog-sidebar { width: 100%; display: grid; grid-template-areas: "title" "intro" "groups"; grid-template-columns: minmax(0, 1fr); align-items: center; gap: 4px; padding: 30px 50px 28px; border-top: 1px solid #d8edf3; border-bottom: 1px solid #d8edf3; background: var(--blue-light); }
.catalog-section--new .catalog-sidebar h2 { grid-area: title; margin: 0; color: var(--blue); font-size: 13px; letter-spacing: .08em; }
.catalog-section--new .catalog-primary-intro { grid-area: intro; }
.catalog-section--new .catalog-primary-groups { grid-area: groups; display: flex; align-items: center; flex-direction: row; flex-wrap: wrap; gap: 9px; margin-top: 18px; }
.catalog-section--new .catalog-primary-groups a { width: auto; min-height: 34px; display: inline-flex; align-items: center; padding: 6px 15px; border: 1px solid #a9dce9; border-radius: 18px; background: white; color: var(--blue); font-size: 13px; line-height: 1.3; transition: color .18s, border-color .18s, background .18s, transform .18s; }
.catalog-section--new .catalog-primary-groups a:hover { border-color: var(--blue); background: white; color: var(--blue); transform: translateY(-1px); }
.catalog-section--new .catalog-primary-groups a.is-active { border-color: var(--blue); background: var(--blue); color: white; box-shadow: none; }
.catalog-section--new .catalog-main { width: 100%; grid-column: auto; grid-row: auto; padding-top: 30px; }
.catalog-section--new .catalog-filter-toggle { display: none; }
.catalog-filter-hint { max-width: 760px; display: flex; align-items: flex-start; gap: 8px; margin: 2px 0 12px; color: var(--muted); font-size: 12.5px; line-height: 1.5; }
.catalog-filter-hint[hidden] { display: none; }
.catalog-filter-hint > span { width: 18px; height: 18px; display: inline-grid; place-items: center; flex: 0 0 18px; margin-top: 1px; border: 1px solid #a9dce9; border-radius: 50%; color: var(--blue); font-size: 11px; font-style: normal; font-weight: 800; line-height: 1; }
.catalog-subgroups { width: 100%; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 40px; padding: 0; }
.catalog-subgroups[hidden] { display: none; }
.catalog-subgroups a { width: auto; min-height: 32px; display: inline-flex; align-items: center; margin: 0; padding: 5px 14px; border: 1px solid #a9dce9; border-radius: 18px; background: var(--blue-light); color: var(--blue); font-size: 13px; line-height: 1.35; cursor: pointer; transition: color .18s, border-color .18s, background .18s; }
.catalog-subgroups a:hover, .catalog-subgroups a.is-active { border-color: var(--blue); background: var(--blue); color: white; }
.catalog-main { min-width: 0; grid-column: 2; grid-row: 1; padding: 0 50px 40px; }
.shop-back-button { width: fit-content; min-height: 38px; margin: 0 0 20px; padding: 6px 18px; font-size: 13px; line-height: 1.3; }
.shop-back-button svg { transition: transform .18s ease; }
.shop-back-button:hover svg { transform: translateX(-2px); }
.catalog-status { min-height: 60px; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.catalog-status h1 { margin: 0; color: var(--blue); font-size: var(--heading-2-size); }
.catalog-status > div { display: flex; align-items: center; gap: 12px; }
.catalog-status #catalogCount { min-height: 30px; display: inline-flex; align-items: center; padding: 5px 11px; border: 1px solid #b9e2ec; border-radius: 16px; background: var(--blue-light); color: var(--blue-dark); font-size: 12px; font-weight: 750; line-height: 1.35; white-space: nowrap; }
.catalog-filter-toggle { display: none; }
.catalog-grid { min-height: 500px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px 24px; }
.catalog-card { min-width: 0; min-height: 481px; position: relative; overflow: hidden; background: white; border: 0; border-radius: 0 0 50px 50px; box-shadow: 10px -10px 15px #ddd; transition: box-shadow .18s; }
/* Product cards must never wait for a reveal observer or user interaction. */
.has-motion .catalog-section.motion-reveal, .has-motion .catalog-grid .catalog-card.motion-reveal, .has-motion .accessory-grid .catalog-card.motion-reveal { opacity: 1; transform: none; transition: box-shadow .18s; }
.catalog-card:hover { box-shadow: 12px -12px 20px #cfcfcf; }
.catalog-card__product { display: block; color: inherit; }
.catalog-card__image { height: 300px; position: relative; display: flex; align-items: center; justify-content: center; padding: 40px 30px 0; background: white; }
.catalog-card__image img { width: auto; max-width: 100%; height: 100%; object-fit: contain; }
.catalog-new-badge { position: absolute; z-index: 2; top: 0; left: 0; padding: 10px 20px; background: var(--blue); color: white; border-radius: 0 40px; font-size: 16px; font-style: italic; font-weight: 700; line-height: 1; }
.catalog-new-badge--ending { background: #f00; }
.catalog-placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: var(--blue); background: var(--blue-light); }
.catalog-card__body { min-height: 181px; padding: 2px 15px 70px; font-style: italic; }
.catalog-card__body h3 { margin: 0 0 2px; color: var(--text); font-size: var(--heading-4-size); font-style: italic; font-weight: 700; line-height: 1.45; }
.catalog-card__body p { max-height: 65px; margin: 0; overflow: hidden; color: var(--text); font-size: 14px; font-style: italic; line-height: 1.55; }
.catalog-card__footer { height: 50px; position: absolute; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 0 0 50px 50px; background: #f1f1f1; color: transparent; font-size: 16px; font-style: normal; }
.catalog-card.has-accessories .catalog-card__footer { background: #303031; color: white; }
.catalog-card.has-accessories .catalog-card__footer:hover { background: var(--blue); }
.catalog-card.skeleton { padding: 0; }
.catalog-card.skeleton div { height: 300px; background: #edf1f2; }
.catalog-card.skeleton span { height: 15px; display: block; margin: 22px 15px 0; background: #e3eaec; animation: pulse 1s infinite alternate; }
.catalog-card.skeleton span:last-child { width: 65%; margin-top: 10px; }
@keyframes pulse { to { opacity: .45; } }
.catalog-more { display: flex; margin: 28px auto 0; }
.catalog-more[data-auto-load="true"] { min-height: 38px; border-color: transparent; color: var(--muted); font-size: 13px; pointer-events: none; }
.catalog-more.is-loading { min-width: 228px; cursor: wait; transform: none; }
.catalog-more.is-loading::after { width: 16px; height: 16px; content: ''; border: 2px solid rgba(19, 150, 185, .25); border-top-color: var(--blue); border-radius: 50%; animation: catalog-button-spin .65s linear infinite; }
@keyframes catalog-button-spin { to { transform: rotate(360deg); } }

/* The shop entry view deliberately shows two complete rows on common desktop screens. */
@media (min-width: 1200px) {
    .catalog-section--new { padding-top: 20px; }
    .catalog-section--new .catalog-sidebar { padding: 18px 50px 17px; }
    .catalog-section--new .catalog-primary-groups { margin-top: 11px; }
    .catalog-section--new .catalog-primary-groups a { min-height: 31px; padding: 4px 13px; }
    .catalog-section--new .catalog-main { padding-top: 18px; }
    .catalog-section--new .catalog-status { min-height: 45px; }
    .catalog-section--new .catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px 22px; }
    .catalog-section--new .catalog-card { min-height: 340px; border-radius: 0 0 36px 36px; }
    .catalog-section--new .catalog-card__image { height: 210px; padding: 27px 23px 0; }
    .catalog-section--new .catalog-card__body { min-height: 130px; padding: 3px 14px 52px; }
    .catalog-section--new .catalog-card__body h3 { font-size: 15px; line-height: 1.35; }
    .catalog-section--new .catalog-card__body p { max-height: 43px; font-size: 12.5px; line-height: 1.4; }
    .catalog-section--new .catalog-card__footer { height: 42px; border-radius: 0 0 36px 36px; font-size: 14px; }
    .catalog-section--new .catalog-card.skeleton div { height: 210px; }
    .catalog-section--new .catalog-card.skeleton span { margin-top: 16px; }
}
.catalog-error { grid-column: 1/-1; padding: 80px 20px; background: white; text-align: center; }
.catalog-error svg { color: var(--blue); }

/* Product detail */
.product-detail-section { min-height: 600px; padding: 10px 0 var(--section-space); }
.product-detail-navigation { display: flex; }
.product-detail-loading { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.product-detail-loading > span { height: 480px; background: #edf1f2; animation: pulse 1s infinite alternate; }
.product-detail-loading > div { padding-top: 20px; }
.product-detail-loading i { height: 24px; display: block; margin-bottom: 22px; background: #edf1f2; animation: pulse 1s infinite alternate; }
.product-detail-loading i:nth-child(2) { width: 80%; }
.product-detail-loading i:nth-child(3) { width: 55%; }
.product-detail-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 65px; row-gap: 32px; align-items: start; }
.product-main-image { height: 500px; position: relative; display: grid; place-items: center; padding: 30px; overflow: hidden; border: 0; border-radius: 0 0 50px 50px; background: white; box-shadow: 10px -10px 15px #ddd; }
.product-main-image__button { position: absolute; inset: 30px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.product-main-image__button img { width: 86%; height: 86%; margin: auto; object-fit: contain; transform-origin: center; transition: transform .22s ease; will-change: transform; }
.product-main-image__button:focus-visible { outline: 3px solid var(--yellow); outline-offset: 5px; }
.product-main-image__zoom { width: 46px; height: 46px; position: absolute; z-index: 3; right: 14px; bottom: 14px; display: grid; place-items: center; border-radius: 50%; background: rgba(19,150,185,.92); color: white; box-shadow: 0 6px 18px rgba(20,59,69,.22); transition: background .18s ease, transform .18s ease; }
.product-main-image__button:hover .product-main-image__zoom { background: var(--blue); transform: scale(1.06); }
@media (hover: hover) and (pointer: fine) {
    .product-main-image__button.is-zooming img { transform: scale(1.85); transition-duration: .08s; }
    .product-main-image__button.is-zooming .product-main-image__zoom { opacity: 0; transform: scale(.8); }
}
.detail-placeholder { width: 100%; height: 100%; display: grid; place-items: center; background: var(--blue-light); color: var(--blue); }
.product-flags { position: absolute; z-index: 2; top: 0; left: 0; display: flex; gap: 5px; }
.product-flag { padding: 10px 20px; background: var(--blue); color: white; border-radius: 0 40px; font-size: 12px; font-style: italic; font-weight: 700; }
.product-thumbnails { display: flex; gap: 9px; margin-top: 12px; overflow-x: auto; }
.product-thumbnails button { width: 78px; height: 68px; flex: 0 0 auto; padding: 5px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-small); background: white; cursor: pointer; }
.product-thumbnails button.is-active { border-color: var(--blue); }
.product-thumbnails img { width: 100%; height: 100%; object-fit: contain; }
.product-summary { padding-top: 8px; }
.product-number { color: var(--blue); font-size: 13px; font-weight: 700; }
.product-summary h2 { margin: 9px 0 8px; color: var(--text); font-size: var(--heading-2-size); }
.product-subtitle { color: var(--muted); font-size: 18px; }
.product-description { grid-column: 1 / -1; margin: 0; padding-top: 28px; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.55; scroll-margin-top: 120px; }
.product-description > h2 { margin-bottom: 18px; color: var(--blue); font-size: var(--heading-2-size); }
.product-description p, .product-description li { font-size: 14px !important; line-height: 1.55 !important; }
.product-description p:last-child { margin-bottom: 0; }
.product-description ul { padding-left: 20px; }
.product-description li { margin-bottom: 7px; }
.product-description h3, .product-description h4 { margin: 25px 0 9px; color: var(--blue-dark); font-size: var(--heading-4-size) !important; }
.partner-price-note { display: grid; gap: 2px; margin: 14px 0 10px; padding: 13px 15px; background: var(--blue-light); color: #52686f; border-left: 3px solid var(--blue); border-radius: 0 var(--radius-small) var(--radius-small) 0; font-size: 13px; }
.partner-price-note strong { color: #344c53; font-size: 13.5px; }
.product-primary-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 22px; }
.product-video-link { min-width: 160px; margin: 0; }
.product-section-jumps { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin-top: 28px; }
.product-description-jump { width: 100%; min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 13px; padding: 9px 10px 9px 15px; border: 1px solid #d7ebf0; border-radius: 16px 5px; background: linear-gradient(100deg, rgba(229,247,252,.72), rgba(255,255,255,.2)); color: var(--blue-dark); transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease; }
.product-description-jump > span:first-child { display: grid; gap: 1px; }
.product-description-jump small { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .09em; line-height: 1.3; text-transform: uppercase; }
.product-description-jump strong { font-size: 14px; line-height: 1.35; }
.product-description-jump__icon { width: 40px; height: 40px; display: grid; flex: 0 0 40px; place-items: center; border-radius: 50%; background: white; color: var(--blue); box-shadow: 0 5px 14px rgba(28,120,143,.12); }
.product-description-jump__icon svg { transition: transform .18s ease; }
.product-description-jump:hover { border-color: #b7dfe9; background: linear-gradient(100deg, var(--blue-light), white); box-shadow: 0 9px 22px rgba(28,120,143,.09); transform: translateY(-1px); }
.product-description-jump:hover .product-description-jump__icon svg { transform: translateY(2px); }
.product-description:focus, .technical-data:focus { outline: none; }
.product-detail-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.product-downloads { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 24px; }
.detail-download { min-height: 50px; display: inline-flex; align-items: center; gap: 12px; padding: 0; color: var(--text); background: transparent; border: 0; font-size: 14px; font-style: italic; font-weight: 600; }
.detail-download svg { width: 50px; height: 50px; padding: 14px; flex: 0 0 50px; border-radius: 15px; background: var(--blue); color: white; }
.detail-download:hover { color: var(--blue); }
.product-video { max-width: 1020px; margin: 78px auto 0; }
.product-video__heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 45px; margin-bottom: 24px; }
.product-video__heading > div { max-width: 650px; }
.product-video__eyebrow { display: block; margin-bottom: 7px; color: var(--blue); font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.product-video h2 { margin: 0; color: var(--blue); font-style: italic; font-weight: 600; }
.product-video__heading > p { max-width: 330px; margin: 0 0 4px; color: var(--muted); font-size: 15px; }
.video-consent { position: relative; aspect-ratio: 16 / 9; display: grid; place-items: center; overflow: hidden; background: #173d48; border-radius: 38px 7px; box-shadow: 0 18px 42px rgba(28,80,94,.16); }
.video-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #173d48; }
.video-consent__overlay { position: absolute; z-index: 1; inset: 0; display: grid; place-items: center; padding: 28px; background: linear-gradient(180deg, rgba(13,44,52,.08) 35%, rgba(10,38,46,.76) 100%); }
.video-play { display: inline-flex; flex-direction: column; align-items: center; gap: 10px; padding: 0; border: 0; background: none; color: white; font-size: 15px; font-weight: 700; cursor: pointer; }
.video-play__icon { width: 72px; height: 72px; position: relative; display: grid; place-items: center; border: 3px solid white; border-radius: 50%; background: var(--yellow); box-shadow: 0 9px 25px rgba(0,0,0,.24); transition: transform .18s, background .18s; }
.video-play__icon::after { margin-left: 5px; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 16px solid #303031; content: ''; }
.video-play:hover .video-play__icon { background: white; transform: scale(1.05); }
.video-play__label { padding: 7px 13px; border-radius: 18px; background: rgba(20,55,65,.72); box-shadow: 0 4px 14px rgba(0,0,0,.14); }
.video-privacy { position: absolute; right: 22px; bottom: 18px; left: 22px; display: flex; align-items: center; gap: 9px; margin: 0; color: white; text-align: left; }
.video-privacy strong { padding: 4px 8px; border: 1px solid rgba(255,255,255,.55); border-radius: 12px; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.video-privacy small { color: rgba(255,255,255,.88); font-size: 11px; }
.video-consent.is-loaded { display: block; background: #111; }
.video-frame { position: relative; height: 100%; min-height: 100%; background: #111; }
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.technical-data { position: relative; margin-top: clamp(58px, 7vw, 92px); padding: clamp(28px, 4vw, 46px); overflow: hidden; border: 1px solid #d8e6e9; border-radius: 28px 6px; background: linear-gradient(145deg, #f7fbfc, #eef6f8); box-shadow: 0 18px 42px rgba(31,75,85,.09); scroll-margin-top: 120px; }
.technical-data::before { width: 92px; height: 5px; position: absolute; top: 0; left: clamp(28px, 4vw, 46px); border-radius: 0 0 5px 5px; background: var(--yellow); content: ''; }
.technical-data__heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 420px); align-items: end; gap: 35px; margin-bottom: 27px; padding-bottom: 23px; border-bottom: 1px solid #cfdee2; }
.technical-data__heading span { display: block; margin-bottom: 5px; color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.technical-data__heading h2 { margin: 0; color: #26383d; font-size: var(--heading-2-size); font-style: normal; font-weight: 650; }
.technical-data__heading p { margin: 0; color: #69777b; font-size: 13.5px; line-height: 1.55; }
.technical-data__content > :first-child { margin-top: 0; }
.technical-data__content > :last-child { margin-bottom: 0; }
.technical-data__content > ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 10px; margin: 0; padding: 0; list-style: none; }
.technical-data__content > ul > li { min-height: 58px; position: relative; display: flex; align-items: center; padding: 13px 18px 13px 27px; border: 1px solid #dce8eb; border-radius: 5px; background: white; color: #465459; font-size: 13.5px; line-height: 1.45; box-shadow: 0 4px 12px rgba(31,75,85,.035); }
.technical-data__content > ul > li::before { width: 3px; height: 23px; position: absolute; top: 50%; left: 14px; border-radius: 3px; background: var(--blue); content: ''; transform: translateY(-50%); }
.technical-data__content > ul > li strong { color: #26383d; font-weight: 700; }
.technical-data__content { overflow-x: auto; scrollbar-width: thin; scrollbar-color: var(--blue) #dfeaec; }
.technical-data__content table { width: 100%; overflow: hidden; border: 1px solid #d5e3e6; border-collapse: separate; border-spacing: 0; border-radius: 6px; background: white; }
.technical-data__content th, .technical-data__content td { padding: 15px 18px; border: 0; border-bottom: 1px solid #e0eaec; text-align: left; vertical-align: top; font-size: 13.5px; line-height: 1.45; }
.technical-data__content th { width: 34%; background: #eaf5f7; color: #285764; font-weight: 750; }
.technical-data__content td { color: #48565a; }
.technical-data__content tr:last-child > * { border-bottom: 0; }
.technical-data__content tr:nth-child(even) td { background: #fafcfc; }
.accessory-section { padding: var(--section-space) 0; scroll-margin-top: 110px; background: var(--light); }
.accessory-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.accessory-status { grid-column: 1 / -1; margin: 0; padding: 28px; border-radius: var(--radius); background: white; color: var(--muted); text-align: center; }

/* Solution landing pages */
.sector-page { --sector-accent: var(--blue); --sector-dark: var(--blue-dark); --sector-soft: var(--blue-light); overflow: hidden; }
.sector-hero { min-height: 560px; display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr); background: var(--sector-soft); }
.sector-hero__media { min-height: 560px; position: relative; overflow: hidden; clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%); background: #dce8eb; }
.sector-hero__media::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(12,36,43,.52)); content: ''; pointer-events: none; }
.sector-hero__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.22,1,.36,1); }
.sector-hero:hover .sector-hero__media img { transform: scale(1.018); }
.sector-hero__label { position: absolute; z-index: 1; right: 9%; bottom: 31px; padding: 7px 14px; border: 1px solid rgba(255,255,255,.65); border-radius: 18px; background: rgba(18,44,51,.45); color: white; font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; backdrop-filter: blur(6px); }
.sector-hero__copy { max-width: 760px; display: flex; flex-direction: column; justify-content: center; padding: clamp(54px, 5vw, 88px) clamp(42px, 5.2vw, 92px); background: radial-gradient(circle at 86% 12%, rgba(255,255,255,.86), transparent 43%); }
.sector-eyebrow, .sector-heading > span { display: block; margin-bottom: 9px; color: var(--sector-accent); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.sector-hero h1 { margin-bottom: 8px; color: var(--sector-accent); font-size: var(--home-display-size); }
.sector-hero h2 { margin-bottom: 21px; color: #303031; font-size: var(--home-subtitle-size); font-style: normal; font-weight: 500; }
.sector-hero__text { max-width: 660px; }
.sector-hero__text p { margin-bottom: 13px; font-size: var(--home-copy-size); line-height: 1.58; }
.sector-hero .button-row { align-items: center; margin-top: 16px; }
.sector-text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--sector-accent); font-size: 14px; font-weight: 750; }
.sector-text-link svg { transition: transform .18s ease; }
.sector-text-link:hover svg { transform: translateX(3px); }

.sector-benefits { position: relative; z-index: 2; padding: 0; background: white; box-shadow: 0 14px 34px rgba(31,75,85,.08); }
.sector-benefits__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sector-benefit { min-width: 0; display: grid; grid-template-columns: auto 1fr; gap: 17px; align-items: center; padding: 31px clamp(22px, 2.5vw, 38px); }
.sector-benefit + .sector-benefit { border-left: 1px solid #e5ecee; }
.sector-benefit__number { color: var(--sector-accent); font-size: 12px; font-style: italic; font-weight: 800; letter-spacing: .08em; }
.sector-benefit h3 { margin-bottom: 4px; color: #303031; font-size: 15px; }
.sector-benefit p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }

.sector-systems { position: relative; padding: var(--section-space) 0 calc(var(--section-space) + 18px); background: linear-gradient(145deg, #fff 10%, var(--sector-soft)); }
.sector-systems::before { width: 86px; height: 4px; position: absolute; top: 0; left: calc(50% - 43px); border-radius: 0 0 4px 4px; background: var(--sector-accent); content: ''; }
.sector-heading { max-width: 720px; margin: 0 auto var(--section-heading-gap); text-align: center; }
.sector-heading h2 { margin-bottom: 10px; color: var(--sector-accent); }
.sector-heading p { margin: 0; color: var(--muted); font-size: 15px; }
.sector-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.sector-card-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.sector-card { min-width: 0; height: 100%; display: flex; flex-direction: column; overflow: hidden; border: 1px solid color-mix(in srgb, var(--sector-accent) 15%, white); border-radius: 28px 7px; background: white; box-shadow: 0 14px 34px rgba(31,75,85,.11); transition: transform .24s ease, box-shadow .24s ease; }
.sector-card:hover { transform: translateY(-4px); box-shadow: 0 20px 42px rgba(31,75,85,.16); }
.sector-card__image { height: 230px; display: block; overflow: hidden; background: #e8eff1; }
.sector-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.sector-card__image:hover img { transform: scale(1.025); }
.sector-card__image--contain { background: white; }
.sector-card__image--contain img { padding: 12px 34px; object-fit: contain; }
.sector-card__body { min-height: 0; position: relative; display: flex; flex: 1; flex-direction: column; padding: 27px 29px 30px; }
.sector-card-grid--four .sector-card__image { height: 190px; }
.sector-card-grid--four .sector-card__body { padding: 24px 22px 27px; }
.sector-card__number { position: absolute; top: 21px; right: 25px; color: color-mix(in srgb, var(--sector-accent) 17%, white); font-size: 42px; font-style: italic; font-weight: 800; line-height: 1; }
.sector-card__type { position: relative; z-index: 1; display: block; margin-bottom: 6px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.sector-card h3 { position: relative; z-index: 1; margin-bottom: 12px; padding-right: 28px; color: var(--sector-accent); font-size: clamp(1.18rem, 1.08rem + .28vw, 1.4rem); font-style: italic; font-weight: 650; }
.sector-card > .sector-card__body > p { margin-bottom: 19px; color: #596166; font-size: 14px; line-height: 1.5; }
.sector-card ul { display: grid; gap: 8px; margin: 0 0 23px; padding: 0; list-style: none; }
.sector-card li { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.45; }
.sector-card li svg { flex: 0 0 auto; margin-top: 2px; color: var(--sector-accent); }
.sector-card .sector-text-link { margin-top: auto; }

.sector-usecases { padding: var(--section-space) 0; background: white; }
.sector-usecases__layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(50px, 7vw, 96px); align-items: center; }
.sector-usecases__intro h2 { color: var(--sector-accent); }
.sector-usecases__intro p { max-width: 440px; margin: 0; color: var(--muted); font-size: 15px; }
.sector-usecases__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #dfe8ea; border-left: 1px solid #dfe8ea; }
.sector-usecases__grid article { min-height: 154px; position: relative; padding: 27px 25px 24px 31px; border-right: 1px solid #dfe8ea; border-bottom: 1px solid #dfe8ea; }
.sector-usecases__grid article[id] { scroll-margin-top: 120px; }
.sector-usecases__grid article > span { width: 18px; height: 3px; display: block; margin-bottom: 15px; border-radius: 2px; background: var(--sector-accent); }
.sector-usecases__grid h3 { margin-bottom: 7px; color: #303031; font-size: 15px; }
.sector-usecases__grid p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.sector-usecases__grid .sector-text-link { margin-top: 15px; font-size: 12px; }

.sector-cta { padding: var(--section-space-compact) 0; background: linear-gradient(112deg, var(--sector-dark), var(--sector-accent)); color: white; }
.sector-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 45px; }
.sector-cta__inner > div { max-width: 760px; }
.sector-cta .sector-eyebrow { color: var(--yellow); }
.sector-cta h2 { margin: 3px 0 9px; color: white; }
.sector-cta p { margin: 0; color: rgba(255,255,255,.9); font-size: 14px; }
.sector-cta .button { flex: 0 0 auto; }

/* Manufacturer system landing pages */
.system-page { --system-accent: var(--blue); --system-dark: var(--blue-dark); --system-soft: var(--blue-light); overflow: hidden; }
.system-hero { min-height: 570px; display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(0, .97fr); background: var(--system-soft); }
.system-hero__media { min-height: 570px; position: relative; overflow: hidden; clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%); background: #e4ecee; }
.system-hero__media::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 52%, rgba(12,34,41,.5)); content: ''; }
.system-hero__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .75s cubic-bezier(.22,1,.36,1); }
.system-hero:hover .system-hero__media img { transform: scale(1.018); }
.system-hero__media > span { position: absolute; z-index: 1; right: 9%; bottom: 30px; padding: 7px 13px; border: 1px solid rgba(255,255,255,.62); border-radius: 18px; background: rgba(18,44,51,.43); color: white; font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; backdrop-filter: blur(6px); }
.system-hero__copy { max-width: 760px; display: flex; flex-direction: column; justify-content: center; padding: clamp(48px, 4.5vw, 78px) clamp(42px, 5.2vw, 92px); background: radial-gradient(circle at 86% 12%, rgba(255,255,255,.88), transparent 43%); }
.system-backlink { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; margin-bottom: 22px; color: var(--muted); font-size: 12px; font-weight: 700; }
.system-backlink:hover { color: var(--system-accent); }
.system-eyebrow, .system-section-heading > span { display: block; margin-bottom: 8px; color: var(--system-accent); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.system-hero h1 { margin-bottom: 8px; color: var(--system-accent); font-size: var(--home-display-size); }
.system-hero h2 { margin-bottom: 21px; color: #303031; font-size: var(--home-subtitle-size); font-style: normal; font-weight: 500; }
.system-hero p { max-width: 670px; margin-bottom: 0; font-size: var(--home-copy-size); line-height: 1.62; }
.system-hero .button-row { margin-top: 27px; }
.system-anchor-nav { position: relative; z-index: 2; border-bottom: 1px solid #e0e9eb; background: white; box-shadow: 0 13px 30px rgba(31,75,85,.07); }
.system-anchor-nav .shell { min-height: 60px; display: flex; align-items: center; justify-content: center; gap: clamp(22px, 4vw, 58px); }
.system-anchor-nav a { position: relative; padding: 19px 0 17px; color: #596166; font-size: 13px; font-weight: 700; }
.system-anchor-nav a::after { width: 0; height: 2px; position: absolute; right: 0; bottom: 0; left: 0; margin: auto; background: var(--system-accent); content: ''; transition: width .2s ease; }
.system-anchor-nav a:hover { color: var(--system-accent); }
.system-anchor-nav a:hover::after { width: 100%; }
.system-topic-links { padding: 25px 0 28px; border-bottom: 1px solid #e2ebed; background: #f5f9fa; }
.system-topic-links__label { display: block; margin-bottom: 11px; color: #6a7478; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.system-topic-links__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.system-topic-links__grid > a { min-height: 82px; display: grid; grid-template-columns: 39px 1fr 18px; gap: 11px; align-items: center; padding: 14px 15px; border: 1px solid #dce7e9; border-radius: 15px 4px; background: white; color: #3d4649; box-shadow: 0 6px 17px rgba(31,75,85,.055); transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.system-topic-links__grid > a:hover { border-color: color-mix(in srgb, var(--system-accent) 45%, white); box-shadow: 0 11px 24px rgba(31,75,85,.1); transform: translateY(-2px); }
.system-topic-links__grid > a > span { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 50%; background: var(--system-soft); color: var(--system-accent); }
.system-topic-links__grid > a > svg { color: var(--system-accent); }
.system-topic-links__grid strong, .system-topic-links__grid small { display: block; }
.system-topic-links__grid strong { margin-bottom: 3px; color: var(--system-accent); font-size: 13px; }
.system-topic-links__grid small { color: #687175; font-size: 10.5px; line-height: 1.35; }
.system-overview { padding: var(--section-space) 0; background: white; scroll-margin-top: 120px; }
.system-overview__layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(330px, .72fr); gap: clamp(55px, 7vw, 100px); align-items: center; }
.system-overview__copy h2 { color: var(--system-accent); }
.system-overview__copy p { max-width: 680px; font-size: 15px; }
.system-overview__copy p:last-child { margin-bottom: 0; }
.system-related-links { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 25px; }
.system-related-links a { display: inline-flex; align-items: center; gap: 7px; color: var(--system-accent); font-size: 13px; font-weight: 750; }
.system-related-links a:hover { text-decoration: underline; text-underline-offset: 3px; }
.system-detail { padding: var(--section-space) 0; scroll-margin-top: 120px; background: #f5f9fa; }
.system-detail__layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: clamp(50px, 7vw, 105px); align-items: center; }
.system-detail__media { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(145px, .8fr); gap: 15px; align-items: end; }
.system-detail__media figure { min-width: 0; position: relative; margin: 0; overflow: hidden; border-radius: 30px 7px; background: #dfe8ea; box-shadow: 0 18px 42px rgba(31,75,85,.14); }
.system-detail__media figure:first-child { height: clamp(390px, 34vw, 545px); }
.system-detail__media figure:last-child { height: clamp(285px, 25vw, 395px); margin-bottom: clamp(22px, 4vw, 65px); border-radius: 7px 24px; }
.system-detail__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.22,1,.36,1); }
.system-detail__media figure:hover img { transform: scale(1.025); }
.system-detail__media figcaption { min-height: 58px; position: absolute; right: 0; bottom: 0; left: 0; display: flex; align-items: center; gap: 10px; padding: 14px 17px; background: linear-gradient(0deg, rgba(12,34,41,.8), rgba(12,34,41,.08)); color: white; font-size: 11px; font-weight: 700; line-height: 1.35; }
.system-detail__media figcaption span { color: var(--yellow); font-size: 10px; letter-spacing: .08em; }
.system-detail__copy h2 { margin-bottom: 19px; color: var(--system-accent); }
.system-detail__copy > p { margin-bottom: 14px; color: #4e575a; font-size: 14px; line-height: 1.65; }
.system-detail__copy h3 { margin: 27px 0 14px; color: #343a3d; font-size: 15px; }
.system-detail__copy ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 20px; margin: 0; padding: 0; list-style: none; }
.system-detail__copy li { display: flex; align-items: flex-start; gap: 8px; color: #454c4f; font-size: 12.5px; line-height: 1.45; }
.system-detail__copy li svg { flex: 0 0 auto; margin-top: 1px; color: var(--system-accent); }
.system-detail__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 29px; }
.system-detail__source { display: inline-flex; align-items: center; gap: 6px; margin-top: 17px; color: var(--system-accent); font-size: 11.5px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.system-detail__sources { display: flex; flex-wrap: wrap; gap: 0 19px; }
.system-selection { padding: var(--section-space) 0; scroll-margin-top: 120px; background: linear-gradient(145deg, #f3f8f9, #fff); }
.system-selection__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.system-selection__grid article { min-height: 330px; display: flex; flex-direction: column; padding: 30px 28px 27px; border: 1px solid #dbe6e8; border-radius: 24px 6px; background: #fff; box-shadow: 0 13px 31px rgba(31,75,85,.075); }
.system-selection__grid article > span { align-self: flex-start; margin-bottom: 16px; padding: 6px 10px; border-radius: 999px; background: var(--system-soft); color: var(--system-accent); font-size: 9.5px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.system-selection__grid h3 { margin-bottom: 10px; color: var(--system-accent); font-size: 20px; }
.system-selection__grid article > p { margin: 0 0 19px; color: #596367; font-size: 13px; line-height: 1.58; }
.system-selection__grid ul { display: grid; gap: 9px; margin: 0 0 23px; padding: 18px 0 0; border-top: 1px solid #e2eaec; list-style: none; }
.system-selection__grid li { display: flex; align-items: flex-start; gap: 8px; color: #464f52; font-size: 12px; line-height: 1.45; }
.system-selection__grid li svg { flex: 0 0 auto; margin-top: 1px; color: var(--system-accent); }
.system-selection__grid article > a { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; margin-top: auto; color: var(--system-accent); font-size: 11px; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.system-selection__note { max-width: 980px; display: flex; align-items: flex-start; justify-content: center; gap: 10px; margin: 24px auto 0; color: #667175; font-size: 11.5px; line-height: 1.55; text-align: center; }
.system-selection__note svg { flex: 0 0 auto; margin-top: 1px; color: var(--system-accent); }
.system-flow { padding: var(--section-space) 0; scroll-margin-top: 120px; background: white; }
.system-flow__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #dce7e9; border-left: 1px solid #dce7e9; }
.system-flow__grid article { min-height: 215px; position: relative; padding: 29px 25px 27px; border-right: 1px solid #dce7e9; border-bottom: 1px solid #dce7e9; background: white; }
.system-flow__grid article > span { display: block; margin-bottom: 29px; color: var(--system-accent); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.system-flow__grid article > span::after { width: 35px; height: 2px; display: inline-block; margin: 0 0 3px 10px; background: var(--yellow); content: ''; }
.system-flow__grid h3 { margin-bottom: 10px; color: var(--system-accent); font-size: 18px; }
.system-flow__grid p { margin: 0; color: #5d676b; font-size: 12.5px; line-height: 1.55; }
.system-flow__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 13px 32px; margin-top: 24px; }
.system-flow__links a { display: inline-flex; align-items: center; gap: 7px; color: var(--system-accent); font-size: 12.5px; font-weight: 750; }
.system-panels { padding: var(--section-space) 0; scroll-margin-top: 120px; background: #f3f8f9; }
.system-panels__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.system-panels__grid article { min-height: 365px; display: flex; flex-direction: column; padding: 30px 28px 27px; border: 1px solid #dbe6e8; border-radius: 24px 6px; background: white; box-shadow: 0 13px 31px rgba(31,75,85,.075); }
.system-panels__grid article.is-featured { border-color: color-mix(in srgb, var(--system-accent) 45%, white); box-shadow: inset 0 4px var(--yellow), 0 18px 40px rgba(31,75,85,.13); }
.system-panels__head { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.system-panels__head h3 { margin: 0; color: var(--system-accent); font-size: 23px; }
.system-panels__head span { padding: 5px 9px; border-radius: 999px; background: var(--yellow); color: #34383a; font-size: 9.5px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.system-panels__grid article > p { min-height: 43px; margin: 0 0 20px; color: #596367; font-size: 12.5px; line-height: 1.5; }
.system-panels__grid ul { display: grid; gap: 10px; margin: 0 0 25px; padding: 20px 0 0; border-top: 1px solid #e2eaec; list-style: none; }
.system-panels__grid li { display: flex; align-items: flex-start; gap: 8px; color: #464f52; font-size: 12px; line-height: 1.45; }
.system-panels__grid li svg { flex: 0 0 auto; margin-top: 1px; color: var(--system-accent); }
.system-panels__links { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 9px 14px; margin-top: auto; }
.system-panels__links .text-link { display: inline-flex; align-items: center; gap: 6px; color: var(--system-accent); font-size: 12px; font-weight: 800; }
.system-panels__links > a:last-child { color: #6a7377; font-size: 10.5px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.system-panels__note { max-width: 940px; display: flex; align-items: flex-start; gap: 10px; margin: 23px auto 0; color: #667175; font-size: 11.5px; line-height: 1.55; text-align: center; }
.system-panels__note svg { flex: 0 0 auto; margin-top: 1px; color: var(--system-accent); }
.system-feature-panel { padding: 34px 35px 36px; border: 1px solid color-mix(in srgb, var(--system-accent) 20%, white); border-radius: 28px 7px; background: linear-gradient(145deg, #fff, var(--system-soft)); box-shadow: 0 15px 34px rgba(31,75,85,.11); }
.system-feature-panel > span { display: block; margin-bottom: 19px; color: var(--system-accent); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.system-feature-panel ul { display: grid; gap: 13px; margin: 0 0 27px; padding: 0; list-style: none; }
.system-feature-panel li { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; }
.system-feature-panel li svg { flex: 0 0 auto; margin-top: 2px; color: var(--system-accent); }
.system-feature-panel .text-link { color: var(--system-accent); }
.system-applications { position: relative; padding: var(--section-space) 0; background: linear-gradient(145deg, #fff 5%, var(--system-soft)); scroll-margin-top: 120px; }
.system-applications::before { width: 86px; height: 4px; position: absolute; top: 0; left: calc(50% - 43px); border-radius: 0 0 4px 4px; background: var(--system-accent); content: ''; }
.system-section-heading { max-width: 680px; margin: 0 auto var(--section-heading-gap); text-align: center; }
.system-section-heading h2 { margin-bottom: 9px; color: var(--system-accent); }
.system-section-heading p { margin: 0; color: var(--muted); font-size: 14px; }
.system-application-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; }
.system-application-grid article { min-height: 190px; position: relative; padding: 30px 25px 28px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--system-accent) 14%, white); border-radius: 23px 6px; background: white; box-shadow: 0 11px 28px rgba(31,75,85,.08); }
.system-application-grid article > span { position: absolute; top: 19px; right: 21px; color: color-mix(in srgb, var(--system-accent) 18%, white); font-size: 36px; font-style: italic; font-weight: 800; line-height: 1; }
.system-application-grid h3 { position: relative; margin: 38px 0 9px; color: var(--system-accent); font-size: 17px; }
.system-application-grid p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.system-application-grid .text-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 18px; color: var(--system-accent); font-size: 12px; font-weight: 750; }
.system-application-grid article.has-link { min-height: 255px; display: flex; align-items: flex-start; flex-direction: column; }
.system-application-grid article.has-link .text-link { margin-top: auto; padding-top: 18px; }
.system-components { padding: var(--section-space) 0; background: #fff; scroll-margin-top: 120px; }
.system-components__layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(55px, 7vw, 100px); align-items: center; }
.system-components__heading h2 { color: var(--system-accent); }
.system-components__heading p { max-width: 430px; margin: 0; color: var(--muted); }
.system-components ol { margin: 0; padding: 0; border-top: 1px solid #dfe8ea; list-style: none; }
.system-components li { min-height: 66px; display: grid; grid-template-columns: 54px 1fr; gap: 17px; align-items: center; padding: 10px 13px; border-bottom: 1px solid #dfe8ea; }
.system-components li > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--system-soft); color: var(--system-accent); font-size: 11px; font-weight: 800; }
.system-components li > div { min-width: 0; }
.system-components li strong { color: #3f4649; font-size: 15px; }
.system-components li p { max-width: 680px; margin: 5px 0 7px; color: var(--muted); font-size: 12.5px; line-height: 1.5; }
.system-components li .text-link { display: inline-flex; align-items: center; gap: 6px; color: var(--system-accent); font-size: 12px; font-weight: 750; }
.system-components li.has-description { min-height: 112px; align-items: start; padding-top: 17px; padding-bottom: 17px; }

.system-grade { padding: var(--section-space) 0; scroll-margin-top: 120px; background: linear-gradient(135deg, #155d70, var(--system-accent)); color: white; }
.system-grade .system-section-heading { max-width: 840px; }
.system-grade .system-section-heading > span { color: var(--yellow); }
.system-grade .system-section-heading h2 { color: white; }
.system-grade .system-section-heading p { color: rgba(255,255,255,.86); font-size: 15px; line-height: 1.6; }
.system-grade__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.system-grade__cards article { padding: 30px clamp(25px, 3vw, 42px) 34px; border: 1px solid rgba(255,255,255,.25); border-radius: 26px 7px; background: rgba(255,255,255,.1); box-shadow: 0 14px 35px rgba(8,49,60,.15); }
.system-grade__cards article > span { display: inline-flex; margin-bottom: 17px; padding: 6px 12px; border-radius: 999px; background: var(--yellow); color: #303031; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.system-grade__cards h3 { margin-bottom: 10px; color: white; font-size: clamp(1.05rem, .97rem + .27vw, 1.25rem); }
.system-grade__cards p { margin: 0; color: rgba(255,255,255,.86); font-size: 13.5px; line-height: 1.6; }
.system-grade__practical { display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(360px, .94fr); gap: clamp(30px, 5vw, 70px); align-items: center; margin-top: 22px; padding: clamp(22px, 3vw, 38px); border: 1px solid rgba(255,255,255,.24); border-radius: 7px 30px; background: rgba(7,51,62,.26); }
.system-grade__practical figure { height: clamp(315px, 31vw, 450px); margin: 0; overflow: hidden; border-radius: 24px 5px; background: #173f49; }
.system-grade__practical img { width: 100%; height: 100%; object-fit: cover; }
.system-grade__practical > div > span { display: block; margin-bottom: 8px; color: var(--yellow); font-size: 10px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.system-grade__practical h3 { margin-bottom: 20px; color: white; font-size: clamp(1.25rem, 1.08rem + .45vw, 1.65rem); }
.system-grade__practical ul { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }
.system-grade__practical li { display: flex; align-items: flex-start; gap: 9px; color: rgba(255,255,255,.9); font-size: 12.5px; line-height: 1.55; }
.system-grade__practical li svg { flex: 0 0 auto; margin-top: 2px; color: var(--yellow); }
.system-grade__details { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(28px, 4vw, 58px); align-items: center; margin-top: 22px; padding: clamp(28px, 4vw, 48px); border-radius: 7px 30px; background: white; color: var(--text); box-shadow: 0 20px 48px rgba(6,42,52,.2); }
.system-grade__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #dce7e9; border-left: 1px solid #dce7e9; }
.system-grade__facts div { min-height: 112px; display: flex; justify-content: center; flex-direction: column; padding: 18px; border-right: 1px solid #dce7e9; border-bottom: 1px solid #dce7e9; text-align: center; }
.system-grade__facts strong { color: var(--system-accent); font-size: 22px; line-height: 1.15; }
.system-grade__facts span { margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.35; }
.system-grade__products h3 { color: var(--system-accent); font-size: var(--heading-3-size); }
.system-grade__products ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; margin: 20px 0 26px; padding: 0; list-style: none; }
.system-grade__products li { display: flex; align-items: flex-start; gap: 8px; color: #444b4e; font-size: 12.5px; }
.system-grade__products li svg { flex: 0 0 auto; margin-top: 1px; color: var(--system-accent); }
.system-grade__products .button-row { align-items: center; }
.system-grade__products .text-link { color: var(--system-accent); font-size: 12px; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.system-grade__process { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 21px; border-top: 1px solid rgba(255,255,255,.24); border-left: 1px solid rgba(255,255,255,.24); }
.system-grade__process article { min-height: 135px; display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 22px; border-right: 1px solid rgba(255,255,255,.24); border-bottom: 1px solid rgba(255,255,255,.24); }
.system-grade__process article > span { color: var(--yellow); font-size: 12px; font-weight: 850; letter-spacing: .08em; }
.system-grade__process h3 { margin-bottom: 7px; color: white; font-size: 14px; }
.system-grade__process p { margin: 0; color: rgba(255,255,255,.92); font-size: 11.5px; line-height: 1.5; }
.system-grade__note { display: grid; grid-template-columns: 190px 1fr; gap: 25px; align-items: start; margin-top: 20px; padding: 21px 25px; border-left: 4px solid var(--yellow); background: rgba(8,49,60,.33); }
.system-grade__note strong { color: var(--yellow); font-size: 13px; }
.system-grade__note p { margin: 0; color: rgba(255,255,255,.88); font-size: 12.5px; line-height: 1.55; }
.system-grade__official-links { display: flex; flex-wrap: wrap; gap: 9px 25px; margin-top: 18px; }
.system-grade__official { display: inline-flex; align-items: center; gap: 7px; color: white; font-size: 12px; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.system-grade__official:hover { color: var(--yellow); }

.system-faq { padding: var(--section-space) 0; scroll-margin-top: 120px; background: linear-gradient(145deg, #fff 5%, var(--system-soft)); }
.system-faq__layout { display: grid; grid-template-columns: minmax(260px, .68fr) minmax(0, 1.32fr); gap: clamp(45px, 7vw, 100px); align-items: start; }
.system-faq__heading { position: sticky; top: 120px; }
.system-faq__heading h2 { color: var(--system-accent); }
.system-faq__heading p { max-width: 390px; margin: 0; color: var(--muted); font-size: 14px; }
.system-faq__items { border-top: 1px solid #d6e3e6; }
.system-faq details { border-bottom: 1px solid #d6e3e6; }
.system-faq summary { min-height: 68px; display: grid; grid-template-columns: 1fr 32px; gap: 20px; align-items: center; color: #343a3d; font-size: 15px; font-weight: 750; cursor: pointer; list-style: none; }
.system-faq summary::-webkit-details-marker { display: none; }
.system-faq summary span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: white; color: var(--system-accent); font-size: 20px; font-weight: 400; transition: transform .2s; }
.system-faq details[open] summary { color: var(--system-accent); }
.system-faq details[open] summary span { transform: rotate(45deg); }
.system-faq details p { max-width: 760px; margin: -3px 50px 23px 0; color: var(--muted); font-size: 13.5px; line-height: 1.6; }
.system-service { padding: 33px 0; border-top: 1px solid #e5ecee; background: #fafcfc; }
.system-service__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.system-service article { display: grid; grid-template-columns: 46px 1fr; gap: 15px; align-items: center; padding: 10px clamp(20px, 2.5vw, 38px); }
.system-service article + article { border-left: 1px solid #dfe8ea; }
.system-service article > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: var(--system-soft); color: var(--system-accent); }
.system-service h3 { margin-bottom: 3px; font-size: 15px; }
.system-service p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.system-cta { padding: var(--section-space-compact) 0; background: linear-gradient(112deg, var(--system-dark), var(--system-accent)); color: white; scroll-margin-top: 120px; }
.system-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 45px; }
.system-cta__inner > div:first-child { max-width: 720px; }
.system-cta .system-eyebrow { color: var(--yellow); }
.system-cta h2 { margin: 3px 0 9px; color: white; }
.system-cta p { margin: 0; color: rgba(255,255,255,.9); font-size: 14px; }
.system-cta .button-row { flex: 0 0 auto; align-items: center; margin-top: 0; }
.system-cta__phone { display: inline-flex; align-items: center; gap: 7px; color: white; font-size: 14px; font-weight: 750; }
.system-cta__phone:hover { color: var(--yellow); }

/* Contact / legal */
.contact-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: start; }
.contact-details h2, .contact-form h2, .legal-copy h2 { color: var(--blue); }
.contact-details address { display: grid; gap: 12px; margin-top: 30px; font-style: normal; }
.contact-details address > a, .contact-details address > div { display: grid; grid-template-columns: 46px 1fr; gap: 13px; align-items: center; }
.contact-details address > * > span { width: 46px; height: 46px; display: grid; place-items: center; background: var(--blue-light); color: var(--blue); }
.contact-details address div div, .contact-details address a div { display: grid; }
.contact-details small { color: var(--muted); }
.contact-form { padding: 34px; background: var(--light); border: 1px solid var(--line); border-radius: var(--radius-large); }
.contact-form label { display: grid; gap: 6px; margin-bottom: 16px; font-size: 14px; font-weight: 500; }
.contact-form input, .contact-form textarea { width: 100%; padding: 11px 16px; border: 1px solid #b9c5c8; border-radius: 20px; background: white; outline: 0; resize: vertical; }
.contact-form input:focus, .contact-form textarea:focus { border-color: var(--blue); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.privacy-check { display: flex !important; grid-template-columns: auto 1fr; align-items: flex-start; gap: 9px !important; font-weight: 400 !important; }
.privacy-check input { width: auto; margin-top: 5px; }
.privacy-check a { color: var(--blue); text-decoration: underline; }
.honeypot { position: absolute; left: -9999px; }
.form-message { margin-bottom: 18px; padding: 12px; font-size: 14px; }
.form-message--success { background: #e1f4e5; color: #236432; }
.form-message--error { background: #fbe5e5; color: #902c2c; }
.legal-page { background: #f3f7f8; }
.has-motion .legal-page > .motion-reveal { opacity: 1; transform: none; transition: none; }
.legal-hero { position: relative; overflow: hidden; padding: clamp(44px, 5vw, 64px) 0; background: linear-gradient(122deg, #0c3642 0%, var(--blue) 58%, #187f95 100%); color: white; }
.legal-hero::before, .legal-hero::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; pointer-events: none; }
.legal-hero::before { width: 440px; height: 440px; top: -280px; right: 7%; }
.legal-hero::after { width: 280px; height: 280px; right: -90px; bottom: -190px; }
.legal-hero__inner { position: relative; z-index: 1; }
.legal-hero__eyebrow { display: block; margin-bottom: 10px; color: var(--yellow); font-size: 12px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.legal-hero h1 { max-width: 900px; margin: 0; color: white; font-family: inherit; font-size: clamp(2rem, 3.4vw, 3rem); font-style: normal; font-weight: 760; line-height: 1.12; letter-spacing: -.025em; }
.legal-hero p { max-width: 720px; margin: 13px 0 0; color: rgba(255,255,255,.84); font-size: clamp(14px, 1.35vw, 16px); line-height: 1.6; }
.legal-hero__meta { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 21px; }
.legal-hero__meta span { padding: 7px 13px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.94); font-size: 12px; font-weight: 650; }
.legal-content { padding: clamp(50px, 7vw, 92px) 0 clamp(70px, 9vw, 120px); }
.legal-layout { display: grid; grid-template-columns: 245px minmax(0, 850px); justify-content: center; gap: clamp(30px, 5vw, 68px); align-items: start; }
.legal-navigation { position: sticky; top: 116px; overflow: hidden; border: 1px solid #dce7e9; border-top: 4px solid var(--yellow); border-radius: 18px 5px; background: white; box-shadow: 0 15px 35px rgba(24,66,76,.08); }
.legal-navigation > strong { display: block; padding: 20px 20px 14px; color: #243b42; font-size: 14px; }
.legal-navigation nav { display: grid; }
.legal-navigation nav a { position: relative; padding: 10px 30px 10px 20px; border-top: 1px solid #edf2f3; color: #617075; font-size: 12.5px; font-weight: 600; line-height: 1.35; transition: color .18s ease, background .18s ease, padding-left .18s ease; }
.legal-navigation nav a::after { content: "›"; position: absolute; top: 50%; right: 17px; color: #9aabad; font-size: 18px; transform: translateY(-52%); }
.legal-navigation nav a:hover { padding-left: 24px; background: #f5fafb; color: var(--blue); }
.legal-navigation nav a:focus-visible { outline: 3px solid var(--yellow); outline-offset: -3px; }
.legal-navigation__contact { display: grid; gap: 3px; margin: 12px; padding: 14px; border-radius: 11px 3px; background: var(--blue-light); }
.legal-navigation__contact span { color: #53686d; font-size: 10.5px; }
.legal-navigation__contact a { color: var(--blue); font-size: 12px; font-weight: 750; overflow-wrap: anywhere; }
.legal-copy, .legal-document { max-width: none; }
.legal-document { padding: clamp(30px, 4.5vw, 58px); border: 1px solid #dce7e9; border-radius: 28px 7px; background: white; box-shadow: 0 20px 55px rgba(24,66,76,.08); }
.legal-document > p:first-child { margin: 0 0 38px; padding: 18px 20px; border-left: 4px solid var(--blue); background: var(--blue-light); color: #40575d; }
.legal-copy h2 { position: relative; margin: 34px 0 11px; padding-left: 14px; color: #294149; font-family: inherit; font-size: clamp(1.05rem, 1.55vw, 1.22rem); font-style: normal; font-weight: 780; line-height: 1.35; scroll-margin-top: 125px; }
.legal-copy h2::before { content: ""; position: absolute; top: .15em; bottom: .15em; left: 0; width: 3px; border-radius: 3px; background: var(--yellow); }
.legal-copy h2:first-child { margin-top: 0; }
.legal-copy h3 { margin: 23px 0 7px; color: #3d5258; font-family: inherit; font-size: 15px; font-style: normal; font-weight: 750; }
.legal-copy ul { display: grid; gap: 9px; padding-left: 21px; }
.legal-copy p, .legal-copy li { color: #57676b; font-size: 14px; line-height: 1.72; }
.legal-address { margin-bottom: 20px; color: #57676b; font-size: 14px; font-style: normal; line-height: 1.72; }
.legal-copy strong { color: #34474c; }
.legal-copy a { color: var(--blue); font-weight: 650; text-decoration: underline; text-decoration-color: rgba(0,105,128,.3); text-underline-offset: 3px; }
.legal-copy a:hover { text-decoration-color: currentColor; }
.legal-copy code { padding: 2px 6px; border-radius: 4px; background: #edf4f5; color: #294e57; font-size: .9em; }

/* Remote support – aligned with the established manufacturer pages */
.remote-page { --brand-accent: var(--blue); --brand-dark: var(--blue-dark); --brand-soft: var(--blue-light); overflow: hidden; }
.remote-manufacturer-hero__image img { object-position: center; }
.remote-manufacturer-hero__image::after { background: linear-gradient(180deg, rgba(13,40,48,.03) 45%, rgba(13,40,48,.5)); }
.remote-official-module { position: absolute; z-index: 2; top: 28px; left: 30px; display: block; padding: 8px; border: 1px solid rgba(255,255,255,.65); border-radius: 8px; background: rgba(255,255,255,.94); box-shadow: 0 10px 28px rgba(18,52,61,.18); transition: transform .18s ease, box-shadow .18s ease; }
.remote-official-module:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(18,52,61,.24); }
.remote-official-module:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }
.remote-official-module img { width: 200px; height: 95px; display: block; object-fit: contain; }
.remote-hero-phone { min-height: 41px; display: inline-flex; align-items: center; gap: 7px; color: var(--blue); font-size: 13px; font-weight: 750; }
.remote-hero-phone:hover { text-decoration: underline; text-underline-offset: 3px; }
.remote-download-note { margin: 11px 0 0; color: var(--muted); font-size: 10.5px; }

.remote-process { background: linear-gradient(145deg, white, var(--blue-light)); }
.remote-step-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.remote-step-grid article { min-height: 285px; position: relative; padding: 31px 30px 29px; overflow: hidden; border: 1px solid #dce8eb; border-radius: 28px 7px; background: white; box-shadow: 0 14px 34px rgba(31,75,85,.1); }
.remote-step-grid article:nth-child(even) { border-radius: 6px 25px; }
.remote-step-grid article > span { position: absolute; top: 20px; right: 22px; color: #dff3f7; font-size: 44px; font-style: italic; font-weight: 850; line-height: 1; }
.remote-step-grid article > div { width: 49px; height: 49px; display: grid; place-items: center; margin-bottom: 25px; border-radius: 50%; background: var(--blue-light); color: var(--blue); }
.remote-step-grid h3 { color: var(--blue); }
.remote-step-grid p { margin: 0; color: #687276; font-size: 13.5px; }
.remote-step-grid a { color: var(--blue); font-weight: 750; }
.remote-process__action { margin-top: 30px; text-align: center; }

.remote-security { padding: var(--section-space) 0; background: white; }
.remote-security__layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(330px, .65fr); align-items: center; gap: clamp(48px, 7vw, 95px); }
.remote-security__copy h2 { color: var(--blue); }
.remote-security__copy > p { max-width: 720px; color: #596468; }
.remote-security__copy ul { display: grid; gap: 10px; margin: 25px 0 0; padding: 0; list-style: none; }
.remote-security__copy li { display: flex; align-items: flex-start; gap: 9px; color: #414b4e; font-size: 14px; }
.remote-security__copy li svg { flex: 0 0 auto; margin-top: 2px; color: var(--blue); }
.remote-security__copy .remote-source { margin-top: 26px; color: #788286; font-size: 11.5px; }
.remote-source a { color: var(--blue); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.remote-notice { padding: 34px 32px; border: 1px solid #d7e8ec; border-radius: 28px 7px; background: #f5fafb; box-shadow: 0 14px 34px rgba(31,75,85,.08); }
.remote-notice > span { width: 55px; height: 55px; display: grid; place-items: center; margin-bottom: 21px; border-radius: 50%; background: var(--yellow); color: #34383a; }
.remote-notice h3 { color: #3d4345; }
.remote-notice p { margin-bottom: 13px; color: #656d70; font-size: 13px; }
.remote-notice p:last-child { margin-bottom: 0; }
.remote-notice kbd { padding: 2px 5px; border: 1px solid #bdcdd1; border-radius: 4px; background: white; color: #434c4f; font-family: inherit; font-size: .85em; }
.remote-cta .section-kicker { color: var(--yellow); }
.remote-cta__actions { max-width: 520px; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.remote-livechat-button { border-color: white; background: white; color: var(--blue); }
.remote-livechat-button:hover { border-color: var(--yellow); background: var(--yellow); color: #303031; }
.remote-whatsapp-button { border-color: #25d366; background: #25d366; color: #123a21; }
.remote-whatsapp-button:hover { border-color: #1fbd5a; background: #1fbd5a; color: #0c2c18; }
.remote-chat-status { width: 100%; margin: 3px 0 0; color: rgba(255,255,255,.84); font-size: 11.5px; text-align: right; }

@media (max-width: 991px) {
    .remote-step-grid { grid-template-columns: 1fr; }
    .remote-step-grid article { min-height: 0; }
    .remote-security__layout { grid-template-columns: 1fr; }
    .remote-cta__actions { justify-content: flex-start; }
    .remote-chat-status { text-align: left; }
}

@media (max-width: 640px) {
    .remote-official-module { top: 16px; left: 16px; transform: scale(.78); transform-origin: top left; }
    .remote-cta__actions, .remote-cta__actions .button { width: 100%; }
}

/* Footer */
.footer-main { background: var(--blue); color: white; }
.footer-container { width: 100%; margin: 0 auto; padding: 80px 40px 40px; }
.footer-main h2 { margin-bottom: 15px; color: white; font-size: 20px; line-height: 24px; }
.footer-columns { display: none; }
.footer-columns strong { display: block; margin-bottom: 20px; font-size: 15px; font-weight: 700; line-height: 22.5px; }
.footer-columns a, .footer-columns button, .footer-mobile a, .footer-mobile button { display: block; margin: 0 0 10px; padding: 0; border: 0; background: transparent; color: white; font-size: 16px; font-weight: 600; line-height: 24px; cursor: pointer; }
.footer-columns a:hover, .footer-columns button:hover, .footer-mobile a:hover, .footer-mobile button:hover { color: var(--yellow); }
.footer-mobile details { color: white; }
.footer-mobile summary { width: calc(100% - 10px); height: 50px; display: flex; align-items: center; font-size: 16px; font-weight: 700; line-height: 24px; list-style: none; cursor: pointer; }
.footer-mobile summary::-webkit-details-marker { display: none; }
.footer-mobile summary span { width: 16px; height: 16px; position: relative; margin-left: 41px; }
.footer-mobile summary span::before { width: 10px; height: 10px; position: absolute; top: 1px; left: 3px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; content: ''; transform: rotate(45deg); transition: transform .18s ease, top .18s ease; }
.footer-mobile details[open] summary span::before { top: 5px; transform: rotate(225deg); }
.footer-mobile details > div { padding: 3px 0 12px 10px; }
.footer-bottom { min-height: 164px; background: white; font-size: 16px; line-height: 24px; }
.footer-bottom__inner { width: 100%; min-height: 164px; display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding-top: 40px; }
.footer-service { width: 83.333333%; height: 24px; display: flex; align-items: center; justify-content: space-between; }
.footer-service a { display: flex; align-items: center; flex: 0 0 auto; font-weight: 700; white-space: nowrap; }
.footer-service svg { flex: 0 0 24px; margin-right: 1px; fill: currentColor; }
.footer-service img { width: auto; height: 24px; margin-right: 1px; }
.social-links { width: min(52%, 210px); height: 52px; display: flex; align-self: center; align-items: center; justify-content: center; margin-top: 40px; padding: 0 12px; border-radius: 26px; background: var(--yellow); font-size: 18px; font-weight: 600; line-height: 27px; }
.social-links a { display: inline-flex; align-items: center; padding: 0 5px; }
.social-links img { width: auto; }
.social-links a:nth-child(1) img, .social-links a:nth-child(2) img { height: 24px; }
.social-links a:nth-child(3) img { height: 20px; }

@media (min-width: 768px) {
    .footer-container, .footer-bottom__inner { width: 91.666667%; }
    .footer-container { padding: 50px 0; }
    .footer-main h2 { margin-bottom: 30px; }
    .footer-columns { display: grid; grid-template-columns: repeat(4, 1fr); }
    .footer-columns strong { margin-bottom: 15px; }
    .footer-mobile { display: none; }
    .footer-bottom { min-height: 60px; }
    .footer-bottom__inner { min-height: 60px; flex-direction: row; align-items: stretch; justify-content: space-between; padding-top: 0; }
    .footer-service { width: 41.666667%; height: 60px; }
    .social-links { width: min(22%, 210px); height: 52px; margin-top: 0; }
}

@media (min-width: 992px) {
    .footer-service { justify-content: flex-start; gap: 18px; }
}

@media (min-width: 1200px) {
    .footer-container, .footer-bottom__inner { width: 66.666667%; }
    .footer-container { padding-top: 65px; padding-bottom: 65px; }
    .footer-main h2 { margin-bottom: 35px; }
}

@media (min-width: 1400px) {
    .footer-container { padding-top: 80px; padding-bottom: 80px; }
    .footer-main h2 { margin-bottom: 40px; }
    .footer-columns strong { margin-bottom: 20px; }
}

@media (min-width: 1600px) {
    .footer-container, .footer-bottom__inner { width: 58.333333%; }
    .footer-container { padding-top: 100px; padding-bottom: 100px; }
    .footer-main h2 { margin-bottom: 50px; font-size: 25px; line-height: 30px; }
    .footer-columns strong { margin-bottom: 25px; }
}

@media (min-width: 1920px) {
    .footer-container, .footer-bottom__inner { width: 50%; }
}

/* Dialogs */
.video-modal { position: fixed; z-index: 250; inset: 0; display: grid; place-items: center; padding: 24px; background: rgba(0,7,19,.78); }
.video-modal__dialog { width: min(1050px, 100%); max-height: calc(100vh - 48px); padding: 25px 30px 20px; overflow-y: auto; border-radius: var(--radius); background: white; box-shadow: 0 20px 60px rgba(0,0,0,.32); }
.video-modal__dialog--consent { width: min(650px, 100%); padding: 32px; }
.video-modal__head { min-height: 46px; display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; }
.video-modal__head h2 { margin: 0 0 18px; color: var(--blue); font-size: var(--heading-2-size); }
.video-modal__close { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; padding: 0; border: 0; background: none; color: var(--text); font-size: 35px; line-height: 1; cursor: pointer; }
.video-modal__frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #111; }
.video-modal__frame iframe, .video-modal__frame video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-modal__frame video { background: #111; object-fit: contain; }
.video-modal__dialog > p { margin: 13px 0 0; color: var(--muted); font-size: 12px; }
.video-consent-prompt > p { margin-bottom: 14px; color: var(--text); }
.video-consent-prompt strong { font-weight: 700; }
.video-consent-links { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 20px 0 24px; }
.video-consent-links a { color: var(--blue); font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.video-consent-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.search-overlay, .cookie-overlay { visibility: hidden; opacity: 0; position: fixed; z-index: 200; inset: 0; transition: opacity .2s; }
.search-overlay.is-open, .cookie-overlay.is-open { visibility: visible; opacity: 1; }
.search-backdrop, .cookie-overlay { background: rgba(0,0,0,.58); }
.search-backdrop { position: absolute; inset: 0; }
.search-dialog { position: absolute; top: 0; right: 0; width: min(600px, 100%); height: 100%; padding: 60px 45px; overflow-y: auto; background: white; border-radius: var(--radius-large) 0 0 var(--radius-large); transform: translateX(100%); transition: transform .25s; }
.search-overlay.is-open .search-dialog { transform: none; }
.dialog-close { position: absolute; top: 22px; right: 22px; border: 0; background: none; cursor: pointer; }
.search-dialog h2 { margin-bottom: 8px; color: var(--blue); }
.search-dialog > p { color: var(--muted); }
.search-input { height: 52px; display: flex; align-items: center; gap: 11px; margin-top: 24px; padding: 0 16px; border: 1px solid #adbdc1; border-radius: 999px; }
.search-input svg { color: var(--blue); }
.search-input input { width: 100%; border: 0; outline: 0; }
.search-input:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(8,117,143,.18); }
.search-input i { display: none; width: 18px; height: 18px; border: 2px solid #cbd7da; border-top-color: var(--blue); border-radius: 50%; animation: spin .7s linear infinite; }
.search-input.is-loading i { display: block; }
@keyframes spin { to { transform: rotate(360deg); } }
.search-results { margin-top: 22px; }
.search-results > p { color: var(--muted); font-size: 14px; }
.search-result { display: grid; grid-template-columns: 65px 1fr auto; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.search-result__image { width: 65px; height: 65px; padding: 5px; background: var(--light); }
.search-result__image img { width: 100%; height: 100%; object-fit: contain; }
.search-result > div:nth-child(2) { min-width: 0; display: grid; }
.search-result small { color: var(--muted); font-size: 11px; }
.search-result strong, .search-result span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-result strong { font-size: 14px; }
.search-result span { color: var(--muted); font-size: 12px; }
.search-result > svg { color: var(--blue); }
.cookie-overlay { display: grid; place-items: center; padding: 20px; }
.cookie-dialog { width: min(620px, 100%); max-height: calc(100vh - 40px); padding: 30px; overflow-y: auto; background: white; border-radius: var(--radius-large); }
.cookie-dialog__head { display: flex; justify-content: space-between; align-items: center; }
.cookie-dialog h2 { margin: 0; color: var(--blue); font-size: var(--heading-2-size); }
.cookie-dialog__head button { border: 0; background: none; cursor: pointer; }
.cookie-dialog > p { margin-top: 15px; color: var(--muted); }
.cookie-row { min-height: 65px; position: relative; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 8px; padding: 13px 15px; background: var(--light); border-radius: var(--radius-small); }
.cookie-row__copy { display: grid; }
.cookie-row span { color: var(--muted); font-size: 13px; }
.cookie-row small { color: var(--blue); font-weight: 700; }
.cookie-row input { width: 1px; height: 1px; position: absolute; right: 34px; opacity: 0; }
.cookie-row i { width: 44px; height: 24px; position: relative; flex: 0 0 auto; border-radius: 15px; background: #929fa2; cursor: pointer; }
.cookie-row i::after { width: 16px; height: 16px; position: absolute; top: 3px; left: 3px; border-radius: 50%; background: white; content: ''; transition: .15s; }
.cookie-row input:checked + i { background: var(--blue); }
.cookie-row input:checked + i::after { transform: translateX(22px); }
.cookie-row input:focus-visible + i { outline: 3px solid var(--blue); outline-offset: 3px; }
.cookie-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 20px; }

@media (min-width: 1440px) {
    .header-main__inner { --header-gutter: 40px; --controls-indent: 40px; }
    .main-nav__item > a, .main-nav__link { padding-right: clamp(16px, calc(1.25vw - 2px), 20px); padding-left: clamp(16px, calc(1.25vw - 2px), 20px); }
}

@media (min-width: 1241px) and (max-width: 1439px) {
    .header-desktop { margin-left: clamp(14px, 1.1vw, 20px); }
    .main-nav { flex: 1 1 auto; }
    .main-nav__item > a, .main-nav__link { padding-right: clamp(8px, calc(2.97vw - 29.38px), 14px); padding-left: clamp(8px, calc(2.97vw - 29.38px), 14px); }
    .header-controls { flex: 0 0 29.88vw; }
}

@media (min-width: 1440px) and (max-width: 1799px) {
    .header-desktop { margin-left: clamp(16px, 1.1vw, 20px); }
    .main-nav { flex: 1 1 auto; }
    .header-controls { flex: 0 0 min(494px, calc(61.14vw - 500.6px)); }
}

@media (min-width: 1600px) {
    .header-main__inner { --header-gutter: 50px; --controls-indent: 50px; }
}

@media (max-width: 1799px) {
    .main-nav__toggle { display: none; }
    .installer-overview { grid-template-rows: 410px 485px; }
    .installer-intro { padding-right: 55px; padding-left: 55px; }
    .installer-intro > p:not(.installer-eyebrow) { font-size: 14px; }
    .installer-benefits { padding-right: 55px; padding-left: 55px; }
    .installer-video-card__copy { padding-right: 42px; padding-left: 42px; }
}

@media (min-width: 1800px) {
    .main-nav__item > a, .main-nav__link { font-size: 20px; }
    .catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 1800px) and (max-width: 1919px) {
    .header-desktop { margin-left: 20px; }
    .main-nav { flex: 0 1 947.046875px; }
    .header-controls { flex: 0 1 493.921875px; }
}

@media (min-width: 1920px) {
    .header-main__inner { --header-gutter: 50px; --controls-indent: 100px; }
    .site-logo { width: 290px; margin-right: calc(25vw - 340px); }
    .site-header.is-scrolled .site-logo { width: 180px; margin-right: calc(25vw - 230px); }
    .main-nav { flex: 1 1 auto; }
    .main-nav__item > a, .main-nav__link { padding-right: clamp(18px, calc(4.1667vw - 62px), 20px); padding-left: clamp(18px, calc(4.1667vw - 62px), 20px); }
    .header-controls { flex: 0 0 527.65625px; }
}

@media (max-width: 1240px) {
    .header-main, .site-header.is-scrolled .header-main { height: 82px; }
    .has-site-breadcrumbs .header-main, .has-site-breadcrumbs .site-header.is-scrolled .header-main { height: 108px; }
    .has-site-breadcrumbs .header-main__inner { padding-bottom: 26px; }
    .site-breadcrumb-bar { left: 0; }
    .site-breadcrumbs { width: calc(100% - 40px); margin: 0 auto; }
    .header-main__inner { padding-right: 20px; padding-left: 20px; }
    .header-desktop { display: none; }
    .site-logo, .site-header.is-scrolled .site-logo { width: 205px; margin-right: 20px; margin-left: 0; }
    .header-actions { display: flex; }
    .mobile-toggle { display: grid; }
}

@media (max-width: 1120px) {
    .main-nav { display: none; }
    .home-slide__teaser p:last-child { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 5; }
    .news-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .manufacturer-section--home .manufacturer-row { display: flex; gap: 42px; overflow-x: auto; scrollbar-width: none; }
    .manufacturer-section--home .manufacturer-row a { min-width: var(--home-logo-width); flex-basis: var(--home-logo-width); }
    .about-gallery figure { min-width: 50%; flex-basis: 50%; }
    .catalog-grid { grid-template-columns: repeat(2, 1fr); }
    .installer-overview { min-height: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
    .installer-benefits, .installer-intro, .installer-intro-image, .installer-training-teaser, .installer-video-card { grid-column: auto; grid-row: auto; }
    .installer-benefits { min-height: 520px; }
    .installer-intro { min-height: 520px; padding: 0 45px 40px; }
    .installer-intro-image { min-height: 330px; }
    .installer-training-teaser { min-height: 430px; }
    .installer-video-card { min-height: 430px; }
    .installer-training__events { padding-right: 55px; padding-left: 55px; }
    .installer-training__intro { padding-right: 55px; padding-left: 55px; }
    .training-event__toggle { grid-template-columns: 1fr 26px; }
    .training-event__date, .training-event__title { grid-column: 1; }
    .training-event__chevron { grid-column: 2; grid-row: 1 / 3; }
    .training-event__facts { grid-template-columns: 1fr; }
}

@media (max-width: 991px) {
    .legal-layout { grid-template-columns: 1fr; }
    .legal-navigation { position: static; }
    .legal-navigation nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .legal-navigation nav a:nth-child(2) { border-top-color: #edf2f3; }
    .legal-navigation__contact { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
    .system-hero { min-height: 0; grid-template-columns: 42% 58%; }
    .system-hero__media { min-height: 550px; }
    .system-hero__copy { padding: 42px 35px; }
    .system-application-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .system-topic-links__grid, .system-flow__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .system-selection__grid, .system-panels__grid { grid-template-columns: 1fr; }
    .system-selection__grid article { min-height: 0; }
    .system-panels__grid article { min-height: 0; }
    .system-grade__details, .system-faq__layout { grid-template-columns: 1fr; }
    .system-grade__practical { grid-template-columns: 1fr; }
    .system-detail__layout { grid-template-columns: 1fr; }
    .system-detail__media { width: min(820px, 100%); }
    .system-faq__heading { position: static; }
    .system-faq__heading p { max-width: 680px; }
    .system-service__grid { grid-template-columns: 1fr; }
    .system-service article { padding: 16px 0; }
    .system-service article + article { border-top: 1px solid #dfe8ea; border-left: 0; }
    .sector-hero { min-height: 0; grid-template-columns: 42% 58%; }
    .sector-hero__media { min-height: 540px; }
    .sector-hero__copy { padding: 42px 35px; }
    .sector-benefit { padding-right: 20px; padding-left: 20px; }
    .sector-card-grid, .sector-card-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sector-usecases__layout { grid-template-columns: 1fr; gap: 35px; }
    .sector-usecases__intro p { max-width: 700px; }
    .manufacturer-page .manufacturer-hero { min-height: 0; grid-template-columns: 42% 58%; }
    .manufacturer-hero__image { min-height: 520px; }
    .manufacturer-hero__copy { max-width: none; padding: 42px 35px; }
    .manufacturer-system-card__image { height: 235px; }
    .manufacturer-page--optex .manufacturer-system-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .manufacturer-page--optex .manufacturer-system-card:nth-child(4) { grid-column: auto; }
    .catalog-layout { display: block; }
    .catalog-main { width: 100%; padding: 23px 30px 60px; }
    .catalog-status { min-height: 49px; align-items: flex-start; padding-left: 10px; }
    .catalog-status h1 { padding-top: 1px; font-size: var(--heading-2-size); }
    .catalog-status > div { flex-direction: row-reverse; }
    .catalog-status #catalogCount { display: inline-flex; }
    .catalog-filter-toggle { width: 34px; min-width: 34px; height: 32px; display: inline-flex; align-items: center; justify-content: center; gap: 0; padding: 0; border: 1px solid var(--secteo); border-radius: 17px; background: white; color: var(--blue); font-size: 0; cursor: pointer; }
    .catalog-filter-toggle svg { transition: transform .18s; }
    .catalog-filter-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
    .catalog-sidebar { display: none; padding: 25px 30px 28px; border-bottom: 1px solid var(--line); }
    .catalog-sidebar.is-open { display: flex; }
    .catalog-section--new .catalog-sidebar { display: grid; padding: 25px 30px 26px; }
    .catalog-section--new .catalog-main { padding-top: 24px; }
    .catalog-section--new .catalog-filter-toggle { display: none; }
    .catalog-search { width: min(330px, 100%); }
    .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    :root { --container: min(100% - 30px, 560px); }
    html { scroll-padding-top: 76px; }
    body { overflow-wrap: break-word; }
    .shell, .shell > *, .two-column > *, .copy-columns > *, .contact-layout > *, .system-cta__inner > *, .sector-cta__inner > *, .manufacturer-cta__inner > * { min-width: 0; }
    .button { max-width: 100%; height: auto; min-height: 44px; padding: 8px 22px; line-height: 1.3; text-align: center; white-space: normal; }
    .text-link, .system-cta__phone, .remote-hero-phone { max-width: 100%; }
    .legal-hero { padding: 39px 0 44px; }
    .legal-hero::before { width: 300px; height: 300px; top: -210px; right: -35px; }
    .legal-content { padding: 35px 0 70px; }
    .legal-layout { gap: 24px; }
    .legal-navigation nav { grid-template-columns: 1fr; }
    .legal-navigation__contact { display: grid; justify-content: stretch; }
    .legal-document { padding: 30px 22px 38px; border-radius: 20px 5px; }
    .legal-document > p:first-child { margin-bottom: 32px; padding: 16px; }
    .legal-copy h2 { margin-top: 31px; font-size: 1.08rem; }
    .legal-copy h3 { font-size: 15px; }
    .content-section, .light-section { padding: 55px 0; }
    .header-main { height: 72px; }
    .site-header.is-scrolled .header-main { height: 66px; }
    .has-site-breadcrumbs .header-main, .has-site-breadcrumbs .site-header.is-scrolled .header-main { height: 98px; }
    .site-logo { width: 146px; margin-right: 10px; }
    .site-header.is-scrolled .site-logo { width: 138px; }
    .header-actions .header-login span { display: none; }
    .mobile-nav__head { height: 72px; padding-right: 15px; padding-left: 15px; }
    .mobile-nav__head img { width: 148px; }
    .mobile-nav nav { padding-right: 25px; padding-left: 25px; }
    .home-slider { height: auto; min-height: 620px; }
    .home-slide { position: relative; inset: auto; display: none; grid-template-columns: 1fr; grid-template-rows: auto auto; opacity: 1; visibility: visible; }
    .home-slide.is-active { display: grid; }
    .home-slide > img { height: clamp(220px, 58vw, 260px); object-position: var(--slide-mobile-position, center); transform: none; }
    .home-slide__content { min-height: 400px; align-items: flex-start; padding: 28px 28px 66px; overflow: visible; }
    .home-slide__content > div { width: 100%; max-height: none; margin-top: 0; }
    .home-slide h2 { font-size: var(--home-display-size); }
    .home-slide p { font-size: var(--home-copy-size); }
    .home-slide__teaser p:last-child { display: block; overflow: visible; -webkit-line-clamp: unset; }
    .slider-arrow { display: none; }
    .slider-dots { left: 50%; bottom: 19px; }
    .news-archive-hero { padding: 50px 0 54px; }
    .news-archive-hero__inner { align-items: flex-start; flex-direction: column; gap: 28px; }
    .news-archive-hero__count { min-width: 0; }
    .news-archive-heading { align-items: flex-start; flex-direction: column; gap: 7px; }
    .news-list { gap: 21px; }
    .news-list__item--featured.has-image { display: flex; min-height: 0; border-radius: 28px 7px; }
    .news-list__item--featured .news-list__image { height: 250px; min-height: 0; }
    .news-list__item--featured .news-list__body { min-height: 0; justify-content: flex-start; padding: 29px 27px 31px; }
    .news-list__item--featured h2 { font-size: clamp(1.35rem, 7vw, 1.8rem); }
    .news-list__body { min-height: 0; }
    .solution-grid, .news-grid, .topic-grid, .topic-grid--three, .feature-grid, .api-news-grid, .training-grid, .application-grid { grid-template-columns: 1fr; }
    .solution-grid { gap: 0; }
    .solution-card { min-height: 0; padding: 19px 3px; }
    .solution-card + .solution-card { border-top: 1px solid rgba(255,255,255,.24); }
    .customer-story { grid-template-columns: 1fr; }
    .customer-story__image { min-height: clamp(225px, 62vw, 290px); }
    .customer-story__play { width: 52px; height: 52px; }
    .customer-story__copy { padding: 34px 24px 38px; }
    .partner-strip__inner { align-items: flex-start; flex-direction: column; gap: 20px; }
    .company-intro .two-column--wide > div:last-child { columns: 1; }
    .about-hero { min-height: 0; padding: 58px 0 64px; background-position: 58% center; }
    .about-hero::before { background: rgba(5, 78, 96, .92); }
    .about-hero__heading { margin-bottom: 24px; }
    .about-hero__columns { grid-template-columns: 1fr; gap: 8px; }
    .about-products, .about-company { padding-top: 55px; }
    .about-products { padding-bottom: 50px; }
    .about-company .about-section-copy { margin-bottom: 30px; }
    .about-gallery__track { height: 285px; }
    .about-gallery figure { min-width: 100%; flex-basis: 100%; }
    .about-gallery img { object-position: center; }
    .about-gallery__button { width: 44px; height: 58px; }
    .about-gallery__button--previous { left: 10px; }
    .about-gallery__button--next { right: 10px; }
    .manufacturer-section--home .shell { width: calc(100% - 30px); }
    .manufacturer-section--home .manufacturer-row { display: flex; gap: 28px; overflow-x: auto; scroll-padding-inline: 4px; scroll-snap-type: x proximity; scrollbar-width: none; }
    .manufacturer-section--home .manufacturer-row::-webkit-scrollbar { display: none; }
    .manufacturer-section--home .manufacturer-row a { scroll-snap-align: start; }
    .manufacturer-section--home .manufacturer-row a { min-width: var(--home-logo-width); flex-basis: var(--home-logo-width); }
    .finder-banner__inner, .section-title, .catalog-head { align-items: flex-start; flex-direction: column; }
    .two-column, .two-column--wide, .copy-columns, .contact-layout { grid-template-columns: 1fr; gap: 35px; }
    .manufacturer-row { display: flex; gap: 30px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
    .manufacturer-row::-webkit-scrollbar { display: none; }
    .manufacturer-row a { flex: 0 0 110px; }
    .manufacturer-page .manufacturer-hero { grid-template-columns: 1fr; }
    .system-hero { grid-template-columns: 1fr; }
    .system-hero__media { min-height: 270px; order: 1; clip-path: none; border-radius: 0 0 42px 0; }
    .system-hero__media > span { right: 22px; bottom: 18px; }
    .system-hero__copy { order: 2; padding: 35px 24px 46px; }
    .system-backlink { margin-bottom: 18px; }
    .system-anchor-nav { overflow-x: auto; scrollbar-width: none; }
    .system-anchor-nav::-webkit-scrollbar { display: none; }
    .system-anchor-nav .shell { width: max-content; min-width: 100%; justify-content: flex-start; gap: 26px; padding: 0 15px; }
    .system-topic-links__grid { grid-template-columns: 1fr; }
    .system-topic-links__grid > a { min-height: 72px; }
    .system-overview__layout, .system-components__layout { grid-template-columns: 1fr; gap: 35px; }
    .system-feature-panel { padding: 28px 24px 31px; }
    .system-application-grid { grid-template-columns: 1fr; }
    .system-application-grid article { min-height: 0; }
    .system-application-grid article.has-link { min-height: 0; }
    .system-grade__cards { grid-template-columns: 1fr; }
    .system-detail__media figure:first-child { height: 390px; }
    .system-detail__media figure:last-child { height: 290px; }
    .system-grade__details { padding: 25px 20px; }
    .system-grade__practical { padding: 18px; }
    .system-grade__practical figure { height: 300px; }
    .system-grade__process { grid-template-columns: 1fr; }
    .system-grade__note { grid-template-columns: 1fr; gap: 8px; }
    .system-components__heading p { max-width: none; }
    .system-cta__inner { align-items: flex-start; flex-direction: column; gap: 25px; }
    .system-cta .button-row { align-items: flex-start; flex-direction: column; }
    .sector-hero { grid-template-columns: 1fr; }
    .sector-hero__media { min-height: 270px; order: 1; clip-path: none; border-radius: 0 0 42px 0; }
    .sector-hero__copy { order: 2; padding: 38px 24px 48px; }
    .sector-hero__label { right: 22px; bottom: 18px; }
    .sector-hero__text p { font-size: 15px; }
    .sector-benefits { box-shadow: 0 10px 28px rgba(31,75,85,.07); }
    .sector-benefits__grid { grid-template-columns: 1fr; padding: 12px 0; }
    .sector-benefit { padding: 18px 5px; }
    .sector-benefit + .sector-benefit { border-top: 1px solid #e5ecee; border-left: 0; }
    .sector-systems { padding: var(--section-space) 0; }
    .sector-card-grid, .sector-card-grid--four { grid-template-columns: 1fr; }
    .sector-card, .sector-card:hover { transform: none; }
    .sector-card__image, .sector-card-grid--four .sector-card__image { height: 235px; }
    .sector-card__body, .sector-card-grid--four .sector-card__body { padding: 25px 24px 29px; }
    .sector-usecases__grid { grid-template-columns: 1fr; }
    .sector-usecases__grid article { min-height: 0; }
    .sector-cta__inner { align-items: flex-start; flex-direction: column; gap: 24px; }
    .manufacturer-hero__image { min-height: 260px; order: 1; clip-path: none; border-radius: 0 0 42px 0; }
    .manufacturer-hero__copy { order: 2; padding: 38px 24px 48px; }
    .manufacturer-hero__image-label { right: 22px; bottom: 18px; }
    .manufacturer-hero__meta { align-items: flex-start; flex-direction: column; gap: 4px; }
    .manufacturer-hero__meta > span:last-child { padding-left: 0; border-left: 0; }
    .manufacturer-hero p { font-size: 15px; }
    .manufacturer-system-grid { grid-template-columns: 1fr; }
    .manufacturer-page--ajax .manufacturer-system-grid { grid-template-columns: 1fr; }
    .manufacturer-page--optex .manufacturer-system-grid { grid-template-columns: 1fr; }
    .manufacturer-systems { padding: var(--section-space) 0; }
    .manufacturer-system-card { transform: none; }
    .manufacturer-system-card__body { padding: 25px 24px 29px; }
    .manufacturer-cta__inner { align-items: flex-start; flex-direction: column; gap: 24px; }
    .page-hero { padding: 30px 0 20px; }
    .link-card-grid { grid-template-columns: 1fr; }
    .company-facts div { grid-template-columns: 1fr; }
    .news-list { grid-template-columns: 1fr; }
    .news-list article > div { min-height: 0; }
    .news-detail-section { padding: 24px 0 42px; }
    .news-detail-layout { width: calc(100% - 24px); }
    .news-detail { padding: 36px 24px 44px; }
    .news-detail { border-radius: 26px 7px; }
    .news-detail__content { grid-template-areas: "body" "media"; grid-template-columns: 1fr; }
    .news-detail__body { padding: 23px 21px; border-radius: 7px 22px; }
    .news-detail__media { width: min(430px, 100%); margin: 0 auto; }
    .news-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .product-detail-loading, .product-detail-grid { grid-template-columns: 1fr; gap: 28px; }
    .product-main-image { height: clamp(290px, 88vw, 360px); }
    .product-video { margin-top: 58px; }
    .product-video__heading { align-items: flex-start; flex-direction: column; gap: 7px; margin-bottom: 18px; }
    .product-video__heading > p { max-width: none; }
    .video-consent { border-radius: 7px 28px; }
    .video-consent__overlay { padding: 16px; }
    .video-play { gap: 7px; font-size: 14px; }
    .video-play__icon { width: 55px; height: 55px; }
    .video-play__label { padding: 5px 10px; font-size: 12px; }
    .video-privacy { right: 13px; bottom: 10px; left: 13px; }
    .video-privacy small { display: none; }
    .technical-data { padding: 28px 22px 24px; border-radius: 22px 5px; }
    .technical-data::before { left: 22px; }
    .technical-data__heading { grid-template-columns: 1fr; gap: 8px; margin-bottom: 20px; padding-bottom: 18px; }
    .technical-data__heading p { max-width: 520px; }
    .technical-data__content > ul { grid-template-columns: 1fr; }
    .accessory-grid { grid-template-columns: repeat(2, 1fr); }
    .form-row { grid-template-columns: 1fr; gap: 0; }
    .contact-form { padding: clamp(22px, 7vw, 30px); border-radius: 24px; }
    .contact-details address > a > div, .contact-details address > div > div { min-width: 0; overflow-wrap: anywhere; }
    .search-dialog { padding: 60px 24px; }
    .video-modal { padding: 12px; }
    .video-modal__dialog { padding: 18px 16px 15px; }
    .video-modal__head h2 { font-size: var(--heading-2-size); }
    .video-modal__dialog--consent { padding: 24px 20px 20px; }
    .video-consent-actions { flex-direction: column-reverse; }
    .video-consent-actions .button { width: 100%; }
    .cookie-actions { flex-direction: column; }
    .site-breadcrumb-bar { height: 30px; }
    .site-breadcrumbs { width: calc(100% - 30px); gap: 7px; overflow-x: auto; font-size: 11px; scrollbar-width: none; }
    .site-breadcrumbs::-webkit-scrollbar { display: none; }
    .site-breadcrumbs a, .site-breadcrumbs > span:not(.site-breadcrumbs__separator) { overflow: visible; text-overflow: clip; }
    .has-site-breadcrumbs .page-hero { padding-top: 18px; }
    .has-site-breadcrumbs .installer-intro { padding-top: 28px; }
    .has-site-breadcrumbs .catalog-main { padding-top: 21px; }
    .catalog-section--new { padding-top: 22px; }
    .catalog-section--new .catalog-sidebar { grid-template-areas: "title" "intro" "groups"; grid-template-columns: 1fr; gap: 6px; }
    .catalog-section--new .catalog-primary-groups { margin-top: 12px; gap: 8px; }
    .catalog-section--new .catalog-primary-groups a { min-height: 32px; padding: 5px 13px; font-size: 12.5px; }
    .installer-overview { display: block; }
    .installer-benefits { min-height: 420px; padding: 58px 35px; }
    .installer-benefits > div { max-width: 350px; }
    .installer-benefits p { font-size: 15px; }
    .installer-intro { min-height: 0; padding: 0 30px 46px; }
    .installer-intro h1 { font-size: var(--heading-1-size); }
    .installer-intro-image { min-height: 270px; }
    .installer-brochure { min-width: 0; max-width: calc(100% - 30px); }
    .installer-training-teaser { min-height: 440px; padding: 45px 0; }
    .installer-training-teaser > span { width: calc(100% - 60px); }
    .installer-training-teaser strong { font-size: var(--heading-2-size); }
    .installer-video-card { min-height: 0; grid-template-rows: 260px auto; }
    .installer-video-card__copy { min-height: 280px; padding: 45px 35px; }
    .installer-training { display: block; }
    .installer-training__intro { min-height: 0; padding: 0 35px; }
    .installer-training__intro-inner { position: relative; top: auto; padding: 58px 0; }
    .installer-training__events { padding: 62px 30px 75px; }
    .installer-training__events > h2 { font-size: var(--heading-1-size); }
    .training-event__facts div { grid-template-columns: 105px 1fr; }
}

@media (max-width: 575px) {
    :root { --section-space: 48px; --section-space-compact: 42px; --section-heading-gap: 24px; }
    .content-section, .light-section { padding: 48px 0; }
    .lead { font-size: 16px; }
    .button-row { width: 100%; }
    .manufacturer-hero .button-row .button, .manufacturer-cta .button, .sector-hero .button-row .button, .sector-cta .button, .system-hero .button-row .button, .system-cta .button, .installer-more, .installer-brochure, .training-event__register { width: 100%; }
    .product-primary-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); align-items: stretch; }
    .product-primary-actions .button { width: 100%; }
    .manufacturer-hero .button-row, .sector-hero .button-row, .system-hero .button-row { align-items: stretch; flex-direction: column; }
    .system-related-links { align-items: flex-start; flex-direction: column; }
    .system-flow__grid { grid-template-columns: 1fr; }
    .system-flow__grid article { min-height: 0; }
    .system-detail__media { grid-template-columns: 1fr; }
    .system-detail__media figure:first-child, .system-detail__media figure:last-child { height: 260px; margin-bottom: 0; }
    .system-detail__copy ul { grid-template-columns: 1fr; }
    .system-detail__actions { align-items: flex-start; flex-direction: column; }
    .system-grade__facts, .system-grade__products ul { grid-template-columns: 1fr; }
    .system-grade__practical figure { height: 235px; }
    .system-grade__facts div { min-height: 90px; }
    .system-grade__products .button-row { align-items: flex-start; flex-direction: column; }
    .system-faq details p { margin-right: 0; }
    .system-faq summary { min-height: 62px; grid-template-columns: minmax(0, 1fr) 30px; gap: 12px; }
    .system-cta .button-row { width: 100%; align-items: stretch; }
    .system-cta__phone { min-height: 44px; align-items: center; }
    .news-related__head { align-items: flex-start; flex-direction: column; gap: 10px; }
    .news-related__grid { grid-template-columns: 1fr; }
    .catalog-main { padding: 23px 20px 55px; }
    .shop-back-button { width: 100%; margin-bottom: 18px; }
    .catalog-sidebar, .catalog-section--new .catalog-sidebar { padding-right: 20px; padding-left: 20px; }
    .catalog-status { min-height: 0; align-items: stretch; flex-direction: column; gap: 10px; margin-bottom: 18px; padding-left: 0; }
    .catalog-status h1 { min-width: 0; width: 100%; }
    .catalog-status > div { width: 100%; flex-direction: row; justify-content: space-between; }
    .catalog-status #catalogCount { max-width: 100%; white-space: normal; }
    .catalog-grid { grid-template-columns: 1fr; gap: 30px; }
    .catalog-card { min-height: 401px; border-radius: 0 0 36px 36px; }
    .catalog-card__image, .catalog-card.skeleton div { height: 270px; }
    .catalog-card__body { min-height: 131px; }
    .catalog-card__footer { border-radius: 0 0 36px 36px; }
    .accessory-grid { grid-template-columns: 1fr; }
    .technical-data { padding-right: 18px; padding-left: 18px; }
    .technical-data__content th, .technical-data__content td { min-width: 135px; padding: 12px 14px; }
    .company-facts div, .info-box, .link-card-grid > a, .feature-grid > div { padding: 22px 20px; }
    .installer-benefits { min-height: 0; padding: 48px 25px; }
    .installer-intro { padding-right: 20px; padding-left: 20px; }
    .installer-training-teaser > span { width: calc(100% - 40px); }
    .installer-video-card__copy, .installer-training__events { padding-right: 20px; padding-left: 20px; }
    .installer-training__intro { padding-right: 25px; padding-left: 25px; }
    .training-event__facts div { grid-template-columns: 1fr; gap: 2px; }
    .remote-notice { padding: 28px 23px; }
    .cookie-overlay { align-items: end; padding: 10px; }
    .cookie-dialog { width: 100%; max-height: calc(100svh - 20px); padding: 24px 20px; border-radius: 24px 24px 8px 8px; }
    .footer-bottom { min-height: 0; }
    .footer-bottom__inner { min-height: 0; padding: 28px 15px 24px; }
    .footer-service { width: 100%; height: auto; flex-wrap: wrap; justify-content: center; gap: 12px 20px; }
    .footer-service a { min-height: 44px; font-size: 14px; }
    .social-links { width: min(210px, 75%); margin-top: 22px; }
}

@media (max-width: 420px) {
    .header-main__inner { padding-right: 14px; padding-left: 14px; }
    .site-logo, .site-header.is-scrolled .site-logo { width: clamp(122px, 34vw, 136px); margin-right: 4px; }
    .header-actions { gap: 0; }
    .header-icon, .mobile-toggle { width: 36px; height: 40px; }
    .header-login { min-width: 36px; justify-content: center; padding-right: 6px; padding-left: 6px; }
    .mobile-nav__head { grid-template-columns: 44px minmax(0, 1fr) 44px; padding-right: 12px; padding-left: 12px; }
    .mobile-nav__head img { width: min(140px, 40vw); }
    .mobile-nav nav { padding-right: 20px; padding-left: 20px; }
    .home-slide__content { padding-right: 22px; padding-left: 22px; }
    .sector-hero__text p, .manufacturer-hero p { font-size: 14.5px; }
    .sector-hero__copy, .manufacturer-hero__copy, .system-hero__copy { padding-right: 20px; padding-left: 20px; }
    .news-detail { padding-right: 18px; padding-left: 18px; }
    .news-detail__body { padding: 21px 17px; }
    .catalog-primary-groups a, .catalog-subgroups a { min-height: 44px; display: inline-flex; align-items: center; }
    .contact-details address > a, .contact-details address > div { grid-template-columns: 42px minmax(0, 1fr); gap: 11px; }
    .contact-details address > * > span { width: 42px; height: 42px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
    .site-header.header-enter, .has-motion .motion-reveal, .home-slide__eyebrow, .home-slide h2, .home-slide p, .home-slide .button, .mobile-nav nav a { opacity: 1 !important; transform: none !important; }
}

/* Structured editorial pages */
.builder-page { color: var(--text); background: #fff; }
.builder-eyebrow { margin: 0 0 12px !important; color: var(--secteo) !important; font-size: 12px !important; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.builder-section { padding: clamp(62px, 7vw, 105px) 0; }
.builder-section--soft { background: #eef9fc; }
.builder-section-heading { max-width: 780px; margin-bottom: 38px; }
.builder-section-heading h2, .builder-text h2, .builder-image-text h2, .builder-faq h2, .builder-cta h2 { margin-bottom: 18px; font-size: var(--heading-2-size); }
.builder-narrow { max-width: 900px; }
.builder-narrow > p:not(.builder-eyebrow) { font-size: clamp(16px, 1.4vw, 18px); line-height: 1.75; }
.builder-hero { min-height: 610px; display: grid; grid-template-columns: minmax(0, 52%) minmax(0, 48%); background: #e5f7fb; }
.builder-hero__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(55px, 7vw, 110px) max(30px, calc((100vw - 1200px)/2)); padding-right: clamp(35px, 6vw, 95px); }
.builder-hero__copy h1 { margin: 0 0 24px; font-size: clamp(2.35rem, 4.2vw, 4.65rem); line-height: 1.02; }
.builder-hero__copy > p:not(.builder-eyebrow) { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.65; }
.builder-hero__copy .button-row { margin-top: 23px; }
.builder-hero__media { min-height: 480px; overflow: hidden; }
.builder-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.builder-hero--no-image { grid-template-columns: 1fr; min-height: 510px; }
.builder-hero--no-image .builder-hero__copy { width: min(1200px, calc(100% - 40px)); margin: 0 auto; padding-left: 0; padding-right: min(25%, 260px); }
.button--outline { border: 1px solid var(--blue); color: var(--blue); background: transparent; }
.builder-image-text { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(35px, 6vw, 85px); align-items: center; }
.builder-image-text > figure, .builder-image-placeholder { height: clamp(360px, 40vw, 560px); margin: 0; border-radius: 5px 58px 5px 5px; overflow: hidden; }
.builder-image-text--right > figure, .builder-image-text--right > .builder-image-placeholder { border-radius: 58px 5px 5px 5px; }
.builder-image-text img { width: 100%; height: 100%; object-fit: cover; }
.builder-image-placeholder { display: grid; place-items: center; background: linear-gradient(145deg,#d8f4fa,#f6fcfd); }
.builder-image-placeholder span { color: #92cedd; font-size: clamp(30px,6vw,72px); font-weight: 900; letter-spacing: .12em; }
.builder-image-text > div:not(.builder-image-placeholder) > p:not(.builder-eyebrow) { line-height: 1.72; }
.builder-image-text .button { margin-top: 18px; }
.builder-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.builder-card { position: relative; min-height: 260px; padding: 30px; border: 1px solid #dce9ec; border-radius: 5px 32px 5px 5px; color: inherit; background: #fff; box-shadow: 0 12px 35px #184d5b0d; text-decoration: none; transition: transform .18s,box-shadow .18s; }
.builder-card[href]:hover { transform: translateY(-5px); box-shadow: 0 20px 45px #184d5b19; }
.builder-card__number { display: block; margin-bottom: 28px; color: var(--secteo); font-size: 12px; font-weight: 900; letter-spacing: .12em; }
.builder-card h3 { font-size: 21px; }
.builder-card p { color: #536d73; }
.builder-card__link { display: block; margin-top: 18px; color: var(--blue); font-weight: 800; }
.builder-gallery__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.builder-gallery figure { margin: 0; overflow: hidden; border-radius: 5px 28px 5px 5px; background: #eef4f5; }
.builder-gallery img { width: 100%; height: 290px; object-fit: cover; }
.builder-gallery figcaption { padding: 12px 15px; color: #4e676d; font-size: 13px; }
.builder-quote { padding: clamp(65px,8vw,115px) 0; color: #fff; background: var(--blue); }
.builder-quote blockquote { max-width: 930px; margin: 0 auto; text-align: center; }
.builder-quote blockquote > p { max-width: none; margin: 0; color: #fff; font-size: clamp(1.7rem,3vw,3rem); font-style: italic; font-weight: 700; line-height: 1.28; }
.builder-quote footer { display: grid; gap: 3px; margin-top: 28px; }
.builder-quote footer span { color: #bce8f2; }
.builder-faq { display: grid; grid-template-columns: minmax(240px,.75fr) minmax(0,1.25fr); gap: clamp(35px,7vw,95px); }
.builder-faq > div:first-child { position: sticky; top: 130px; align-self: start; }
.builder-faq__items { display: grid; gap: 10px; }
.builder-faq details { border: 1px solid #d9e8eb; border-radius: 8px; background: #fff; }
.builder-faq summary { display: grid; grid-template-columns: 1fr 34px; align-items: center; min-height: 70px; padding: 15px 20px; color: var(--blue); cursor: pointer; font-weight: 800; list-style: none; }
.builder-faq summary::-webkit-details-marker { display: none; }
.builder-faq summary span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: var(--secteo); font-size: 20px; }
.builder-faq details[open] summary span { transform: rotate(45deg); }
.builder-faq details > div { padding: 0 20px 18px; color: #536d73; }
.builder-cta { padding: clamp(55px,7vw,90px) 0; color: #fff; background: #154f5e; }
.builder-cta__inner { display: flex; justify-content: space-between; gap: 35px; align-items: center; }
.builder-cta h2 { margin-bottom: 10px; color: #fff; }
.builder-cta p { color: #d2ebf0; }
.builder-cta .builder-eyebrow { color: #64d1ed !important; }
.builder-preview-bar { position: sticky; z-index: 8; top: 0; display: flex; justify-content: center; gap: 14px; align-items: center; padding: 10px 18px; color: #172f36; background: #f3ca20; font: 14px/1.4 system-ui,sans-serif; }
.builder-preview-bar a { margin-left: 12px; color: inherit; font-weight: 800; }
@media (max-width:900px) { .builder-hero { grid-template-columns: 1fr; min-height: 0; } .builder-hero__copy { order: 2; padding: 55px 30px 65px; } .builder-hero__media { order: 1; min-height: 380px; max-height: 480px; } .builder-hero--no-image .builder-hero__copy { width: min(100% - 50px,760px); padding: 65px 0; } .builder-image-text,.builder-faq { grid-template-columns: 1fr; } .builder-image-text > figure,.builder-image-placeholder { height: 420px; } .builder-faq > div:first-child { position: static; } .builder-card-grid,.builder-gallery__grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:620px) { .builder-section { padding: 52px 0; } .builder-hero__copy { padding: 42px 22px 52px; } .builder-hero__media { min-height: 280px; } .builder-hero--no-image .builder-hero__copy { width: calc(100% - 40px); padding: 52px 0; } .builder-image-text > figure,.builder-image-placeholder { height: 300px; } .builder-card-grid,.builder-gallery__grid { grid-template-columns: 1fr; } .builder-card { min-height: 0; } .builder-gallery img { height: 270px; } .builder-cta__inner { align-items: flex-start; flex-direction: column; } .builder-preview-bar { align-items: flex-start; flex-direction: column; gap: 2px; } .builder-preview-bar a { margin-left: 0; } }

/* Builder design system: safe combinations editable without CSS knowledge. */
.builder-page {
    --builder-accent: #1396b9;
    --builder-deep: #1c788f;
    --builder-soft: #e5f7fc;
    --builder-highlight: #ffd300;
    --builder-radius: 5px 34px 5px 5px;
    --builder-section-space: clamp(62px,7vw,105px);
}
.builder-palette--ocean { --builder-accent:#168db9; --builder-deep:#164f72; --builder-soft:#e8f5fb; --builder-highlight:#f1c928; }
.builder-palette--navy { --builder-accent:#4ba9ca; --builder-deep:#17334d; --builder-soft:#edf3f8; --builder-highlight:#f3ca20; }
.builder-palette--fresh { --builder-accent:#35a989; --builder-deep:#175e57; --builder-soft:#e9f8f3; --builder-highlight:#f1cf38; }
.builder-palette--warm { --builder-accent:#d86e43; --builder-deep:#713b34; --builder-soft:#fff2e9; --builder-highlight:#f4c33d; }
.builder-shape--classic { --builder-radius:4px; }
.builder-shape--soft { --builder-radius:18px; }
.builder-shape--dynamic { --builder-radius:5px 44px 5px 5px; }
.builder-density--compact { --builder-section-space:clamp(44px,5vw,72px); }
.builder-density--generous { --builder-section-space:clamp(78px,9vw,135px); }
.builder-page .builder-eyebrow { color:var(--builder-accent)!important; }
.builder-page .button--blue { background:var(--builder-deep); }
.builder-page .button--yellow { background:var(--builder-highlight); }
.builder-block { position:relative; }
.builder-section,.builder-benefits,.builder-quote,.builder-cta { padding-top:var(--builder-section-space); padding-bottom:var(--builder-section-space); }
.builder-space--compact { padding-top:clamp(28px,4vw,52px)!important; padding-bottom:clamp(28px,4vw,52px)!important; }
.builder-space--large { padding-top:clamp(90px,10vw,145px)!important; padding-bottom:clamp(90px,10vw,145px)!important; }
.builder-bg--white { background:#fff; }
.builder-bg--soft { background:var(--builder-soft); }
.builder-bg--accent { background:color-mix(in srgb,var(--builder-accent) 16%,#fff); }
.builder-bg--dark { color:#fff; background:var(--builder-deep); }
.builder-bg--dark h1,.builder-bg--dark h2,.builder-bg--dark h3,.builder-bg--dark p { color:#fff; }
.builder-shape--classic .builder-card,.builder-shape--classic .builder-gallery figure,.builder-shape--classic .builder-image-text > figure { border-radius:4px; }
.builder-shape--soft .builder-card,.builder-shape--soft .builder-gallery figure,.builder-shape--soft .builder-image-text > figure { border-radius:var(--builder-radius); }

.builder-hero--system { min-height:min(780px,82vh); grid-template-columns:minmax(0,47%) minmax(0,53%); background:linear-gradient(130deg,var(--builder-soft),#fff); }
.builder-hero--system .builder-hero__copy { position:relative; z-index:1; }
.builder-hero--system .builder-hero__copy::before { content:''; position:absolute; z-index:-1; width:170px; height:170px; top:8%; left:5%; border:35px solid color-mix(in srgb,var(--builder-accent) 14%,transparent); border-radius:50%; }
.builder-hero--system .builder-hero__media { clip-path:polygon(9% 0,100% 0,100% 100%,0 100%); }
.builder-hero--background { min-height:min(780px,84vh); grid-template-columns:1fr; color:#fff; background-image:linear-gradient(90deg,rgba(10,42,53,.91),rgba(10,42,53,.28)),var(--builder-hero-image); background-size:cover; background-position:center; }
.builder-hero--background .builder-hero__copy { width:min(1200px,calc(100% - 40px)); margin:auto; padding-right:min(42%,520px); padding-left:0; }
.builder-hero--background h1,.builder-hero--background p { color:#fff; }
.builder-hero--background .builder-eyebrow { color:#9eeaff!important; }
.builder-hero--simple { min-height:0; grid-template-columns:1fr; text-align:center; }
.builder-hero--simple .builder-hero__copy { width:min(920px,calc(100% - 40px)); margin:auto; padding-right:0; padding-left:0; align-items:center; }

.builder-anchor-nav { position:sticky; z-index:6; top:var(--header-height,90px); padding:0!important; border-bottom:1px solid #d5e5e8; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }
.builder-anchor-nav .shell { min-height:66px; display:flex; gap:8px 26px; align-items:center; overflow-x:auto; }
.builder-anchor-nav a { color:var(--builder-deep); font-size:14px; font-weight:800; text-decoration:none; white-space:nowrap; }
.builder-anchor-nav a:hover { color:var(--builder-accent); }
.builder-topic-links { padding-top:clamp(28px,4vw,48px); padding-bottom:clamp(28px,4vw,48px); }
.builder-topic-links > .shell { display:grid; grid-template-columns:minmax(150px,.24fr) minmax(0,1fr); gap:28px; align-items:center; }
.builder-topic-links__heading .builder-eyebrow { margin:0!important; }
.builder-topic-links__heading h2 { margin:5px 0 0; font-size:clamp(1.2rem,2vw,1.65rem); }
.builder-topic-links__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.builder-topic-links__grid > * { min-width:0; display:grid; grid-template-columns:42px minmax(0,1fr) 22px; gap:12px; align-items:center; min-height:88px; padding:15px 16px; border:1px solid #dce8eb; border-radius:5px 20px 5px 5px; color:inherit; background:#fff; box-shadow:0 7px 20px #184d5b0d; text-decoration:none; }
.builder-topic-links__grid > a { transition:transform .18s,border-color .18s,box-shadow .18s; }
.builder-topic-links__grid > a:hover { border-color:var(--builder-accent); box-shadow:0 13px 30px #184d5b1c; transform:translateY(-3px); }
.builder-topic-links__icon { width:40px; height:40px; display:grid; place-items:center; border-radius:12px 4px; color:#fff; background:var(--builder-accent); }
.builder-topic-links__icon svg { width:23px; height:23px; }
.builder-topic-links__grid strong,.builder-topic-links__grid small { display:block; }
.builder-topic-links__grid strong { color:var(--builder-deep); font-size:15px; }
.builder-topic-links__grid small { margin-top:3px; color:#60757b; font-size:12px; line-height:1.35; }
.builder-topic-links__arrow { color:var(--builder-accent); font-size:20px; font-weight:800; }
.builder-benefits__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:color-mix(in srgb,var(--builder-deep) 15%,transparent); }
.builder-benefits__grid article { min-height:180px; display:grid; grid-template-columns:54px 1fr; gap:18px; padding:34px; background:inherit; background-color:#fff; }
.builder-benefits__grid article > span,.builder-steps__grid article > span { color:var(--builder-accent); font-size:12px; font-weight:900; letter-spacing:.14em; }
.builder-benefits__grid h3 { margin-bottom:9px; font-size:21px; }
.builder-align--center { text-align:center; }
.builder-align--center .shell,.builder-align--center p { margin-right:auto; margin-left:auto; }
.builder-width--narrow { max-width:900px; }
.builder-card-grid--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.builder-card { padding:0; border-radius:var(--builder-radius); overflow:hidden; }
.builder-card__body { padding:30px; }
.builder-card__image { height:230px; overflow:hidden; }
.builder-card__image img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.builder-card:hover .builder-card__image img { transform:scale(1.035); }
.builder-cards--minimal .builder-card { min-height:0; border:0; border-top:3px solid var(--builder-accent); border-radius:0; box-shadow:none; }
.builder-cards--minimal .builder-card__number,.builder-cards--image .builder-card__number { display:none; }
.builder-cards--image .builder-card:not(:has(.builder-card__image)) { border-top:6px solid var(--builder-accent); }
.builder-steps__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; counter-reset:steps; }
.builder-steps__grid article { position:relative; min-height:245px; padding:32px; border-radius:var(--builder-radius); background:var(--builder-soft); }
.builder-steps__grid article:not(:last-child)::after { content:'→'; position:absolute; z-index:2; top:50%; right:-26px; width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--builder-accent); transform:translateY(-50%); }
.builder-steps__grid h3 { margin-top:35px; font-size:21px; }
.builder-gallery figure,.builder-faq details { border-radius:var(--builder-radius); }
.builder-quote { background:var(--builder-deep); }
.builder-cta--gradient { background:linear-gradient(120deg,var(--builder-deep),var(--builder-accent)); }
.builder-cta--solid { background:var(--builder-deep); }
.builder-cta--soft { color:var(--builder-deep); background:var(--builder-soft); }
.builder-cta--soft h2,.builder-cta--soft p { color:var(--builder-deep); }
.builder-cta--soft .builder-eyebrow { color:var(--builder-accent)!important; }
@media (max-width:900px) {
    .builder-hero--system { grid-template-columns:1fr; }
    .builder-hero--system .builder-hero__media { clip-path:none; }
    .builder-hero--background .builder-hero__copy { padding-right:15%; }
    .builder-benefits__grid,.builder-card-grid--2,.builder-steps__grid { grid-template-columns:1fr 1fr; }
    .builder-steps__grid article::after { display:none!important; }
}
@media (max-width:620px) {
    .builder-anchor-nav { top:var(--header-height-mobile,72px); }
    .builder-hero--background .builder-hero__copy { padding-right:0; }
    .builder-benefits__grid,.builder-card-grid--2,.builder-steps__grid { grid-template-columns:1fr; }
    .builder-benefits__grid article { grid-template-columns:40px 1fr; padding:26px 20px; }
    .builder-card__image { height:210px; }
}

/* Expanded builder blocks modeled after the manufacturer and system pages. */
.builder-hero__kicker { display:flex; gap:10px; align-items:center; margin-bottom:12px; }
.builder-hero__kicker .builder-eyebrow { margin:0!important; }
.builder-hero__meta { padding-left:10px; border-left:1px solid color-mix(in srgb,var(--builder-accent) 40%,transparent); color:#65797e; font-size:11px; font-weight:650; }
.builder-hero__copy > h2 { margin:-13px 0 20px; color:#303738; font-size:clamp(1.15rem,1.6vw,1.45rem); font-style:normal; font-weight:500; }
.builder-hero__text p { margin-bottom:12px; }
.builder-hero__badge { width:max-content; max-width:100%; display:flex; gap:9px; align-items:center; margin:0 0 20px; padding:7px 15px 7px 8px; border:1px solid color-mix(in srgb,var(--builder-accent) 40%,white); border-radius:999px; background:#fff; box-shadow:0 5px 18px #153f4912; }
.builder-hero__badge > svg { width:35px; height:35px; padding:7px; border-radius:50%; color:#fff; background:var(--builder-accent); }
.builder-hero__badge > span { display:grid; }
.builder-hero__badge small { color:#6c8085; font-size:8px; font-weight:900; letter-spacing:.16em; }
.builder-hero__badge strong { color:#172d33; font-size:13px; }
.builder-hero__image-label { position:absolute; z-index:2; right:9%; bottom:30px; padding:7px 13px; border:1px solid #ffffffa8; border-radius:18px; color:#fff; background:#102d356b; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; backdrop-filter:blur(5px); }
.builder-hero__media { position:relative; }
.builder-hero--manufacturer { min-height:585px; grid-template-columns:minmax(0,50%) minmax(0,50%); background:var(--builder-soft); }
.builder-hero--manufacturer .builder-hero__copy { grid-column:2; padding:clamp(45px,5vw,85px) clamp(42px,5.2vw,92px); background:radial-gradient(circle at 85% 15%,#ffffffd1,transparent 42%); }
.builder-hero--manufacturer .builder-hero__copy h1 { margin-bottom:18px; color:var(--builder-accent); font-size:clamp(2.1rem,3.5vw,4rem); font-style:italic; }
.builder-hero--manufacturer .builder-hero__media { grid-column:1; grid-row:1; clip-path:polygon(0 0,100% 0,93% 100%,0 100%); }
.builder-hero--manufacturer.builder-hero--no-image .builder-hero__copy { grid-column:1/-1; width:min(1200px,calc(100% - 40px)); margin:auto; }
.builder-section-heading--center { margin-right:auto; margin-left:auto; text-align:center; }
.builder-section-heading--center p { margin-right:auto; margin-left:auto; }
.button--text { padding-right:6px; padding-left:6px; color:var(--builder-accent); background:transparent; }

.builder-checklist__items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 28px; margin:0; padding:0; list-style:none; }
.builder-checklist__items--1 { grid-template-columns:1fr; }
.builder-checklist__items li { display:grid; grid-template-columns:28px 1fr; gap:10px; align-items:start; color:#405960; line-height:1.55; }
.builder-checklist__items svg,.builder-system-card li svg { width:22px; height:22px; padding:3px; border-radius:50%; color:#fff; background:var(--builder-accent); }
.builder-feature-panel__layout { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr); gap:clamp(35px,7vw,95px); align-items:center; }
.builder-feature-panel__layout--left { grid-template-columns:minmax(320px,.72fr) minmax(0,1.08fr); }
.builder-feature-panel__copy > p:not(.builder-eyebrow) { font-size:clamp(16px,1.3vw,18px); line-height:1.72; }
.builder-feature-panel__box { padding:clamp(27px,4vw,43px); border-radius:5px 36px 5px 5px; color:#fff; background:var(--builder-deep); box-shadow:0 17px 45px #183f4930; }
.builder-feature-panel__box h3 { margin-bottom:22px; color:#fff; font-size:clamp(1.25rem,2vw,1.7rem); }
.builder-feature-panel__box ul { display:grid; gap:13px; margin:0 0 25px; padding:0; list-style:none; }
.builder-feature-panel__box li { display:grid; grid-template-columns:24px 1fr; gap:10px; align-items:start; color:#fff; }
.builder-feature-panel__box li svg { width:21px; height:21px; padding:3px; border-radius:50%; color:var(--builder-deep); background:var(--builder-highlight); }
.builder-feature-panel__box .button { margin-top:4px; }
.builder-system-cards__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.builder-system-cards__grid--3 { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.builder-system-card { min-width:0; position:relative; display:flex; flex-direction:column; border:1px solid color-mix(in srgb,var(--builder-accent) 15%,white); border-radius:28px 7px; background:#fff; box-shadow:0 14px 34px #1f4b551f; overflow:hidden; }
.builder-system-card__image,.builder-system-card__placeholder { height:255px; display:grid; place-items:center; color:#7b969d; background:linear-gradient(145deg,#deeff3,#f8fcfd); font-size:13px; font-weight:800; }
.builder-system-card__image img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.builder-system-card:hover .builder-system-card__image img { transform:scale(1.025); }
.builder-system-card__body { position:relative; display:flex; flex:1; flex-direction:column; padding:27px 32px 31px; }
.builder-system-card__number { position:absolute; top:22px; right:30px; color:color-mix(in srgb,var(--builder-accent) 18%,white); font-size:38px; font-style:italic; font-weight:850; }
.builder-system-card h3 { max-width:80%; margin-bottom:8px; color:var(--builder-accent); font-size:26px; font-style:italic; }
.builder-system-card__kicker { margin:0 0 16px; color:#61757a; font-size:10px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.builder-system-card ul { display:grid; gap:10px; margin:0 0 23px; padding:0; list-style:none; }
.builder-system-card li { display:grid; grid-template-columns:18px 1fr; gap:8px; align-items:start; color:#465d63; font-size:14px; }
.builder-system-card li svg { width:17px; height:17px; padding:2px; color:var(--builder-accent); background:transparent; }
.builder-system-card .button-row { margin-top:auto; }
.builder-icon-grid__items { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.builder-icon-grid__items--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.builder-icon-grid__items--4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.builder-icon-grid__items article { padding:27px; border:1px solid #dce9ec; border-radius:var(--builder-radius); background:#fff; box-shadow:0 10px 30px #184d5b0d; }
.builder-icon-grid__icon { width:54px; height:54px; display:grid; place-items:center; margin-bottom:21px; border-radius:15px; color:#fff; background:var(--builder-accent); }
.builder-icon-grid__icon svg { width:30px; height:30px; }
.builder-icon-grid h3 { font-size:20px; }
.builder-icon-grid article p { color:#536d73; }
.builder-icon-grid .button { margin-top:8px; }
.builder-stats__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:#ffffff2b; }
.builder-stats__grid article { min-height:220px; padding:34px; background:color-mix(in srgb,var(--builder-deep) 92%,#000); }
.builder-stats__grid strong { display:block; color:#fff; font-size:clamp(2.5rem,5vw,4.8rem); line-height:1; }
.builder-stats__grid h3 { margin:14px 0 8px; color:#fff; font-size:18px; }
.builder-stats__grid p { color:#d2e8ed; font-size:14px; }
.builder-logo-strip h2 { margin-bottom:32px; text-align:center; }
.builder-logo-strip__items { display:flex; flex-wrap:wrap; gap:20px 42px; justify-content:center; align-items:center; }
.builder-logo-strip__items > * { width:170px; height:85px; display:grid; place-items:center; padding:15px; border:1px solid #dce8eb; border-radius:14px; background:#fff; }
.builder-logo-strip img { max-width:100%; max-height:100%; object-fit:contain; }
.builder-page .builder-logo-strip--original { min-height:130px; display:flex; align-items:center; padding:24px 0!important; background:linear-gradient(90deg,rgba(19,150,185,0),var(--builder-accent) 13%,var(--builder-accent) 87%,rgba(19,150,185,0))!important; }
.builder-page .builder-logo-strip--original .shell { width:min(1340px,calc(100% - 70px)); overflow:hidden; }
.builder-page .builder-logo-strip--original .builder-logo-strip__items { flex-wrap:nowrap; justify-content:space-between; gap:clamp(18px,1.5vw,28px); }
.builder-page .builder-logo-strip--original .builder-logo-strip__items > * { --home-logo-width:clamp(120px,10.9vw,145px); width:var(--home-logo-width); min-width:var(--home-logo-width); height:82px; flex:0 0 var(--home-logo-width); padding:0; border:0; border-radius:0; background:transparent; }
.builder-page .builder-logo-strip--original .builder-logo-strip__items > [data-home-brand="jablotron"],.builder-page .builder-logo-strip--original .builder-logo-strip__items > [data-home-brand="ajax"],.builder-page .builder-logo-strip--original .builder-logo-strip__items > [data-home-brand="optex"] { --home-logo-width:clamp(132px,12vw,160px); }
.builder-page .builder-logo-strip--original .builder-logo-strip__items > [data-home-brand="grundig"] { --home-logo-width:clamp(136px,12.4vw,165px); }
.builder-page .builder-logo-strip--original .builder-logo-strip__items > [data-home-brand="reconeyez"] { --home-logo-width:clamp(86px,7.9vw,105px); }
.builder-page .builder-logo-strip--original .builder-logo-strip__items img { width:100%; max-width:100%; max-height:72px; }
.builder-page .builder-logo-strip--original .builder-logo-strip__items > [data-home-brand="reconeyez"] img { filter:brightness(0) invert(1); }
.builder-banner { padding-top:clamp(52px,6vw,78px); padding-bottom:clamp(52px,6vw,78px); color:#fff; background:var(--builder-deep); }
.builder-banner--highlight { background:linear-gradient(115deg,var(--builder-accent),var(--builder-deep)); }
.builder-banner--info { color:var(--builder-deep); background:var(--builder-soft); }
.builder-banner__inner { display:flex; justify-content:space-between; gap:40px; align-items:center; }
.builder-banner h2 { margin:0 0 8px; color:inherit; font-size:clamp(1.8rem,3vw,2.8rem); }
.builder-banner p { margin:0; color:inherit; }
.builder-banner .builder-eyebrow { color:var(--builder-highlight)!important; }
.builder-banner--info .builder-eyebrow { color:var(--builder-accent)!important; }
.builder-downloads__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.builder-downloads__grid article { display:grid; grid-template-columns:48px 1fr; gap:17px; padding:25px; border:1px solid #dce8eb; border-radius:var(--builder-radius); background:#fff; }
.builder-downloads__grid article > svg { width:45px; height:45px; padding:10px; border-radius:50%; color:#fff; background:var(--builder-accent); }
.builder-downloads h3 { font-size:19px; }
.builder-downloads p { color:#536d73; }
@media (max-width:1000px) {
    .builder-system-cards__grid--3,.builder-icon-grid__items--4,.builder-stats__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
    .builder-hero--manufacturer { grid-template-columns:1fr; }
    .builder-hero--manufacturer .builder-hero__copy { grid-column:1; grid-row:2; }
    .builder-hero--manufacturer .builder-hero__media { grid-column:1; grid-row:1; min-height:390px; clip-path:none; }
    .builder-system-cards__grid,.builder-system-cards__grid--3,.builder-icon-grid__items,.builder-icon-grid__items--4,.builder-topic-links__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .builder-topic-links > .shell,.builder-feature-panel__layout,.builder-feature-panel__layout--left { grid-template-columns:1fr; }
}
@media (max-width:620px) {
    .builder-hero__kicker { align-items:flex-start; flex-direction:column; }
    .builder-hero__meta { padding-left:0; border-left:0; }
    .builder-hero__badge { width:100%; border-radius:16px; }
    .builder-checklist__items,.builder-system-cards__grid,.builder-system-cards__grid--3,.builder-icon-grid__items,.builder-icon-grid__items--2,.builder-icon-grid__items--4,.builder-stats__grid,.builder-downloads__grid,.builder-topic-links__grid { grid-template-columns:1fr; }
    .builder-system-card__body { padding:24px 20px; }
    .builder-banner__inner { align-items:flex-start; flex-direction:column; }
    .builder-logo-strip__items > * { width:130px; }
}

/* A consistent keyboard focus indicator remains visible on light, blue and image backgrounds. */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible {
    outline: 3px solid #174f5d;
    outline-offset: 3px;
}
.site-header a:focus-visible, .site-header button:focus-visible, .footer-main a:focus-visible, .footer-main button:focus-visible,
.system-grade a:focus-visible, .system-grade button:focus-visible, .video-consent button:focus-visible {
    outline-color: var(--yellow);
}

/*
 * Seiten-Builder: Die gespeicherten Inhaltsdaten verwenden die originalen
 * SECTEO-Strukturen. Diese kleine Brücke verbindet nur die wählbare Farbwelt
 * und Sonderfälle des Editors; Maße und Breakpoints bleiben die der Website.
 */
.builder-page {
    --blue: var(--builder-accent);
    --blue-dark: var(--builder-deep);
    --blue-light: var(--builder-soft);
    --brand-accent: var(--builder-accent);
    --brand-dark: var(--builder-deep);
    --brand-soft: var(--builder-soft);
    --system-accent: var(--builder-accent);
    --system-dark: var(--builder-deep);
    --system-soft: var(--builder-soft);
    --sector-accent: var(--builder-accent);
    --sector-dark: var(--builder-deep);
    --sector-soft: var(--builder-soft);
    --yellow: var(--builder-highlight);
}
.builder-density--compact { --section-space: clamp(44px, 4vw, 58px); --section-space-compact: clamp(32px, 3vw, 44px); }
.builder-density--comfortable { --section-space: clamp(56px, 4.7vw, 72px); --section-space-compact: clamp(44px, 3.9vw, 60px); }
.builder-density--generous { --section-space: clamp(76px, 6.5vw, 104px); --section-space-compact: clamp(58px, 5vw, 78px); }
.builder-shape--classic { --radius: 4px; }
.builder-shape--soft { --radius: 18px; }
.builder-shape--dynamic { --radius: 20px; }
.builder-page .system-hero h1,
.builder-page .system-overview__copy h2,
.builder-page .system-detail__copy h2,
.builder-page .system-components__heading h2,
.builder-page .system-faq__heading h2,
.builder-page .system-section-heading h2 { color: var(--system-accent); }
.builder-page .system-hero h2 { color: #303031; }
.builder-page .manufacturer-hero h1,
.builder-page .manufacturer-system-card h3 { color: var(--brand-accent); }
.builder-page .manufacturer-hero h2 { color: #303031; }
.builder-page .sector-hero h1,
.builder-page .sector-heading h2 { color: var(--sector-accent); }
.builder-page .sector-hero h2 { color: #303031; }
.builder-page .manufacturer-systems__heading h2,
.builder-page .about-section-copy h2,
.builder-page .feature-grid h3,
.builder-page .link-card-grid h3 { color: var(--blue); }
.builder-page .system-flow__grid h3,
.builder-page .system-application-grid h3 { color: var(--system-accent); }
.builder-page .system-cta h2,
.builder-page .sector-cta h2,
.builder-page .manufacturer-cta h2,
.builder-page .builder-original-quote h2 { color: #fff; }
.builder-page .builder-about-hero { background-image: var(--builder-about-image, url('../images/ueber-uns-hero.webp')); }
.builder-page .builder-about-hero h1,
.builder-page .builder-original-simple-hero h1 { color: var(--blue); }
.builder-page .builder-about-hero h1 { color: #fff; }
.builder-page .builder-original-simple-hero h2 { color: #303031; font-style: normal; }
.builder-page .builder-original-placeholder {
    width: 100%;
    height: 100%;
    min-height: inherit;
    display: grid;
    place-items: center;
    padding: 24px;
    color: #647d84;
    background: linear-gradient(145deg, #dce9ec, #f6fafb);
    font-size: 13px;
    font-weight: 750;
    text-align: center;
}
.builder-page .system-detail__media--single { grid-template-columns: 1fr; }
.builder-page .system-detail__media--single figure:first-child { width: 100%; }
.builder-page .builder-original-image-text--right .system-detail__media { order: 2; }
.builder-page .builder-original-feature--left { grid-template-columns: minmax(330px, .72fr) minmax(0, 1.05fr); }
.builder-page .builder-original-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.builder-page .builder-original-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.builder-page .builder-original-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.builder-page .link-card-grid > article {
    padding: 29px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    box-shadow: 0 7px 20px rgba(40,68,76,.05);
}
.builder-page .builder-original-cards .link-card-grid > * { position: relative; overflow: hidden; background: #fff; }
.builder-page .builder-original-cards figure { height: 220px; margin: -29px -29px 25px; overflow: hidden; background: #e3ecee; }
.builder-page .builder-original-cards figure img { width: 100%; height: 100%; object-fit: cover; }
.builder-page .builder-original-card-number { position: absolute; top: 18px; right: 22px; color: color-mix(in srgb, var(--blue) 20%, #fff); font-size: 32px; font-style: italic; font-weight: 800; }
.builder-page .builder-original-cards--minimal figure,
.builder-page .builder-original-cards--minimal .builder-original-card-number { display: none; }
.builder-page .builder-original-feature-icon,
.builder-page .builder-original-download-icon { width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 50%; color: var(--blue); background: var(--blue-light); }
.builder-page .builder-original-feature-icon svg,
.builder-page .builder-original-download-icon svg { width: 24px; height: 24px; }
.builder-page .builder-original-downloads .link-card-grid > * { display: grid; grid-template-columns: 54px 1fr; gap: 17px; }
.builder-page .builder-original-downloads .builder-original-download-icon { margin: 0; }
.builder-page .builder-original-topic-title { margin: 0 0 15px; color: var(--system-accent); font-size: var(--heading-3-size); }
.builder-page .manufacturer-section--home .manufacturer-row > span { --home-logo-width: clamp(120px, 10.9vw, 145px); width: var(--home-logo-width); min-width: var(--home-logo-width); height: 82px; display: grid; flex: 0 0 var(--home-logo-width); place-items: center; }
.builder-page .manufacturer-section--home .manufacturer-row > span img { width: 100%; max-height: 72px; object-fit: contain; }

@media (max-width: 991px) {
    .builder-page .builder-original-grid--3,
    .builder-page .builder-original-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .builder-page .builder-original-image-text--right .system-detail__media { order: 0; }
    .builder-page .builder-original-feature--left { grid-template-columns: 1fr; }
    .builder-page .builder-original-grid--2,
    .builder-page .builder-original-grid--3,
    .builder-page .builder-original-grid--4 { grid-template-columns: 1fr; }
    .builder-page .builder-original-downloads .link-card-grid > * { grid-template-columns: 44px 1fr; padding: 24px 20px; }
}