/* Website UI kit styles — extends colors_and_type.css */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
html, body { scroll-padding-top: 100px; }
body { background: var(--bg); color: var(--fg-1); }
/* subtle warmth across white sections so the page doesn't read stark */
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background-image: url('assets/pattern-blueprint.svg'); background-size: 32px 32px; opacity: 0.035; }

.container { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.eyebrow { font-size: 11px; font-weight: 600; letter-spacing: var(--tracking-widest);
  text-transform: uppercase; color: var(--lb-red-600);
  display: inline-flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-3); }
.eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; }
.hero .eyebrow { background: rgba(250,250,247,0.82); padding: 6px 12px 6px 8px; backdrop-filter: blur(3px); }

/* Buttons */
.btn { font-family: var(--font-body); font-weight: 600; font-size: 14px;
  letter-spacing: 0.01em; border: 0; cursor: pointer; padding: 14px 22px;
  display: inline-flex; align-items: center; gap: 10px; border-radius: 0;
  transition: background var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out), transform var(--dur-fast) var(--ease-out);
  text-decoration: none; }
.btn--sm { padding: 9px 14px; font-size: 13px; }
.btn--primary { background: var(--lb-red-600); color: #fff; }
.btn--primary:hover { background: var(--lb-red-700); }
.btn--primary:active { transform: translateY(1px); }
.btn--ghost { background: transparent; color: var(--lb-ink-900); border: 1px solid var(--lb-ink-900); }
.btn--ghost:hover { background: var(--lb-ink-900); color: #fff; }
.btn--text { background: transparent; color: var(--lb-red-600); padding: 12px 0;
  position: relative; }
.btn--text::after { content: ""; position: absolute; left: 0; bottom: 6px;
  height: 1px; width: 100%; background: currentColor;
  transform: scaleX(1); transform-origin: left;
  transition: transform var(--dur-base) var(--ease-out); }
.btn--text:hover::after { transform: scaleX(1.05); }
/* On-photo variant (hero) — needs a solid backing since it sits over an image */
.hero .btn--text { background: rgba(17,17,17,0.5); color: #fff; padding: 12px 18px; backdrop-filter: blur(2px); }
.hero .btn--text::after { left: 18px; bottom: 8px; width: calc(100% - 36px); }
.hero .btn--text:hover { color: var(--lb-red-500); }

/* ── Nav ───────────────────────────────────────────────── */
.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(250,250,247,0.95); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); transition: box-shadow var(--dur-base); }
.nav--scrolled { box-shadow: 0 2px 16px -8px rgba(17,17,17,0.18); }
body { padding-top: 72px; }
@media (max-width: 960px) { body { padding-top: 68px; } }
.nav__inner { max-width: var(--container); margin: 0 auto; padding: 14px var(--gutter);
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--sp-6); }
.nav__brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; border: 0; color: inherit; }
.nav__mark { width: 40px; height: 40px; background: var(--lb-ink-900); color: #FAFAF7;
  font-family: var(--font-display); font-weight: 800; font-size: 28px; line-height: 1;
  display: grid; place-items: center; letter-spacing: -2px; }
.nav__word { display: flex; flex-direction: column; line-height: 1; }
.nav__name { font-family: var(--font-display); font-weight: 700; font-size: 17px; letter-spacing: -0.005em; color: var(--lb-ink-900); }
.nav__sub { font-size: 10px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-red-600); font-weight: 600; margin-top: 3px; }
.nav__items { list-style: none; display: flex; gap: var(--sp-6); justify-content: center; margin: 0; padding: 0; }
.nav__items a { color: var(--fg-1); font-size: 14px; font-weight: 500; text-decoration: none; border: 0; position: relative; padding: 6px 0; }
.nav__items a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0;
  height: 2px; background: var(--lb-red-600); transform: scaleX(0); transform-origin: left;
  transition: transform var(--dur-base) var(--ease-out); }
.nav__items a:hover::after { transform: scaleX(1); }
.nav__right { display: flex; align-items: center; gap: 14px; }
.lang { display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 1px solid var(--border-strong); color: var(--fg-2);
  font-family: var(--font-mono); font-size: 11px; padding: 8px 10px; letter-spacing: 0.04em; }
.lang__sep { opacity: 0.5; }
.lang__active { color: var(--lb-ink-900); font-weight: 600; }
.lang__other { color: var(--fg-3); text-decoration: none; border: 0; transition: color var(--dur-fast) var(--ease-out); }
.lang__other:hover { color: var(--lb-red-600); }

