/*
 * MLE Digital – Fallback fuer deutlich aeltere Browser.
 * Aktiviert wird diese Ebene nur, wenn zentrale moderne CSS-Funktionen fehlen.
 * Ziel: Die oeffentliche Website bleibt lesbar und bedienbar; moderne Effekte
 * duerfen entfallen. MLE-Produkte selbst haben getrennte Mindestanforderungen.
 */

.mle-legacy-browser body {
  overflow-x: hidden;
}

.mle-legacy-browser .global-wrap,
.mle-legacy-browser .wrap,
.mle-legacy-browser .site-main > .wrap,
.mle-legacy-browser .site-main .statement .wrap,
.mle-legacy-browser .site-main .projects .wrap,
.mle-legacy-browser .site-main .contact .wrap,
.mle-legacy-browser .product-hero,
.mle-legacy-browser .site-main.legal-main {
  width: calc(100% - 32px);
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}

/* Moderne min()/clamp()/logische Eigenschaften bekommen feste Fallbacks. */
.mle-legacy-browser h1,
.mle-legacy-browser .site-main h1 {
  font-size: 52px;
  letter-spacing: -2px;
}
.mle-legacy-browser .site-main .section-head h2,
.mle-legacy-browser .site-main .values h2,
.mle-legacy-browser .site-main .contact h2,
.mle-legacy-browser .product-intro h2,
.mle-legacy-browser .product-basic h2,
.mle-legacy-browser .product-development h2,
.mle-legacy-browser .product-webapp h2 {
  font-size: 38px;
  letter-spacing: -1.5px;
}
.mle-legacy-browser .statement p:last-child,
.mle-legacy-browser .product-question p:last-child {
  font-size: 34px;
}
.mle-legacy-browser .work-overview h3 { font-size: 32px; }

/* Header: bewusst einfach, ohne Flex-Gap-Abhaengigkeit. */
.mle-legacy-browser .header-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  min-height: 0;
  padding: 16px 0;
}
.mle-legacy-browser .logo { flex-shrink: 0; }
.mle-legacy-browser .logo-icon { flex-shrink: 0; margin-right: 10px; }
.mle-legacy-browser .header-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 0 24px;
}
.mle-legacy-browser .header-nav a,
.mle-legacy-browser .header-nav button {
  margin: 4px 20px 4px 0;
}
.mle-legacy-browser .header-nav button {
  padding: 10px 14px;
}

/* Konto-Anmeldung wird in nicht unterstuetzten Altbrowsern gar nicht angeboten. */
.mle-legacy-browser [data-account-entry],
.mle-account-blocked [data-account-entry] {
  display: none !important;
}

/* Der allgemeine Hinweis bleibt sichtbar, nur der Anmeldelink im Header verschwindet. */
.mle-legacy-browser .legacy-browser-note,
.mle-account-blocked .legacy-browser-note {
  border-bottom: 1px solid var(--line);
  background: #fff4ec;
  color: var(--ink);
}
.mle-legacy-browser .legacy-browser-note__inner,
.mle-account-blocked .legacy-browser-note__inner {
  width: calc(100% - 32px);
  max-width: 1080px;
  margin: 0 auto;
  padding: 11px 0;
  font-size: 12px;
  line-height: 1.5;
}
.mle-legacy-browser .legacy-browser-note strong,
.mle-account-blocked .legacy-browser-note strong { color: var(--orange); }
.mle-account-blocked .legacy-browser-note__inner p { margin: 5px 0 0; }

/* Die stark gerundete Maske schneidet die Textkarten auf Tablets ab.
 * Nur die Kompatibilitaetsansicht bekommt eine sichere rechteckige Flaeche. */
.mle-account-blocked .site-main .hero-art { border-radius: 28px; }

