@font-face {
  font-family: "Instrument Sans";
  src: url("./fonts/instrument-sans.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: optional;
}

:root {
  --ink: #141816;
  --ink-soft: #252b28;
  --paper: #f8f7f2;
  --stone: #efede6;
  --line: #c9cbc5;
  --line-dark: #444b47;
  --green: #184b38;
  --white: #fff;
  --shell: min(1240px, calc(100% - 64px));
  --header: 72px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Instrument Sans", Arial, sans-serif; font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
body.modal-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
[hidden] { display: none !important; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 200; padding: 10px 16px; background: var(--white); }
.skip-link:focus { top: 12px; }
.shell { width: var(--shell); margin-inline: auto; }
.section { padding: 104px 0; }
.section-stone { background: var(--stone); }
.section-dark { background: var(--ink); color: var(--paper); }

h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { margin-bottom: 0; font-weight: 520; line-height: .98; letter-spacing: -.045em; text-wrap: balance; }
h1 { font-size: clamp(4rem, 6.4vw, 5.5rem); }
h2 { font-size: clamp(3rem, 4.4vw, 4.15rem); }
h3 { font-size: clamp(1.7rem, 2.2vw, 2.35rem); }
.eyebrow { margin: 0 0 18px; font-size: .68rem; font-weight: 650; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow span { margin-right: 14px; color: #737a75; }
.eyebrow.light, .eyebrow.light span { color: #b9c0bc; }
.section-heading { display: grid; grid-template-columns: 1.55fr .65fr; gap: 80px; align-items: end; margin-bottom: 64px; }
.section-heading .eyebrow, .section-heading h2 { grid-column: 1; }
.section-heading h2 { max-width: 830px; }
.section-heading>p:last-child { grid-column: 2; grid-row: 1 / 3; margin: 0; max-width: 390px; color: #59605c; }

.site-header { height: var(--header); padding-inline: max(32px, calc((100vw - 1240px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 28px; position: absolute; inset: 0 0 auto; z-index: 50; color: var(--white); border-bottom: 1px solid rgba(255,255,255,.28); transition: background .25s, color .25s, border-color .25s; }
.site-header-solid, .site-header.is-scrolled { position: sticky; top: 0; background: rgba(248,247,242,.96); color: var(--ink); border-color: var(--line); backdrop-filter: blur(14px); }
.site-header-overlay.is-scrolled { position: fixed; }
.brand { display: inline-flex; align-items: baseline; gap: 9px; text-decoration: none; letter-spacing: .16em; font-weight: 690; }
.brand small { font-size: .57rem; letter-spacing: .22em; font-weight: 620; opacity: .68; }
.main-nav { display: flex; align-items: center; gap: 29px; }
.main-nav a, .nav-consult { border: 0; background: none; color: inherit; text-decoration: none; font-size: .74rem; letter-spacing: .035em; cursor: pointer; }
.main-nav a:not(.nav-cta):hover, .nav-consult:hover { opacity: .58; }
.main-nav .nav-cta { padding: 10px 16px; border: 1px solid currentColor; }
.mobile-toggle { display: none; border: 0; background: none; color: inherit; text-transform: uppercase; letter-spacing: .12em; font-size: .7rem; }

.button { min-height: 48px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: space-between; gap: 30px; border: 1px solid transparent; border-radius: 0; text-decoration: none; font-size: .76rem; font-weight: 640; cursor: pointer; transition: transform .2s, background .2s, color .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--green); color: var(--white); }
.button-primary:hover { background: #113b2b; }
.button-dark { background: var(--ink); color: var(--white); }
.button-light { background: var(--paper); color: var(--ink); }
.button-ghost { border-color: rgba(255,255,255,.7); color: var(--white); }
.button-back { padding-inline: 0; background: transparent; border: 0; }
.button-reset { padding: 0; background: none; border: 0; }
.text-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; padding-bottom: 7px; border-bottom: 1px solid currentColor; color: var(--green); text-decoration: none; font-size: .77rem; font-weight: 640; cursor: pointer; }
.text-link span { transition: transform .2s; }
.text-link:hover span { transform: translate(3px,-2px); }

.hero { min-height: 100svh; position: relative; display: flex; align-items: flex-end; overflow: hidden; background: var(--ink); color: var(--white); }
.hero-media, .hero-shade { position: absolute; inset: 0; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: 52% 59%; }
.hero-shade { background: linear-gradient(90deg, rgba(7,11,9,.9) 0%, rgba(7,11,9,.63) 42%, rgba(7,11,9,.08) 72%), linear-gradient(0deg, rgba(7,11,9,.62), transparent 58%); }
.hero-inner { min-height: 100svh; padding: calc(var(--header) + 70px) 0 38px; position: relative; z-index: 2; display: grid; grid-template-columns: repeat(12,1fr); gap: 24px; align-items: end; }
.hero-copy { grid-column: 1 / 9; align-self: center; max-width: 900px; padding-top: 40px; }
.hero-eyebrow { color: rgba(255,255,255,.78); opacity: 0; animation: rise .55s .05s forwards; }
.hero h1 { max-width: 900px; opacity: 0; transform: translateY(20px); animation: rise .7s .12s forwards; }
.hero-lead { max-width: 590px; margin: 26px 0 0; color: rgba(255,255,255,.82); font-size: 1.06rem; opacity: 0; transform: translateY(16px); animation: rise .6s .2s forwards; }
.hero-actions { display: flex; gap: 12px; margin-top: 30px; opacity: 0; transform: translateY(12px); animation: rise .55s .28s forwards; }
.hero-proof { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(255,255,255,.42); }
.hero-proof span { padding: 14px 12px 0 0; font-size: .63rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.68); }
.hero-proof strong { color: var(--white); font-weight: 650; }
@keyframes rise { to { opacity: 1; transform: translateY(0); } }

.system-heading { margin-bottom: 50px; }
.system-selector { display: grid; grid-template-columns: 1.45fr .75fr; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.system-guide { grid-column: 1 / -1; margin: 0; padding: 15px 0; display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid var(--line); color: #626965; font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.system-guide span:nth-child(2) { text-align: center; }
.system-guide span:last-child { text-align: right; }
.visual-controls { grid-column: 1 / -1; padding: 24px 0 28px; display: grid; grid-template-columns: 1.25fr .75fr; gap: 26px; border-bottom: 1px solid var(--line); }
.visual-control-group>strong { display: block; margin-bottom: 13px; font-size: .82rem; font-weight: 620; }
.size-options, .surface-options { display: grid; gap: 8px; }
.size-options { grid-template-columns: repeat(4,1fr); }
.surface-options { grid-template-columns: repeat(2,1fr); }
.size-options button, .surface-options button, .size-surface-switch button { position: relative; min-width: 0; padding: 0; border: 1px solid var(--line); background: #f2f1ec; text-align: left; cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.size-options button:hover, .surface-options button:hover, .size-surface-switch button:hover { border-color: var(--green); transform: translateY(-2px); }
.size-options button.is-active, .surface-options button.is-active, .size-surface-switch button.is-active { border-color: var(--green); background: var(--white); box-shadow: inset 0 -3px var(--green); }
.size-options img { width: 100%; height: 94px; object-fit: contain; }
.surface-options img { width: 100%; height: 112px; object-fit: cover; }
.size-options button>span, .surface-options button>span, .size-surface-switch button>span { display: grid; gap: 2px; padding: 10px 11px 12px; }
.size-options b, .surface-options b, .size-surface-switch b { font-size: .74rem; }
.size-options small, .surface-options small, .size-surface-switch small { color: #6a716d; font-size: .61rem; }
.size-options i, .surface-options i, .size-surface-switch i { position: absolute; top: 8px; right: 8px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: var(--white); font-size: .65rem; font-style: normal; opacity: 0; transform: scale(.7); transition: opacity .2s, transform .2s; }
.size-options .is-active i, .surface-options .is-active i, .size-surface-switch .is-active i { opacity: 1; transform: scale(1); }
.system-controls { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 40px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.control-group { display: flex; align-items: center; gap: 20px; }
.control-group>span { font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: #6d746f; }
.control-group>div { display: flex; gap: 4px; }
.control-group button, .filter-line button { padding: 7px 11px; border: 0; background: transparent; font-size: .75rem; cursor: pointer; }
.control-group button.is-active, .filter-line button.is-active { background: var(--ink); color: var(--white); }
.system-stage { min-height: 560px; margin: 0; display: grid; place-items: center; background: #f2f1ec; overflow: hidden; }
.system-stage img { width: 88%; height: 470px; object-fit: contain; transition: opacity .18s, transform .32s ease; }
.system-stage img.is-changing { opacity: 0; transform: translateY(8px); }
.system-specification { padding: 52px 0 44px 52px; border-left: 1px solid var(--line); }
.system-specification>p:not(.eyebrow) { margin: 9px 0 34px; color: #68706b; font-size: .72rem; }
.system-specification dl { margin: 0; }
.system-specification dl div { display: flex; justify-content: space-between; gap: 18px; padding: 10px 0; border-top: 1px solid var(--line); font-size: .74rem; }
.system-specification dt { color: #737a75; }
.system-specification dd { margin: 0; text-align: right; font-weight: 610; }
.system-price { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 8px; margin: 30px 0 16px; }
.system-price span, .system-price small { font-size: .65rem; color: #68706b; }
.system-price strong { font-size: 2rem; font-weight: 540; letter-spacing: -.035em; }
.system-price small { grid-column: 2; margin-top: -7px; }
.system-tiers { display: grid; grid-template-columns: repeat(3,1fr); margin-bottom: 28px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.system-tiers span { padding: 10px 3px; font-size: .62rem; color: #6a716d; }
.system-tiers span+span { border-left: 1px solid var(--line); padding-left: 10px; }
.system-tiers b { display: block; color: var(--ink); font-size: .72rem; }
.system-specification .button { width: 100%; }
.system-specification .text-link { margin-top: 22px; }

.audience-layout { display: grid; grid-template-columns: .7fr 1.3fr; gap: 80px; }
.audience-heading { display: block; margin: 0; }
.audience-heading h2 { max-width: 470px; }
.audience-switch { grid-column: 2; display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid var(--ink); align-self: end; }
.audience-switch button { position: relative; padding: 14px 28px 14px 4px; border: 0; border-top: 1px solid var(--line); background: none; text-align: left; color: #747a76; font-size: .72rem; cursor: pointer; }
.audience-switch button+button { padding-left: 14px; }
.audience-switch button span { display: block; margin-bottom: 5px; font-size: .58rem; letter-spacing: .12em; }
.audience-switch button i { position: absolute; right: 6px; top: 16px; color: var(--green); font-style: normal; opacity: 0; }
.audience-switch button[aria-selected="true"] { border-top: 3px solid var(--green); color: var(--ink); font-weight: 650; }
.audience-switch button[aria-selected="true"] i { opacity: 1; }
.audience-panels { grid-column: 2; }
.audience-panels article { min-height: 430px; display: grid; grid-template-columns: 1.08fr .92fr; column-gap: 45px; align-items: stretch; padding-top: 22px; }
.audience-panels figure { min-height: 390px; margin: 0; overflow: hidden; background: #d9d8d1; }
.audience-panels figure img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.audience-panels article:hover figure img { transform: scale(1.025); }
.audience-panels article>div { display: flex; flex-direction: column; padding: 25px 0 5px; }
.audience-statement { margin: 0; font-family: Georgia, serif; font-size: clamp(2rem,3.2vw,3.25rem); line-height: 1.04; letter-spacing: -.03em; }
.audience-panels ul { margin: 28px 0; padding: 0; list-style: none; }
.audience-panels li { padding: 12px 0; border-top: 1px solid var(--line); font-size: .78rem; }
.audience-panels .button { margin-top: auto; align-self: flex-start; }

.quality-heading>p:last-child { color: #b8bfbb; }
.detail-gallery { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 250px 250px; gap: 14px; }
.detail-gallery figure { position: relative; margin: 0; overflow: hidden; background: var(--ink-soft); }
.detail-gallery .detail-large { grid-row: 1 / 3; }
.detail-gallery figure:last-child { grid-column: 2 / 4; }
.detail-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.detail-gallery figure:hover img { transform: scale(1.025); }
.detail-gallery figcaption { position: absolute; inset: auto 0 0; padding: 34px 20px 17px; display: grid; background: linear-gradient(transparent,rgba(4,7,6,.82)); }
.detail-gallery figcaption strong { font-size: .78rem; }
.detail-gallery figcaption span { color: #c5ccc8; font-size: .68rem; }
.technical-facts { display: grid; grid-template-columns: repeat(4,1fr); margin: 48px 0 32px; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); }
.technical-facts div { padding: 20px 18px 20px 0; }
.technical-facts div+div { padding-left: 18px; border-left: 1px solid var(--line-dark); }
.technical-facts span, .technical-facts small { display: block; color: #aeb6b1; font-size: .64rem; }
.technical-facts strong { display: block; margin: 8px 0 4px; font-size: .84rem; }

.decision-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 100px; }
.decision-main h2 { max-width: 680px; }
.process-list { margin: 60px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--ink); }
.process-list li { display: grid; grid-template-columns: 64px 1fr; padding: 20px 0; border-bottom: 1px solid var(--line); }
.process-list li>span { color: #747b76; font-size: .65rem; }
.process-list strong { font-size: 1rem; }
.process-list p { margin: 5px 0 0; color: #666d69; font-size: .78rem; }
.decision-actions { margin-top: 28px; display: flex; align-items: center; gap: 24px; }
.decision-aside { padding-top: 48px; }
.review-proof { padding: 0 0 30px; border-bottom: 1px solid var(--ink); font-family: Georgia, serif; }
.review-proof strong { display: block; font-size: 3.7rem; line-height: 1; font-weight: 500; }
.review-proof span, .review-proof small { display: block; margin-top: 7px; }
.review-proof span { font-size: 1rem; }
.review-proof small { color: #707773; font-family: "Instrument Sans", Arial, sans-serif; font-size: .62rem; }
.faq-list details { padding: 18px 0; border-bottom: 1px solid var(--line); }
.faq-list summary { display: flex; justify-content: space-between; gap: 18px; list-style: none; cursor: pointer; font-size: .78rem; font-weight: 630; }
.faq-list summary::after { content: "+"; font-size: 1rem; font-weight: 400; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list p { margin: 13px 0 0; color: #626965; font-size: .76rem; }

.inquiry-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 100px; align-items: start; }
.inquiry-intro { position: sticky; top: 110px; }
.inquiry-intro h2 { max-width: 540px; }
.inquiry-intro>p:not(.eyebrow) { max-width: 480px; margin: 26px 0 0; color: #5f6662; }
.advisor-profile { margin: 42px 0 24px; display: grid; grid-template-columns: 145px 1fr; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.advisor-profile figure { height: 205px; margin: 0; overflow: hidden; background: #d8d7d0; }
.advisor-profile img { width: 100%; height: 100%; object-fit: cover; object-position: 48% top; filter: saturate(.82) contrast(1.04); transition: transform .4s ease; }
.advisor-profile:hover img { transform: scale(1.025); }
.advisor-profile>div { padding: 23px 0 18px 22px; display: flex; flex-direction: column; }
.advisor-profile>div>span { color: #6c736e; font-size: .61rem; letter-spacing: .12em; text-transform: uppercase; }
.advisor-profile h3 { margin-top: auto; font-size: 1.55rem; }
.advisor-profile p { margin: 4px 0 20px; color: #686f6b; font-size: .72rem; }
.advisor-contact { margin-top: auto; padding-top: 9px; display: grid; gap: 8px; border-top: 1px solid var(--line); }
.advisor-contact>strong { color: var(--ink); font-size: .9rem; font-weight: 620; }
.advisor-contact>div { display: flex; align-items: center; gap: 15px; }
.advisor-contact a, .advisor-contact button { padding: 0; border: 0; background: none; color: var(--green); text-decoration: none; font-size: .86rem; font-weight: 640; cursor: pointer; }
.advisor-contact button { color: #66706b; text-decoration: underline; text-underline-offset: 3px; }
.advisor-contact small { min-height: 1em; color: #66706b; font-size: .76rem; }
.advisor-profile b { font-weight: inherit; }
.inquiry-form { border-top: 2px solid var(--ink); padding-top: 18px; }
.form-progress { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 40px; }
.form-progress span { padding: 9px 0; border-bottom: 1px solid var(--line); color: #8a908c; font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; }
.form-progress span.is-active { border-bottom-color: var(--green); color: var(--green); font-weight: 650; }
.form-step { min-width: 0; margin: 0; padding: 0; border: 0; animation: form-in .25s ease; }
.form-step legend { width: 100%; margin-bottom: 28px; padding: 0; font-size: 1.4rem; font-weight: 540; letter-spacing: -.02em; }
@keyframes form-in { from { opacity: 0; transform: translateY(8px); } }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 24px; }
.form-grid label { display: grid; gap: 5px; }
.form-grid label>span { font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.form-grid small { color: #747b77; letter-spacing: 0; text-transform: none; }
.form-wide { grid-column: 1 / -1; }
input, select, textarea { width: 100%; min-width: 0; border: 0; border-bottom: 1px solid #9ea39f; border-radius: 0; padding: 10px 2px; background: transparent; color: var(--ink); outline: none; }
input, select { min-height: 46px; }
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--green); box-shadow: 0 1px 0 var(--green); }
.is-invalid { border-color: #a42f2f !important; }
.selected-products { margin-bottom: 24px; padding: 15px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.selected-products>span { display: block; margin-bottom: 8px; font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; }
.selected-products-item { display: flex; justify-content: space-between; gap: 20px; padding: 5px 0; font-size: .74rem; }
.selected-products-item span { color: #68706b; }
.form-next { width: 100%; margin-top: 30px; }
.privacy-check { display: flex; gap: 11px; margin: 22px 0 18px; color: #626965; font-size: .72rem; }
.privacy-check input { width: 17px; min-height: 17px; flex: 0 0 auto; }
.turnstile-area { min-height: 64px; }
.turnstile-area p { margin: 7px 0 0; color: #6c736e; font-size: .68rem; }
.form-actions { display: flex; justify-content: space-between; gap: 14px; align-items: center; }
.submit-button { flex: 1; }
.form-status { min-height: 22px; margin: 12px 0 0; font-size: .76rem; }
.form-status.is-error { color: #a42f2f; }
.form-status.is-success { color: var(--green); }
.form-feedback { margin-top: 20px; padding: 20px 0; border-top: 1px solid var(--green); }
.form-feedback h3 { font-size: 1.45rem; }
.honeypot { position: absolute !important; left: -9999px !important; }

.site-footer { padding: 54px 0; background: #0b0f0d; color: var(--paper); }
.footer-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr .8fr; gap: 36px; align-items: start; }
.brand-footer { align-self: start; }
.footer-grid>p { color: #9aa29d; font-size: .72rem; }
.footer-grid nav { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 20px; }
.footer-grid nav a { font-size: .69rem; text-decoration: none; }
.footer-mark { text-align: right; font-family: Georgia, serif; font-size: 1.16rem; line-height: 1.1; }

.catalog-hero { height: 440px; padding-top: var(--header); background: var(--stone); }
.catalog-hero-grid { height: 100%; display: grid; grid-template-columns: 1.15fr .85fr; gap: 80px; align-items: center; }
.catalog-hero-copy h1 { max-width: 690px; }
.catalog-hero-copy>p:not(.eyebrow) { max-width: 500px; margin: 20px 0; color: #59605c; }
.catalog-hero figure { height: 310px; margin: 0; overflow: hidden; }
.catalog-hero figure img { width: 100%; height: 100%; object-fit: cover; object-position: center 57%; }
.catalog { padding-top: 72px; }
.catalog-heading { display: flex; justify-content: space-between; gap: 60px; align-items: end; margin-bottom: 38px; }
.catalog-heading h2 { font-size: clamp(2.8rem,4vw,3.8rem); }
.catalog-price-note { display: grid; gap: 3px; text-align: right; font-size: .67rem; }
.catalog-price-note small { color: #6b726e; }
.catalog-size-nav { position: sticky; top: var(--header); z-index: 20; display: grid; grid-template-columns: repeat(4,1fr); background: rgba(248,247,242,.97); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); backdrop-filter: blur(12px); }
.catalog-size-nav a { min-width: 0; padding: 8px 14px; display: grid; grid-template-columns: 72px 1fr; gap: 12px; align-items: center; text-decoration: none; transition: background .2s; }
.catalog-size-nav a+a { border-left: 1px solid var(--line); }
.catalog-size-nav a:hover { background: var(--stone); }
.catalog-size-nav img { width: 72px; height: 60px; object-fit: contain; }
.catalog-size-nav span { display: grid; }
.catalog-size-nav b { font-size: .78rem; }
.catalog-size-nav small { color: #6b726e; font-size: .62rem; }
.size-model { scroll-margin-top: 160px; padding: 62px 0; border-bottom: 1px solid var(--ink); }
.size-model-heading { display: grid; grid-template-columns: 70px 1fr; gap: 18px; margin-bottom: 28px; }
.size-model-heading>span { color: var(--green); font-size: .67rem; letter-spacing: .12em; }
.size-model-heading p { margin: 0 0 4px; color: #626965; font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; }
.size-model-heading h2 { max-width: 720px; font-size: clamp(2.25rem,3.8vw,3.5rem); }
.size-model-heading small { display: block; max-width: 650px; margin-top: 12px; color: #646b67; }
.size-surface-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 16px 88px; }
.size-surface-switch button { display: grid; grid-template-columns: 90px 1fr; align-items: center; }
.size-surface-switch img { width: 90px; height: 76px; object-fit: contain; }
.size-model-main { display: grid; grid-template-columns: 1.25fr .75fr; min-height: 510px; background: #f1f0eb; }
.size-model-main>figure { margin: 0; display: grid; place-items: center; overflow: hidden; }
.size-model-main>figure img { width: 90%; height: 470px; object-fit: contain; transition: opacity .18s, transform .3s ease; }
.size-model-main>figure img.is-changing { opacity: 0; transform: translateY(8px); }
.size-model-info { padding: 45px 38px; background: var(--white); border-left: 1px solid var(--line); }
.size-model-info h3 { font-size: 2rem; }
.article-number { margin: 9px 0 25px; color: #6c736f; font-size: .68rem; }
.size-model-info dl { margin: 0; }
.size-model-info dl div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-top: 1px solid var(--line); font-size: .73rem; }
.size-model-info dd { margin: 0; text-align: right; font-weight: 620; }
.model-price { margin: 26px 0 14px; display: grid; }
.model-price span { color: #68706b; font-size: .64rem; text-transform: uppercase; letter-spacing: .08em; }
.model-price strong { margin-top: 3px; font-size: 1.7rem; font-weight: 560; }
.model-tiers { padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.model-tiers span { font-size: .62rem; }
.model-tiers b { margin-top: 3px; }
.size-model .project-action { margin-top: 24px; display: grid; grid-template-columns: 82px 1fr; }
.size-model .project-action label { display: grid; gap: 4px; }
.size-model .project-action label span { font-size: .6rem; text-transform: uppercase; letter-spacing: .08em; }
.size-model .project-action input { height: 48px; border: 1px solid var(--line); padding: 8px; text-align: center; }
.size-model .project-action .button { min-height: 48px; background: var(--ink); color: var(--white); border-color: var(--ink); }
.size-model .technical-details { margin: 0 0 0 88px; padding-top: 15px; }
.size-model .technical-details>div { grid-template-columns: repeat(5,1fr); }
.catalog-controls { position: sticky; top: var(--header); z-index: 20; padding: 12px 0; display: flex; justify-content: space-between; gap: 30px; background: rgba(248,247,242,.96); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); backdrop-filter: blur(12px); }
.filter-line { display: flex; align-items: center; gap: 14px; }
.filter-line>span { min-width: 65px; color: #6d746f; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.filter-line>div { display: flex; gap: 3px; }
.comparison-table-head { display: grid; grid-template-columns: 2.2fr 1.25fr 1.35fr .9fr; gap: 26px; padding: 16px 18px 10px; color: #6d746f; font-size: .61rem; letter-spacing: .1em; text-transform: uppercase; }
.comparison-row { display: grid; grid-template-columns: 2.2fr 1.25fr 1.35fr .9fr; gap: 26px; align-items: center; min-height: 220px; border-top: 1px solid var(--line); }
.comparison-row:last-child { border-bottom: 1px solid var(--line); }
.comparison-row[hidden] { display: none; }
.comparison-product { display: grid; grid-template-columns: 168px 1fr; gap: 20px; align-items: center; }
.comparison-product img { width: 168px; height: 168px; object-fit: contain; transition: transform .3s; }
.comparison-row:hover .comparison-product img { transform: translateY(-5px); }
.comparison-product h2 { margin: 2px 0 7px; font-size: 1.4rem; }
.comparison-product p { margin: 0; color: #67706a; font-size: .69rem; }
.system-data { display: grid; gap: 7px; }
.system-data div { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 5px; border-bottom: 1px solid #dedfd9; font-size: .7rem; }
.system-data span { color: #747b77; }
.price-stack>strong { display: block; margin-bottom: 13px; font-size: 1.18rem; font-weight: 560; }
.tier-stack { display: grid; grid-template-columns: repeat(3,1fr); gap: 4px; }
.tier-stack span { color: #68706b; font-size: .61rem; }
.tier-stack b { display: block; color: var(--ink); font-size: .68rem; }
.project-action { display: grid; grid-template-columns: 58px 1fr; gap: 7px; }
.project-action input { border: 1px solid var(--line); padding: 8px; text-align: center; }
.project-action button { border: 1px solid var(--ink); background: transparent; padding: 8px; cursor: pointer; font-size: .68rem; }
.project-action button:hover { background: var(--ink); color: var(--white); }
.technical-details { grid-column: 2 / -1; margin: -8px 0 18px; }
.technical-details summary { color: var(--green); font-size: .69rem; cursor: pointer; }
.technical-details>div { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; padding: 18px 0; color: #626965; font-size: .71rem; }
.technical-details a { color: var(--green); }
.catalog-note { margin: 22px 0 0; color: #68706b; font-size: .68rem; }
.catalog-service-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; }
.catalog-service-grid p, .catalog-service-grid li { color: #5f6662; }
.catalog-service-grid ul { margin: 22px 0 28px; padding: 0; list-style: none; }
.catalog-service-grid li { padding: 9px 0; border-top: 1px solid var(--line); font-size: .76rem; }
.selection-tray { position: fixed; z-index: 45; left: 50%; bottom: 18px; transform: translateX(-50%) translateY(140%); width: min(820px,calc(100% - 32px)); padding: 11px 11px 11px 18px; display: flex; align-items: center; gap: 15px; background: var(--ink); color: var(--white); transition: transform .28s ease; }
.selection-tray.is-visible { transform: translateX(-50%) translateY(0); }
.selection-tray:not(.is-visible) { display: none; }
.selection-label { margin-right: auto; }
.selection-label span { display: block; color: #aeb6b1; font-size: .59rem; letter-spacing: .1em; text-transform: uppercase; }
.selection-label strong { font-size: .77rem; }
.selection-clear { border: 0; background: none; color: #b9c0bc; font-size: .68rem; cursor: pointer; }
.selection-link { min-height: 40px; }
.is-disabled { opacity: .42; pointer-events: none; }
.mobile-conversion { display: none; }

.modal[hidden] { display: none !important; }
.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(8,12,10,.8); }
.modal-panel { position: relative; z-index: 1; width: min(920px,100%); max-height: calc(100svh - 40px); overflow: auto; padding: 32px; background: var(--paper); }
.modal-panel iframe { width: 100%; height: 650px; border: 0; }
.modal-close { position: absolute; right: 18px; top: 13px; border: 0; background: none; font-size: 1.7rem; cursor: pointer; }

@media (max-width: 1000px) {
  :root { --shell: min(100% - 40px, 780px); }
  .mobile-toggle { display: block; }
  .main-nav { display: none; position: absolute; top: var(--header); left: 0; right: 0; padding: 24px; background: var(--paper); color: var(--ink); flex-direction: column; align-items: stretch; border-bottom: 1px solid var(--line); }
  .main-nav.is-open { display: flex; }
  .hero-copy { grid-column: 1 / 11; }
  .system-selector { grid-template-columns: 1.15fr .85fr; }
  .system-stage { min-height: 480px; }
  .system-stage img { height: 400px; }
  .system-specification { padding-left: 32px; }
  .audience-layout { gap: 50px; }
  .audience-panels article { grid-template-columns: 1fr; gap: 35px; }
  .audience-panels .text-link { grid-column: 1; }
  .inquiry-grid { gap: 55px; }
  .comparison-row, .comparison-table-head { grid-template-columns: 1.8fr 1fr 1fr; }
  .comparison-table-head span:last-child { display: none; }
  .project-action { grid-column: 2 / 4; margin-bottom: 18px; }
}

/* Tablet-Navigation: Verhindert mehrzeilige und gedrängte Header auf iPads. */
@media (min-width: 641px) and (max-width: 1180px) {
  .mobile-toggle { display: block; }
  .main-nav { display: none; position: absolute; top: var(--header); left: 0; right: 0; padding: 24px 32px; background: var(--paper); color: var(--ink); flex-direction: column; align-items: stretch; border-bottom: 1px solid var(--line); }
  .main-nav.is-open { display: flex; }
  .main-nav a, .nav-consult { min-height: 48px; display: flex; align-items: center; font-size: .94rem; }
  .main-nav .nav-cta { justify-content: center; }

  .gallery-preview { min-height: 112px; display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
  .gallery-preview button { flex: 0 0 124px; width: 124px; height: 94px; display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: 62px 32px; scroll-snap-align: start; background: var(--white); }
  .gallery-preview img { width: 100%; height: 62px; padding: 4px; }
  .gallery-preview span { position: static; width: 100%; padding: 6px 7px; display: flex; align-items: center; background: none; color: var(--ink); font-size: .8rem; line-height: 1.1; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
}

@media (max-width: 640px) {
  :root { --shell: calc(100% - 40px); --header: 66px; }
  html { scroll-padding-top: 72px; }
  body { font-size: 15px; }
  .section { padding: 54px 0; }
  .site-header { padding-inline: 20px; }
  h1 { font-size: clamp(2.65rem,11.6vw,3rem); line-height: 1; }
  h2 { font-size: clamp(2.2rem,9.7vw,2.55rem); line-height: 1.02; }
  h3 { font-size: 1.65rem; }
  .section-heading { display: block; margin-bottom: 38px; }
  .section-heading>p:last-child { margin-top: 20px; }
  .eyebrow { margin-bottom: 14px; font-size: .62rem; }
  .hero { min-height: max(700px,100svh); }
  .hero-media img { object-position: 51% center; }
  .hero-shade { background: linear-gradient(0deg,rgba(6,10,8,.94) 0%,rgba(6,10,8,.72) 55%,rgba(6,10,8,.12) 100%); }
  .hero-inner { min-height: max(700px,100svh); padding: calc(var(--header) + 30px) 0 20px; display: flex; flex-direction: column; justify-content: flex-end; }
  .hero-copy { max-width: 100%; padding: 0; }
  .hero h1 { max-width: 350px; }
  .hero-lead { max-width: 340px; margin-top: 18px; font-size: .9rem; }
  .hero-actions { display: grid; gap: 8px; margin-top: 20px; }
  .hero-actions .button { width: 100%; }
  .hero-proof { width: 100%; grid-template-columns: 1fr 1fr; margin-top: 22px; }
  .hero-proof span { padding: 9px 4px 0 0; font-size: .55rem; }
  .system-heading { margin-bottom: 28px; }
  .system-selector { display: block; }
  .system-guide { display: flex; gap: 10px; overflow-x: auto; padding: 11px 0; white-space: nowrap; font-size: .55rem; }
  .system-guide span::after { content: "→"; margin-left: 10px; color: var(--green); }
  .system-guide span:last-child::after { display: none; }
  .system-controls { display: grid; gap: 12px; padding: 12px 0; }
  .visual-controls { grid-template-columns: 1fr; gap: 24px; padding: 20px 0; }
  .visual-control-group>strong { font-size: .76rem; }
  .size-options { grid-template-columns: 1fr 1fr; }
  .size-options img { height: 82px; }
  .surface-options img { height: 96px; }
  .size-options button>span, .surface-options button>span { padding: 8px 9px 10px; }
  .control-group { justify-content: space-between; }
  .control-group>span { font-size: .58rem; }
  .control-group button { padding: 6px 9px; }
  .system-stage { min-height: 235px; }
  .system-stage img { width: 96%; height: 215px; }
  .system-specification { padding: 23px 0 22px; border: 0; border-top: 1px solid var(--line); }
  .system-specification>p:not(.eyebrow) { margin-bottom: 17px; }
  .system-specification dl div { padding: 7px 0; }
  .system-price { margin: 18px 0 12px; }
  .system-tiers { margin-bottom: 20px; }
  .audience-layout { display: block; }
  .audience-heading h2 { max-width: 350px; }
  .audience-switch { margin-top: 28px; grid-template-columns: 1fr; border-bottom: 0; }
  .audience-switch button, .audience-switch button+button { min-height: 54px; padding: 10px 34px 10px 6px; font-size: .7rem; border-bottom: 1px solid var(--line); }
  .audience-switch button span { display: inline; margin-right: 9px; }
  .audience-switch button i { top: 16px; right: 10px; }
  .audience-switch button[aria-selected="true"] { border-top-width: 1px; border-left: 3px solid var(--green); background: rgba(255,255,255,.45); }
  .audience-panels { margin-top: 26px; }
  .audience-panels article { min-height: 0; display: flex; flex-direction: column; gap: 20px; padding-top: 0; }
  .audience-panels figure { min-height: 220px; height: 220px; }
  .audience-panels article>div { padding: 0; }
  .audience-statement { font-size: 2.05rem; }
  .audience-panels ul { margin: 20px 0; }
  .audience-panels .button { width: 100%; }
  .detail-gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 250px 150px 150px; gap: 8px; }
  .detail-gallery .detail-large { grid-column: 1 / 3; grid-row: 1; }
  .detail-gallery figure:last-child { grid-column: 1 / 3; }
  .detail-gallery figcaption { padding: 28px 13px 12px; }
  .technical-facts { grid-template-columns: 1fr 1fr; margin: 24px 0 22px; }
  .technical-facts div { padding: 11px 10px 11px 0; }
  .technical-facts div+div { padding-left: 10px; }
  .technical-facts div:nth-child(3) { border-left: 0; border-top: 1px solid var(--line-dark); }
  .technical-facts div:nth-child(4) { border-top: 1px solid var(--line-dark); }
  .decision-grid { grid-template-columns: 1fr; gap: 30px; }
  .process-list { margin-top: 28px; }
  .process-list li { padding: 15px 0; }
  .decision-actions { align-items: stretch; flex-direction: column; gap: 16px; }
  .decision-actions .button, .decision-actions .text-link { width: 100%; }
  .decision-aside { padding-top: 0; }
  .review-proof strong { font-size: 3rem; }
  .inquiry-grid { grid-template-columns: 1fr; gap: 34px; }
  .inquiry-intro { position: static; }
  .advisor-profile { grid-template-columns: 118px 1fr; margin: 26px 0 18px; }
  .advisor-profile figure { height: 170px; }
  .advisor-profile>div { padding-left: 17px; }
  .advisor-profile h3 { font-size: 1.4rem; }
  .form-progress { margin-bottom: 30px; }
  .form-grid { grid-template-columns: 1fr; gap: 14px; }
  .form-wide { grid-column: auto; }
  .selected-products-item { display: block; }
  .form-actions { align-items: stretch; flex-direction: column-reverse; }
  .button-back { justify-content: center; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 30px 20px; }
  .footer-mark { text-align: left; }
  .catalog-hero { height: 420px; padding-top: var(--header); }
  .catalog-hero-grid { grid-template-columns: 1fr; grid-template-rows: auto 100px; gap: 16px; padding-top: 26px; }
  .catalog-hero-copy h1 { max-width: 350px; }
  .catalog-hero-copy>p:not(.eyebrow) { margin: 12px 0; font-size: .85rem; }
  .catalog-hero figure { height: 100px; margin-inline: -20px; }
  .catalog-hero figure img { object-position: center 61%; }
  .catalog { padding-top: 56px; }
  .catalog-heading { display: block; margin-bottom: 24px; }
  .catalog-heading h2 { font-size: 2.45rem; }
  .catalog-price-note { margin-top: 18px; text-align: left; }
  .catalog-size-nav { top: var(--header); margin-inline: -20px; grid-template-columns: repeat(4,1fr); }
  .catalog-size-nav a { padding: 6px 3px; display: block; text-align: center; }
  .catalog-size-nav a+a { border-left: 1px solid var(--line); }
  .catalog-size-nav img { width: 100%; height: 48px; }
  .catalog-size-nav b { font-size: .67rem; }
  .catalog-size-nav small { font-size: .56rem; }
  .size-model { scroll-margin-top: 150px; padding: 42px 0; }
  .size-model-heading { grid-template-columns: 32px 1fr; gap: 6px; margin-bottom: 20px; }
  .size-model-heading h2 { font-size: 2.15rem; }
  .size-model-heading small { font-size: .72rem; }
  .size-surface-switch { margin-left: 0; grid-template-columns: 1fr 1fr; }
  .size-surface-switch button { grid-template-columns: 60px 1fr; }
  .size-surface-switch img { width: 60px; height: 62px; }
  .size-surface-switch button>span { padding: 7px 5px; }
  .size-surface-switch b { font-size: .62rem; }
  .size-surface-switch small { font-size: .54rem; }
  .size-model-main { grid-template-columns: 1fr; min-height: 0; }
  .size-model-main>figure { height: 250px; }
  .size-model-main>figure img { width: 94%; height: 230px; }
  .size-model-info { padding: 24px 18px; border-left: 0; border-top: 1px solid var(--line); }
  .size-model-info h3 { font-size: 1.7rem; }
  .size-model .project-action { grid-template-columns: 72px 1fr; gap: 7px; }
  .size-model .project-action .button { padding-inline: 12px; gap: 8px; }
  .size-model .technical-details { margin-left: 0; }
  .size-model .technical-details>div { grid-template-columns: 1fr; }
  .catalog-controls { top: var(--header); margin-inline: -20px; padding: 9px 20px; display: grid; gap: 6px; overflow: hidden; }
  .filter-line { gap: 7px; }
  .filter-line>span { min-width: 54px; font-size: .55rem; }
  .filter-line>div { overflow-x: auto; scrollbar-width: none; }
  .filter-line button { padding: 5px 8px; white-space: nowrap; font-size: .68rem; }
  .comparison-table-head { display: none; }
  .comparison-row { grid-template-columns: 1fr; gap: 14px; min-height: 0; padding: 22px 0; }
  .comparison-product { grid-template-columns: 118px 1fr; gap: 15px; }
  .comparison-product img { width: 118px; height: 118px; }
  .comparison-product h2 { font-size: 1.28rem; }
  .system-data { grid-template-columns: 1fr 1fr; }
  .price-stack { display: grid; grid-template-columns: .9fr 1.3fr; gap: 12px; align-items: start; }
  .project-action { grid-column: auto; margin: 0; }
  .technical-details { grid-column: auto; margin: 0; }
  .technical-details>div { grid-template-columns: 1fr; gap: 10px; }
  .catalog-service-grid { grid-template-columns: 1fr; gap: 30px; }
  .selection-tray { bottom: max(8px,env(safe-area-inset-bottom)); width: calc(100% - 16px); padding: 9px 9px 9px 12px; }
  body.is-interacting .selection-tray { display: none; }
  .selection-clear { display: none; }
  .selection-label strong { font-size: .68rem; }
  .selection-link { min-height: 38px; padding-inline: 12px; }
  .mobile-conversion { position: fixed; z-index: 38; left: 8px; right: 8px; bottom: max(8px,env(safe-area-inset-bottom)); height: 50px; grid-template-columns: 1.15fr .85fr; background: var(--ink); box-shadow: 0 9px 28px rgba(0,0,0,.25); transform: translateY(140%); transition: transform .25s ease; }
  .mobile-conversion.is-visible { display: grid; transform: translateY(0); }
  .mobile-conversion a, .mobile-conversion button { display: grid; place-items: center; border: 0; background: transparent; color: var(--white); text-decoration: none; font-size: .7rem; font-weight: 650; }
  .mobile-conversion a { background: var(--green); }
  .mobile-conversion button { border-left: 1px solid var(--line-dark); }
  body.is-interacting .mobile-conversion, body.modal-open .mobile-conversion, body.has-selection .mobile-conversion { display: none; }
  .modal { padding: 8px; }
  .modal-panel { max-height: calc(100svh - 16px); padding: 24px; }
  .modal-panel iframe { height: calc(100svh - 140px); }
}

/* V4: readable editorial typography and product galleries */
:root { --header: 80px; }
body { font-size: 17px; }
.site-header-overlay:not(.is-scrolled) { background: rgba(13,18,16,.72); border-color: rgba(255,255,255,.34); backdrop-filter: blur(14px); }
.brand small { font-size: .72rem; opacity: .82; }
.main-nav { gap: 26px; }
.main-nav a, .nav-consult { font-size: .9rem; font-weight: 560; }
.mobile-toggle { min-width: 44px; min-height: 44px; font-size: .88rem; }
.button { min-height: 54px; padding-inline: 22px; font-size: .95rem; }
.button-ghost { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.button-ghost:hover { background: var(--white); }
.text-link { min-height: 44px; font-size: .9rem; }
.eyebrow { font-size: .75rem; }
.hero-copy { max-width: 850px; }
.hero h1 { max-width: 850px; }
.hero-lead { font-size: 1.08rem; color: rgba(255,255,255,.9); }
.hero-proof span { padding: 17px 16px 0 0; color: rgba(255,255,255,.86); font-size: .82rem; letter-spacing: .02em; line-height: 1.35; text-transform: none; }
.hero-proof strong { display: block; margin-bottom: 2px; font-size: .92rem; }
.system-guide { padding-block: 17px; font-size: .84rem; letter-spacing: .045em; }
.visual-control-group>strong { font-size: .94rem; }
.size-options b, .surface-options b, .size-surface-switch b { font-size: .94rem; }
.size-options small, .surface-options small, .size-surface-switch small { font-size: .84rem; }
.system-specification>p:not(.eyebrow), .article-number { font-size: .88rem; }
.system-specification dl div, .size-model-info dl div { font-size: .88rem; }
.system-price span, .system-price small, .model-price span { font-size: .88rem; }
.system-tiers span, .model-tiers span { font-size: .88rem; }
.system-tiers b, .model-tiers b { font-size: .86rem; }
.audience-switch button { min-height: 58px; font-size: .94rem; line-height: 1.35; }
.audience-switch button span { font-size: .8rem; }
.audience-panels li { font-size: .92rem; }
.detail-gallery figcaption strong { font-size: .92rem; }
.detail-gallery figcaption span { font-size: .82rem; }
.technical-facts span, .technical-facts small { font-size: .82rem; }
.technical-facts strong { font-size: .96rem; }
.process-list li>span { font-size: .75rem; }
.process-list p { font-size: .92rem; }
.review-proof small { font-size: .78rem; }
.faq-list summary { min-height: 44px; align-items: center; font-size: .92rem; }
.faq-list p { font-size: .9rem; }
.advisor-profile>div>span { font-size: .75rem; }
.advisor-profile p { font-size: .88rem; }
.advisor-contact a, .advisor-contact button { font-size: .86rem; }
.inquiry-assurances { margin: 26px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.inquiry-assurances li { padding: 10px 0 10px 22px; position: relative; border-bottom: 1px solid var(--line); color: #515954; font-size: .88rem; }
.inquiry-assurances li::before { content: "✓"; position: absolute; left: 0; color: var(--green); font-weight: 700; }
.form-progress span, .form-grid label>span, .selected-products>span { font-size: .84rem; }
.selected-products-item, .privacy-check, .turnstile-area p, .form-status { font-size: .88rem; }
.footer-grid>p, .footer-grid nav a { font-size: .84rem; }
.catalog-price-note { font-size: .88rem; }
.catalog-size-nav b { font-size: .94rem; }
.catalog-size-nav small { font-size: .84rem; }
.size-model-heading>span, .size-model-heading p { font-size: .88rem; }
.size-model-heading small { font-size: .95rem; }
.size-model .project-action label span { font-size: .84rem; }
.size-model .project-action .button { font-size: .95rem; }
.technical-details summary { min-height: 44px; display: flex; align-items: center; font-size: .88rem; }
.technical-details>div, .catalog-note, .catalog-service-grid li { font-size: .86rem; }
.selection-label span, .selection-clear { font-size: .78rem; }
.selection-label strong { font-size: .9rem; }

/* Die Projektliste sitzt in der Navigation und verdeckt keine Inhalte mehr. */
.header-selection {
  min-height: 44px;
  margin-left: auto;
  padding: 0 11px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid currentColor;
  background: rgba(20,24,22,.2);
  color: inherit;
  cursor: pointer;
}
.site-header-solid .header-selection,
.site-header.is-scrolled .header-selection { background: var(--white); }
.header-selection span { font-size: .82rem; font-weight: 650; }
.header-selection b { min-width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: var(--white); font-size: .76rem; }
.header-selection strong { color: inherit; font-size: .82rem; font-weight: 520; }
.header-selection:not(.is-visible) { display: none; }

.product-gallery { min-width: 0; margin: 0; display: block; background: #f2f1ec; }
.product-gallery.system-stage { width: 100%; min-height: 560px; display: block; place-items: initial; overflow: hidden; }
.gallery-main { position: relative; height: 455px; overflow: hidden; background: #f2f1ec; }
.gallery-image-button { width: 100%; height: 100%; padding: 0; border: 0; display: block; background: transparent; cursor: zoom-in; }
.product-gallery .gallery-main img { width: 100%; height: 100%; padding: 24px; object-fit: contain; transition: opacity .18s, transform .32s ease; }
.product-gallery .gallery-main img.is-changing { opacity: 0; transform: translateY(8px); }
.gallery-image-button>span { position: absolute; top: 16px; right: 16px; min-height: 44px; padding: 0 15px; display: inline-flex; align-items: center; background: rgba(20,24,22,.9); color: var(--white); font-size: .94rem; font-weight: 650; }
.gallery-arrow { position: absolute; z-index: 2; top: 50%; width: 46px; height: 46px; border: 1px solid rgba(20,24,22,.22); background: rgba(248,247,242,.94); color: var(--ink); font-size: 1.15rem; cursor: pointer; transform: translateY(-50%); }
.gallery-arrow:hover { background: var(--white); }
.gallery-arrow-prev { left: 14px; }
.gallery-arrow-next { right: 14px; }
.gallery-counter { position: absolute; z-index: 2; left: 16px; bottom: 14px; min-height: 34px; padding: 0 11px; display: inline-flex; align-items: center; background: rgba(20,24,22,.86); color: var(--white); font-size: .82rem; }
.gallery-preview { min-height: 105px; padding: 8px; display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; border-top: 1px solid var(--line); background: var(--paper); }
.gallery-preview button { min-width: 0; height: 88px; padding: 0; display: grid; grid-template-columns: 88px 1fr; align-items: center; border: 1px solid transparent; background: #efeee8; color: var(--ink); text-align: left; cursor: pointer; }
.gallery-preview button.is-active { border-color: var(--green); box-shadow: inset 0 -3px var(--green); }
.gallery-preview img { width: 88px; height: 86px; padding: 5px; object-fit: contain; }
.gallery-preview span { padding: 8px; font-size: .88rem; font-weight: 620; }
.catalog-product-gallery { border-right: 0; }
.size-model-main>.product-gallery { align-self: stretch; }
.size-model-main>.product-gallery .gallery-main { height: 405px; }
.size-model-main>.product-gallery .gallery-preview { min-height: 105px; }

.gallery-modal { padding: 12px; }
.gallery-modal .modal-backdrop { background: rgba(8,11,10,.94); }
.gallery-modal-panel { position: relative; z-index: 1; width: min(1500px,100%); height: calc(100svh - 24px); padding: 22px 26px 18px; display: grid; grid-template-rows: auto minmax(0,1fr) auto auto; gap: 12px; overflow: hidden; background: #111513; color: var(--white); }
.gallery-modal-panel>header { display: flex; align-items: start; justify-content: space-between; gap: 30px; }
.gallery-modal-panel h2 { font-size: clamp(1.8rem,3vw,2.8rem); }
.gallery-modal-panel .eyebrow { margin-bottom: 8px; color: #aeb6b1; }
.gallery-modal-close { width: 48px; height: 48px; border: 1px solid var(--line-dark); background: transparent; color: var(--white); font-size: 1.8rem; cursor: pointer; }
.gallery-modal-stage { min-height: 0; display: grid; grid-template-columns: 52px minmax(0,1fr) 52px; align-items: center; gap: 12px; }
.gallery-modal-stage>button { width: 52px; height: 52px; border: 1px solid var(--line-dark); background: #202622; color: var(--white); font-size: 1.2rem; cursor: pointer; }
.gallery-modal-image-wrap { position: relative; height: 100%; min-height: 0; display: grid; place-items: center; overflow: auto; background: #e8e7e1; }
.gallery-modal-image-wrap>img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; transition: width .25s ease; }
.gallery-modal-image-wrap.is-zoomed { display: block; cursor: zoom-out; }
.gallery-modal-image-wrap.is-zoomed>img { max-width: none; max-height: none; width: 145%; }
.gallery-zoom { position: absolute; right: 12px; bottom: 12px; min-height: 44px; padding: 0 14px; border: 0; background: rgba(20,24,22,.9); color: var(--white); font-size: .94rem; cursor: pointer; }
.gallery-modal-meta { min-height: 28px; display: flex; justify-content: space-between; gap: 20px; color: #c2c9c5; font-size: .88rem; }
.gallery-modal-thumbnails { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-color: #606863 transparent; }
.gallery-modal-thumbnails button { flex: 0 0 104px; height: 78px; padding: 0; border: 1px solid transparent; background: #202622; scroll-snap-align: center; cursor: pointer; }
.gallery-modal-thumbnails button.is-active { border-color: #6fb392; }
.gallery-modal-thumbnails img { width: 100%; height: 100%; padding: 4px; object-fit: contain; }

@media (max-width: 640px) {
  :root { --header: 72px; }
  body { font-size: 16px; }
  h1 { max-width: 100%; font-size: clamp(2.35rem,10.2vw,2.7rem); line-height: 1.02; overflow-wrap: normal; word-break: normal; hyphens: none; }
  .site-header { padding-inline: 20px; }
  .brand small { font-size: .7rem; }
  .button { min-height: 54px; font-size: .94rem; }
  .eyebrow { font-size: .75rem; }
  .hero { min-height: max(760px,100svh); }
  .hero-inner { min-height: max(760px,100svh); padding-bottom: 22px; }
  .hero h1 { max-width: 350px; }
  .hero-lead { max-width: 350px; font-size: 1rem; }
  .hero-proof { gap: 0 12px; }
  .hero-proof span { min-height: 52px; padding: 10px 4px 0 0; font-size: .82rem; }
  .hero-proof strong { font-size: .88rem; }
  .system-guide { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; overflow: visible; white-space: normal; font-size: .88rem; line-height: 1.25; text-align: center; }
  .system-guide span::after { display: none; }
  .visual-control-group>strong { font-size: .94rem; }
  .size-options b, .surface-options b, .size-surface-switch b { font-size: .86rem; }
  .size-options small, .surface-options small, .size-surface-switch small { font-size: .88rem; }
  .product-gallery.system-stage { min-height: 0; }
  .gallery-main { height: 260px; }
  .product-gallery .gallery-main img { height: 100%; padding: 16px; }
  .gallery-image-button>span { top: 10px; right: 10px; min-height: 44px; padding-inline: 12px; font-size: .94rem; }
  .gallery-arrow { top: auto; bottom: 10px; width: 42px; height: 42px; transform: none; }
  .gallery-arrow-prev { left: auto; right: 58px; }
  .gallery-arrow-next { right: 10px; }
  .gallery-counter { left: 10px; bottom: 14px; font-size: .82rem; }
  .gallery-preview { min-height: 96px; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .gallery-preview button { flex: 0 0 104px; height: 80px; display: block; position: relative; scroll-snap-align: start; }
  .gallery-preview img { width: 100%; height: 78px; }
  .gallery-preview span { position: absolute; inset: auto 0 0; padding: 18px 6px 5px; background: linear-gradient(transparent,rgba(20,24,22,.82)); color: var(--white); font-size: .82rem; }
  .audience-switch button, .audience-switch button+button { min-height: 58px; font-size: .92rem; }
  .technical-facts span, .technical-facts small { font-size: .88rem; }
  .size-model-heading small { font-size: .9rem; }
  .catalog-size-nav b { font-size: .94rem; }
  .catalog-size-nav small { font-size: .84rem; }
  .size-surface-switch b { font-size: .94rem; }
  .size-surface-switch small { font-size: .84rem; }
  .size-model-main>.product-gallery .gallery-main { height: 260px; }
  .size-model-main>.product-gallery .gallery-preview { min-height: 96px; }
  .size-model-info { padding: 28px 20px; }
  .mobile-conversion { height: 56px; }
  .mobile-conversion a, .mobile-conversion button { font-size: .92rem; }
  .gallery-modal { padding: 0; }
  .gallery-modal-panel { width: 100%; height: 100svh; padding: 16px 14px 12px; gap: 9px; }
  .gallery-modal-panel h2 { font-size: 1.55rem; }
  .gallery-modal-close { width: 44px; height: 44px; }
  .gallery-modal-stage { grid-template-columns: 44px minmax(0,1fr) 44px; gap: 5px; }
  .gallery-modal-stage>button { width: 44px; height: 48px; }
  .gallery-modal-image-wrap.is-zoomed>img { width: 210%; }
  .gallery-zoom { right: 8px; bottom: 8px; font-size: .94rem; }
  .gallery-modal-meta { font-size: .82rem; }
  .gallery-modal-thumbnails button { flex-basis: 88px; height: 66px; }
}

/* V5: klare Produktauswahl und gemeinsame Projektliste */
.configuration-action { margin: 24px 0 10px; display: grid; grid-template-columns: 1fr 172px; gap: 18px; align-items: center; }
.configuration-action>span, .project-action label>span { font-size: .88rem; font-weight: 620; }
.quantity-stepper { height: 52px; display: grid; grid-template-columns: 48px minmax(54px,1fr) 48px; border: 1px solid var(--line); background: var(--white); }
.quantity-stepper button { min-width: 44px; border: 0; background: transparent; font-size: 1.25rem; cursor: pointer; }
.quantity-stepper button:hover { background: var(--stone); }
.quantity-stepper input { height: 50px !important; min-height: 0; padding: 0 !important; border: 0 !important; border-inline: 1px solid var(--line) !important; text-align: center; font-weight: 650; box-shadow: none !important; appearance: textfield; }
.quantity-stepper input::-webkit-inner-spin-button { appearance: none; }
.size-model .project-action { grid-template-columns: minmax(170px,.72fr) 1.28fr; gap: 10px; align-items: end; }
.size-model .project-action label { gap: 8px; }
.size-model .project-action .quantity-stepper { width: 100%; }
.catalog-selection-help { max-width: 630px; margin: 15px 0 0; color: #5f6662; font-size: 1rem; }

.selection-tray { width: min(900px,calc(100% - 32px)); min-height: 72px; padding: 9px; gap: 10px; transform: translateX(-50%) translateY(150%); }
.selection-tray[hidden] { display: none !important; }
.selection-summary { min-width: 0; flex: 1; align-self: stretch; padding: 8px 12px; display: grid; gap: 2px; border: 0; background: transparent; color: var(--white); text-align: left; cursor: pointer; }
.selection-summary span { color: #b9c0bc; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.selection-summary span b { min-width: 24px; height: 24px; margin-left: 5px; display: inline-grid; place-items: center; border: 1px solid #66706b; border-radius: 50%; color: var(--white); font-size: .78rem; }
.selection-summary strong { overflow: hidden; font-size: .95rem; font-weight: 620; text-overflow: ellipsis; white-space: nowrap; }
.selection-link { min-height: 54px; }

.project-list-modal { place-items: stretch end; padding: 0; }
.project-list-modal .modal-backdrop { background: rgba(8,12,10,.66); backdrop-filter: blur(3px); }
.project-list-drawer { position: relative; z-index: 1; width: min(560px,100%); height: 100svh; padding: 30px 32px max(26px,env(safe-area-inset-bottom)); display: grid; grid-template-rows: auto minmax(0,1fr) auto; background: var(--paper); box-shadow: -28px 0 70px rgba(0,0,0,.22); animation: drawer-in .3s cubic-bezier(.2,.75,.25,1); }
@keyframes drawer-in { from { transform: translateX(100%); } }
.project-list-drawer>header { display: flex; align-items: start; justify-content: space-between; gap: 24px; padding-bottom: 22px; border-bottom: 1px solid var(--ink); }
.project-list-drawer h2 { font-size: clamp(2.4rem,5vw,3.5rem); }
.project-list-close { width: 48px; height: 48px; flex: 0 0 auto; border: 1px solid var(--line); background: transparent; font-size: 1.7rem; cursor: pointer; }
.project-list-items { min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.project-list-item { display: grid; grid-template-columns: 86px minmax(0,1fr) 150px; gap: 14px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--line); }
.project-list-item>img { width: 86px; height: 86px; padding: 5px; background: var(--white); object-fit: contain; }
.project-list-item-copy { min-width: 0; display: grid; gap: 4px; }
.project-list-item-copy strong { font-size: 1rem; }
.project-list-item-copy span { color: #646c67; font-size: .82rem; line-height: 1.35; }
.project-list-item .quantity-stepper { height: 46px; grid-template-columns: 42px minmax(42px,1fr) 42px; }
.project-list-item .quantity-stepper input { height: 44px !important; }
.project-list-remove { grid-column: 3; justify-self: end; margin-top: -8px; border: 0; background: none; color: #6b726e; font-size: .8rem; text-decoration: underline; cursor: pointer; }
.project-list-drawer>footer { padding-top: 20px; display: grid; gap: 10px; border-top: 1px solid var(--ink); }
.project-list-drawer>footer>strong { margin-bottom: 6px; font-size: 1rem; }
.project-list-drawer>footer .button, .project-list-drawer>footer .text-link { width: 100%; }
.project-list-drawer>footer .selection-clear { justify-self: start; min-height: 36px; border: 0; background: none; color: #676f6a; text-decoration: underline; cursor: pointer; }

.selected-products { padding: 17px 0; }
.selected-products #selected-products-list { display: grid; }
.selected-products .project-list-item { grid-template-columns: 70px minmax(0,1fr) 142px; padding: 14px 0; }
.selected-products .project-list-item>img { width: 70px; height: 70px; }
.selected-products .project-list-item-copy strong { font-size: .92rem; }
.selected-products .project-list-remove { grid-column: 3; }

.gallery-preview button { overflow: hidden; }
.gallery-preview span { min-width: 0; overflow-wrap: normal; word-break: normal; hyphens: none; line-height: 1.2; }

.quality .detail-gallery figure, .quality .technical-facts>div { opacity: 1; transform: none; }
.quality .reveal-ready { opacity: 0; transform: translateY(22px); transition: opacity .55s ease, transform .55s ease; }
.quality .reveal-ready.is-revealed { opacity: 1; transform: translateY(0); }
.quality .detail-gallery figure:nth-child(2) { transition-delay: .06s; }
.quality .detail-gallery figure:nth-child(3) { transition-delay: .12s; }
.quality .detail-gallery figure:nth-child(4) { transition-delay: .18s; }

@media (max-width: 640px) {
  .section { padding: 38px 0; }
  .section-heading { margin-bottom: 30px; }
  .site-header { gap: 10px; }
  .header-selection { min-width: 44px; width: 44px; padding: 0; justify-content: center; }
  .header-selection span, .header-selection strong { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .header-selection b { min-width: 26px; height: 26px; }
  .system-heading { margin-bottom: 24px; }
  .system-heading h2, .quality-heading h2 { font-size: 2.2rem; }
  .visual-controls { gap: 16px; padding-block: 15px; }
  .visual-control-group { min-width: 0; width: 100%; }
  .size-options { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
  .size-options, .surface-options { min-width: 0; width: 100%; }
  .size-options button { flex: 0 0 132px; scroll-snap-align: start; }
  .size-options img { height: 72px; }
  .surface-options img { height: 82px; }
  .system-specification dl { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
  .system-specification dl div { min-width: 0; display: grid; gap: 2px; border-top: 0; border-bottom: 1px solid var(--line); }
  .system-specification dl div:nth-child(even) { padding-left: 12px; border-left: 1px solid var(--line); }
  .system-specification dd { text-align: left; }
  .configuration-action { margin-top: 16px; }
  .audience-switch { margin-top: 22px; }
  .audience-switch { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .audience-switch button, .audience-switch button+button { min-height: 86px; padding: 9px 8px; border-left: 0; border-bottom: 1px solid var(--line); font-size: .76rem; line-height: 1.2; }
  .audience-switch button span { display: block; margin: 0 0 4px; }
  .audience-switch button i { top: 8px; right: 7px; }
  .audience-switch button[aria-selected="true"] { border-left: 0; border-bottom: 3px solid var(--green); }
  .audience-panels { margin-top: 20px; }
  .audience-panels figure { min-height: 165px; height: 165px; }
  .audience-statement { font-size: 1.85rem; }
  .audience-panels ul { margin: 15px 0; }
  .quality .detail-gallery { margin-inline: -20px; padding-inline: 20px; display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
  .quality .detail-gallery figure,
  .quality .detail-gallery .detail-large,
  .quality .detail-gallery figure:last-child { flex: 0 0 min(82vw,320px); height: 260px; grid-column: auto; grid-row: auto; scroll-snap-align: start; }
  .technical-facts { margin-top: 20px; }
  .decision-grid { gap: 24px; }
  .process-list { margin-top: 24px; }
  .process-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
  .process-list li { min-width: 0; padding: 13px 8px 13px 0; display: block; border-bottom: 1px solid var(--ink); }
  .process-list li+li { padding-left: 10px; border-left: 1px solid var(--line); }
  .process-list li>span { display: block; margin-bottom: 8px; }
  .process-list strong { display: block; font-size: .9rem; line-height: 1.2; }
  .process-list p { margin-top: 7px; font-size: .78rem; line-height: 1.35; }
  .decision-actions { display: grid; grid-template-columns: 1.25fr .75fr; gap: 9px; }
  .decision-actions .button, .decision-actions .text-link { min-width: 0; font-size: .82rem; line-height: 1.15; }
  .decision-aside { display: grid; gap: 10px; }
  .review-proof { padding-bottom: 22px; }
  .inquiry-grid { gap: 28px; }
  .advisor-profile { grid-template-columns: 108px 1fr; }
  .advisor-profile figure { height: 154px; }
  .advisor-profile>div { padding-top: 15px; padding-bottom: 13px; }
  .catalog-hero { height: 385px; }
  .configuration-action { grid-template-columns: 1fr; gap: 8px; margin-top: 20px; }
  .configuration-action .quantity-stepper { width: 100%; }
  .size-model .project-action { grid-template-columns: 1fr; }
  .size-model .project-action .button { width: 100%; }
  .catalog-selection-help { font-size: .94rem; }
  .project-list-modal { place-items: end stretch; }
  .project-list-drawer { width: 100%; height: min(82svh,760px); padding: 20px 20px max(18px,env(safe-area-inset-bottom)); border-radius: 18px 18px 0 0; animation-name: sheet-in; }
  @keyframes sheet-in { from { transform: translateY(100%); } }
  .project-list-drawer>header { padding-bottom: 16px; }
  .project-list-drawer h2 { font-size: 2.35rem; }
  .project-list-item { grid-template-columns: 64px minmax(0,1fr); gap: 10px; padding: 14px 0; }
  .project-list-item>img { width: 64px; height: 64px; }
  .project-list-item .quantity-stepper { grid-column: 1 / 3; width: calc(100% - 92px); margin-left: 74px; }
  .project-list-remove { grid-column: 2; margin-top: 0; align-self: auto; }
  .project-list-drawer>footer>strong { font-size: .9rem; }
  .project-list-drawer>footer .selection-clear { display: inline-block; }
  .selected-products .project-list-item { grid-template-columns: 58px minmax(0,1fr); }
  .selected-products .project-list-item>img { width: 58px; height: 58px; }
  .selected-products .project-list-item .quantity-stepper { grid-column: 1 / 3; width: calc(100% - 68px); margin-left: 68px; }
  .selected-products .project-list-remove { grid-column: 2; margin-top: 0; }
  .gallery-preview { min-height: 128px; align-items: stretch; padding: 8px 8px 10px; gap: 8px; }
  .gallery-preview button { flex: 0 0 124px; width: 124px; height: 108px; display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: 74px 34px; background: var(--white); }
  .gallery-preview img { width: 100%; height: 74px; padding: 4px; }
  .gallery-preview span { position: static; width: 100%; padding: 6px 7px; display: flex; align-items: center; background: none; color: var(--ink); font-size: .82rem; line-height: 1.15; white-space: nowrap; }
}

/* Muss nach den Galerie-Basisregeln stehen, damit Tablet-Kacheln nicht zurückgesetzt werden. */
@media (min-width: 641px) and (max-width: 1180px) {
  .gallery-preview { min-height: 112px; display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
  .gallery-preview button { flex: 0 0 124px; width: 124px; height: 94px; display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: 62px 32px; scroll-snap-align: start; background: var(--white); }
  .gallery-preview img { width: 100%; height: 62px; padding: 4px; }
  .gallery-preview span { position: static; width: 100%; padding: 6px 7px; display: flex; align-items: center; background: none; color: var(--ink); font-size: .8rem; line-height: 1.1; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}