/* ── Hero ────────────────────────────────────────────── */
.hero { position: relative; padding: 0 0 170px; overflow: hidden; border-bottom: 1px solid var(--border); background: var(--lb-paper-50); }
.hero__fade { position: absolute; left: 0; right: 0; bottom: 0; height: 150px; z-index: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(250,250,247,0) 0%, var(--lb-paper-50) 100%); }
.hero__photo { position: absolute; inset: 0; background-image: url('assets/hero-prad.jpg'); background-size: cover; background-position: center 58%; opacity: 0.7; z-index: 0; }
.hero__scrim { display: none; }
.hero__inner, .hero__marquee { position: relative; z-index: 1; }
.hero__marquee { position: absolute; left: 0; right: 0; top: 14px; overflow: hidden; pointer-events: none; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.hero__marquee-track { display: inline-flex; white-space: nowrap; animation: marq 120s linear infinite;
  font-family: var(--font-display); font-weight: 800; font-size: clamp(56px, 5.6vw, 84px); text-transform: uppercase; letter-spacing: -0.02em; color: var(--lb-red-600); line-height: 1.12; padding-top: 0.14em; gap: 28px; }
.hero__marquee-track em { color: var(--lb-red-700); font-style: normal; }
@keyframes marq { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.hero__inner { position: relative; z-index: 1; padding-top: calc(clamp(56px, 5.6vw, 84px) * 1.26 - 22px); }
.hero__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(48px, 6.2vw, 100px);
  line-height: 0.95; letter-spacing: -0.02em; color: var(--lb-ink-900); margin: 0 0 var(--sp-4);
  text-transform: none; }
.hero__title-link { color: inherit; text-decoration: none; border: 0; display: inline-block; background: rgba(250,250,247,0.5); padding: 10px 20px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.hero__title-link:hover .hero__rotator-word { color: var(--lb-red-700); }
.hero__rotator { display: block; width: 4.9em; padding-bottom: 0.18em; vertical-align: baseline; }
.hero__rotator-word { display: inline-block; color: var(--lb-red-600);
  animation: rotin var(--dur-reveal) var(--ease-out) both; }
@keyframes rotin { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }

.hero__lede { font-size: 18px; line-height: 1.5; color: var(--fg-2); max-width: 60ch; margin: 0 0 var(--sp-5);
  display: inline-block; background: rgba(250,250,247,0.5); padding: 14px 18px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.hero__cta { display: flex; gap: var(--sp-5); align-items: center; margin-bottom: var(--sp-6); flex-wrap: wrap; }
.hero .btn--text { background: transparent; color: var(--lb-red-600); padding: 12px 0; }
.hero .btn--text::after { left: 0; bottom: 6px; width: 100%; }
.hero .btn--text:hover { color: var(--lb-red-700); }

.hero__rail { display: flex; flex-direction: column; gap: 1px; background: rgba(0,0,0,0.08); border-top: 1px solid rgba(255,255,255,0.4); border-bottom: 1px solid rgba(255,255,255,0.4); }
.hero__rail-row { display: grid; gap: 1px; align-items: stretch; }
.hero__rail-item { background: rgba(250,250,247,0.42); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 0; text-align: left; padding: 14px 18px; cursor: pointer; font-family: var(--font-body); display: flex; flex-direction: column; justify-content: center; gap: 8px; min-height: 88px; transition: background var(--dur-fast); position: relative; text-decoration: none; color: var(--fg-1); backdrop-filter: blur(3px); }
.hero__rail-item::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--lb-red-600); transform: scaleY(0); transform-origin: top; transition: transform var(--dur-base) var(--ease-out); }
.hero__rail-item.is-active { background: rgba(255,255,255,0.82); }
.hero__rail-item.is-active::before { transform: scaleY(1); }
.hero__rail-item:hover { background: rgba(255,255,255,0.82); }
.hero__rail-num { font-family: var(--font-mono); font-size: 12px; color: var(--lb-red-600); letter-spacing: 0.08em; }
.hero__rail-label { font-size: 16px; color: var(--fg-1); font-weight: 600; line-height: 1.25; letter-spacing: -0.005em; }

/* ── Section frame ─────────────────────────────────────── */
.section { padding: var(--sp-8) 0; border-bottom: 1px solid var(--border); background: var(--lb-paper-50); }
.section--tint { background: var(--lb-paper-100); }
.section__head { margin-bottom: var(--sp-6); display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-7); align-items: end; }
.section__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(36px, 4.4vw, 64px);
  letter-spacing: -0.02em; line-height: 1; color: var(--lb-ink-900); margin: 0; }
.section__title .dot { color: var(--lb-red-600); }
.section__lede { font-size: 17px; line-height: 1.6; color: var(--fg-2); max-width: 52ch; margin: 0; }

/* ── Services grid ─────────────────────────────────────── */
.svc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
.svc { position: relative; background: #fff; padding: var(--sp-6) var(--sp-5) var(--sp-5) calc(var(--sp-5) + 6px); border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); transition: background var(--dur-base) var(--ease-out); display: flex; flex-direction: column; }
.svc::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--lb-red-600); transition: width var(--dur-base) var(--ease-out); }
.svc:hover { background: var(--lb-paper-50); }
.svc:hover::before { width: 10px; }
.svc__head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--sp-3); }
.svc__icon { width: 52px; height: 52px; display: grid; place-items: center; background: var(--lb-red-100); color: var(--lb-red-600); margin-bottom: var(--sp-4); }
.svc:hover .svc__icon { background: var(--lb-red-600); color: #fff; }
.svc__num { font-family: var(--font-mono); font-size: 11px; color: var(--lb-red-600); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: var(--sp-3); }
.svc__title { font-family: var(--font-display); font-weight: 700; font-size: 22px; line-height: 1.08; letter-spacing: -0.005em; color: var(--lb-ink-900); margin: 0 0 var(--sp-3); text-wrap: balance; }
.svc__body { font-size: 13.5px; line-height: 1.55; color: var(--fg-2); margin: 0 0 var(--sp-4); }
.svc__tags { list-style: none; display: flex; flex-wrap: wrap; gap: 5px; padding: 0; margin: 0 0 var(--sp-4); }
.tag { font-size: 10.5px; padding: 3px 8px; background: var(--lb-paper-100); color: var(--fg-2); letter-spacing: 0.02em; border-radius: 2px; }
.tag--green { background: #E6F2EA; color: var(--lb-signal-green); }
.tag--amber { background: #FBEFDD; color: var(--lb-signal-amber); }
.tag--blue  { background: #E1ECF7; color: var(--lb-signal-blue); }
.svc__title a, .svc__title-link { color: inherit; text-decoration: none; border: 0; transition: color var(--dur-fast) var(--ease-out); }
.svc__title a:hover, .svc__title-link:hover { color: var(--lb-red-600); }
.svc__more { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono); font-size: 12px; color: var(--lb-red-600); border-bottom: 1px solid currentColor; padding-bottom: 2px; letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; margin-top: auto; align-self: flex-start; }

/* ── Forest band removed — sections use their normal paper backgrounds ── */
.forest-bg { position: relative; }


.stats { position: relative; background: var(--lb-ink-900); color: var(--fg-inverse); padding: var(--sp-7) 0; overflow: hidden; }
.stats__photo { position: absolute; inset: 0; background-image: url('assets/hero-prad.jpg'); background-size: cover; background-position: center 30%; opacity: 0.5; }
.stats__scrim { display: none; }
.stats__grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-7); }
.stat { border-left: 6px solid var(--lb-red-600); padding: var(--sp-4) var(--sp-5); background: rgba(17,17,17,0.42); backdrop-filter: blur(3px); }
.stat__value { font-family: var(--font-display); font-weight: 800; font-size: clamp(48px, 6vw, 84px); line-height: 1; color: #fff; letter-spacing: -0.02em; }
.stat__label { font-size: 13px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-paper-300); margin-top: var(--sp-3); }

/* ── Projects gallery ──────────────────────────────────── */
.gallery { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--sp-4); }
.proj { display: block; text-decoration: none; border: 0; color: inherit; grid-column: span 2; }
.proj--span3 { grid-column: span 3; }
.proj__img { aspect-ratio: 4/3; position: relative; display: grid; place-items: center; overflow: hidden; transition: transform var(--dur-base) var(--ease-out); }
.proj:hover .proj__img { transform: translateY(-3px); }
.proj__placeholder { color: rgba(255,255,255,0.65); font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; }
.proj__meta { padding-top: var(--sp-3); }
.proj__top { display: flex; gap: var(--sp-3); font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fg-3); margin-bottom: 4px; }
.proj__year { color: var(--lb-red-600); }
.proj__title { font-family: var(--font-display); font-weight: 700; font-size: 22px; letter-spacing: 0; color: var(--lb-ink-900); margin: 0; line-height: 1.15; }