/* Startseite: auf alten Browsern lieber ein ruhiges Einspalten-Layout. */
.mle-legacy-browser .hero,
.mle-legacy-browser .site-main .hero {
  display: block;
  min-height: 0;
  padding: 46px 0 54px;
}
.mle-legacy-browser .site-main .hero > site-news {
  position: static;
  width: 100%;
  transform: none;
  margin: 0 0 28px;
}
.mle-legacy-browser .page-news { width: 100%; }
.mle-legacy-browser .page-news__content { display: block; }
.mle-legacy-browser .page-news__content > * { display: block; margin-bottom: 7px; }
.mle-legacy-browser .page-news__link { width: auto; }
.mle-legacy-browser .actions {
  display: flex;
  flex-wrap: wrap;
}
.mle-legacy-browser .actions > * { margin: 0 22px 10px 0; }
.mle-legacy-browser .button { width: auto; }
.mle-legacy-browser .hero-art,
.mle-legacy-browser .site-main .hero-art {
  display: block;
  width: 100%;
  max-width: 620px;
  height: 390px;
  margin: 38px auto 0;
}
/* Kein place-items/inset: diese Eigenschaften fehlen in alten Samsung-Browsern. */
.mle-legacy-browser .hero-art .brand-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -96px;
  margin-left: -90px;
  transform: none;
}
.mle-legacy-browser .hero-art .grid,
.mle-legacy-browser .product-visual::after {
  top: 0; right: 0; bottom: 0; left: 0;
}
.mle-legacy-browser .hero-art .n1 { top: 44px; left: 32px; }
.mle-legacy-browser .site-main .hero-art .n2 { right: 36px; bottom: 48px; }
.mle-legacy-browser .eyebrow span { flex-shrink: 0; margin-right: 12px; }
.mle-legacy-browser .actions { gap: 0; }

.mle-legacy-browser .statement-inner,
.mle-legacy-browser .section-head,
.mle-legacy-browser .values,
.mle-legacy-browser .contact-inner,
.mle-legacy-browser .product-question-inner,
.mle-legacy-browser .product-intro,
.mle-legacy-browser .product-basic-grid,
.mle-legacy-browser .product-webapp {
  display: block;
}
.mle-legacy-browser .statement-inner { padding: 48px 0; }
.mle-legacy-browser .statement .label,
.mle-legacy-browser .product-question .label { padding-top: 0; margin-bottom: 18px; }
.mle-legacy-browser .section-head > p { margin-top: 20px; }

.mle-legacy-browser .services,
.mle-legacy-browser .projects,
.mle-legacy-browser .values { padding: 62px 0; }

.mle-legacy-browser .work-overview {
  display: block;
  min-height: 0;
  padding: 36px;
}
.mle-legacy-browser .work-overview .browser { margin: 0 auto 34px; }

/* Karten: Flexbox-Fallback statt moderner Grid-Details. */
.mle-legacy-browser .project-grid,
.mle-legacy-browser .technology-notes {
  display: flex;
  flex-wrap: wrap;
  margin: -8px;
}
.mle-legacy-browser .project-grid article,
.mle-legacy-browser .technology-notes article {
  width: calc(50% - 16px);
  margin: 8px;
}
.mle-legacy-browser .project-grid article { min-height: 300px; }

.mle-legacy-browser .values > div:first-child { margin-bottom: 38px; }
.mle-legacy-browser .values li {
  display: flex;
  padding: 20px 0;
}
.mle-legacy-browser .values li > span {
  width: 48px;
  flex: 0 0 48px;
}

.mle-legacy-browser .contact-inner { padding: 50px 0; }
.mle-legacy-browser .contact .button { margin-top: 28px; }

/* Produkt-Informationsseiten bleiben ebenfalls lesbar. */
.mle-legacy-browser .product-hero {
  display: block;
  min-height: 0;
  padding: 48px 0 58px;
}
.mle-legacy-browser .product-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 620px;
  height: 380px;
  margin: 38px auto 0;
}
.mle-legacy-browser .product-question-inner { padding: 48px 0; }
.mle-legacy-browser .product-intro > * + *,
.mle-legacy-browser .product-basic-grid > * + *,
.mle-legacy-browser .product-webapp > * + * { margin-top: 30px; }
.mle-legacy-browser .product-principles { display: block; }
.mle-legacy-browser .product-principles article,
.mle-legacy-browser .product-principles article + article {
  min-height: 0;
  padding: 24px 0;
  border-right: 0;
  border-bottom: 1px solid var(--line);
}
.mle-legacy-browser .product-development {
  display: block;
  padding: 58px 0;
}
.mle-legacy-browser .product-development > * + * { margin-top: 28px; }

