:root[data-theme="dark"] .button-light { border-color: var(--line); background: var(--paper); color: var(--ink); }
:root[data-theme="dark"] .site-nav a { color: var(--ink-soft); }
:root[data-theme="dark"] .login-switch button.is-active { background: var(--paper); }
:root[data-theme="dark"] .form-status.is-error { background: #472c2c; color: #ffbeb6; }
:root[data-theme="dark"] .form-status.is-success { border-color: var(--sage-strong); }

:root[data-theme="dark"] .calendar-day:disabled { border-color: var(--line); background: #1b353f; color: #83989e; }
:root[data-theme="dark"] .project-progress { background: #29444d; }
:root[data-theme="dark"] .project-steps li { color: #94a8ad; }
:root[data-theme="dark"] .project-steps li.is-current { color: var(--green); }
:root[data-theme="dark"] .product-art { background: linear-gradient(145deg,#1e3943,#233e45); color: var(--green); }
:root[data-theme="dark"] .product-art::before, :root[data-theme="dark"] .product-art::after { border-color: rgba(122,203,181,.2); }
:root[data-theme="dark"] .admin-status-compact { background: var(--sage); color: var(--ink-soft); }
:root[data-theme="dark"] .admin-status-compact.is-blocked { background: #472c2c; color: #ffbeb6; }
:root[data-theme="dark"] .calendar-slot.is-busy { border-color: #6a4141; background: #472c2c; color: #ffc4bd; }

:root[data-theme="dark"] .invoice-sheet { color: var(--ink); }
:root[data-theme="dark"] .credential-line code, :root[data-theme="dark"] .status-pill, :root[data-theme="dark"] .admin-metric strong, :root[data-theme="dark"] .portal-metric strong, :root[data-theme="dark"] .account-metric strong, :root[data-theme="dark"] .order-card-head strong, :root[data-theme="dark"] .order-summary-total, :root[data-theme="dark"] .product-price strong { color: var(--green); }
:root[data-theme="dark"] .status-pill { background: var(--sage); }
:root[data-theme="dark"] .site-header .button:not(.button-ghost) { color: white; }

@media (max-width: 970px) {
  .backoffice-login-layout { grid-template-columns: 1fr; }
  .backoffice-login-intro { max-width: 740px; }
}
@media (max-width: 760px) {
  .brand-wordmark { width: 142px; max-height: 62px; }
  .footer-logo-wordmark { width: min(170px, 100%); }
  
  
  .quick-access-grid, .arrival-layout { grid-template-columns: 1fr; }
  .home-shortcuts-head { align-items: flex-start; flex-direction: column; gap: .45rem; }
  
  .admin-key-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-subgrid { grid-template-columns: 1fr; }
  .admin-subpanel:last-child { grid-column: auto; }
  .admin-subpanel .admin-slot-form { grid-template-columns: 1fr 1fr; }
  .admin-subpanel .admin-slot-form > .button { grid-column: 1/-1; }
  .admin-shortcuts { position: static; }
  .backoffice-grid .admin-panel-head { align-items: flex-start; flex-direction: column; }
  .backoffice-grid .admin-panel-head span { text-align: left; }
  .legal-document-heading { align-items: flex-start; flex-direction: column; }
  .simple-footer { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 520px) {
  .legal-document-card { grid-template-columns: auto minmax(0,1fr); gap: .65rem; }
  .legal-document-card .legal-open { grid-column: 2; }
  .admin-key-metrics { grid-template-columns: 1fr 1fr; }
  .admin-metric { padding: .8rem; }
  .admin-key-metrics .admin-metric strong { font-size: 1.2rem; }
  .admin-subpanel .admin-event-form { grid-template-columns: 1fr 1fr; }
  .admin-subpanel .admin-slot-form { grid-template-columns: 1fr; }
  .admin-subpanel .admin-slot-form > .button { grid-column: auto; }
  
  .admin-topbar-actions .button { flex: 1 1 100%; }
}


/* Persistent area bar, shared by every page in the local HKU preview */















/* The requested large HKU wordmark is used everywhere; the white variant appears only in dark mode. */
.brand-wordmark { width: clamp(184px,18vw,220px); max-height: 98px; object-fit: contain; }
.brand-wordmark-dark { display: none; }
:root[data-theme="dark"] .brand-wordmark-light { display: none; }
:root[data-theme="dark"] .brand-wordmark-dark { display: block; }
.footer-logo-wordmark { width: min(235px,100%); height: auto; margin-bottom: .8rem; }
.footer-brand { align-items: flex-start; }

/* Two truthful service fields after removal of the service that is not offered. */
.proof-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }
.service-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }

/* Product-specific illustrative photography in the shop */
.product-art { background: #edf1ee; }
.product-art::before, .product-art::after { display: none; }
.product-art img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }

/* Native details/summary makes each of the six Brunnenbau cards clickable and keyboard-accessible. */
details.feature-card { padding: 0; overflow: hidden; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
details.feature-card:hover { transform: translateY(-2px); }
details.feature-card[open] { border-color: var(--green); box-shadow: var(--shadow-card); }
.feature-card-summary {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr);
  align-items: center;
  gap: .85rem;
  padding: 1.25rem 1.35rem;
  cursor: pointer;
  list-style: none;
}
.feature-card-summary::-webkit-details-marker { display: none; }
.feature-card-summary::marker { content: ""; }
.feature-card-summary:focus-visible { outline: 3px solid #7ca88d; outline-offset: -5px; border-radius: var(--radius-md); }
.feature-card-summary .feature-icon { width: 44px; height: 44px; margin: 0; }
.feature-card-heading { display: grid; gap: .45rem; min-width: 0; }
.feature-card-title { display: block; margin: 0; color: var(--ink); font-size: 1.07rem; font-weight: 720; line-height: 1.12; letter-spacing: -.02em; }
.feature-card-prompt { color: var(--green); font-size: .74rem; font-weight: 760; }
.feature-card-prompt::before { content: "+ "; font-size: 1rem; }
details.feature-card[open] .feature-card-prompt::before { content: "− "; }
.feature-card-more { padding: 0 1.35rem 1.3rem 5.25rem; color: var(--muted); }
.feature-card-more p { margin: 0; font-size: .92rem; line-height: 1.55; }


@media (max-width: 970px) {
  .brand-wordmark { width: 188px; max-height: 84px; }
}
@media (max-width: 760px) {
  .brand-wordmark { width: 168px; max-height: 75px; }
  .footer-logo-wordmark { width: min(205px,100%); }
  
  
  
  
  
  
  
  .feature-card-summary { padding: 1.15rem; }
  .feature-card-more { padding: 0 1.15rem 1.15rem 4.8rem; }
  .proof-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .proof-item:nth-child(2) { border-right: 0; }
  .proof-item:nth-child(3) { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }
  .proof-item:nth-child(n/**/+4) { border-bottom: 0; }
  .service-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .brand-wordmark { width: 148px; max-height: 66px; }
  
  
  
  
  
  
  .feature-card-summary { grid-template-columns: 40px minmax(0,1fr); gap: .7rem; }
  .feature-card-summary .feature-icon { width: 40px; height: 40px; }
  .feature-card-title { font-size: .98rem; }
  .feature-card-prompt { font-size: .7rem; }
  .feature-card-more { padding-left: 4.6rem; }
}

/* Visual refresh: clear, light, content-first layout across the whole site. */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --ink: #243746;
  --ink-soft: #4b6170;
  --muted: #526977;
  --forest: #145c7b;
  --forest-deep: #104761;
  --green: #2b7795;
  --sage: #edf5f8;
  --sage-strong: #d7e8ef;
  --lime: #d8edf3;
  --cream: #f7fafb;
  --paper: #ffffff;
  --line: #dce6eb;
  --warning: #fff7e5;
  --warning-ink: #75591b;
  --danger: #9b3c35;
  --shadow-soft: 0 5px 18px rgba(24, 61, 81, .045);
  --shadow-card: 0 7px 20px rgba(24, 61, 81, .055);
  --radius-sm: 7px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --section-space: clamp(2.8rem, 5vw, 4.3rem);
}
:root[data-theme="blue"] {
  color-scheme: light;
  --ink: #213b4c;
  --ink-soft: #476476;
  --muted: #506b7b;
  --forest: #08769a;
  --forest-deep: #075575;
  --green: #1f849e;
  --sage: #e8f5f8;
  --sage-strong: #cae9f0;
  --lime: #d1eef3;
  --cream: #f5fbfc;
  --paper: #ffffff;
  --line: #d7e9ee;
  --shadow-soft: 0 5px 18px rgba(9, 87, 113, .05);
  --shadow-card: 0 7px 20px rgba(9, 87, 113, .06);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e8f0f4;
  --ink-soft: #c2d2db;
  --muted: #9aafba;
  --forest: #2788aa;
  --forest-deep: #14394b;
  --green: #6eb5cc;
  --sage: #1a3543;
  --sage-strong: #294b5a;
  --lime: #a9dae8;
  --cream: #102b39;
  --paper: #153342;
  --line: #2e4d5b;
  --warning: #443a21;
  --warning-ink: #f3d77b;
  --danger: #ffb3a9;
  --shadow-soft: 0 8px 22px rgba(0,0,0,.16);
  --shadow-card: 0 8px 22px rgba(0,0,0,.18);
}

html { scroll-padding-top: 92px; }
body { background: var(--paper); color: var(--ink); }
h1, h2, h3 { letter-spacing: -.028em; font-weight: 700; }
:focus-visible { outline-color: var(--green); }

/* Smaller, quieter preview strip. The area switcher remains on every page. */














/* Calm navigation, restrained actions and consistent surfaces. */
.site-header { border-bottom: 1px solid var(--line); background: var(--paper); box-shadow: none; backdrop-filter: none; }
.header-inner { min-height: 72px; gap: 1rem; }
.brand { min-width: 0; color: var(--forest); }
.brand-wordmark { width: clamp(148px,15vw,180px); max-height: 58px; object-fit: contain; }
.brand-wordmark-dark { display: none; }
:root[data-theme="dark"] .brand-wordmark-light { display: none; }
:root[data-theme="dark"] .brand-wordmark-dark { display: block; }
.site-nav { gap: .1rem; }
.site-nav a { min-height: 38px; padding: .45rem .58rem; border-radius: 5px; color: var(--ink-soft); font-size: .8rem; font-weight: 620; }
.site-nav a:hover, .site-nav a[aria-current="page"] { background: var(--sage); color: var(--forest-deep); }
.header-icon-link { width: 38px; height: 38px; border-radius: 6px; }
.nav-toggle { width: 38px; height: 38px; border-radius: 6px; }
.button { min-height: 42px; padding: .62rem .92rem; border-radius: 6px; box-shadow: none; font-size: .87rem; font-weight: 680; transition: background .15s ease, border-color .15s ease, color .15s ease; }
.button:hover { transform: none; box-shadow: none; }
.button-small { min-height: 37px; padding: .5rem .72rem; border-radius: 6px; font-size: .79rem; }
.button-ghost { border-color: var(--line); background: var(--paper); color: var(--forest); }
.button-ghost:hover { border-color: var(--sage-strong); background: var(--sage); color: var(--forest-deep); }
.button-light { border-color: var(--line); background: var(--paper); color: var(--forest); }
.button-light:hover { border-color: var(--sage-strong); background: var(--sage); color: var(--forest-deep); }
.button-lime { border-color: var(--sage-strong); background: var(--sage); color: var(--forest-deep); }
.button-lime:hover { border-color: var(--sage-strong); background: var(--sage-strong); color: var(--forest-deep); }

.eyebrow { margin-bottom: .7rem; color: var(--forest); font-size: .67rem; letter-spacing: .09em; }
.eyebrow::before { width: 14px; height: 1px; }
.eyebrow-light { color: var(--forest); }
.lead { color: var(--ink-soft); line-height: 1.55; }
.section { padding-block: var(--section-space); }
.section-sage { background: var(--cream); }
.section-forest { background: var(--sage); color: var(--ink); }
.section-forest h2, .section-forest h3 { color: var(--ink); }
.section-forest .section-head p { color: var(--muted); }
.page-hero { padding-block: clamp(2.2rem,4vw,3.4rem); border-bottom: 1px solid var(--line); background: var(--paper); }
.page-hero-grid { gap: clamp(1.5rem,4vw,3.25rem); }
.page-hero-copy h1 { font-size: clamp(2.25rem,4.3vw,3.7rem); }
.page-visual { min-height: 310px; border: 1px solid var(--line); border-radius: 10px; box-shadow: none; }
.page-visual::after { background: linear-gradient(0deg,rgba(15,48,67,.18),transparent 58%); }
.service-card, .feature-card, .info-tile, .surface-card, .tile-card, .login-card, .role-choice-card, .admin-panel, .portal-panel, .product-card, .certificate-card, .legal-document-card {
  border-radius: 9px;
  box-shadow: none;
}
.service-card { transition: border-color .15s ease, background .15s ease; }
.service-card:hover { transform: none; border-color: var(--forest); box-shadow: none; }
.service-card-image { height: 195px; }
.service-card-body { min-height: 205px; padding: 1.2rem; }
.feature-card, .info-tile, .surface-card { border-color: var(--line); background: var(--paper); }
.feature-card { padding: 1.25rem; }
.feature-icon { width: 36px; height: 36px; margin-bottom: .85rem; border-radius: 6px; background: var(--sage); color: var(--forest); }
.process-card { min-height: 190px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: var(--ink); }
.process-card::before { color: var(--forest); }
.process-card p { color: var(--muted); }
.cta-panel { padding: clamp(1.35rem,3vw,2.25rem); border: 1px solid var(--line); border-radius: 10px; background: var(--sage); color: var(--ink); }
.cta-panel::after { display: none; }
.cta-panel h2 { color: var(--ink); }
.cta-panel p { color: var(--ink-soft); }
.check-list li::before { border-radius: 4px; background: var(--sage); color: var(--forest); }

/* Forms and interactive panels stay clear and readable. */
.form-field input, .form-field select, .form-field textarea, .search-control, .filter-control, .admin-select {
  border-color: var(--line);
  border-radius: 6px;
  background: var(--paper);
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus, .search-control:focus, .filter-control:focus { border-color: var(--green); outline: 2px solid var(--sage-strong); }
.admin-panel, .portal-panel { border-color: var(--line); background: var(--paper); }
.admin-panel-head, .portal-panel-head { border-bottom: 1px solid var(--line); padding-bottom: .6rem; }
.admin-metric, .portal-metric, .account-metric { border-radius: 8px; background: var(--cream); box-shadow: none; }
.admin-metric strong, .portal-metric strong, .account-metric strong { color: var(--forest); }
.admin-button, .calendar-month-button, .calendar-slot, .calendar-day, .filter-chip { border-radius: 6px; }
.calendar-day.is-selected, .calendar-slot.is-selected, .filter-chip:hover, .filter-chip.is-active { border-color: var(--forest); background: var(--forest); color: white; }
.calendar-day.is-selected small { color: rgba(255,255,255,.82); }
.calendar-selection, .calendar-selected-summary { border-radius: 6px; background: var(--sage); color: var(--forest-deep); }
.role-choice-featured { border-color: var(--sage-strong); background: var(--sage); color: var(--ink); }
.role-choice-featured h2 { color: var(--ink); }
.role-choice-featured p, .role-choice-featured ul { color: var(--ink-soft); }
.role-choice-featured .role-choice-icon { background: var(--paper); color: var(--forest); }
.backoffice-login-mark { border-radius: 7px; background: var(--sage); color: var(--forest); }
.toast { border: 1px solid var(--line); border-radius: 7px; background: var(--paper); color: var(--ink); box-shadow: var(--shadow-soft); }

/* Light footer with legal links at the bottom. */
.site-footer { border-top: 1px solid var(--line); background: var(--cream); color: var(--ink); }
.footer-main { gap: 1.5rem; padding-block: 2.25rem; }
.footer-logo-wordmark { width: min(190px,100%); margin-bottom: .3rem; }
:root[data-theme="dark"] .footer-logo-wordmark { filter: brightness(0) invert(1); }
.footer-about, .footer-contact-line { color: var(--ink-soft); }
.footer-brand small { color: var(--muted); }
.footer-column h2 { margin-bottom: .55rem; color: var(--forest); font-size: .72rem; letter-spacing: .07em; }
.footer-column a, .footer-contact-line a { color: var(--ink-soft); }
.footer-column a:hover, .footer-contact-line a:hover { color: var(--forest); text-decoration: underline; text-underline-offset: 3px; }
.footer-bottom { border-top: 1px solid var(--line); color: var(--muted); font-size: .72rem; }
.footer-bottom-links { gap: .6rem 1rem; }
.footer-bottom-links a { color: var(--ink-soft); }
.footer-bottom-links a:hover { color: var(--forest); text-decoration: underline; text-underline-offset: 3px; }
.simple-footer { border-top-color: var(--line); color: var(--muted); }
.simple-footer nav a { color: var(--ink-soft); }
.simple-footer nav a:hover { color: var(--forest); }

/* One-screen, services-first customer start page. */
body.landing-page {
  width: 100%;
  height: 100vh;
  height: 100svh;
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0,1fr) auto;
  overflow: hidden;
  background: var(--paper);
}
body.landing-page .site-header { position: relative; top: auto; }
body.landing-page .landing-header .header-inner { min-height: 66px; }
body.landing-page .landing-main { min-height: 0; overflow: hidden; }
body.landing-page .landing-hero { height: 100%; min-height: 0; padding: 0; background: var(--paper); }
body.landing-page .landing-container {
  width: min(1180px,calc(100% - 48px));
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-block: clamp(12px,2.3vh,24px);
}
body.landing-page .landing-intro {
  display: grid;
  grid-template-columns: minmax(0,1.2fr) minmax(250px,.8fr);
  align-items: end;
  gap: 1.5rem;
  margin-bottom: 1.2rem;
}
body.landing-page .landing-intro .eyebrow { margin-bottom: .42rem; }
body.landing-page .landing-intro h1 { margin: 0; color: var(--ink); font-size: clamp(2.15rem,4.1vw,3.45rem); line-height: 1.04; letter-spacing: -.045em; }
body.landing-page .landing-lead { max-width: 400px; margin: 0 0 .2rem; color: var(--muted); font-size: .98rem; line-height: 1.5; }
body.landing-page .service-choice-grid { min-height: 0; flex: 1 1 auto; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
body.landing-page .service-choice-card {
  min-width: 0;
  min-height: 250px;
  display: grid;
  grid-template-columns: minmax(0,.82fr) minmax(0,1fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--ink);
  transition: border-color .15s ease, box-shadow .15s ease;
}
body.landing-page .service-choice-card:hover { border-color: var(--forest); box-shadow: var(--shadow-card); color: var(--ink); }
body.landing-page .service-choice-image { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: var(--sage); }
body.landing-page .service-choice-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.landing-page .service-choice-number { position: absolute; top: .8rem; left: .8rem; display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid rgba(255,255,255,.7); border-radius: 5px; background: rgba(255,255,255,.92); color: var(--forest-deep); font-size: .7rem; font-weight: 800; }
body.landing-page .service-choice-copy { min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: .7rem; padding: clamp(1rem,1.8vw,1.55rem); }
body.landing-page .service-choice-kicker { display: block; margin-bottom: .55rem; color: var(--forest); font-size: .62rem; font-weight: 800; letter-spacing: .09em; }
body.landing-page .service-choice-copy h2 { margin: 0 0 .5rem; color: var(--ink); font-size: clamp(1.35rem,2.4vw,2rem); line-height: 1.08; }
body.landing-page .service-choice-copy p { margin: 0; color: var(--muted); font-size: .83rem; line-height: 1.45; }
body.landing-page .service-choice-link { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding-top: .6rem; border-top: 1px solid var(--line); color: var(--forest); font-size: .75rem; font-weight: 750; }
body.landing-page .service-choice-link b { font-size: 1.05rem; font-weight: 500; transition: transform .15s ease; }
body.landing-page .service-choice-card:hover .service-choice-link b { transform: translateX(3px); }
body.landing-page .landing-support { display: flex; align-items: center; justify-content: space-between; gap: .85rem; padding-top: 1rem; }
body.landing-page .landing-support-link { display: inline-flex; align-items: center; gap: .45rem; color: var(--ink-soft); font-size: .75rem; }
body.landing-page .landing-support-link:hover { color: var(--forest); }
body.landing-page .landing-support-label { color: var(--forest); font-size: .58rem; font-weight: 800; letter-spacing: .08em; }
body.landing-page .landing-support-link b { color: var(--forest); font-size: .95rem; font-weight: 500; }
body.landing-page .landing-location { color: var(--muted); font-size: .7rem; }
body.landing-page .landing-footer { min-height: 40px; }
body.landing-page .landing-footer-inner { min-height: 40px; display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding-block: .28rem; }
body.landing-page .landing-footer-brand { color: var(--muted); font-size: .64rem; white-space: nowrap; }
body.landing-page .landing-footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem 1rem; }
body.landing-page .landing-footer-links a { color: var(--ink-soft); font-size: .65rem; }
body.landing-page .landing-footer-links a:hover { color: var(--forest); text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 1150px) {
  
  
  
  
  .site-header .header-inner { position: relative; }
  .site-header .nav-toggle { display: grid; order: 3; }
  .site-header .header-actions { margin-left: auto; }
  .site-header .site-nav { position: absolute; top: calc(100% + 1px); right: 0; left: 0; display: none; align-items: stretch; padding: .65rem 18px .85rem; border: 1px solid var(--line); border-top: 0; background: var(--paper); box-shadow: var(--shadow-soft); }
  .site-header .site-nav.is-open { display: grid; }
  .site-header .site-nav a { min-height: 40px; padding-inline: .65rem; font-size: .86rem; }
}
@media (max-width: 760px) {
  
  
  
  
  
  
  
  
  
  .header-inner { min-height: 62px; gap: .5rem; }
  .brand-wordmark { width: 142px; max-height: 48px; }
  .header-icon-link, .nav-toggle { width: 35px; height: 35px; }
  .header-actions { gap: .32rem; }
  .header-actions .button-small { min-height: 34px; padding-inline: .52rem; font-size: .72rem; }
  body.landing-page .landing-container { width: calc(100% - 32px); }
  body.landing-page .landing-header .header-inner { min-height: 58px; }
  body.landing-page .landing-intro { grid-template-columns: 1fr; gap: .3rem; margin-bottom: .7rem; }
  body.landing-page .landing-intro .eyebrow { margin-bottom: .25rem; font-size: .58rem; }
  body.landing-page .landing-intro h1 { font-size: clamp(1.8rem,7vw,2.6rem); }
  body.landing-page .landing-lead { max-width: 100%; margin: 0; font-size: .76rem; line-height: 1.35; }
  body.landing-page .service-choice-grid { grid-template-columns: 1fr; gap: .55rem; }
  body.landing-page .service-choice-card { min-height: 0; grid-template-columns: minmax(82px,.35fr) minmax(0,1fr); }
  body.landing-page .service-choice-copy { gap: .35rem; padding: .65rem .75rem; }
  body.landing-page .service-choice-kicker { margin-bottom: .25rem; font-size: .54rem; }
  body.landing-page .service-choice-copy h2 { margin-bottom: .28rem; font-size: 1.05rem; }
  body.landing-page .service-choice-copy p { font-size: .67rem; line-height: 1.32; }
  body.landing-page .service-choice-link { padding-top: .35rem; font-size: .65rem; }
  body.landing-page .service-choice-number { top: .48rem; left: .48rem; width: 25px; height: 25px; font-size: .61rem; }
  body.landing-page .landing-support { gap: .3rem .6rem; padding-top: .58rem; }
  body.landing-page .landing-support-link { gap: .3rem; font-size: .64rem; }
  body.landing-page .landing-support-label { display: none; }
  body.landing-page .landing-location { display: none; }
  body.landing-page .landing-footer-inner { width: calc(100% - 28px); min-height: 42px; justify-content: center; }
  body.landing-page .landing-footer-brand { display: none; }
  body.landing-page .landing-footer-links { justify-content: center; gap: .28rem .72rem; }
  body.landing-page .landing-footer-links a { font-size: .59rem; }
  .footer-main { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.4rem 1rem; padding-block: 1.8rem; }
  .footer-main > :first-child { grid-column: 1 / -1; }
  .footer-bottom { padding-block: .8rem; }
}
@media (max-width: 420px) {
  .container { width: calc(100% - 28px); }
  body.landing-page .landing-container { width: calc(100% - 24px); padding-block: 7px; }
  body.landing-page .landing-support { justify-content: space-between; }
  body.landing-page .landing-support-link { font-size: .59rem; }
  body.landing-page .landing-footer-links { gap: .22rem .55rem; }
  body.landing-page .landing-footer-links a { font-size: .55rem; }
}
@media (max-height: 700px) {
  body.landing-page .landing-container { padding-block: 8px; }
  body.landing-page .landing-intro { margin-bottom: .65rem; }
  body.landing-page .landing-intro h1 { font-size: clamp(1.9rem,3.2vw,2.8rem); }
  body.landing-page .service-choice-card { min-height: 0; }
  body.landing-page .landing-support { padding-top: .55rem; }
  body.landing-page .landing-footer-inner { min-height: 34px; }
}
@media (max-width: 760px) and (max-height: 680px) {
  body.landing-page .landing-lead { display: none; }
  body.landing-page .landing-intro { margin-bottom: .42rem; }
  body.landing-page .service-choice-copy p { font-size: .62rem; }
  body.landing-page .landing-support { padding-top: .35rem; }
}
@media (prefers-reduced-motion: reduce) {
  .service-choice-card, .service-choice-link b { transition: none !important; }
}

/* Drei Bilder nebeneinander auf der Startseite. */
body.landing-page { height: auto; min-height: 100svh; grid-template-rows: auto minmax(0,1fr) auto; overflow-x: hidden; overflow-y: auto; }
body.landing-page .landing-main { overflow: visible; }
body.landing-page .service-choice-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
body.landing-page .service-choice-card { min-height: 410px; display: flex; flex-direction: column; }
body.landing-page .service-choice-image { flex: 1 1 56%; min-height: 190px; }
body.landing-page .service-choice-copy { flex: 1 1 44%; }
@media (max-width: 760px) {
  body.landing-page .service-choice-grid { grid-template-columns: 1fr; }
  body.landing-page .service-choice-card { min-height: 165px; display: grid; grid-template-columns: minmax(110px,.42fr) minmax(0,1fr); }
  body.landing-page .service-choice-image { min-height: 0; }
}
@media (max-height: 700px) and (min-width: 761px) {
  body.landing-page .service-choice-card { min-height: 380px; }
}

/* Umwelttechnik: Prozesskarten ohne Inline-Styles. */
.process-grid { color: var(--ink); }
.process-grid .surface-card > p { color: var(--muted); }