/* ── About ─────────────────────────────────────────────── */
.about { padding: var(--sp-8) 0; background: var(--lb-paper-100); }
.about__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-9); align-items: start; }
.about__col p { font-size: 16px; line-height: 1.65; color: var(--fg-2); margin: 0 0 var(--sp-4); max-width: 56ch; }
.about__quote { font-family: var(--font-display); font-weight: 700; font-size: 36px; line-height: 1.15; letter-spacing: -0.01em; color: var(--lb-ink-900); margin: 0; padding-left: var(--sp-5); border-left: 6px solid var(--lb-red-600); }
.about__sig { font-family: var(--font-mono); font-size: 12px; color: var(--fg-3); letter-spacing: 0.06em; margin-top: var(--sp-4); }

/* ── Values grid (über uns / unsere Werte) ─────────────── */
.values { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); margin-top: var(--sp-4); }
.value { position: relative; background: #fff; border: 1px solid var(--border); padding: var(--sp-6) var(--sp-6) var(--sp-6) calc(var(--sp-6) + 6px); display: flex; flex-direction: column; gap: var(--sp-3); }
.value::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--lb-red-600); }
.value__title { font-family: var(--font-display); font-weight: 700; font-size: 24px; line-height: 1.15; letter-spacing: -0.005em; color: var(--lb-ink-900); margin: 0; }
.value__body { font-size: 15px; line-height: 1.6; color: var(--fg-2); margin: 0; }

/* ── Kontakt ───────────────────────────────────────────── */
.kontakt { padding: var(--sp-8) 0; background: var(--lb-paper-100); }
.kontakt__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: var(--sp-9); align-items: start; }
.kontakt__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(36px, 4.4vw, 60px); line-height: 1; letter-spacing: -0.02em; color: var(--lb-ink-900); margin: 0 0 var(--sp-4); }
.kontakt__lede { font-size: 16px; line-height: 1.6; color: var(--fg-2); margin: 0 0 var(--sp-6); }
.kontakt__meta { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); margin: 0; }
.kontakt__meta dt { font-size: 11px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-red-600); font-weight: 600; margin-bottom: 4px; }
.kontakt__meta dd { margin: 0; font-size: 14px; color: var(--fg-1); line-height: 1.5; }

.form { background: #fff; border: 1px solid var(--border); padding: var(--sp-7); display: flex; flex-direction: column; gap: var(--sp-5); }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label { font-size: 11px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--fg-3); font-weight: 600; }
.field input, .field select, .field textarea {
  font-family: var(--font-body); font-size: 15px; padding: 12px 14px; border: 1px solid var(--border-strong); background: #fff; border-radius: 2px; color: var(--fg-1); transition: border-color var(--dur-fast), box-shadow var(--dur-fast); }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: 0; border-color: var(--lb-red-600); box-shadow: 0 0 0 3px rgba(168,42,58,0.15); }
.help { font-size: 12px; color: var(--fg-3); }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--fg-2); line-height: 1.5; }
.check input { margin-top: 3px; accent-color: var(--lb-red-600); }
.check a { color: var(--lb-red-600); border-bottom: 1px solid currentColor; text-decoration: none; }
.form__cta { display: flex; gap: var(--sp-5); align-items: center; flex-wrap: wrap; }
.form__note { font-size: 12px; color: var(--fg-3); }
.kontakt__sent { background: #fff; border: 1px solid var(--border); padding: var(--sp-7); display: flex; flex-direction: column; gap: var(--sp-4); align-items: flex-start; }
.kontakt__sent-title { font-family: var(--font-display); font-weight: 700; font-size: 32px; margin: 0; }

/* ── Footer ────────────────────────────────────────────── */
.foot { background: var(--lb-ink-900); color: var(--lb-paper-300); padding: var(--sp-9) 0 0; }
.foot__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: var(--sp-7); padding-bottom: var(--sp-8); }
.foot__brand { display: flex; gap: 14px; align-items: flex-start; }
.foot__mark { width: 56px; height: 56px; background: var(--lb-red-600); color: #fff; font-family: var(--font-display); font-weight: 800; font-size: 38px; display: grid; place-items: center; letter-spacing: -2px; flex-shrink: 0; line-height: 1; }
.foot__name { font-family: var(--font-display); font-weight: 800; font-size: 22px; color: #fff; letter-spacing: -0.005em; line-height: 1.1; }
.foot__sub { font-family: var(--font-body); font-size: 11px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-red-500); font-weight: 600; margin-top: 6px; }
.foot__col h5 { font-family: var(--font-body); font-size: 11px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-paper-400); font-weight: 600; margin: 0 0 var(--sp-4); }
.foot__col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.foot__col a { color: var(--lb-paper-200); font-size: 14px; text-decoration: none; border: 0; transition: color var(--dur-fast); }
.foot__col a:hover { color: var(--lb-red-500); }
.foot__col--addr address { font-style: normal; font-size: 14px; line-height: 1.6; color: var(--lb-paper-200); }
.foot__col--addr a { border: 0; }
.foot__fine { border-top: 1px solid #2A2A2A; padding: var(--sp-4) 0; }
.foot__fine-inner { display: flex; justify-content: space-between; font-size: 12px; color: var(--lb-paper-400); }
.foot__fine-links a { color: inherit; border: 0; }
.foot__fine-links a:hover { color: var(--lb-red-500); }

/* ── Reveal-on-scroll utility ──────────────────────────── */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out); }
.reveal.is-in { opacity: 1; transform: translateY(0); }
.reveal[data-delay="1"] { transition-delay: 80ms; }
.reveal[data-delay="2"] { transition-delay: 160ms; }
.reveal[data-delay="3"] { transition-delay: 240ms; }
.reveal[data-delay="4"] { transition-delay: 320ms; }

