/* Editorial handoffs between the four service worlds. */
@media (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  html { scroll-snap-type: none; }
  .lean-mode :is(.msk-about,.lean-contact) { scroll-margin-top: 92px; }

  .lean-mode :is(.world--repair,.world--vde,.world--rental,.world--water) .world-sticky::after {
    display: none !important;
  }

  .lean-mode .story-chapter {
    z-index: 3;
    height: 125svh;
    min-height: 760px;
    margin-top: 0;
    overflow: clip;
    opacity: 1;
    box-shadow: none;
  }

  .story-chapter__stage {
    position: sticky;
    top: 0;
    display: block;
    height: 100svh;
    overflow: hidden;
    isolation: isolate;
  }

  .lean-mode .story-chapter__photo {
    transform: translate3d(0,var(--photo-shift,0px),0) scale(var(--scene-scale,1.04));
  }

  .lean-mode .story-chapter__heading {
    translate: 0 var(--heading-drift,0px);
  }

  .scene-handoff {
    position: absolute;
    z-index: 3;
    left: 5vw;
    right: 5vw;
    bottom: 0;
    height: 29svh;
    overflow: hidden;
    pointer-events: none;
    border-top: 1px solid color-mix(in srgb,var(--chapter-accent) 38%,transparent);
    opacity: var(--handoff-opacity,0);
    transform: translate3d(0,var(--handoff-rise,42px),0);
  }

  .scene-handoff small {
    position: absolute;
    top: 22px;
    left: 0;
    color: var(--chapter-accent);
    font: 700 10px/1.3 var(--tech);
    letter-spacing: .2em;
  }

  .scene-handoff strong {
    position: absolute;
    left: -1vw;
    bottom: -0.21em;
    max-width: 100%;
    white-space: nowrap;
    color: transparent;
    -webkit-text-stroke: 1px color-mix(in srgb,var(--chapter-accent) 55%,transparent);
    font: 400 clamp(110px,17vw,320px)/.85 var(--display);
    letter-spacing: -.07em;
  }

  .lean-mode .reality-interlude {
    z-index: 3;
    margin-top: 0;
    opacity: 1;
  }
}

@media (max-width: 800px), (prefers-reduced-motion: reduce) {
  .story-chapter__stage { display: contents; }
}

/* A quiet instrument panel that belongs to the journey, not a floating menu. */
.topbar-shell { position: relative; overflow: hidden; }
.topbar-shell::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg,#b88947,#f1d6a3 58%,#9ad1dc);
  transform: scaleX(var(--journey-progress,0));
  transform-origin: left;
  pointer-events: none;
}
.topbar.is-journey .topbar-shell {
  background: linear-gradient(90deg,rgba(15,14,13,.94),rgba(20,20,20,.9) 54%,rgba(13,23,26,.91)) !important;
  border-color: rgba(227,199,151,.29) !important;
  box-shadow: 0 14px 42px rgba(0,0,0,.25) !important;
}
.topnav a.active { color: #f5d6a1 !important; }
.topnav a.active::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 3px;
  height: 1px;
  background: currentColor;
}
.topnav a { position: relative; }
@media (min-width: 801px) {
  .world-rail.visible {
    padding: 14px 12px;
    border: 1px solid rgba(226,197,121,.19);
    border-radius: 4px;
    background: rgba(13,13,13,.51);
    backdrop-filter: blur(14px);
    box-shadow: 0 16px 35px rgba(0,0,0,.18);
  }
  .world-rail a { min-height: 22px; }
}

@media (max-width: 800px), (prefers-reduced-motion: reduce) {
  .scene-handoff { display: none !important; }
}

/* V0.9.48: photographs belong to their own world; the navigation stays quiet. */
@media (min-width: 801px) and (prefers-reduced-motion: no-preference) {
  .lean-mode .world--repair { height: 205svh !important; }
  .lean-mode :is(.world--vde,.world--rental,.world--water) { height: 175svh !important; }
}

