.heating-page { color: var(--text); background: var(--bg); letter-spacing: 0; }
.heating-page .heat-intro { padding: calc(var(--heat-header-height, 180px) + 32px) 0 40px !important; border-bottom: 1px solid var(--border); }
.heat-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13px; margin-bottom: 36px; color: var(--text-muted); }
.heat-breadcrumb a:hover { color: var(--primary); }
.heat-intro h1 { font-size: 48px; line-height: 1.15; max-width: 900px; margin: 12px 0 20px; letter-spacing: 0; overflow-wrap: anywhere; }
.heat-intro p { color: var(--text-secondary); font-size: 16px; }
.heat-intro p:first-of-type { font-size: 12px; font-weight: 700; color: var(--primary); }
.heat-tabs { display: flex; justify-content: center; gap: 28px; padding: 0 24px; border-bottom: 1px solid var(--border); background: var(--bg-alt); }
.heat-tabs a { padding: 20px 0; border-bottom: 3px solid transparent; font-size: 14px; font-weight: 600; color: var(--text-secondary); }
.heat-tabs a[aria-current], .heat-tabs a:hover { border-color: var(--primary); color: var(--primary); }
.heat-catalog { padding: 48px 0 64px; }
.heat-catalog > .container { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; }
.heat-family { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--bg-elevated); }
.heat-family:last-child { grid-column: 1 / -1; }
.heat-family-heading { display: flex; gap: 18px; align-items: center; padding: 24px; }
.heat-family-heading > a { margin-left: auto; font-size: 26px; color: var(--primary); }
.heat-family h2 { font-size: 22px; line-height: 1.3; letter-spacing: 0; }
.heat-family-heading p { font-size: 13px; color: var(--text-muted); margin-top: 6px; }
.heat-number { color: var(--primary); font-size: 12px; font-weight: 600; }
.heat-family-image { display: block; background: #fff; height: 222px; overflow: hidden; border-block: 1px solid var(--border); }
.heating-page .heat-family-image img { display: block; width: 100%; height: 220px !important; min-height: 0; max-height: 220px; object-fit: contain; padding: 14px; }
.heat-series { padding: 0 24px; }
.heat-series-row { display: grid; grid-template-columns: 28px minmax(0,1fr) auto 20px; gap: 12px; align-items: center; min-height: 72px; border-bottom: 1px solid var(--border); color: var(--text); transition: color .15s; }
.heat-series-row:last-child { border-bottom: 0; }
.heat-series-row:hover { color: var(--primary); }
.heat-series-row strong { font-size: 18px; overflow-wrap: anywhere; }
.heat-series-row > span:nth-last-child(2) { color: var(--text-muted); font-size: 12px; }
.heating-page a:focus-visible { outline: 2px solid var(--primary); outline-offset: 4px; }
.heat-family-detail, .heat-series-detail { padding: 48px 0; }
.heat-family-detail .heat-series { padding: 0; }
.heat-section-heading { display: flex; gap: 20px; justify-content: space-between; align-items: baseline; margin-bottom: 24px; }
.heat-section-heading h2, .heat-family-detail h2, .heat-contact h2 { font-size: 26px; line-height: 1.3; letter-spacing: 0; }
.heat-section-heading p { color: var(--text-muted); }
.heat-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-block: 1px solid var(--border); }
.heat-facts > div { padding: 24px 20px 24px 0; }
.heat-facts dt { font-size: 13px; color: var(--text-muted); margin-bottom: 10px; }
.heat-facts dd { font-weight: 600; }
.heat-pending { margin-top: 28px; color: var(--text-muted); }
.heat-contact { padding: 40px 0; border-top: 1px solid var(--border); background: var(--bg-alt); }
.heat-contact .container { display: flex; justify-content: space-between; gap: 24px; align-items: center; }
.heat-contact p { margin-top: 10px; color: var(--text-muted); }
.heat-contact .btn { flex-shrink: 0; border-radius: 6px; }
@media(max-width: 700px) {
 .heating-page .heat-intro { padding-top: calc(var(--heat-header-height, 72px) + 28px) !important; }
 .heat-intro h1 { font-size: 34px; }
 .heat-tabs { display: grid; grid-template-columns: minmax(0,1fr); padding: 8px 20px; gap: 0; }
 .heat-tabs a { flex-shrink: 0; }
 .heat-catalog > .container { grid-template-columns: minmax(0,1fr); }
 .heat-family-heading { padding: 20px; }
 .heat-family h2 { font-size: 20px; }
 .heat-series { padding-inline: 20px; }
 .heat-series-row { grid-template-columns: 24px minmax(0,1fr) 18px; }
 .heat-series-row > span:nth-last-child(2) { display: none; }
 .heat-facts { grid-template-columns: 1fr; }
 .heat-facts > div + div { border-top: 1px solid var(--border); }
 .heat-contact .container { align-items: flex-start; flex-direction: column; }
 .heat-breadcrumb { font-size: 14px; gap: 8px; }
}