/* ── Responsive ────────────────────────────────────────── */
@media (max-width: 1280px) {
  .svc-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 960px) {
  .nav__items { display: none; }
  .nav__inner { grid-template-columns: auto 1fr auto; }
  .svc-grid { grid-template-columns: repeat(2, 1fr); }
  .hero__rail-row { grid-template-columns: repeat(2, 1fr) !important; }
  .stats__grid { grid-template-columns: 1fr 1fr; }
  .gallery { grid-template-columns: repeat(2, 1fr); }
  .proj, .proj--span3 { grid-column: span 1; }
  .about__grid, .kontakt__grid, .section__head { grid-template-columns: 1fr; gap: var(--sp-5); }
  .values { grid-template-columns: 1fr; }
  .form__row, .kontakt__meta { grid-template-columns: 1fr; }
  .foot__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .svc-grid { grid-template-columns: 1fr; }
  .hero__rail-row { grid-template-columns: 1fr !important; }
}

/* ── Detail page (service + legal) ─────────────────────── */
.page-hero { background: var(--lb-paper-50); padding: 56px 0 var(--sp-8); border-bottom: 1px solid var(--border); position: relative; overflow: hidden; }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: url('../assets/pattern-blueprint.svg'); background-size: 32px 32px; opacity: 0.05; pointer-events: none; }
.page-hero__inner { position: relative; z-index: 1; max-width: 880px; }
.page-hero__crumbs { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-3); margin-bottom: var(--sp-4); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.page-hero__crumbs a { color: var(--fg-3); text-decoration: none; border: 0; transition: color var(--dur-fast); }
.page-hero__crumbs a:hover { color: var(--lb-red-600); }
.page-hero__crumbs .sep { color: var(--lb-red-600); }
.page-hero__eyebrow { font-size: 12px; font-weight: 600; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-red-600); display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.page-hero__eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; display: inline-block; }
.page-hero__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(38px, 5vw, 72px); line-height: 1; letter-spacing: -0.02em; color: var(--lb-ink-900); margin: 0 0 var(--sp-5); text-wrap: balance; }
.page-hero__lede { font-size: 19px; line-height: 1.55; color: var(--fg-2); max-width: 60ch; margin: 0; }

.detail { padding: var(--sp-7) 0; }
.detail__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--sp-9); align-items: start; }
.detail__body { display: flex; flex-direction: column; gap: var(--sp-5); }
.detail__body h2 { font-family: var(--font-display); font-weight: 700; font-size: 28px; letter-spacing: -0.005em; color: var(--lb-ink-900); margin: 0 0 4px; }
.detail__body p { font-size: 16px; line-height: 1.65; color: var(--fg-2); margin: 0; max-width: 56ch; }
.detail__bullets { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--border); }
.detail__bullets li { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: baseline; padding: 14px 0 14px 18px; border-bottom: 1px solid var(--border); position: relative; font-size: 15.5px; color: var(--fg-1); line-height: 1.45; }
.detail__bullets li::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--lb-red-600); transform: scaleY(0.55); transform-origin: center; transition: transform var(--dur-base) var(--ease-out); }
.detail__bullets li:hover::before { transform: scaleY(1); }
.detail__bullets .n { font-family: var(--font-mono); font-size: 11px; color: var(--lb-red-600); letter-spacing: 0.08em; }

.detail__side { background: var(--lb-paper-100); border: 1px solid var(--border); padding: var(--sp-6); display: flex; flex-direction: column; gap: var(--sp-4); position: sticky; top: 92px; }
.detail__side h3 { font-family: var(--font-display); font-weight: 700; font-size: 22px; margin: 0; letter-spacing: -0.005em; line-height: 1.1; }
.detail__side p { font-size: 14px; line-height: 1.55; color: var(--fg-2); margin: 0; }
.detail__side dl { margin: 0; display: grid; grid-template-columns: 1fr; gap: var(--sp-3); }
.detail__side dt { font-size: 11px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-red-600); font-weight: 600; margin-bottom: 2px; }
.detail__side dd { margin: 0; font-size: 14px; color: var(--fg-1); line-height: 1.5; }
.detail__side a:not(.btn) { color: var(--lb-red-600); border-bottom: 1px solid currentColor; text-decoration: none; }
.detail__side .btn { color: #fff; border-bottom: 0; }
.detail__side .btn { align-self: flex-start; }

.related { padding: var(--sp-7) 0; background: var(--lb-paper-100); border-top: 1px solid var(--border); }
.related__head { margin-bottom: var(--sp-6); }
.related__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(28px, 3vw, 44px); letter-spacing: -0.02em; line-height: 1; color: var(--lb-ink-900); margin: 0; }
.related__title .dot { color: var(--lb-red-600); }
.related__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--border); border-left: 1px solid var(--border); background: #fff; }
.related__item { position: relative; padding: var(--sp-5) var(--sp-5) var(--sp-5) calc(var(--sp-5) + 6px); border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); text-decoration: none; color: inherit; transition: background var(--dur-base) var(--ease-out); display: flex; flex-direction: column; gap: 8px; }
.related__item::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--lb-red-600); transition: width var(--dur-base) var(--ease-out); }
.related__item:hover { background: var(--lb-paper-50); }
.related__item:hover::before { width: 10px; }
.related__item .num { font-family: var(--font-mono); font-size: 11px; color: var(--lb-red-600); letter-spacing: 0.08em; }
.related__item h4 { font-family: var(--font-display); font-weight: 700; font-size: 20px; line-height: 1.15; letter-spacing: 0; margin: 0; color: var(--lb-ink-900); }
.related__item .arr { font-family: var(--font-mono); font-size: 11px; color: var(--lb-red-600); letter-spacing: 0.08em; margin-top: auto; }