.world-rail { display: none !important; }
.topbar {
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.topbar .topbar-shell,
.topbar.is-journey .topbar-shell {
  grid-template-columns: minmax(215px,.7fr) minmax(0,2fr) auto !important;
  gap: clamp(18px,2vw,38px) !important;
  min-height: 70px;
  padding: 10px clamp(24px,3vw,58px) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(231,209,174,.25) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg,rgba(12,12,12,.87),rgba(12,12,12,.70)) !important;
  box-shadow: none !important;
  backdrop-filter: blur(19px) saturate(1.04) !important;
}
.topbar-shell::after {
  height: 1px;
  background: #d8bc8d;
}
.topbar .topbrand { gap: 12px !important; }
.topbar .topbrand-mark {
  width: 38px !important;
  height: 38px !important;
  flex-basis: 38px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.topbar .topbrand img { width: 37px !important; height: 37px !important; }
.topbar .topbrand-copy strong { font-size: 12px !important; letter-spacing: .16em !important; }
.topbar .topbrand-copy em { font-size: 9px !important; letter-spacing: .14em !important; }
.topbar .topnav { justify-content: flex-end !important; gap: clamp(13px,1.6vw,30px) !important; }
/* Never give hover or active links different padding: it collapses the pills. */
.topbar .topnav a {
  position: relative;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  color: rgba(251,246,237,.72) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .11em !important;
}
.topbar .topnav a.active,
.topbar .topnav a:hover { color: #f0d29e !important; }
.topbar .topnav a span {
  display: inline-block !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 !important;
  margin-right: 2px;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #c8a970 !important;
  font-size: 8px !important;
}
.topbar .topnav a.active::after {
  left: 0;
  right: 0;
  bottom: 4px;
  height: 1px;
}
.topbar .topbar-cta {
  min-height: 0 !important;
  padding: 9px 0 9px 17px !important;
  border: 0 !important;
  border-left: 1px solid rgba(231,209,174,.36) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  white-space: nowrap;
}
.topbar .topbar-cta small { font-size: 8px !important; letter-spacing: .15em !important; }
.topbar .topbar-cta span { font-size: 11px !important; letter-spacing: .07em !important; }
.topbar .topbar-cta:hover { transform: none !important; color: #f0d29e !important; }

.world-sticky.has-photo .world-visual { opacity: 0 !important; pointer-events: none; }
.world-photo-reveal img { object-position: center; }
.world--repair .world-photo-reveal img { object-position: 58% center; }
.world--vde .world-photo-reveal img { object-position: 58% center; }
.world--rental .world-photo-reveal img { object-position: 59% center; }
.world--water .world-photo-reveal img { object-position: 61% center; }
.world-sticky.has-photo .world-photo-reveal img { animation: world-photo-breathe 12s ease-in-out infinite alternate; }
@keyframes world-photo-breathe { to { transform: scale(1.045) translateX(-.5%); } }
/* Each world and each interactive chapter has a distinct editorial photograph. */
.story-chapter__stage{isolation:isolate}
.story-chapter__stage::before,.story-chapter__stage::after{content:"";position:absolute;pointer-events:none}
.story-chapter--repair .story-chapter__stage{background:#130e09}
.story-chapter--repair .story-chapter__stage::before{width:min(55vw,790px);aspect-ratio:1;right:5%;top:7%;border:1px solid rgba(236,193,128,.33);border-radius:50%;box-shadow:0 0 0 54px rgba(236,193,128,.025),inset 0 0 0 110px rgba(236,193,128,.025)}
.story-chapter--vde .story-chapter__stage{background:#08191f}
.story-chapter--vde .story-chapter__stage::before{width:min(52vw,720px);aspect-ratio:1;right:6%;top:8%;border:1px solid rgba(169,225,237,.35);border-radius:50%;box-shadow:0 0 0 48px rgba(169,225,237,.025),inset 0 0 0 95px rgba(169,225,237,.035)}
.story-chapter--rental .story-chapter__stage{background:#160e09}
.story-chapter--rental .story-chapter__stage::before{right:7%;top:17%;width:min(40vw,580px);height:62%;border:1px solid rgba(242,192,136,.35);transform:skewX(-12deg);box-shadow:22px 22px 0 rgba(242,192,136,.025),44px 44px 0 rgba(242,192,136,.02)}
.story-chapter--water .story-chapter__stage{background:#071f2a}
.story-chapter--water .story-chapter__stage::before{right:18%;top:18%;width:min(23vw,310px);aspect-ratio:1;border:1px solid rgba(164,230,243,.54);border-radius:50%;box-shadow:0 0 0 42px rgba(164,230,243,.035),0 0 0 112px rgba(164,230,243,.02),0 0 100px rgba(113,213,233,.21)}
.water-impact{background:radial-gradient(circle at 69% 48%,rgba(145,228,243,.38),transparent 26%),repeating-radial-gradient(circle at 69% 48%,transparent 0 54px,rgba(167,234,245,.13) 55px 56px),linear-gradient(135deg,#071b24,#18475a)}
@media (max-width:800px), (prefers-reduced-motion:reduce){
  .story-chapter--repair{background:radial-gradient(circle at 78% 38%,rgba(195,136,66,.26),transparent 40%),repeating-linear-gradient(90deg,transparent 0 56px,rgba(228,190,133,.06) 57px 58px),#130e09}
  .story-chapter--vde{background:radial-gradient(circle at 78% 40%,rgba(111,208,231,.23),transparent 40%),repeating-linear-gradient(0deg,transparent 0 48px,rgba(168,225,237,.07) 49px 50px),#08191f}
  .story-chapter--rental{background:linear-gradient(118deg,transparent 55%,rgba(235,166,86,.14) 56%,transparent 60%),radial-gradient(circle at 80% 45%,#4d2b16,#160e09 68%)}
  .story-chapter--water{background:repeating-radial-gradient(circle at 75% 42%,transparent 0 62px,rgba(159,228,241,.08) 63px 64px),#071f2a}
}
.repair-final { background: #090909; }
.water-compare__surface {
  background: linear-gradient(90deg,rgba(15,77,96,.22),rgba(130,216,230,.1)),
    repeating-linear-gradient(0deg,transparent 0 56px,rgba(170,235,246,.09) 57px 58px),
    repeating-linear-gradient(90deg,transparent 0 56px,rgba(170,235,246,.07) 57px 58px);
  backdrop-filter: grayscale(1) contrast(1.1);
  box-shadow: inset 0 0 160px rgba(74,177,201,.16);
}
.water-compare__surface::after {
  content: "MESSBLICK / HÄRTE · MINERALIEN";
  position: absolute;
  right: 7%;
  top: 15%;
  color: rgba(210,245,250,.72);
  font: 700 9px/1.3 var(--tech);
  letter-spacing: .18em;
}
.lean-contact {
  background: linear-gradient(90deg,rgba(10,9,8,.96),rgba(10,9,8,.82) 44%,rgba(10,9,8,.4)),url('assets/editorial/contact-conversation-2026.png') 60% center/cover !important;
}
.reality-interlude>img { object-position: 60% center; }

@media (max-width: 1180px) {
  .topbar .topbar-shell,.topbar.is-journey .topbar-shell { grid-template-columns: auto 1fr !important; gap: 6px 18px !important; }
  .topbar .topbar-cta { justify-self: end; }
  .topbar .topnav { grid-column: 1 / -1; justify-content: center !important; }
}
@media (max-width: 800px) {
  .topbar .topbar-shell,.topbar.is-journey .topbar-shell { padding: 7px 12px !important; min-height: 0; }
  .topbar .topbrand-mark { width: 32px !important; height: 32px !important; flex-basis: 32px !important; }
  .topbar .topbrand img { width: 31px !important; height: 31px !important; }
  .topbar .topbrand-copy strong { font-size: 10px !important; }
  .topbar .topbrand-copy em { display: none !important; }
  .topbar .topnav { justify-content: flex-start !important; gap: 16px !important; }
  .topbar .topnav a { white-space: nowrap; padding: 7px 0 !important; }
  .topbar .topnav a span { display: none !important; }
  .topbar .topbar-cta { border: 0 !important; padding: 6px 0 !important; }
  .topbar .topbar-cta span { font-size: 10px !important; }
  .lean-contact { background: #100d0b !important; }
}
@media (prefers-reduced-motion: reduce) {
  .world-sticky.has-photo .world-photo-reveal img { animation: none !important; }
}

/* A clear post-film landing frame: the film itself carries the MSK wordmark. */
.brand-quicklinks,.brand-quicklinks--single{display:none!important}
body.brand-video-frozen .brand-scrollcue{
  z-index:24;bottom:clamp(26px,6vh,70px);min-width:0;padding:0;
  display:flex;flex-direction:column;gap:10px;
  color:#33261a;background:none;border:0;border-radius:0;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;text-shadow:0 1px 8px rgba(255,246,230,.8);
}
body.brand-video-frozen .brand-scrollcue::after{display:none}
body.brand-video-frozen .brand-scrollcue em{color:#3b2b1a;font-size:11px!important;letter-spacing:.2em!important;font-weight:800}
body.brand-video-frozen .cue-mouse{width:25px;height:39px;border:1.5px solid #4b3420;background:rgba(255,249,236,.22);box-shadow:0 0 0 5px rgba(255,249,236,.12)}
body.brand-video-frozen .cue-mouse b{background:#573b20;box-shadow:none;animation:msk-scroll-dot 1.7s ease-in-out infinite}
@keyframes msk-scroll-dot{0%,100%{transform:translateY(0);opacity:.45}55%{transform:translateY(11px);opacity:1}}

/* Native wheel movement, shorter holds, and controls that follow the finger. */
html{scroll-snap-type:none!important;scroll-behavior:auto}
.lean-mode .world-sticky{filter:none!important}
@media (min-width:801px) and (prefers-reduced-motion:no-preference){
  .brand-scene{height:150svh!important}
  .lean-mode :is(.world--vde,.world--rental,.world--water){height:150svh!important}
  .lean-mode .story-chapter{height:115svh;min-height:760px}
}

/* The small side navigator is easier to hit without occupying the scene. */
@media (min-width:801px){
  .world-rail,.world-rail.visible{display:flex!important;right:14px;gap:2px;padding:8px;background:rgba(8,11,12,.58);border:1px solid rgba(231,209,174,.2);border-radius:14px;backdrop-filter:blur(12px)}
  body.brand-video-frozen .world-rail{opacity:1;pointer-events:auto;transform:translate(0,-50%)}
  .world-rail a{position:relative;min-height:44px;min-width:44px;width:44px;justify-content:center;padding:0;color:rgba(255,255,255,.68)!important;font-size:10.5px!important}
  .world-rail a span{position:absolute;right:54px;top:50%;width:max-content;padding:9px 11px;transform:translateY(-50%) translateX(5px);opacity:0;pointer-events:none;background:rgba(8,11,12,.92);border:1px solid rgba(231,209,174,.2);border-radius:4px;transition:opacity .2s,transform .2s}
  .world-rail a:hover span,.world-rail a:focus-visible span{opacity:1;transform:translateY(-50%) translateX(0)}
  .world-rail a b{width:12px;height:12px;flex:none;border-width:1.5px}
  .world-rail a.active b{width:24px}
  .world-rail a:hover,.world-rail a:focus-visible{color:#f0d29e!important}
}
@media (min-width:801px) and (max-width:1100px){
  .world-rail{right:8px;padding:6px}
  .world-rail a span{display:none}
  .story-chapter__heading,.story-chapter--water .story-chapter__heading{width:52vw!important;top:20%!important}
  .story-chapter__heading h2,.story-chapter--water .story-chapter__heading h2{font-size:clamp(54px,7vw,78px)!important}
  .repair-explore,.vde-sequence{right:6vw;width:39vw}
  .water-compare__fact{right:5vw;width:31vw}
}
@media (max-width:800px){
  .world-rail{display:none!important}
  .topbar .topnav a{min-height:44px;display:inline-flex!important;align-items:center;padding:11px 3px!important}
  .topbar .topnav{gap:18px!important}
  body.brand-video-frozen .brand-scrollcue{bottom:24px;padding:0 12px;max-width:calc(100vw - 24px)}
  body.brand-video-frozen .brand-scrollcue em{font-size:9px!important;white-space:normal;text-align:center}
}
@media (prefers-reduced-motion:reduce){body.brand-video-frozen .cue-mouse b{animation:none}}

/* The navigation belongs to the atelier: a floating, lit instrument rather than a toolbar. */
.topbar{top:12px!important;left:clamp(10px,1.5vw,28px)!important;right:clamp(10px,1.5vw,28px)!important;width:auto!important}
.topbar .topbar-shell,.topbar.is-journey .topbar-shell{
  min-height:94px!important;padding:9px clamp(14px,1.5vw,27px)!important;
  border:1px solid transparent!important;border-radius:20px!important;
  background:linear-gradient(115deg,rgba(28,22,18,.96),rgba(12,15,17,.95) 56%,rgba(15,30,32,.94)) padding-box,linear-gradient(110deg,rgba(248,210,145,.72),rgba(232,205,166,.16) 44%,rgba(160,223,228,.38) 74%,rgba(248,210,145,.6)) border-box!important;
  box-shadow:0 20px 55px rgba(0,0,0,.45),0 4px 13px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,238,205,.14)!important;
  backdrop-filter:blur(22px) saturate(1.25)!important;-webkit-backdrop-filter:blur(22px) saturate(1.25)!important;
}
.topbar .topbar-shell::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(105deg,transparent 36%,rgba(255,224,165,.12) 50%,transparent 64%);transform:translateX(-135%);animation:msk-nav-light 10s ease-in-out infinite}
.topbar .topbar-shell::after{left:18px;right:18px;bottom:0;height:2px;border-radius:2px;background:linear-gradient(90deg,#8f6132,#f3d59e 48%,#b8edf1)!important;box-shadow:0 0 13px rgba(245,202,128,.8)}
.topbar .topbar-shell>*{position:relative;z-index:1}
.topbar .topbrand{gap:12px!important}
.topbar .topbrand-mark{width:72px!important;height:72px!important;flex-basis:72px!important;display:grid;place-items:center;border:1px solid rgba(239,202,142,.43)!important;border-radius:50%!important;background:radial-gradient(circle at 30% 20%,rgba(239,202,142,.18),rgba(11,13,14,.76) 65%)!important;box-shadow:inset 0 1px 0 rgba(255,238,203,.18),0 0 24px rgba(205,147,75,.19)!important}
.topbar .topbrand img{width:64px!important;height:64px!important;object-fit:contain}
.topbar .topbrand-copy strong{font-size:12px!important;letter-spacing:.13em!important}
.topbar .topbrand-copy em{color:#cfac7e!important;letter-spacing:.16em!important}
.topbar .topnav{gap:clamp(2px,.32vw,8px)!important}
.topbar .topnav a{min-height:43px!important;display:inline-flex!important;align-items:center!important;gap:7px!important;padding:9px clamp(9px,.76vw,16px)!important;border:1px solid transparent!important;border-radius:999px!important;background:transparent!important;transition:background .3s,border-color .3s,color .3s,box-shadow .3s!important;font-size:10.5px!important;letter-spacing:.08em!important}
.topbar .topnav a:hover,.topbar .topnav a:focus-visible{border-color:rgba(242,210,153,.35)!important;background:rgba(240,201,140,.1)!important;color:#fff4df!important;box-shadow:0 0 24px rgba(234,176,94,.13)!important}
.topbar .topnav a.active{border-color:rgba(248,219,166,.62)!important;background:linear-gradient(135deg,rgba(235,185,110,.24),rgba(226,196,146,.08))!important;color:#ffedcc!important;box-shadow:inset 0 1px 0 rgba(255,239,207,.22),0 0 22px rgba(229,165,79,.21)!important}
.topbar .topnav a.active::after{display:none!important}
.topbar .topnav a span{color:#dfbc89!important}
.topbar .topbar-cta{min-height:44px!important;padding:7px 17px!important;border:1px solid rgba(244,210,157,.75)!important;border-radius:999px!important;background:linear-gradient(120deg,rgba(237,190,117,.19),rgba(222,179,114,.07))!important;box-shadow:inset 0 1px 0 rgba(255,234,194,.2),0 0 20px rgba(214,152,75,.13)!important;transition:background .3s,box-shadow .3s,transform .3s!important}
.topbar .topbar-cta:hover,.topbar .topbar-cta:focus-visible{background:linear-gradient(120deg,rgba(237,190,117,.36),rgba(222,179,114,.17))!important;box-shadow:0 0 29px rgba(226,167,86,.33),inset 0 1px 0 rgba(255,240,211,.28)!important;transform:translateY(-2px)!important}
.topbar .topbar-cta small{color:#e1bb81!important}
.topbar .topbar-cta span{color:#fff4df!important}
@keyframes msk-nav-light{0%,72%,100%{transform:translateX(-135%)}83%{transform:translateX(135%)}}

/* A short arrival, then a recurring illuminated invitation at the end of the film. */
body.brand-video-frozen .brand-scrollcue{
  bottom:clamp(10px,2.2vh,24px);width:min(332px,calc(100vw - 32px));min-width:0;max-width:none;
  padding:11px 20px;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:15px;
  color:#fff3dd;text-shadow:none;border:1px solid rgba(247,211,154,.86);border-radius:999px;
  background:linear-gradient(125deg,rgba(23,17,13,.88),rgba(35,25,16,.77));
  box-shadow:0 0 0 1px rgba(255,234,192,.12),0 9px 35px rgba(0,0,0,.24),0 0 24px rgba(234,175,88,.28),inset 0 1px 0 rgba(255,237,206,.2);
  backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);
  animation:msk-cue-arrive .9s cubic-bezier(.2,.9,.2,1) both,msk-cue-glow 3.2s 1s ease-in-out infinite;
}
body.brand-video-frozen .brand-scrollcue::before{content:"";position:absolute;inset:-5px;border:1px solid rgba(249,210,143,.7);border-radius:inherit;pointer-events:none;animation:msk-cue-ring 3.2s 1s ease-in-out infinite}
body.brand-video-frozen .brand-scrollcue::after{display:none}
body.brand-video-frozen .cue-copy{display:flex;flex-direction:column;gap:3px;text-align:left}
body.brand-video-frozen .cue-copy strong{font:800 11px/1.2 var(--tech);letter-spacing:.2em;color:#fff1d8}
body.brand-video-frozen .brand-scrollcue em{font:600 9px/1.3 var(--tech)!important;letter-spacing:.12em!important;color:#e0bd86!important;text-align:left!important;white-space:nowrap!important}
body.brand-video-frozen .cue-mouse{width:27px;height:40px;flex:none;border:1.5px solid #f0ca8d;border-radius:17px;background:linear-gradient(150deg,rgba(244,202,133,.2),rgba(255,255,255,.03));box-shadow:0 0 0 4px rgba(241,195,122,.09),0 0 15px rgba(238,190,114,.25)}
body.brand-video-frozen .cue-mouse b{width:3px;height:8px;background:#ffdfaa;box-shadow:0 0 9px #f7c785;animation:msk-scroll-dot 1.45s ease-in-out infinite}
@keyframes msk-cue-arrive{from{opacity:0;transform:translateX(-50%) translateY(50px) scale(.82);filter:blur(7px)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1);filter:blur(0)}}
@keyframes msk-cue-glow{0%,100%{box-shadow:0 0 0 1px rgba(255,234,192,.12),0 9px 35px rgba(0,0,0,.24),0 0 17px rgba(234,175,88,.2),inset 0 1px 0 rgba(255,237,206,.2)}50%{box-shadow:0 0 0 2px rgba(255,234,192,.4),0 9px 35px rgba(0,0,0,.24),0 0 39px rgba(242,181,88,.8),0 0 72px rgba(242,181,88,.35),inset 0 0 20px rgba(247,207,145,.13)}}
@keyframes msk-cue-ring{0%,100%{opacity:.2;transform:scale(.98)}50%{opacity:1;transform:scale(1.045)}}
@media (max-width:1180px){.topbar .topbar-shell,.topbar.is-journey .topbar-shell{gap:7px 15px!important}.topbar .topnav{justify-content:center!important}}
@media (max-width:800px){
  .topbar{top:8px!important;left:8px!important;right:8px!important}
  .topbar .topbar-shell,.topbar.is-journey .topbar-shell{padding:8px 11px!important;border-radius:17px!important}
  .topbar .topbrand-mark{width:56px!important;height:56px!important;flex-basis:56px!important}
  .topbar .topbrand img{width:50px!important;height:50px!important}
  .topbar .topnav{justify-content:flex-start!important;gap:5px!important;padding-bottom:2px}
  .topbar .topnav a{min-height:40px!important;padding:7px 12px!important;font-size:10px!important}
  .topbar .topbar-cta{min-height:38px!important;padding:6px 11px!important}
  body.brand-video-frozen .brand-scrollcue{bottom:9px;padding:10px 15px;gap:12px}
}
@media (max-width:420px){.topbar .topbrand{gap:7px!important}.topbar .topbrand-copy strong{font-size:9px!important}.topbar .topbar-cta span{font-size:9px!important}.topbar .topbar-cta small{font-size:7px!important}}
@media (prefers-reduced-motion:reduce){.topbar .topbar-shell::before,body.brand-video-frozen .brand-scrollcue,body.brand-video-frozen .brand-scrollcue::before,body.brand-video-frozen .cue-mouse b{animation:none!important}}

/* Give the repair statement room to arrive, stay readable, and leave gradually. */
@media (min-width:801px) and (prefers-reduced-motion:no-preference){.lean-mode .world--repair{height:260svh!important}}

/* Warmer typography and tactile controls across the service worlds. */
:root{--tech:"Aptos","Segoe UI",Arial,sans-serif;--body:"Aptos","Segoe UI",Arial,sans-serif}
.world-more{border-radius:17px!important;background:linear-gradient(125deg,rgba(40,30,22,.93),rgba(14,14,14,.87))!important;box-shadow:0 17px 38px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,239,209,.11)!important;transition:transform .35s ease,box-shadow .35s ease,background .35s ease!important}
.world-more:hover,.world-more:focus-visible{transform:translateY(-4px);background:linear-gradient(125deg,rgba(83,57,33,.96),rgba(24,22,19,.94))!important;box-shadow:0 24px 48px rgba(0,0,0,.4),0 0 27px color-mix(in srgb,var(--summary-accent) 30%,transparent)!important}
.world-more>span{font-family:var(--body)!important;font-weight:700!important;letter-spacing:.01em!important;text-transform:none!important;font-size:18px!important}
.world-more>small{font-family:var(--body)!important;letter-spacing:0!important;font-weight:400!important}
.world-more>b{display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:rgba(235,198,137,.14);color:#f5d8a5}
.world-interact,.repair-explore,.vde-sequence,.rental-choice,.water-compare__controls,.water-compare__fact{border-radius:18px!important}
.world-interact__choices button,.repair-explore__nav button,.vde-sequence__steps button{border-radius:10px!important;font-family:var(--body)!important;letter-spacing:0!important}

/* Repair: a lit photographic layer responds only around the visitor's pointer. */
.world--repair .repair-lens{--lens-x:72%;--lens-y:48%;--ring-x:72%;--ring-y:48%;position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .35s ease}
.world--repair .repair-lens::before{content:"";position:absolute;inset:0;background:url('assets/editorial/repair-story-leak-2026.png') 58% center/cover no-repeat;filter:brightness(1.17) saturate(1.08) contrast(1.05);-webkit-mask-image:radial-gradient(circle 225px at var(--lens-x) var(--lens-y),#000 0 33%,rgba(0,0,0,.86) 65%,transparent 100%);mask-image:radial-gradient(circle 225px at var(--lens-x) var(--lens-y),#000 0 33%,rgba(0,0,0,.86) 65%,transparent 100%)}
.world--repair .repair-lens::after{content:"";position:absolute;inset:0;background:radial-gradient(circle 205px at var(--lens-x) var(--lens-y),rgba(255,201,113,.09),transparent 80%);mix-blend-mode:screen}
.world--repair .repair-lens__ring{position:absolute;left:var(--ring-x);top:var(--ring-y);width:clamp(190px,20vw,275px);aspect-ratio:1;border:1px solid rgba(250,211,147,.55);border-radius:50%;transform:translate(-50%,-50%);box-shadow:inset 0 0 42px rgba(245,184,99,.17),0 0 28px rgba(245,184,99,.3),0 0 0 12px rgba(245,184,99,.045)}
.world--repair .repair-lens__ring::before,.world--repair .repair-lens__ring::after{content:"";position:absolute;left:50%;top:50%;background:#ffe3b1;box-shadow:0 0 12px #ffc376}
.world--repair .repair-lens__ring::before{width:20px;height:1px;transform:translate(-50%,-50%)}
.world--repair .repair-lens__ring::after{width:1px;height:20px;transform:translate(-50%,-50%)}
.world--repair .repair-stage.has-photo.lens-active .repair-lens{opacity:1}
.world--repair .repair-stage:not(.has-photo) .repair-lens{visibility:hidden}
.world--repair .world-sticky.has-photo .world-photo-reveal img{animation:none!important;transform:none!important}

/* Keep the diagnostic instrument above the process strip, with room for two honest entry routes. */
.world--repair .world-interact--repair{right:4.5vw;bottom:clamp(150px,18vh,215px);width:min(430px,35vw);padding:19px 21px 20px;border:1px solid rgba(240,204,146,.48)!important;background:linear-gradient(150deg,rgba(34,26,20,.91),rgba(14,13,12,.88))!important;box-shadow:0 25px 65px rgba(0,0,0,.43),inset 0 1px 0 rgba(255,232,193,.13)!important}
.world--repair .world-interact__top small{font:700 12px/1.35 var(--body)!important;letter-spacing:.045em;color:#f3d5a8}
.world--repair .world-interact__view{font:600 12px/1.3 var(--body)!important;letter-spacing:0!important}
.world--repair .world-interact__choices button{font-size:12px!important;font-weight:600!important;min-height:42px}
.world--repair .world-interact__answer{min-height:0;margin-top:14px;padding-top:13px}
.world--repair .world-interact__answer strong{font-family:Georgia,"Times New Roman",serif;font-size:clamp(22px,1.6vw,29px);line-height:1.2}
.world--repair .world-interact__answer p{font-family:var(--body);font-size:13px;line-height:1.5;color:#e4d7c6}
.repair-entry{display:grid;grid-template-columns:1.12fr .88fr;gap:8px;margin-top:15px}
.repair-entry a{display:flex;flex-direction:column;justify-content:center;gap:4px;min-height:67px;padding:9px 12px;border-radius:12px;border:1px solid rgba(233,200,146,.4);background:rgba(255,255,255,.04);transition:transform .25s,background .25s,box-shadow .25s}
.repair-entry a:hover,.repair-entry a:focus-visible{transform:translateY(-3px);background:rgba(245,204,142,.16);box-shadow:0 9px 22px rgba(0,0,0,.28);outline-offset:3px}
.repair-entry__primary{background:linear-gradient(125deg,rgba(215,164,92,.25),rgba(157,105,49,.13))!important;border-color:rgba(247,204,143,.7)!important}
.repair-entry span{font:700 12px/1.22 var(--body);color:#fff2df}
.repair-entry span b{display:inline-block;margin-left:3px;color:#f3d19b;font:700 9px/1.2 var(--body)}
.repair-entry small{font:500 10px/1.25 var(--body);color:#d5bfa5}
.world--repair .repair-steps{bottom:4vh}
.world--repair .repair-steps article{border-radius:10px 10px 0 0}
.world--repair .repair-steps b{font-family:var(--body)!important;letter-spacing:.035em!important;text-transform:none!important;font-size:11px!important}
@media (max-width:1180px) and (min-width:801px){.world--repair .world-interact--repair{right:2vw;width:37vw}.repair-entry{grid-template-columns:1fr}.repair-entry a{min-height:46px;padding:7px 10px}.repair-entry small{font-size:9px}}
@media (max-width:800px){
  .world--repair .repair-lens{display:none}
  .world--repair .world-interact--repair{position:relative;right:auto;bottom:auto;width:100%;max-width:none;margin-top:20px;padding:18px!important}
  .world--repair .world-interact__top small{font-size:12px!important}
  .world--repair .world-interact__choices button{font-size:12px!important}
  .repair-entry{grid-template-columns:repeat(2,minmax(0,1fr))}
  .repair-entry a{min-height:64px}
}
@media (max-width:440px){.repair-entry{grid-template-columns:1fr}.repair-entry a{min-height:55px}.world--repair .world-interact__choices button{font-size:10px!important}}
@media (prefers-reduced-motion:reduce){.world--repair .repair-lens{display:none}.world-more,.repair-entry a{transition:none!important}}

/* One warm interface language throughout every current and future world. */
.world-interact,.repair-explore,.vde-sequence,.rental-choice,.water-compare__controls,.water-compare__fact,
.vde-tiers article,.water-core__info,.rental-live,.water-measure,.coach-live,.lean-contact-action,
.brand-quicklink,.scene-handoff{border-radius:18px!important}
.world-interact{box-shadow:0 22px 55px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.1)!important}
.world-interact__top small,.world-interact__hint,.world-interact__view,
.repair-explore__nav button,.vde-sequence__steps button,.rental-choice button,
.water-compare__controls label,.water-compare__fact small{font-family:var(--body)!important;letter-spacing:.035em!important}
.world-interact__top small,.world-interact__hint{font-size:11px!important;line-height:1.35!important}
.world-interact__view{font-size:12px!important;text-transform:none!important}
.world-interact__choices button{min-height:43px;border-radius:11px!important;font-family:var(--body)!important;font-size:12px!important;font-weight:650!important;letter-spacing:0!important;text-transform:none!important}
.world-interact__answer strong,.rental-choice strong,.vde-sequence__display strong{font-family:Georgia,"Palatino Linotype",serif!important;letter-spacing:-.025em!important}
.world-interact__answer p,.rental-choice p,.vde-sequence__display p,.repair-explore__text{font-family:var(--body)!important;font-size:14px!important;line-height:1.55!important}
.repair-explore__nav button,.vde-sequence__steps button,.rental-choice button{border-radius:10px!important;font-size:12px!important;font-weight:650!important;text-transform:none!important}
.rental-choice button,.vde-sequence__steps button{min-height:42px}
.water-compare__controls input[type="range"]{accent-color:#a8dce7}
.water-core__info,.rental-live,.vde-tiers article{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 32px rgba(0,0,0,.17)!important}
.world-summary__facts em{font-family:var(--body)!important;letter-spacing:0!important}
.world-summary__facts b,.repair-steps b,.vde-tiers small,.rental-live small,.water-measure small{font-family:var(--body)!important;letter-spacing:.055em!important}
.story-chapter__heading small,.world-copy>small{font-family:var(--body)!important;letter-spacing:.09em!important}
.story-chapter a:not(.world-more){font-family:var(--body)!important;letter-spacing:.035em!important}
.lean-contact-methods a,.world-cta{border-radius:999px}
@media (max-width:800px){.world-interact__choices button{font-size:11px!important}.world-interact__top small{font-size:10px!important}}

/* V10.18 — the first VDE scene stays calm; the second one changes its real
   workshop photograph together with Sicht, Messung and Dokumentation. */
.world--vde .world-summary--single{
  display:block!important;
  width:min(100%,620px);
  margin-top:30px!important;
}
.world--vde .world-summary--single .world-more{width:100%}

.story-chapter--vde .vde-story-photo{
  z-index:0;
  opacity:0;
  object-position:59% center;
  filter:contrast(1.11) saturate(.62) brightness(.78) sepia(.04);
  transition:opacity .9s cubic-bezier(.22,.7,.18,1),filter .9s ease;
}
.story-chapter--vde .vde-story-photo.is-current{
  opacity:1;
  filter:contrast(1.11) saturate(.68) brightness(.82) sepia(.03);
}
.story-chapter--vde .vde-sequence__steps button{
  transition:background .3s ease,border-color .3s ease,color .3s ease,transform .3s cubic-bezier(.2,.75,.22,1);
}
.story-chapter--vde .vde-sequence__steps button:hover,
.story-chapter--vde .vde-sequence__steps button:focus-visible{
  transform:translateY(-2px);
}
@media (max-width:800px){
  .story-chapter--vde .vde-story-photo{object-position:62% center}
}
@media (prefers-reduced-motion:reduce){
  .story-chapter--vde .vde-story-photo{transition:none!important}
}