/* Footer ohne Grid-/Gap-Abhaengigkeit. */
.mle-legacy-browser .site-footer .footer-main {
  display: block;
  padding: 46px 0 36px;
}
.mle-legacy-browser .site-footer .footer-brand,
.mle-legacy-browser .site-footer .footer-claim,
.mle-legacy-browser .site-footer .footer-nav { margin-bottom: 34px; }
.mle-legacy-browser .site-footer .footer-claim { font-size: 32px; }
.mle-legacy-browser .site-footer .footer-bottom {
  display: block;
  padding: 18px 0 24px;
}
.mle-legacy-browser .site-footer .footer-bottom div { margin-top: 10px; }
.mle-legacy-browser .site-footer .footer-bottom a { margin-right: 20px; }

/* Dialog/Contact: alte Browser bekommen feste Viewport-Werte statt dvh/min(). */
.mle-legacy-browser .contact-dialog {
  width: calc(100% - 32px);
  max-width: 760px;
  max-height: calc(100vh - 40px);
}
.mle-legacy-browser .contact-dialog__head h2 { font-size: 34px; }
.mle-legacy-browser .contact-standard { width: 100% !important; }
.mle-legacy-browser .contact-standard .contact-form__row { grid-gap: 18px; }

/* Rechtliche Seiten. */
.mle-legacy-browser .site-main.legal-main { padding: 55px 0 80px; }
.mle-legacy-browser .site-main .legal-layout { display: block; }
.mle-legacy-browser .legal-layout aside { margin-bottom: 30px; }

/* Alte Browser brauchen die moderne Startanimation nicht. */
.mle-legacy-browser .mle-startup-animation { display: none !important; }
.mle-legacy-browser.mle-startup-pending body > :not(.mle-startup-animation) { visibility: visible !important; }
.mle-legacy-browser.mle-startup-pending body { background: var(--paper); }

@media (max-width: 700px) {
  .mle-legacy-browser .header-inner { display: block; }
  .mle-legacy-browser .header-nav { margin: 18px 0 0; }
  .mle-legacy-browser .header-nav a,
  .mle-legacy-browser .header-nav button { margin-right: 16px; }
  .mle-legacy-browser h1,
  .mle-legacy-browser .site-main h1 { font-size: 40px; letter-spacing: -1.5px; }
  .mle-legacy-browser .site-main .section-head h2,
  .mle-legacy-browser .site-main .values h2,
  .mle-legacy-browser .site-main .contact h2,
  .mle-legacy-browser .product-intro h2,
  .mle-legacy-browser .product-basic h2,
  .mle-legacy-browser .product-development h2,
  .mle-legacy-browser .product-webapp h2 { font-size: 32px; }
  .mle-legacy-browser .statement p:last-child,
  .mle-legacy-browser .product-question p:last-child { font-size: 28px; }
  .mle-legacy-browser .project-grid article,
  .mle-legacy-browser .technology-notes article { width: calc(100% - 16px); }
  .mle-legacy-browser .hero-art,
  .mle-legacy-browser .site-main .hero-art { height: 330px; }
  .mle-legacy-browser .work-overview { padding: 28px 20px; }
}

/* Verbindlicher MLE-Digital-Typografie-Standard */
:root{--mle-font-family:"Manrope",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;--mle-font-weight-normal:500;--mle-font-weight-heading:500;--mle-font-weight-navigation:700}
html,body,button,input,select,textarea{font-family:var(--mle-font-family)!important}
body,button,input,select,textarea,p,li,dt,dd,label,small,span{font-weight:var(--mle-font-weight-normal)}
h1,h2,h3,h4,h5,h6,strong,b,.button,.account-button,.account-product__link,.contact-form__submit,.contact-success__close{font-weight:var(--mle-font-weight-heading)!important}
nav a,nav button,.header-nav a,.header-nav button,.site-footer a{font-weight:var(--mle-font-weight-navigation)!important}