/* Plain-HTML nav variant (for static sub-pages) */
.snav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(250,250,247,0.95); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); }
.snav__inner { max-width: var(--container); margin: 0 auto; padding: 14px var(--gutter); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--sp-6); }
.snav__brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; border: 0; color: inherit; }
.snav__mark { width: 40px; height: 40px; background: var(--lb-ink-900); color: #FAFAF7; font-family: var(--font-display); font-weight: 800; font-size: 28px; line-height: 1; display: grid; place-items: center; letter-spacing: -2px; }
.snav__word { display: flex; flex-direction: column; line-height: 1; }
.snav__name { font-family: var(--font-display); font-weight: 700; font-size: 17px; letter-spacing: -0.005em; color: var(--lb-ink-900); }
.snav__sub { font-size: 10px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-red-600); font-weight: 600; margin-top: 3px; }
.snav ul { list-style: none; display: flex; gap: var(--sp-6); justify-content: center; margin: 0; padding: 0; }
.snav ul a { color: var(--fg-1); font-size: 14px; font-weight: 500; text-decoration: none; border: 0; padding: 6px 0; position: relative; }
.snav ul a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--lb-red-600); transform: scaleX(0); transform-origin: left; transition: transform var(--dur-base) var(--ease-out); }
.snav ul a:hover::after { transform: scaleX(1); }
.snav__right { display: flex; align-items: center; gap: 14px; }

/* Legal / prose page */
.prose { max-width: 760px; margin: 0 auto; padding: var(--sp-7) var(--gutter) var(--sp-9); }
.prose h2 { font-family: var(--font-display); font-weight: 700; font-size: 28px; letter-spacing: -0.005em; color: var(--lb-ink-900); margin: var(--sp-7) 0 var(--sp-3); line-height: 1.1; }
.prose h2:first-of-type { margin-top: 0; }
.prose h3 { font-family: var(--font-display); font-weight: 700; font-size: 20px; color: var(--lb-ink-900); margin: var(--sp-5) 0 var(--sp-2); }
.prose p { font-size: 16px; line-height: 1.65; color: var(--fg-2); margin: 0 0 var(--sp-3); }
.prose ul { padding-left: 18px; margin: 0 0 var(--sp-4); }
.prose ul li { font-size: 15.5px; line-height: 1.55; color: var(--fg-2); margin-bottom: 6px; }
.prose a { color: var(--lb-red-600); border-bottom: 1px solid currentColor; text-decoration: none; }
.prose dl { display: grid; grid-template-columns: 200px 1fr; gap: 6px 24px; margin: 0 0 var(--sp-4); }
.prose dt { font-size: 12px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--lb-red-600); font-weight: 600; padding-top: 4px; }
.prose dd { margin: 0; font-size: 15.5px; color: var(--fg-1); line-height: 1.55; }
.prose .lede { font-size: 18px; line-height: 1.55; color: var(--fg-2); margin: 0 0 var(--sp-6); max-width: 60ch; }

@media (max-width: 1100px) {
  .detail__grid { grid-template-columns: 1fr; }
  .detail__side { position: static; }
  .related__grid { grid-template-columns: 1fr 1fr; }
  .snav ul { display: none; }
  .prose dl { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .related__grid { grid-template-columns: 1fr; }
}


/* ── SEO / no-JS fallback (replaced by React on load) ─────── */
.seo-fallback { max-width: 760px; margin: 0 auto; padding: var(--sp-8) var(--gutter); font-family: var(--font-body); color: var(--fg-1); }
.seo-fallback h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(30px,4vw,52px); line-height: 1.05; letter-spacing: -0.01em; margin: 0 0 var(--sp-4); }
.seo-fallback h2 { font-family: var(--font-display); font-weight: 700; font-size: 24px; margin: var(--sp-6) 0 var(--sp-3); }
.seo-fallback p { font-size: 16px; line-height: 1.6; color: var(--fg-2); margin: 0 0 var(--sp-3); }
.seo-fallback ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.seo-fallback li a { color: var(--fg-1); text-decoration: none; }
.seo-fallback li a strong { color: var(--lb-red-700); }

.js .seo-fallback { display: none; }

/* equal-height service cards */
.svc-grid > .reveal { display: flex; }
.svc-grid > .reveal > .svc { flex: 1; }
/* mobile overflow fixes */
body { overflow-x: clip; }
.kontakt__grid > *, .form__row > *, .field { min-width: 0; }
.field input, .field select, .field textarea { width: 100%; min-width: 0; max-width: 100%; }
@media (max-width: 640px) {
  .nav__inner { grid-template-columns: minmax(0,1fr) auto; gap: 10px; padding: 10px 16px; }
  .nav__sub { display: none; }
  .nav__name { font-size: 15px; }
  .nav__mark { width: 34px; height: 34px; font-size: 24px; }
  .nav__right { gap: 8px; }
  .nav__right .btn--sm { padding: 8px 10px; font-size: 12px; }
  .lang { padding: 6px 7px; }
  .stats__grid { grid-template-columns: 1fr; gap: var(--sp-4); }
  .gallery { grid-template-columns: 1fr; }
  .foot__grid { grid-template-columns: 1fr; gap: var(--sp-6); }
  .foot__fine-inner { flex-direction: column; gap: 8px; }
  .kontakt__meta { grid-template-columns: 1fr; }
  .form { padding: var(--sp-5); }
}

/* identical header layout in DE and IT: fixed side columns */
@media (min-width: 961px) {
  .nav__inner, .snav__inner { grid-template-columns: 320px 1fr 320px; }
  .nav__right, .snav__right { justify-self: end; }
}

@media (max-width: 960px) {
  .nav__inner, .snav__inner { grid-template-columns: minmax(0,1fr) auto; }
  .nav__right, .snav__right { justify-self: end; }
}

