/* Responsive reliability and mobile-layout repairs (V5). Keep the established desktop design. */
/* Never allow off-canvas navigation or moving text to enlarge the page canvas. */
html { overflow-x: clip; }
body { overflow-x: clip; }
main, .page-main, .footer { max-width: 100%; min-width: 0; }
img, video { max-width: 100%; }
/* The two marquee halves have identical dimensions: -50% now loops seamlessly. */
.vision-band { overflow: clip; }
.vision-track { display:flex; width:max-content; max-width:none; }
.vision-line:first-child,
.vision-line:last-child { flex: 0 0 auto; padding: 28px 0 28px var(--section-x); gap: 0; }
.vision-line span { flex-shrink:0; margin:0; padding-right:clamp(34px,5.8vw,86px); }
.vision-line span::after { margin-left: clamp(34px,5.8vw,86px); }
.vision-line span:last-child::after { content:""; margin-left:0; }
@media (prefers-reduced-motion:reduce) {
  .vision-track { animation:none !important; }
}
/* Keyboard focus remains visible with both themes. */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:2px solid var(--gold);outline-offset:3px;
}
html { scroll-padding-top:95px; }
@media (min-width:781px) and (max-width:1550px) {
 .topbar { --section-x:clamp(26px,4vw,66px);gap:clamp(10px,1.1vw,17px); grid-template-columns:minmax(100px,138px) minmax(0,1fr) auto max-content; }
 .topbar .nav,html[lang="de"] .topbar .nav { gap:clamp(10px,1.35vw,21px); }
 .topbar .nav a { font-size:11px;letter-spacing:.045em; }
}
@media (min-width:781px) and (max-width:1180px) {
 .topbar { --section-x:28px;grid-template-columns:106px minmax(0,1fr) auto; }
 .topbar .outline-btn { display:none; }
 .topbar .nav,html[lang="de"] .topbar .nav { gap:9px; }
 .topbar .nav a { font-size:10px;letter-spacing:0; }
 .topbar .theme-toggle { min-width:38px;width:38px;height:34px;padding:0; }
 .topbar .theme-toggle__track { width:32px; }
 .topbar .theme-toggle__text { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap; }
}
@media (max-width:780px) {
 :root { --section-x:clamp(16px,4.8vw,28px); --mobile-header-height:88px; }
 .topbar.is-scrolled { --mobile-header-height:78px; }
 .topbar,
 html[data-theme="dark"] .topbar { isolation:isolate; backdrop-filter:none; -webkit-backdrop-filter:none; }
 .topbar { grid-template-columns:minmax(0,1fr) auto auto; gap:clamp(6px,2vw,10px); padding-inline:var(--section-x); }
 .topbar .brand { width:clamp(72px,22vw,92px);min-width:0; }
 .topbar.is-scrolled .brand { width:clamp(68px,20vw,84px); }
 .topbar .header-controls { grid-column:2;grid-row:1;z-index:2;min-width:0;gap:3px;transform:none;transform-origin:right center;padding:2px; }
 .topbar .theme-toggle { width:32px;min-width:32px;height:32px;padding:0; }
 .topbar .language-option { width:clamp(26px,7.5vw,32px);height:30px; }
 .topbar .menu-btn { grid-column:3;grid-row:1;display:grid;position:relative;z-index:3;width:44px;min-width:44px;height:44px;touch-action:manipulation; }
 /* Slide illusion uses a clip instead of placing a 100vw panel off-screen. */
 .topbar .nav,html[lang="de"] .topbar .nav {
  position:fixed;inset:var(--mobile-header-height) 0 0 0;
  width:100%;max-width:100%;min-width:0;height:calc(100dvh - var(--mobile-header-height));
  max-height:calc(100dvh - var(--mobile-header-height));padding:clamp(24px,6vw,42px);
  display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
  gap:0;overflow-x:clip;overflow-y:auto;overscroll-behavior:contain;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:none;clip-path:inset(0 0 0 100%);
  transition:clip-path .34s var(--ease-premium),opacity .22s ease,visibility .22s;
  z-index:1;background:#fff;color:#151515;box-shadow:0 20px 36px rgba(0,0,0,.07);
 }
 body.menu-open .topbar .nav { opacity:1;visibility:visible;pointer-events:auto;transform:none;clip-path:inset(0); }
 .topbar .nav a,html[lang="de"] .topbar .nav a {
  display:block;width:100%;padding:clamp(16px,4vh,24px) 4px;
  border-bottom:1px solid rgba(21,21,21,.10);
  font-size:clamp(19px,5.2vw,26px);font-weight:530;line-height:1.3;letter-spacing:-.035em;white-space:normal;
 }
 .topbar .nav a::after { bottom:0; }
 html[data-theme="dark"] .topbar .nav { background:#201d19;color:#f2eadf;box-shadow:0 18px 35px rgba(0,0,0,.28); }
 html[data-theme="dark"] .topbar .nav a { border-bottom-color:rgba(226,188,117,.16); }
 .hero, .hero-content { min-width:0;max-width:100%; }
 .hero-content { width:100%;padding-left:var(--section-x);padding-right:var(--section-x); }
 .hero h1 { overflow-wrap:break-word;hyphens:auto; }
 .hero .dark-btn { max-width:100%;min-width:0; }
 .vision-line:first-child,.vision-line:last-child { padding:19px 0 19px 20px; }
 .vision-line { font-size:clamp(17px,5.4vw,24px);line-height:1.2; }
 .vision-line span { padding-right:22px; }
 .vision-line span::after { margin-left:22px; }
 .statement,.process,.contact { grid-template-columns:minmax(0,1fr); }
 .statement > *,.contact > *, .process > * { min-width:0; }
 .service-row,.numbers { grid-template-columns:minmax(0,1fr); }
 .page-main .info-block > * { min-width:0; }
 .page-main .info-block { overflow-wrap:anywhere; }
 .footer { overflow:clip; }
 .footer-main { padding:30px 0 24px; gap:25px;grid-template-columns:minmax(0,1fr);justify-items:stretch; }
 .footer-brand { display:grid;grid-template-columns:74px minmax(0,1fr);align-items:center;gap:17px; }
 .footer-brand img { width:69px; }
 .footer-brand p { max-width:340px;font-size:13px;line-height:1.65; }
 .footer-links { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;width:100%; }
 .footer-links a { display:block; width:100%;padding:14px 0;border-top:1px solid rgba(255,255,255,.1);font-size:12px;line-height:1.35; }
 .footer-cta { justify-self:stretch;width:100%;display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid rgba(221,181,106,.5);font-size:12px; }
 .footer-bottom { padding:19px 0 24px;gap:11px; }
 .footer-bottom p,.footer-bottom span { line-height:1.6; }
}
@media (max-width:375px) {
 :root { --section-x:16px; }
 .topbar { gap:5px; }
 .topbar .brand { width:70px; }
 .topbar.is-scrolled .brand { width:66px; }
 .topbar .header-controls { padding:2px;gap:2px; }
 .topbar .language-option { width:25px; }
 .topbar .menu-btn { width:40px;min-width:40px;height:42px; }
 .hero h1 { font-size:clamp(35px,11vw,42px); }
 .footer-brand { grid-template-columns:62px minmax(0,1fr);gap:14px; }
 .footer-brand img { width:61px; }
}
@media (max-height:550px) and (max-width:780px) { .topbar .nav a { padding-block:12px; } }
@media (prefers-reduced-motion:reduce) { .topbar .nav { transition:none!important; } }
/* Non-JS accessibility fallback. */
@media (max-width:780px) {
 html.no-js .topbar { height:auto;min-height:88px;grid-template-columns:minmax(0,1fr);padding-block:16px 14px; }
 html.no-js .topbar .header-controls,html.no-js .topbar .menu-btn { display:none; }
 html.no-js .topbar .nav { position:static;grid-column:1;height:auto;max-height:none;width:100%;padding:10px 0 0;display:flex;clip-path:none;transform:none;opacity:1;visibility:visible;pointer-events:auto;box-shadow:none; }
}

/* Footer content must remain reliably visible even after fast mobile scrolling.
   Its navigation is useful content, not a decorative reveal animation. */
.js .footer .reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