/* Readable catalog controls and comfortable touch targets. */
.heating-page .container { width: min(1180px, calc(100% - 64px)); }
.heat-breadcrumb { font-size: 15px; line-height: 1.6; color: var(--text-secondary); }
.heat-breadcrumb a { text-decoration: underline; text-underline-offset: 4px; }
.heat-intro p { font-size: 18px; line-height: 1.6; }
.heat-intro p:first-of-type { font-size: 14px; }
.heat-tabs { flex-wrap: wrap; background: var(--bg-alt); }
.heating-page .heat-tabs a { display: flex; align-items: center; min-height: 60px !important; font-size: 16px; line-height: 1.5; }
.heat-catalog > .container { align-items: start; }
.heat-family-heading { min-height: 112px; }
.heat-family-heading > a { display: grid; place-items: center; min-width: 44px; min-height: 44px; }
.heat-family h2 { font-size: 24px; }
.heat-family-heading p { font-size: 16px; color: var(--text-secondary); margin-top: 8px; }
.heat-number { font-size: 14px; color: var(--text-secondary); }
.heat-family-image { height: 262px; }
.heating-page .heat-family-image img { height: 260px !important; max-height: 260px; transform: none !important; }
.heating-page .heat-series-row { min-height: 76px !important; padding-block: 16px; transition: background-color .15s, color .15s; }
.heat-series-row:hover { background: var(--bg-alt); }
.heating-page .heat-series-row strong { font-size: 20px !important; line-height: 1.5; }
.heat-series-row > span:nth-last-child(2) { font-size: 14px; color: var(--text-secondary); }
.heating-page a:focus-visible { outline-width: 3px; outline-offset: -3px; }
.heat-facts dt { font-size: 16px; color: var(--text-secondary); }
.heat-facts dd { font-size: 18px; line-height: 1.5; }
.heat-pending, .heat-contact p { font-size: 17px; line-height: 1.7; color: var(--text-secondary); }
.heat-contact .btn { min-height: 52px; font-size: 16px; }
@media(max-width: 900px) {
 .heating-page .container { width: calc(100% - 40px); }
 .heat-family h2 { font-size: 22px; }
 .heat-family-heading { gap: 10px; padding: 20px; }
 .heat-family-heading > .heat-number { display: none; }
 .heat-series-row { grid-template-columns: 24px minmax(0,1fr) 20px; }
 .heat-series-row > span:nth-last-child(2) { display: none; }
}
@media(max-width: 700px) {
 .heat-tabs a { min-height: 52px; padding: 12px 4px; border-bottom: 1px solid var(--border); }
 .heat-tabs a:last-child { border-bottom: 0; }
 .heat-tabs a[aria-current] { border-left: 3px solid var(--primary); padding-left: 12px; }
 .heating-page .heat-series-row strong { font-size: 18px !important; }
 .heat-contact .btn { width: 100%; }
 .heat-family-heading { min-height: 104px; }
}
@media(prefers-reduced-motion: reduce) { .heat-series-row { transition: none; } }

[data-theme="dark"] .heating-layout .footer-legal { background: var(--bg-alt); }
[data-theme="dark"] .heating-layout .legal-disclaimer,
[data-theme="dark"] .heating-layout .legal-logo-text,
[data-theme="dark"] .heating-layout .footer-company-details { color: var(--text-secondary) !important; }
[data-theme="dark"] .heating-layout .legal-disclaimer { background: var(--bg-elevated); }