/* ── Header: desktop (>1100px) nav right-aligned next to DE·IT ── */
.nav__mark, .snav__mark { font-size: 25px; letter-spacing: -1.5px; overflow: hidden; }
@media (min-width: 1101px) {
  .nav__inner, .snav__inner { grid-template-columns: auto minmax(0,1fr) auto; }
  .nav__items, .snav ul { justify-content: flex-end; gap: var(--sp-5); }
  .nav__items a, .snav ul a { white-space: nowrap; }
}
/* ── Mobile / tablet menu (≤1100px) ── */
.mnav-burger, .mnav-drawer, .mnav-backdrop { display: none; }
@media (max-width: 1100px) {
  .nav__items, .nav__right, .snav ul, .snav__right { display: none !important; }
  .nav__inner, .snav__inner { grid-template-columns: minmax(0,1fr); padding-right: 72px; }
  .mnav-burger { display: flex; position: fixed; top: 12px; right: 16px; z-index: 130; width: 44px; height: 44px;
    flex-direction: column; align-items: center; justify-content: center; gap: 5px; background: #fff; border: 1px solid var(--border-strong); cursor: pointer; padding: 0; }
  .mnav-burger span { display: block; width: 20px; height: 2px; background: var(--lb-ink-900); transition: transform var(--dur-base) var(--ease-out), opacity var(--dur-fast); }
  .menu-open .mnav-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-open .mnav-burger span:nth-child(2) { opacity: 0; }
  .menu-open .mnav-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .mnav-backdrop { display: block; position: fixed; inset: 0; z-index: 110; background: rgba(17,17,17,0.45); opacity: 0; pointer-events: none; transition: opacity var(--dur-base) var(--ease-out); }
  .menu-open .mnav-backdrop { opacity: 1; pointer-events: auto; }
  .mnav-drawer { display: flex; flex-direction: column; position: fixed; top: 0; right: 0; bottom: 0; z-index: 120; width: min(340px, 86vw);
    background: var(--lb-paper-50); border-left: 6px solid var(--lb-red-600); padding: 84px 28px 32px; overflow-y: auto;
    transform: translateX(100%); transition: transform var(--dur-base) var(--ease-out); }
  .menu-open .mnav-drawer { transform: translateX(0); }
  .menu-open, .menu-open body { overflow: hidden; }
  .mnav-drawer ul { list-style: none; margin: 0 0 var(--sp-6); padding: 0; display: flex; flex-direction: column; }
  .mnav-drawer ul a { display: block; padding: 14px 0; border-bottom: 1px solid var(--border); font-family: var(--font-display); font-weight: 700; font-size: 22px; color: var(--lb-ink-900); text-decoration: none; }
  .mnav-drawer ul a:hover { color: var(--lb-red-600); }
  .mnav-drawer .lang { align-self: flex-start; margin-bottom: var(--sp-5); font-size: 13px; padding: 10px 14px; }
  .mnav-drawer .btn { justify-content: center; }
}
@media (max-width: 640px) {
  .mnav-burger { top: 7px; right: 12px; width: 42px; height: 42px; }
  .nav__inner, .snav__inner { padding-right: 64px; }
  .nav__mark, .snav__mark { width: 36px; height: 36px; font-size: 22px; letter-spacing: -1px; }
  .snav__sub { display: none; }
  .hero__marquee-track { font-size: 40px; }
  .hero__marquee { top: 8px; }
  .hero__inner { padding-top: 72px; }
}

/* ── Desktop dropdown: Tätigkeitsbereiche ── */
.nav__items > li, .snav ul > li { position: relative; }
.has-dd { padding-right: 14px; }
.has-dd::after { content: ""; position: absolute; right: 0; top: 50%; margin-top: -2px; border: 4px solid transparent; border-top-color: currentColor; transition: transform var(--dur-fast); }
.has-dd:hover::after, .has-dd:focus-within::after { transform: rotate(180deg) translateY(4px); }
.navdd { position: absolute; top: 100%; left: -18px; margin: 0; padding: 8px 0; list-style: none; min-width: 330px; display: block !important;
  background: #fff; border: 1px solid var(--border); border-top: 3px solid var(--lb-red-600); box-shadow: var(--shadow-md); z-index: 140;
  opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out), visibility 0s linear var(--dur-fast); }
.navdd::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.has-dd:hover > .navdd, .has-dd:focus-within > .navdd { opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s; }
.navdd a { display: flex !important; gap: 12px; align-items: baseline; padding: 10px 18px !important; font-size: 14px; color: var(--lb-ink-900); white-space: nowrap; text-decoration: none; border: 0; }
.navdd a::after { display: none !important; }
.navdd a:hover, .navdd a[aria-current] { background: var(--lb-paper-100); color: var(--lb-red-600); }
.navdd__n { font-family: var(--font-mono); font-size: 11px; color: var(--lb-red-600); letter-spacing: 0.06em; }
/* mobile drawer sub-list */
.mnav-sub { list-style: none; margin: 0 0 6px; padding: 4px 0 8px 14px; border-left: 2px solid var(--lb-red-600); }
.mnav-drawer ul.mnav-sub a { font-family: var(--font-body); font-weight: 500; font-size: 15px; padding: 8px 0; border-bottom: 0; display: flex; gap: 10px; }
.mnav-drawer ul.mnav-sub a[aria-current] { color: var(--lb-red-600); }

.mnav-drawer ul.mnav-sub { margin: 0 0 6px; padding: 4px 0 8px 14px; }
.mnav-drawer ul.mnav-sub a { align-items: baseline; }
.snav ul.navdd { display: block !important; justify-content: initial; gap: 0; }
.snav ul.navdd a { padding: 10px 18px !important; }
.snav ul.navdd a::after, .nav__items .navdd a::after { content: none !important; display: none !important; }

/* ── Body offset = exact nav height (no white strip under the header) ── */
body { padding-top: var(--navh, 72px) !important; }
html { scroll-padding-top: calc(var(--navh, 72px) + 8px) !important; }
@media (max-width: 640px) {
  .section, .about, .kontakt { padding: var(--sp-6) 0; }
  .section__head { margin-bottom: var(--sp-5); gap: var(--sp-3); }
  .stats { padding: var(--sp-6) 0; }
  .hero__marquee { top: 10px; }
  .hero__inner { padding-top: 70px; }
  /* compact contact block */
  .kontakt__grid { gap: var(--sp-5); }
  .kontakt__title { margin-bottom: var(--sp-3); }
  .kontakt__lede { margin-bottom: var(--sp-4); font-size: 15px; }
  .kontakt__meta { grid-template-columns: 1fr 1fr !important; gap: var(--sp-3) var(--sp-4); }
  .kontakt__meta dd { font-size: 13px; }
  .form { gap: var(--sp-4); }
  /* compact drawer */
  .mnav-drawer { padding: 60px 22px 24px; }
  .mnav-drawer ul { margin-bottom: var(--sp-4); }
  .mnav-drawer ul a { font-size: 18px; padding: 9px 0; }
  .mnav-drawer ul.mnav-sub { padding: 2px 0 4px 12px; margin-bottom: 2px; }
  .mnav-drawer ul.mnav-sub a { font-size: 14px; padding: 5px 0; }
  .mnav-drawer .lang { margin-bottom: var(--sp-4); }
}

@media (max-width: 640px) {
  .hero__marquee { top: 12px; }
  .hero__inner { padding-top: 58px; }
}

/* ── Extended service content (GEO) ── */
.geo { display: flex; flex-direction: column; gap: var(--sp-3); margin-top: var(--sp-6); padding-top: var(--sp-6); border-top: 1px solid var(--border); }
.geo h2 { font-family: var(--font-display); font-weight: 700; font-size: 26px; margin: var(--sp-4) 0 0; color: var(--lb-ink-900); }
.geo h2:first-child { margin-top: 0; }
.geo p { font-size: 16px; line-height: 1.65; color: var(--fg-2); margin: 0; max-width: 62ch; }
.geo__steps { margin: 0; padding: 0; list-style: none; counter-reset: st; display: flex; flex-direction: column; gap: 10px; }
.geo__steps li { counter-increment: st; position: relative; padding-left: 44px; font-size: 15.5px; line-height: 1.55; color: var(--fg-1); max-width: 62ch; }
.geo__steps li::before { content: counter(st, decimal-leading-zero); position: absolute; left: 0; top: 1px; font-family: var(--font-mono); font-size: 12px; color: #fff; background: var(--lb-red-600); padding: 2px 6px; }
.geo__ref { position: relative; background: var(--lb-paper-100); border: 1px solid var(--border); padding: var(--sp-4) var(--sp-5) var(--sp-4) calc(var(--sp-5) + 6px); display: flex; flex-direction: column; gap: 4px; max-width: 62ch; }
.geo__ref::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--lb-red-600); }
.geo__ref-meta { font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--lb-red-600); }
.geo__ref strong { font-family: var(--font-display); font-size: 20px; color: var(--lb-ink-900); }
.geo__faq { display: flex; flex-direction: column; border-top: 1px solid var(--border); max-width: 62ch; }
.geo__qa { padding: var(--sp-4) 0; border-bottom: 1px solid var(--border); }
.geo__qa h3 { font-family: var(--font-body); font-weight: 600; font-size: 16px; color: var(--lb-ink-900); margin: 0 0 6px; }
.geo__qa p { font-size: 15px; }

/* ── Founder block (Über uns) ── */
.founder { position: relative; background: #fff; border: 1px solid var(--border); padding: var(--sp-6) var(--sp-6) var(--sp-6) calc(var(--sp-6) + 6px); margin-top: var(--sp-6); display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); gap: var(--sp-3) var(--sp-7); align-items: start; }
.founder::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--lb-red-600); }
.founder__head { grid-row: span 3; }
.founder__name { font-family: var(--font-display); font-weight: 800; font-size: 32px; line-height: 1.05; margin: 4px 0 6px; color: var(--lb-ink-900); }
.founder__role { font-size: 14px; color: var(--fg-3); margin: 0; }
.founder__lead { font-size: 16px; line-height: 1.6; color: var(--fg-2); margin: 0; }
.founder__creds { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border); }
.founder__creds li { padding: 10px 0 10px 22px; border-bottom: 1px solid var(--border); position: relative; font-size: 14.5px; line-height: 1.5; color: var(--fg-1); }
.founder__creds li::before { content: ""; position: absolute; left: 0; top: 17px; width: 10px; height: 2px; background: var(--lb-red-600); }
.founder__link { justify-self: start; font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--lb-red-600); border-bottom: 1px solid currentColor; text-decoration: none; }
@media (max-width: 960px) { .founder { grid-template-columns: 1fr; padding: var(--sp-5) var(--sp-5) var(--sp-5) calc(var(--sp-5) + 6px); } .founder__head { grid-row: auto; } }

/* ── Hero without scrolling text ── */
.hero__marquee { display: none !important; }
.hero__inner { padding-top: 32px !important; }
@media (max-width: 640px) { .hero__inner { padding-top: 20px !important; } }
/* ── Primary buttons: text always white, darker red on hover (like the contact submit) ── */
a.btn--primary, a.btn--primary:visited, a.btn--primary:hover, a.btn--primary:focus, a.btn--primary:active,
button.btn--primary:hover { color: #fff !important; }
a.btn--primary:hover, a.btn--primary:focus-visible { background: var(--lb-red-700) !important; }
a.btn--primary::after { display: none !important; }

.hero .eyebrow { display: flex; width: fit-content; }

/* ── Changes 2026-09-26 ── */
.geo__steps li::before { content: counter(st) !important; }
.form__need { margin: -4px 0 0; padding: 10px 14px; background: var(--lb-red-100); border-left: 4px solid var(--lb-red-600); color: var(--lb-red-700); font-size: 14px; }
.kontakt__meta dd a, .form__note a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--lb-red-600); }
.kontakt__meta dd a:hover, .form__note a:hover { color: var(--lb-red-600); }
/* dropdown: sits fully below the word, invisible bridge keeps hover continuous */
.has-dd > .navdd { top: calc(100% + 10px); }
.has-dd > .navdd::before { top: -14px; height: 14px; }

/* ── 2026-09-28: uniform tags, form placeholders, contact links ── */
.tag, .tag--green, .tag--amber, .tag--blue { background: var(--lb-paper-100) !important; color: var(--fg-2) !important; }
.field input::placeholder, .field textarea::placeholder { color: var(--fg-mute); opacity: 1; }
.field select:has(> option[value=""]:checked) { color: var(--fg-mute); }
.field select option { color: var(--fg-1); }
.kontakt__meta dd a { color: var(--lb-red-600) !important; border-bottom: 1px solid currentColor !important; }
.kontakt__meta dd a:hover { color: var(--lb-red-700) !important; }

/* ── 2026-09-28: larger company name in header ── */
.nav__name, .snav__name { font-size: 20px; }
.nav__sub, .snav__sub { font-size: 10.5px; margin-top: 4px; }
@media (max-width: 640px) { .nav__name, .snav__name { font-size: 17px; } }