/* Direct heater product pages. */
.heating-hub .heat-catalog > .container { grid-template-columns: minmax(0,1fr); gap: 36px; }
.heating-hub .heat-family { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; padding-bottom: 28px; overflow: visible; }
.heating-hub .heat-family:last-child { border-bottom: 0; }
.heating-hub .heat-family-heading { padding: 0; gap: 24px; min-height: 240px; }
.heating-hub .heat-family-heading > div { min-width: 0; }
.heating-hub .heat-family-heading h2 { font-size: 28px; }
.heating-hub .hub-family-photo { width: 360px; height: 240px; flex-shrink: 0; background: #fff; border-radius: 6px; overflow: hidden; }
.heating-hub .hub-family-photo img { display: block; width: 100%; height: 240px !important; object-fit: contain; padding: 4px; transform: none !important; }
.hub-family-description { max-width: 720px; margin: 12px 0 24px; font-size: 17px; line-height: 1.7; color: var(--text-secondary); }
.heating-hub .heat-series { padding: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 32px; }
.heating-hub .heat-series-row { grid-template-columns: 24px minmax(0,1fr) auto 20px; min-height: 72px !important; }
.heating-hub .heat-series-row > span:nth-last-child(2) { display: inline; }
.heating-hub .heat-series-row:hover { background: var(--bg-alt); }
@media(max-width:700px) {
 .heating-hub .heat-family-heading { gap: 16px; flex-wrap: wrap; min-height: 0; }
 .heating-hub .heat-family-heading > div { width: 100%; }
 .heating-hub .heat-family-heading h2 { font-size: 22px; }
 .heating-hub .heat-family-heading > .hub-family-photo { width: 100%; height: 240px; margin: 0; }
 .heating-hub .hub-family-photo img { height: 240px !important; padding: 8px; }
 .heating-hub .heat-series { grid-template-columns: minmax(0,1fr); }
 .heating-hub .heat-series-row { grid-template-columns: 24px minmax(0,1fr) 20px; }
 .heating-hub .heat-series-row > span:nth-last-child(2) { display: none; }
}
.direct-gallery.direct-gallery-three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.water-table .direct-spec-table { min-width: 520px; }
.direct-overview p + p { margin-top: 18px; }
.water-family-feature { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 40px; align-items: center; margin-top: 32px; }
.water-family-image { display: block; height: 400px; padding: 24px; background: #fff; border: 1px solid var(--border); border-radius: 6px; }
.heating-page .water-family-image img { width: 100%; height: 350px !important; object-fit: contain; }
.water-family-feature h3 { font-size: 26px; line-height: 1.4; margin-bottom: 20px; }
.water-family-feature p { font-size: 18px; line-height: 1.8; color: var(--text-secondary); }
.water-family-feature .direct-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
@media(max-width: 700px) {
 .direct-gallery.direct-gallery-three { grid-template-columns: minmax(0,1fr); }
 .water-product .direct-photo-link { aspect-ratio: 4 / 3; }
 .water-product .water-table .direct-spec-table { display: table !important; min-width: 0; table-layout: fixed; font-size: 15px; }
 .water-product .water-table .direct-spec-table caption { white-space: normal; overflow-wrap: anywhere; }
 .water-product .water-table .direct-spec-table th,
 .water-product .water-table .direct-spec-table td { padding: 14px 10px; white-space: normal; overflow-wrap: anywhere; }
 .water-product .water-table .direct-spec-table th:first-child { position: static; min-width: 0; max-width: none; width: 40%; }
 .water-product .water-table .direct-spec-table th:nth-child(2) { width: 26%; }
 .water-product .water-table .direct-spec-table th:last-child { width: 34%; }
 .water-product .water-table .direct-spec-table thead { font-size: 14px; }
 .water-family-feature { grid-template-columns: minmax(0,1fr); gap: 24px; }
 .water-family-image { height: 320px; }
 .heating-page .water-family-image img { height: 270px !important; }
 .water-family-feature .direct-summary { grid-template-columns: 1fr; }
}
.direct-family-products { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin-top: 32px; }
.direct-family-products article { border: 1px solid var(--border); border-radius: 6px; overflow: hidden; background: var(--bg-elevated); }
.direct-family-product-image { display: block; height: 260px; padding: 20px; background: #fff; }
.heating-page .direct-family-product-image img { width: 100%; height: 220px !important; object-fit: contain; transform: none !important; }
.direct-family-products article > div { padding: 24px; }
.direct-family-products h3 { font-size: 24px; margin-bottom: 12px; }
.direct-family-products p { font-size: 16px; line-height: 1.7; color: var(--text-secondary); }
.direct-family-products dl { margin-top: 20px; }
.direct-family-products dl > div { padding-block: 12px; border-top: 1px solid var(--border); }
.direct-family-products dt { color: var(--text-secondary); font-size: 14px; margin-bottom: 4px; }
.direct-family-products dd { font-size: 17px; font-weight: 600; }
.direct-family-product-link { display: flex; align-items: center; justify-content: space-between; min-height: 52px !important; margin-top: 16px; color: var(--primary); font-weight: 600; border-top: 1px solid var(--border); }
@media(max-width: 1000px) { .direct-family-products { grid-template-columns: 1fr; } .direct-family-products article { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
@media(max-width: 600px) { .direct-family-products article { display: block; } }
.direct-product { --direct-line: var(--border); }
.direct-product [id] { scroll-margin-top: calc(var(--heat-header-height, 100px) + 24px); }
.direct-heading { display: flex; justify-content: space-between; align-items: center; gap: 32px; }
.direct-heading > div { min-width: 0; }
.direct-heading .btn { flex-shrink: 0; border-radius: 6px; min-height: 52px; }
.direct-product .heat-intro h1 { font-size: 56px; }
.direct-product .heat-intro { border-bottom: 0; }
.direct-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--direct-line); gap: 24px; }
.direct-summary dt { font-size: 14px; color: var(--text-secondary); margin-bottom: 8px; }
.direct-summary dd { font-size: 22px; font-weight: 600; line-height: 1.4; }
.direct-gallery-section { padding: 0 0 36px !important; }
.direct-gallery { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; }
.direct-gallery.direct-gallery-single { grid-template-columns: minmax(0,1fr); max-width: 640px; margin-inline: auto; }
.direct-gallery.indirect-gallery-pair { grid-template-columns: repeat(2,minmax(0,1fr)); max-width: 960px; margin-inline: auto; }
@media(max-width: 600px) { .direct-gallery.indirect-gallery-pair { grid-template-columns: minmax(0,1fr); } }
.direct-gallery-single .direct-photo-link { aspect-ratio: 16 / 9; }
.direct-photo { min-width: 0; margin: 0; border: 1px solid var(--direct-line); border-radius: 6px; overflow: hidden; }
.direct-photo-link, .direct-photo-empty { aspect-ratio: 1; background: #fff; }
.direct-photo-link { display: block; padding: 18px; min-height: 0 !important; }
.heating-page .direct-photo img { width: 100%; height: 100% !important; min-height: 0; object-fit: contain; transform: none !important; }
.direct-photo-empty { display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 14px; color: var(--text-secondary); background: var(--bg-alt); text-align: center; padding: 16px; font-size: 14px; }
.direct-photo-empty > span:first-child { font-size: 30px; color: var(--text-muted); }
.direct-photo figcaption { padding: 14px 16px; min-height: 64px; font-size: 14px; line-height: 1.5; display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--direct-line); color: var(--text-secondary); background: var(--bg-elevated); }
.direct-photo figcaption > span:first-child { font-size: 12px; color: var(--text-muted); }
.direct-photo [hidden] { display: none !important; }
.direct-section-nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 36px; padding: 12px 24px; border-block: 1px solid var(--direct-line); background: var(--bg-alt); }
.heating-page .direct-section-nav a { min-height: 48px !important; display: flex; align-items: center; font-weight: 600; font-size: 16px; color: var(--text); }
.direct-section-nav a:hover { color: var(--primary); text-decoration: underline; text-underline-offset: 6px; }
.heating-page .direct-section { padding: 56px 0 !important; }
.direct-alt { background: var(--bg-alt); border-block: 1px solid var(--direct-line); }
.direct-section-title { display: flex; align-items: baseline; gap: 18px; margin-bottom: 28px; }
.direct-section-title > span { font-size: 14px; color: var(--primary); font-weight: 600; }
.heating-page .direct-section h2 { font-size: 30px !important; line-height: 1.3; letter-spacing: 0; }
.direct-overview { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); gap: 48px; }
.direct-overview p { font-size: 18px; line-height: 1.8; color: var(--text-secondary); }
.direct-properties { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 36px; list-style: none; }
.direct-properties li { display: flex; align-items: baseline; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--direct-line); font-size: 17px; line-height: 1.7; }
.direct-properties li > span:first-child { color: var(--primary); }
.direct-benefits { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.direct-benefits article { padding-top: 20px; border-top: 2px solid var(--direct-line); }
.direct-benefit-number { font-size: 14px; color: var(--primary); }
.direct-benefits h3 { margin: 12px 0; font-size: 20px; line-height: 1.5; letter-spacing: 0; }
.direct-benefits p { font-size: 16px; line-height: 1.8; color: var(--text-secondary); }
.direct-table-scroll { max-width: 100%; overflow-x: auto; border: 1px solid var(--direct-line); border-radius: 6px; background: var(--bg-elevated); }
.direct-table-scroll { scrollbar-width: auto; scrollbar-color: var(--text-muted) var(--bg-alt); }
.direct-table-scroll:focus-visible { outline: 3px solid var(--primary); outline-offset: 4px; }
.direct-spec-table { display: table !important; width: 100%; min-width: 660px; border-collapse: collapse; font-size: 16px; line-height: 1.5; font-variant-numeric: tabular-nums; }
.direct-spec-table caption { text-align: left; padding: 20px; color: var(--text-secondary); font-size: 15px; }
.direct-spec-table th, .direct-spec-table td { padding: 16px 20px; border-top: 1px solid var(--direct-line); text-align: right; white-space: nowrap; }
.direct-spec-table th:first-child { text-align: left; }
.direct-spec-table tbody th { font-weight: 500; }
.direct-spec-table thead { color: var(--text); background: var(--bg-alt); }
.direct-spec-table tbody tr:nth-child(even) { background: var(--bg-alt); }
.direct-spec-note { margin-top: 16px; font-size: 14px; line-height: 1.7; color: var(--text-secondary); }
.direct-related { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; margin-top: 28px; }
.direct-related a { display: grid; grid-template-columns: minmax(0,1fr) 24px; gap: 8px 16px; padding: 24px; border: 1px solid var(--direct-line); border-radius: 6px; color: var(--text); background: var(--bg-elevated); }
.direct-related strong { font-size: 22px; }
.direct-related a > span:nth-child(2) { grid-column: 1; color: var(--text-secondary); }
.direct-related a > span:last-child { grid-column: 2; grid-row: 1 / 3; align-self: center; font-size: 24px; color: var(--primary); }
.direct-photo-dialog { position: fixed; inset: 0; margin: auto; width: min(1000px,calc(100% - 32px)); max-height: calc(100dvh - 32px); border: 1px solid var(--border); border-radius: 8px; padding: 16px; background: var(--bg-elevated); color: var(--text); }
.direct-photo-dialog::backdrop { background: rgba(0,0,0,.72); }
.direct-photo-dialog img { display: block; width: 100%; height: min(calc(100dvh - 140px),700px) !important; object-fit: contain; background: #fff; }
.direct-photo-dialog button { display: block; margin: 0 0 12px auto; width: 48px; height: 48px; font-size: 30px; background: var(--bg-alt); color: var(--text); border: 1px solid var(--border); cursor: pointer; }
@media(max-width: 1000px) {
 .direct-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .direct-benefits { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .direct-overview { gap: 24px; }
 .direct-heading { flex-direction: column; align-items: flex-start; gap: 24px; }
 .direct-heading > div { width: 100%; }
}
@media(max-width: 700px) {
 .direct-heading { flex-direction: column; gap: 24px; }
 .direct-product .heat-intro h1 { font-size: 38px; }
 .direct-heading .btn { width: 100%; }
 .direct-summary { grid-template-columns: 1fr; gap: 20px; }
 .direct-summary > div { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px 16px; }
 .direct-summary dd { font-size: 18px; }
 .direct-gallery { gap: 12px; }
 .direct-photo-link { padding: 8px; }
 .direct-photo figcaption { padding: 12px; font-size: 13px; flex-wrap: wrap; gap: 6px; min-height: 72px; }
 .direct-section-nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px 16px; padding: 12px 20px; }
 .direct-section-nav a { justify-content: center; }
 .heating-page .direct-section { padding: 36px 0 !important; }
 .direct-overview, .direct-properties, .direct-benefits, .direct-related { grid-template-columns: minmax(0,1fr); }
 .direct-overview { gap: 0; }
 .heating-page .direct-section h2 { font-size: 25px !important; }
 .direct-properties li { font-size: 16px; }
 .direct-spec-table th, .direct-spec-table td { padding: 14px 16px; }
 .direct-spec-table th:first-child { position: sticky; left: 0; z-index: 1; min-width: 150px; max-width: 180px; white-space: normal; background: var(--bg-elevated); border-right: 1px solid var(--direct-line); }
 .direct-spec-table thead th:first-child, .direct-spec-table tbody tr:nth-child(even) th:first-child { background: var(--bg-alt); }
 .direct-photo-empty { font-size: 13px; }
}