/* ── 2026-09-28: one blur layer for the whole rail (no seams when hovering) ── */
.hero__rail { position: relative; isolation: isolate; background: rgba(0,0,0,0.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transform: translateZ(0); }
.hero__rail-item { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: rgba(250,250,247,0.42); }
.hero__rail-item.is-active, .hero__rail-item:hover { background: rgba(255,255,255,0.82); }

/* ── Service banners: photo behind the page title (2026-09-29) ── */
.page-hero--img { padding: 72px 0 110px; }
.page-hero--img::before { display: none; }
.page-hero__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; background-position: center; background-size: cover; background-repeat: no-repeat; opacity: 0.6; filter: blur(1.5px); transform: scale(1.02); }
.page-hero--sharp .page-hero__bg { filter: none; opacity: 0.55; transform: none; background-size: contain; background-color: #fff; }
.page-hero--img::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(250,250,247,0) 0%, var(--lb-paper-50) 100%); }
.page-hero--img .page-hero__inner { z-index: 1; }
.page-hero--img .page-hero__crumbs, .page-hero--img .page-hero__eyebrow { display: flex; width: fit-content; background: rgba(250,250,247,0.72); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 5px 10px; }
.page-hero--img .page-hero__crumbs { margin-bottom: var(--sp-3); }
.page-hero--img .page-hero__title { display: inline; background: rgba(250,250,247,0.72); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-decoration-break: clone; -webkit-box-decoration-break: clone; padding: 2px 12px; line-height: 1.12; }
.page-hero--img .page-hero__lede { display: block; width: fit-content; margin-top: var(--sp-5); background: rgba(250,250,247,0.72); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 12px 16px; }
.page-hero--img .page-hero__eyebrow { margin-bottom: var(--sp-3); }
.page-hero--img .page-hero__title + .page-hero__lede { margin-top: var(--sp-5); }
@media (max-width: 640px) { .page-hero--img { padding: 40px 0 72px; } .page-hero--img .page-hero__lede { font-size: 16px; } }

/* ── Service banners v2 (2026-09-29): no blur, tight labels, equal height ── */
.page-hero__bg, .page-hero--sharp .page-hero__bg { filter: none; transform: none; opacity: 0.6; background-size: cover; }
.page-hero--img { box-sizing: border-box; min-height: 600px; padding: 56px 0 110px; }
.page-hero--img .page-hero__crumbs, .page-hero--img .page-hero__eyebrow { padding: 3px 8px; margin-bottom: 10px; }
.page-hero--img .page-hero__title { line-height: 1.24; padding: 0 8px; }
.page-hero--img .page-hero__lede { padding: 8px 12px; margin-top: 18px; }
@media (max-width: 640px) { .page-hero--img { min-height: 0; padding: 40px 0 72px; } }

/* ── Service banners v3: title bar sits lower, lede bar hugs each line ── */
.page-hero--img .page-hero__title { backdrop-filter: none; -webkit-backdrop-filter: none; background: linear-gradient(180deg, transparent 0 16%, rgba(250,250,247,0.8) 16% 100%); padding: 0 8px 0.07em; line-height: 1.28; }
.page-hero--img .page-hero__lede { display: block; width: auto; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; padding: 0; margin: 16px 0 0; }
.page-hero--img .page-hero__lede > span { background: rgba(250,250,247,0.8); padding: 3px 10px; line-height: 1.85; box-decoration-break: clone; -webkit-box-decoration-break: clone; }

/* ── Photo strength (2026-09-29): same, less milky factor on home + service pages ── */
.hero__photo { opacity: 0.85 !important; }
.page-hero__bg, .page-hero--sharp .page-hero__bg { opacity: 0.85 !important; }

.geo__abbr { list-style: none; padding: 0; margin: 6px 0 10px; display: grid; gap: 4px; }
.geo__abbr li { font-size: 15px; line-height: 1.5; color: var(--fg-2); }
.geo__abbr strong { font-family: var(--font-mono); font-size: 13px; color: var(--lb-ink-900); display: inline-block; min-width: 96px; }

/* ── Kontakt: map panel (two-click, loads Google only on request) ── */
.kmap { margin-top: var(--sp-7); }
.kmap__box { position: relative; height: 340px; border: 1px solid var(--border); background: #fff; overflow: hidden; }
.kmap__box::before { content: ""; position: absolute; inset: 0; background-image: url('assets/pattern-blueprint.svg'); background-size: 32px 32px; opacity: 0.12; }
.kmap__ph { position: relative; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; padding: 20px; color: var(--lb-red-600); }
.kmap__addr { color: var(--fg-1); font-size: 15px; line-height: 1.5; }
.kmap__ext { color: var(--lb-red-600); font-size: 14px; border-bottom: 1px solid currentColor; text-decoration: none; }
.kmap__note { font-size: 12px; color: var(--fg-3); max-width: 46ch; margin: 4px 0 0; }
.kmap__note a { color: inherit; }
.kmap__frame { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 640px) { .kmap { margin-top: var(--sp-5); } .kmap__box { height: 280px; } }

.kmap__box::before { pointer-events: none; }
.kmap__frame { position: relative; z-index: 1; }
.kmap__box:has(.kmap__frame)::before { display: none; }

/* ── KlimaHaus pages only: near-opaque white panels (busy certificate background) ── */
.page-hero--sharp .page-hero__crumbs, .page-hero--sharp .page-hero__eyebrow { background: rgba(255,255,255,0.94); }
.page-hero--sharp .page-hero__title { background: linear-gradient(180deg, transparent 0 16%, rgba(255,255,255,0.94) 16% 100%); }
.page-hero--sharp .page-hero__lede > span { background: rgba(255,255,255,0.94); }

/* ── KlimaHaus pages: one white box behind the whole text block ── */
.page-hero--sharp .page-hero__inner { background: rgba(255,255,255,0.94); padding-top: 22px; padding-bottom: 26px; }
.page-hero--sharp .page-hero__crumbs, .page-hero--sharp .page-hero__eyebrow { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
.page-hero--sharp .page-hero__title { background: none; }
.page-hero--sharp .page-hero__lede > span { background: none; }