/* Tablet layout contract: 600–1199px only. Loaded after all legacy styles. */
@media (min-width: 600px) and (max-width: 1199px) {
  :root { --tablet-gutter: clamp(28px, 5vw, 62px); --tablet-content: min(100%, 46rem); }
  html, body { scroll-snap-type: none !important; scroll-behavior: auto !important; overflow-x: clip !important; }
  html:has(.brand-scene) { scroll-padding-top: 0 !important; }
  /* Desktop handoff veils must not paint across tablet content, including reduced motion. */
  .brand-scene::before, .brand-scene::after, .world::before, .world::after,
  .world-transition-bridge::before, .world-transition-bridge::after { display:none !important; }

  /* Compact mobile-style header on every tablet width. */
  .topbar, .detail-top.detail-top--site { top: 8px !important; left: 8px !important; right: 8px !important; width: auto !important; padding: 0 !important; }
  .topbar .topbar-shell, .topbar.is-journey .topbar-shell, .detail-top__shell {
    display:grid !important; grid-template-columns:42px 42px minmax(120px,1fr) auto 42px !important;
    grid-template-rows:46px !important; gap:7px !important; min-height:0 !important; padding:6px 8px !important;
    border-radius:17px !important; overflow:visible !important;
  }
  .topbar .topbrand, .detail-top--site .detail-brand, .topbar .topbrand-mark, .detail-brand__mark { grid-column:1 !important; grid-row:1 !important; width:42px !important; height:42px !important; flex-basis:42px !important; gap:0 !important; }
  .topbar .topbrand img, .detail-brand__mark img { width:40px !important; height:40px !important; }
  .topbar .topbrand-copy, .detail-top--site .detail-brand__copy { display:none !important; }
  .topbar .topbar-shell > .msk-language-switch, .detail-top__shell > .msk-language-switch { position:relative !important; grid-column:2 !important; grid-row:1 !important; inset:auto !important; transform:none !important; }
  .msk-language-trigger { width:42px !important; height:42px !important; padding:0 !important; }
  .msk-language-trigger .msk-language-flag:not(.is-current) { display:none !important; }
  .topbar .topbar-shell > .site-search-bar, .detail-top__shell > .site-search-bar { position:relative !important; grid-column:3 !important; grid-row:1 !important; inset:auto !important; transform:none !important; width:100% !important; height:42px !important; min-width:0 !important; margin:0 !important; grid-template-columns:minmax(0,1fr) 36px !important; }
  .site-search-bar input { min-width:0 !important; font-size:16px !important; padding:0 5px 0 11px !important; }
  .site-search-bar button { width:36px !important; height:42px !important; }
  .topbar .topbar-cta, .detail-contact-cta { grid-column:4 !important; grid-row:1 !important; min-height:42px !important; min-width:0 !important; padding:6px 10px !important; }
  .topbar .topbar-cta small, .detail-contact-cta small { display:none !important; }
  .topbar .topbar-cta span, .detail-contact-cta span { font-size:10px !important; white-space:nowrap !important; }
  .mobile-menu-toggle { grid-column:5 !important; grid-row:1 !important; display:flex !important; width:42px !important; height:42px !important; padding:0 !important; border-radius:14px !important; }
  .topbar .topnav, .detail-world-nav { position:absolute !important; top:calc(100% + 8px) !important; left:0 !important; right:0 !important; display:none !important; width:100% !important; max-height:calc(100svh - 80px) !important; overflow:auto !important; flex-direction:column !important; gap:6px !important; padding:10px !important; border-radius:17px !important; }
  .topbar .mobile-nav-open .topnav, .mobile-nav-open .detail-world-nav { display:flex !important; }
  .topbar .topnav > a, .detail-world-nav > a { display:flex !important; width:100% !important; min-height:46px !important; padding:10px 14px !important; font-size:13px !important; border-radius:12px !important; }
  .nav-flyout, .detail-section-nav { display:none !important; }

  /* Brand film stays a single, clipped, full-screen composition. */
  .brand-scene { height:100svh !important; min-height:0 !important; }
  .brand-sticky { position:relative !important; height:100svh !important; min-height:0 !important; overflow:hidden !important; }
  /* Final-frame logo centre is x=1834 of 3840; compensate for the actual cover width. */
  .brand-reveal-poster, .brand-reveal-video { --msk-video-x:calc(50% + max(100vw, 177.777778svh) * 0.0223958333) !important; --msk-video-y:50% !important; object-fit:cover !important; }

  /* Home worlds: no sticky desktop canvas, no absolute content columns. */
  .world, .story-chapter, .service-compass, .reality-interlude, .msk-about, .lean-contact, .ending-scene { height:auto !important; min-height:0 !important; overflow:visible !important; scroll-snap-align:none !important; }
  .world-sticky { position:relative !important; display:flex !important; flex-direction:column !important; align-items:stretch !important; height:auto !important; min-height:0 !important; padding:82px var(--tablet-gutter) 46px !important; overflow:hidden !important; isolation:isolate !important; }
  .world-sticky::before, .world-sticky::after { display:none !important; }
  .world-ghost, .world-index, .repair-grid, .vde-grid-bg, .repair-final, .shop-final { display:none !important; }
  .world-photo-reveal { position:absolute !important; inset:0 !important; z-index:0 !important; width:100% !important; height:100% !important; opacity:1 !important; overflow:hidden !important; }
  .world-photo-reveal > img, .world-photo-reveal > video, .world-photo-reveal .scene-video-pair, .world-photo-reveal .scene-video-pair video, .world-water-video { width:100% !important; height:100% !important; min-height:0 !important; object-fit:cover !important; object-position:center !important; transform:none !important; }
  .world-photo-reveal .scene-video-pair { position:absolute !important; inset:0 !important; }
  .world-copy, .coffee-copy { position:relative !important; inset:auto !important; z-index:4 !important; order:1 !important; width:var(--tablet-content) !important; max-width:46rem !important; margin:0 auto !important; text-align:center !important; transform:none !important; opacity:1 !important; }
  .world-copy > small { text-align:center !important; }
  .world-copy h1, .world-copy h2 { font-size:clamp(52px,7.2vw,76px) !important; line-height:.94 !important; }
  .world-copy p { max-width:42rem !important; margin-inline:auto !important; font-size:16px !important; line-height:1.58 !important; }
  .world-visual, .coffee-visual, .shop-window { position:relative !important; inset:auto !important; z-index:3 !important; order:2 !important; width:var(--tablet-content) !important; max-width:46rem !important; height:clamp(300px,42svh,480px) !important; min-height:0 !important; margin:22px auto 0 !important; transform:none !important; opacity:1 !important; }
  /* Hidden desktop diagrams must not reserve an empty column below a background. */
  .world-sticky.has-photo .world-visual { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; max-width:none !important; margin:0 !important; opacity:0 !important; pointer-events:none !important; }
  .world-interact, .repair-steps, .water-facts-strip, .vde-tiers, .coach-duration, .rental-track { position:relative !important; inset:auto !important; z-index:5 !important; order:3 !important; width:var(--tablet-content) !important; max-width:46rem !important; margin:16px auto 0 !important; transform:none !important; opacity:1 !important; }
  .world-interact { text-align:center !important; }
  .repair-steps { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .water-facts-strip { display:flex !important; }
  .repair-lens, .scene-spotlight { z-index:6 !important; }

  /* Story photographs remain background layers of a single scene. */
  html.lean-mode .story-chapter { position:relative !important; display:block !important; padding:0 !important; margin:0 !important; overflow:hidden !important; }
  html.lean-mode .story-chapter__stage { position:relative !important; top:auto !important; display:flex !important; flex-direction:column !important; align-items:center !important; isolation:isolate !important; height:auto !important; padding:84px var(--tablet-gutter) 36px !important; min-height:clamp(680px,78vw,930px) !important; overflow:hidden !important; }
  .story-chapter__stage::before, .story-chapter__stage::after, .story-chapter__index, .vde-sweep { display:none !important; }
  html.lean-mode .story-chapter__photo { position:absolute !important; inset:0 !important; width:100% !important; max-width:none !important; height:100% !important; margin:0 !important; object-fit:cover !important; object-position:center !important; transform:none !important; opacity:1 !important; z-index:0 !important; }
  .story-chapter--vde .vde-story-photo { visibility:hidden !important; opacity:0 !important; }
  .story-chapter--vde .vde-story-photo.is-current { visibility:visible !important; opacity:1 !important; }
  .story-chapter__shade { display:block !important; position:absolute !important; inset:0 !important; z-index:2 !important; pointer-events:none !important; background:linear-gradient(180deg,rgba(3,16,20,.78),rgba(3,16,20,.15) 38%,rgba(3,16,20,.32) 62%,rgba(3,16,20,.82)) !important; }
  .story-chapter__heading, .story-chapter--repair .story-chapter__heading, .story-chapter--water .story-chapter__heading, .repair-explore, .vde-sequence, .rental-choice, .water-compare__fact { position:relative !important; inset:auto !important; z-index:5 !important; width:var(--tablet-content) !important; max-width:46rem !important; margin:0 auto !important; translate:none !important; transform:none !important; opacity:1 !important; text-align:center !important; }
  .story-chapter__heading { flex:none !important; }
  .repair-explore, .vde-sequence, .rental-choice, .water-compare__fact { flex:none !important; margin-top:auto !important; }
  .story-chapter__heading h2 { font-size:clamp(42px,5.8vw,66px) !important; line-height:1 !important; }
  .story-chapter__heading small { margin-bottom:14px !important; }
  .story-chapter__heading p { margin:16px auto 0 !important; max-width:36rem !important; font-size:16px !important; line-height:1.5 !important; }
  .vde-sequence__display { min-height:0 !important; }
  .vde-sequence, .water-compare__fact { margin-top:24px !important; }
  /* Repair needs the entire source image: parts on both edges must stay reachable. */
  html.lean-mode .story-chapter--repair .story-chapter__stage { padding:80px 0 32px !important; min-height:100svh !important; justify-content:center !important; gap:24px !important; background:linear-gradient(180deg,#100d09,#18120b) !important; }
  html.lean-mode .story-chapter--repair .repair-image-stage { position:relative !important; inset:auto !important; flex:none !important; width:100% !important; max-width:none !important; height:auto !important; min-height:0 !important; aspect-ratio:1672/940 !important; margin:0 !important; overflow:hidden !important; z-index:3 !important; }
  html.lean-mode .story-chapter--repair .repair-image-stage > img { object-fit:contain !important; object-position:center !important; }
  .story-chapter--repair .story-chapter__shade { display:none !important; }
  .story-chapter--repair .story-chapter__heading, .story-chapter--repair .repair-explore { width:calc(100% - 2 * var(--tablet-gutter)) !important; margin-top:0 !important; }
  .repair-focus { inset:0 !important; }
  .repair-focus span { width:clamp(64px,9vw,105px) !important; }
  /* All comparison layers share the exact same rectangle and image crop. */
  .story-chapter--water .water-compare__surface, .story-chapter--water .water-compare__curtain, .story-chapter--water .water-compare__glass { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; background-size:cover !important; background-position:right center !important; }
  .story-chapter--water .water-compare__surface::after, .story-chapter--water .water-compare__labels { display:none !important; }
  /* The mineral image is its own top layer; the clear glass cannot cover it. */
  .story-chapter--water .water-compare__glass,
  .story-chapter--water .water-compare__surface {
    /* Inline mask also works when index.html is opened directly via file://. */
    --tablet-glass-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1672 941'%3E%3Cpath fill='white' d='M1292 96 Q1313 84 1361 87 Q1412 86 1424 98 L1415 110 L1414 264 Q1414 280 1398 282 L1310 282 Q1293 279 1293 265 L1293 117 L1287 105 Z'/%3E%3C/svg%3E");
    -webkit-mask-image:var(--tablet-glass-mask) !important;
    mask-image:var(--tablet-glass-mask) !important;
    -webkit-mask-size:cover !important; mask-size:cover !important;
    -webkit-mask-position:right center !important; mask-position:right center !important;
    -webkit-mask-repeat:no-repeat !important; mask-repeat:no-repeat !important;
    filter:contrast(1.06) saturate(.9) brightness(1.06) !important;
    pointer-events:none !important;
  }
  .story-chapter--water .water-compare__glass { z-index:3 !important; }
  .story-chapter--water .water-compare__surface {
    z-index:4 !important;
    background-image:url('assets/editorial/water-story-mineral-reveal-2026.png') !important;
    clip-path:inset(0 0 0 var(--water-split)) !important;
    opacity:1 !important; backdrop-filter:none !important; box-shadow:none !important;
  }
  .story-chapter--water .water-compare__glass::after,
  .story-chapter--water .water-compare__curtain { display:none !important; }
  .story-chapter--water .water-compare__divider { top:0 !important; bottom:0 !important; }
  .story-chapter--water .water-compare__divider span { top:20% !important; }
  .story-chapter--water .water-compare__divider:not(.is-interacted)::after { top:calc(20% + 38px) !important; }
  .mobile-menu-toggle { flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:5px !important; border:1px solid rgba(237,207,158,.44) !important; background:rgba(255,255,255,.045) !important; color:#f9eee0 !important; }
  .mobile-menu-toggle span { display:block !important; width:20px !important; height:2px !important; background:currentColor !important; }

  /* Close-out sections and footer share the same centred tablet column. */
  .service-compass, .msk-about, .reality-interlude, .lean-contact { padding:78px var(--tablet-gutter) 52px !important; }
  .service-compass__head, .msk-about-inner, .reality-interlude__copy, .lean-contact-copy, .lean-contact-action { width:var(--tablet-content) !important; max-width:46rem !important; margin-inline:auto !important; text-align:center !important; }
  .lean-contact { display:flex !important; flex-direction:column !important; isolation:isolate !important; }
  .lean-contact > .scene-video { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; object-fit:cover !important; }
  .site-footer__inner, .ending-scene .site-footer__inner { width:var(--tablet-content) !important; max-width:46rem !important; margin-inline:auto !important; }
  .site-footer__grid, .ending-scene .site-footer__grid { grid-template-columns:1fr !important; text-align:center !important; }
  .site-footer__contact, .ending-scene .site-footer__contact { grid-column:auto !important; }
  .site-footer__nav, .site-footer__legal, .site-footer__bottom { justify-content:center !important; text-align:center !important; }

  /* Detail pages use the same normal flow, too. */
  .detail-shell { padding-top:76px !important; }
  .detail-shell .detail-hero, .detail-shell .detail-section, .detail-shell .final-cta { grid-template-columns:1fr !important; padding-left:var(--tablet-gutter) !important; padding-right:var(--tablet-gutter) !important; }
  .detail-shell .detail-copy, .detail-shell .section-content, .detail-shell .detail-visual { width:var(--tablet-content) !important; max-width:46rem !important; margin-inline:auto !important; text-align:center !important; }
  .detail-shell .detail-visual { height:clamp(320px,46svh,520px) !important; min-height:0 !important; }
  .detail-shell .fact-grid, .detail-shell .quick-answers, .detail-shell .info-grid, .detail-shell .tool-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

@media (min-width: 600px) and (max-width: 799px) {
  :root { --tablet-gutter:24px; --tablet-content:min(100%,38rem); }
  .world-copy h1, .world-copy h2, .story-chapter__heading h2 { font-size:clamp(46px,8.7vw,62px) !important; }
  .world-visual, .coffee-visual, .shop-window { height:clamp(280px,40svh,380px) !important; }
}
/* Tablet hard reset for the desktop journey heights. These are the source of the former black gaps. */
@media (min-width: 600px) and (max-width: 1199px) {
  html.lean-mode :is(.world, .world--repair, .world--vde, .world--rental, .world--water),
  html.lean-mode .story-chapter {
    height: auto !important;
    min-height: 0 !important;
  }
  html.lean-mode .world-sticky { height:auto !important; min-height:100svh !important; justify-content:center !important; gap:20px !important; }
  html.lean-mode .story-chapter__stage { min-height:100svh !important; justify-content:space-between !important; }
  html.lean-mode .story-chapter--repair .story-chapter__stage { justify-content:center !important; }
  html.lean-mode .story-chapter--water .story-chapter__stage { justify-content:flex-start !important; padding-top:max(44svh,420px) !important; gap:22px !important; }
  html.lean-mode .story-chapter--water .story-chapter__photo { object-position:right center !important; }
  .story-chapter--water .water-compare__fact { margin-top:0 !important; }
  .story-chapter--water .water-compare__fact strong { font-size:clamp(44px,5vw,64px) !important; }
  .story-chapter--water .water-compare__fact p { font-size:15px !important; line-height:1.5 !important; }

  .world-summary__facts { gap:12px !important; }
  .world--repair .repair-entry { margin-top:0 !important; margin-bottom:24px !important; gap:24px !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .world--repair .repair-steps { margin-top:0 !important; }
  .world-copy p, .story-chapter__heading p { font-size:clamp(16px,1.7vw,20px) !important; }
  .world-more { text-align:center !important; }

  /* The precision film is a full scene, not a collapsed strip. */
  .reality-interlude { position:relative !important; display:flex !important; align-items:flex-end !important; justify-content:center !important; min-height:100svh !important; padding:84px var(--tablet-gutter) 64px !important; overflow:hidden !important; }
  .reality-interlude > img, .reality-interlude .scene-video-pair, .reality-interlude .scene-video { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important; transform:none !important; }
  .reality-interlude__copy { position:relative !important; inset:auto !important; width:var(--tablet-content) !important; max-width:46rem !important; margin:0 auto !important; transform:none !important; opacity:1 !important; text-align:center !important; }
  .reality-interlude__copy h2 { font-size:clamp(52px,7vw,82px) !important; line-height:1 !important; }

  .service-compass, .msk-about { min-height:100svh !important; display:flex !important; align-items:center !important; }
  .service-compass__inner { width:100% !important; }
  .service-compass__grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .msk-about-inner { display:grid !important; grid-template-columns:1fr !important; gap:30px !important; }
  .msk-about__intro, .msk-about__body, .msk-about__principles article { text-align:center !important; }
  .msk-about__intro h2 { font-size:clamp(46px,6vw,70px) !important; }
  .msk-about__lead, .msk-about__body > p { margin-inline:auto !important; max-width:42rem !important; }
  .msk-about__principles article { grid-template-columns:1fr !important; gap:8px !important; padding:16px 0 !important; }
  .msk-about__principles article > span { grid-row:auto !important; }

  /* Preserve the contact film's background, with a readable content column. */
  .lean-contact { position:relative !important; min-height:100svh !important; justify-content:center !important; }
  .lean-contact-inner { display:flex !important; flex-direction:column !important; position:relative !important; width:100% !important; height:auto !important; min-height:0 !important; margin:0 auto !important; padding:0 !important; gap:28px !important; }
  .lean-contact-copy, .lean-contact-action { position:relative !important; inset:auto !important; transform:none !important; margin:0 auto !important; width:var(--tablet-content) !important; max-width:46rem !important; }
  .lean-contact-copy h2 { font-size:clamp(44px,5.8vw,68px) !important; line-height:1.02 !important; }
  .lean-contact-copy p { font-size:17px !important; line-height:1.55 !important; margin-inline:auto !important; }
  .lean-contact-action { padding:24px !important; }
  .lean-contact-action h3 { font-size:32px !important; }
  .lean-contact-methods a { font-size:21px !important; overflow-wrap:anywhere !important; }

  /* Centre the complete closing composition, including the links themselves. */
  .ending-scene .finale { padding:84px var(--tablet-gutter) 24px !important; text-align:center !important; }
  .ending-scene .finale .finale__inner { display:grid !important; grid-template-columns:1fr !important; width:var(--tablet-content) !important; max-width:46rem !important; gap:32px !important; padding-bottom:32px !important; }
  .ending-scene .finale .finale__identity, .ending-scene .finale .finale__invitation { align-items:center !important; text-align:center !important; }
  .ending-scene .finale .finale__identity > small { display:block !important; margin-bottom:16px !important; }
  .ending-scene .finale .finale__identity > img { width:260px !important; height:240px !important; max-width:100% !important; object-fit:contain !important; margin:0 auto 20px !important; }
  .ending-scene .finale .finale__identity p { width:100% !important; max-width:none !important; font-size:32px !important; line-height:1.2 !important; }
  .ending-scene .finale .finale__identity p span { display:block !important; }
  .ending-scene .finale .finale__invitation { padding:28px 0 0 !important; border-left:0 !important; border-top:1px solid rgba(226,194,147,.33) !important; }
  .ending-scene .finale .finale__invitation h2 { font-size:clamp(40px,5vw,58px) !important; }
  .ending-scene .finale .site-footer__methods { align-items:center !important; justify-content:center !important; gap:12px 28px !important; }
  .ending-scene .finale .site-footer__cta { justify-content:center !important; gap:24px !important; }
  .ending-scene .site-footer__grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:32px !important; }
  .ending-scene .site-footer__contact { grid-column:1 / -1 !important; }
  .ending-scene .site-footer__contact p { margin:0 auto 16px !important; }
  .ending-scene .site-footer__nav, .ending-scene .site-footer__methods { align-items:center !important; }
  .ending-scene .site-footer__inner { width:calc(100% - 2 * var(--tablet-gutter)) !important; max-width:46rem !important; padding:24px 0 !important; }
  .ending-scene .site-footer__bottom { justify-content:center !important; gap:12px 24px !important; text-align:center !important; }
  .scene-rail, .scene-rail.visible { display: none !important; }
  :where(.ai-visual-anchor) { position:relative; }
  .ai-visual-badge { position:absolute !important; left:auto !important; top:auto !important; right:10px !important; bottom:10px !important; min-width:23px !important; height:17px !important; padding:0 4px !important; font-size:8px !important; transform:none !important; box-shadow:none !important; }

  /* Active detail pages share a tablet column without clipping their content. */
  .detail-shell .detail-hero { height:auto !important; min-height:calc(100svh - 76px) !important; overflow:visible !important; padding:64px var(--tablet-gutter) 48px !important; gap:32px !important; justify-items:center !important; }
  .detail-shell .detail-copy h1, .detail-shell .detail-lead { margin-inline:auto !important; }
  .detail-shell .hero-actions, .detail-shell .hero-proof, .detail-shell .detail-tease > div, .detail-shell .final-actions { justify-content:center !important; flex-wrap:wrap !important; }
  .detail-shell .detail-body { padding:0 var(--tablet-gutter) 64px !important; }
  .detail-shell .detail-section { padding:64px 0 !important; gap:24px !important; }
  .detail-shell .section-label, .detail-shell .signature, .detail-shell .final-cta { text-align:center !important; }
  .detail-shell .signature { padding:64px var(--tablet-gutter) !important; }
  .detail-shell .signature strong, .detail-shell .signature p { margin-inline:auto !important; }
  .detail-shell .section-content > p { margin-inline:auto !important; }
  .detail-shell .final-cta { margin:0 var(--tablet-gutter) 48px !important; padding:32px !important; gap:24px !important; }
  .detail-shell .detail-footer { flex-wrap:wrap !important; justify-content:center !important; gap:16px 28px !important; text-align:center !important; }
  .detail-shell .detail-photo-break__copy { left:var(--tablet-gutter) !important; right:var(--tablet-gutter) !important; max-width:46rem !important; margin-inline:auto !important; text-align:center !important; }
  .detail-shell .detail-photo-break__copy p { margin-inline:auto !important; }
  .detail-shell .detail-lab { display:grid !important; grid-template-columns:1fr !important; gap:24px !important; padding:64px var(--tablet-gutter) !important; }
  .detail-shell .detail-lab__intro, .detail-shell .detail-lab__stage, .detail-shell .detail-lab__controls, .detail-shell .detail-lab__note { grid-column:1 !important; width:min(100%,46rem) !important; margin-inline:auto !important; }
  .detail-shell .detail-lab__intro, .detail-shell .detail-lab__readout, .detail-shell .detail-lab__note { text-align:center !important; }
  .detail-shell .detail-lab__intro p, .detail-shell .detail-lab__readout p { margin-inline:auto !important; }
  .detail-shell .detail-lab__controls { flex-wrap:wrap !important; }
  .detail-motion-ready .detail-shell .section-content { opacity:1 !important; transform:none !important; }

  /* Repair cards retain room for their text and their own interactive photo. */
  .detail-shell--repair .repair-record-scene, .detail-shell--repair .repair-process-layout, .detail-shell--repair .repair-tech-profile, .detail-shell--repair .repair-descaler { grid-template-columns:1fr !important; min-height:0 !important; gap:24px !important; }
  .detail-shell--repair .repair-descaler { grid-template-areas:"chooser" "guide" !important; }
  .detail-shell--repair .repair-descaler__chooser, .detail-shell--repair .repair-descaler__guide { width:100% !important; min-width:0 !important; }
  .detail-shell--repair .repair-process-stage { position:relative !important; top:auto !important; width:min(100%,560px) !important; margin-inline:auto !important; }
  .detail-shell--repair .repair-process { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .detail-shell--repair .repair-process button { min-height:180px !important; text-align:center !important; }
  .detail-shell--repair .repair-help-grid, .detail-shell--repair .repair-faq { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .detail-shell--repair .repair-help-grid svg { margin-inline:auto !important; }
  .detail-shell--repair .repair-principle__notes { grid-template-columns:1fr !important; }
  .detail-shell--repair .repair-record-grid article { opacity:1 !important; transform:none !important; }

  /* Keep the VDE exploration and its readout inside one generously sized panel. */
  .detail-shell .vde-hero-visual { height:auto !important; min-height:640px !important; }
  .detail-shell .vde-circuit { height:640px !important; min-height:640px !important; margin-inline:auto !important; }
  .detail-shell .vde-circuit__node { width:128px !important; text-align:center !important; }
  .detail-shell .node--0 { left:4% !important; top:7% !important; }
  .detail-shell .node--1 { left:auto !important; right:5% !important; top:23% !important; }
  .detail-shell .node--2 { left:5% !important; right:auto !important; top:40% !important; }
  .detail-shell .node--3 { right:5% !important; bottom:42% !important; }
  .detail-shell .vde-law-readout { left:5% !important; right:5% !important; bottom:5% !important; width:auto !important; text-align:center !important; }
  .detail-shell .vde-frist-lab, .detail-shell .vde-process-screen, .detail-shell .vde-service-intro { grid-template-columns:1fr !important; }
  .detail-shell .vde-service-orbit, .detail-shell .vde-frist-orbit, .detail-shell .vde-process-symbol { margin-inline:auto !important; }

  /* Water detail photos and all comparison layers retain their native proportions. */
  .detail-shell--water .water-measure-section, .detail-shell--water .water-scale-section, .detail-shell--water .water-compare { padding:64px var(--tablet-gutter) !important; }
  .detail-shell--water .water-measure-section, .detail-shell--water .water-scale-layout, .detail-shell--water .water-tool-grid { display:grid !important; grid-template-columns:1fr !important; gap:24px !important; }
  .detail-shell--water .water-measure-copy, .detail-shell--water .water-scale-heading, .detail-shell--water .water-compare__head { display:block !important; width:min(100%,46rem) !important; margin-inline:auto !important; text-align:center !important; }
  .detail-shell--water .water-measure-copy > p, .detail-shell--water .water-scale-heading > p { margin-inline:auto !important; }
  .detail-shell--water .water-measure-scene { width:min(100%,46rem) !important; min-height:clamp(480px,48svh,650px) !important; margin-inline:auto !important; }
  .detail-shell--water .water-scale-layout { width:min(100%,46rem) !important; margin-inline:auto !important; }
  .detail-shell--water .water-scale-scene { position:relative !important; top:auto !important; height:auto !important; min-height:0 !important; max-height:none !important; aspect-ratio:1672/941 !important; }
  .detail-shell--water .water-scale-scene img { object-fit:contain !important; }
  .detail-shell--water .water-scale-controls { display:grid !important; grid-template-columns:1fr !important; }
  .detail-shell--water .water-scale-readout { min-height:0 !important; text-align:center !important; }
  .detail-shell--water .water-scale-buttons button { text-align:center !important; }
  .detail-shell--water .water-compare__stage { max-width:46rem !important; aspect-ratio:586/658 !important; }
  .detail-shell--water .water-guidance__cards { grid-template-columns:1fr !important; }
  .detail-shell--water .water-hotspots { display:grid !important; grid-template-columns:1fr !important; }
  .detail-shell--water .water-hotspots__machine { position:relative !important; top:auto !important; max-height:none !important; }
  .detail-shell--water .water-hotspots__machine svg { display:block !important; width:100% !important; height:auto !important; }

  /* About has custom class names, so it needs the same tablet rules explicitly. */
  .detail-shell--about :is(.about-hero,.about-experience,.about-values,.about-origin,.about-certificates__intro) { grid-template-columns:1fr !important; gap:28px !important; }
  .detail-shell--about :is(.about-hero,.about-section,.about-finale) { width:min(calc(100% - 2 * var(--tablet-gutter)),46rem) !important; padding:64px 0 !important; margin-inline:auto !important; }
  .detail-shell--about .about-hero { min-height:calc(100svh - 76px) !important; }
  .detail-shell--about :is(.about-hero__copy,.about-section__heading,.about-origin__copy,.about-certificates__intro,.about-finale__copy) { text-align:center !important; max-width:none !important; }
  .detail-shell--about h1 { font-size:clamp(54px,6.5vw,76px) !important; }
  .detail-shell--about h2 { font-size:clamp(42px,5.8vw,68px) !important; }
  .detail-shell--about .about-section__heading { position:relative !important; top:auto !important; }
  .detail-shell--about .about-hero__facts, .detail-shell--about .about-finale__actions { justify-content:center !important; flex-wrap:wrap !important; }
  .detail-shell--about .about-portrait { width:min(100%,440px) !important; margin-inline:auto !important; transform:none !important; }
  .detail-shell--about .about-portrait__image { height:clamp(440px,48svh,620px) !important; min-height:0 !important; }
  .detail-shell--about .about-portrait figcaption { flex-direction:column !important; gap:8px !important; text-align:center !important; }
  .detail-shell--about .about-portrait figcaption strong { text-align:center !important; }
  .detail-shell--about .about-origin, .detail-shell--about .about-certificates { padding:64px var(--tablet-gutter) !important; min-height:0 !important; }
  .detail-shell--about .about-origin__copy, .detail-shell--about .about-origin__principles, .detail-shell--about .certificate-grid, .detail-shell--about .about-certificates__intro { width:min(100%,46rem) !important; margin-inline:auto !important; }
  .detail-shell--about .about-origin__principles, .detail-shell--about .about-proof-grid, .detail-shell--about .certificate-grid { grid-template-columns:1fr !important; }
  .detail-shell--about .about-values__grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .detail-shell--about .about-value, .detail-shell--about .about-proof-grid article, .detail-shell--about .about-origin__principles article { text-align:center !important; min-height:0 !important; }
  .detail-shell--about .about-origin__principles span { float:none !important; display:block !important; margin:0 0 12px !important; }
  .detail-shell--about .certificate-card { grid-template-columns:minmax(200px,.8fr) minmax(0,1fr) !important; grid-template-rows:auto !important; text-align:center !important; }
  .detail-shell--about .certificate-card figure { aspect-ratio:210/297 !important; }
  .detail-shell--about .certificate-card img { object-fit:contain !important; }
  .detail-shell--about .certificate-card > div { align-self:center !important; padding:24px !important; }
  .detail-shell--about .about-finale { min-height:0 !important; }

  /* A full-height photograph, with a central reading area clear of the upper/lower parts. */
  html.lean-mode .story-chapter--repair .story-chapter__stage { display:flex !important; flex-direction:column !important; justify-content:center !important; align-items:center !important; height:clamp(980px,100svh,162vw) !important; min-height:0 !important; padding:104px var(--tablet-gutter) 36px !important; gap:16px !important; background:#171510 !important; }
  html.lean-mode .story-chapter--repair .story-chapter__stage::before { display:none !important; }
  html.lean-mode .story-chapter--repair .repair-image-stage { position:absolute !important; inset:0 !important; width:100% !important; margin:0 !important; height:100% !important; aspect-ratio:auto !important; z-index:1 !important; }
  html.lean-mode .story-chapter--repair .repair-image-stage > img { inset:auto !important; left:var(--repair-photo-left,0px) !important; top:var(--repair-photo-top,0px) !important; width:var(--repair-photo-width,100%) !important; height:var(--repair-photo-height,100%) !important; aspect-ratio:auto !important; object-fit:cover !important; object-position:center !important; transform:none !important; transition:left .35s ease !important; -webkit-mask-image:none !important; mask-image:none !important; }
  .story-chapter--repair .repair-image-stage::after { display:block !important; content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(180deg,rgba(13,8,4,.22),rgba(13,8,4,.08) 28%,rgba(13,8,4,.82) 37%,rgba(13,8,4,.88) 62%,rgba(13,8,4,.15) 76%,rgba(13,8,4,.08)); pointer-events:none; }
  .story-chapter--repair .story-chapter__shade { display:none !important; }
  html.lean-mode .story-chapter--repair .story-chapter__heading { position:absolute !important; inset:auto !important; left:var(--repair-heading-x,24px) !important; top:var(--repair-heading-y,84px) !important; width:max-content !important; max-width:calc(100% - 48px) !important; padding:12px !important; border-radius:14px; background:rgba(15,10,4,.72); text-align:left !important; text-shadow:0 2px 12px #000; transition:top .35s ease !important; }
  .story-chapter--repair .story-chapter__heading small { font-size:10px !important; }
  .story-chapter--repair .story-chapter__heading h2 { font-size:clamp(44px,5.5vw,64px) !important; font-weight:700 !important; white-space:nowrap !important; }
  .story-chapter--repair .story-chapter__heading p { display:none !important; }
  .story-chapter--repair .tablet-repair-summary { display:block !important; position:relative; z-index:5; width:var(--tablet-content); max-width:46rem; text-align:center; color:#fff4e4; font:600 clamp(14px,1.5vw,18px)/1.5 var(--body); }
  html.lean-mode .story-chapter--repair .repair-explore { position:relative !important; inset:auto !important; align-self:center !important; width:var(--tablet-content) !important; margin:0 !important; padding:16px !important; background:rgba(24,20,15,.84) !important; border-color:rgba(232,201,157,.55) !important; box-shadow:0 16px 40px rgba(0,0,0,.2) !important; backdrop-filter:blur(8px); }
  .story-chapter--repair .repair-focus { z-index:4 !important; }
  .story-chapter--repair .repair-focus span { width:clamp(56px,8vw,96px) !important; border:3px solid #ffd170 !important; background:linear-gradient(#fff3cf,#fff3cf) center/2px 26px no-repeat,linear-gradient(#fff3cf,#fff3cf) center/26px 2px no-repeat,radial-gradient(circle,rgba(255,190,61,.22),transparent 70%) !important; box-shadow:0 0 0 2px rgba(12,8,3,.85),0 0 0 7px rgba(255,187,57,.15),0 0 28px rgba(255,181,46,.8),inset 0 0 18px rgba(255,218,138,.35) !important; animation:none !important; transition:none !important; }
  .story-chapter--repair .repair-focus span::before { width:8px !important; height:8px !important; background:#fff !important; box-shadow:0 0 10px #ffd170 !important; }
  .story-chapter--repair .repair-focus span[data-repair-marker]::after { display:none !important; }
  .story-chapter--repair .tablet-repair-callout-lines { display:block !important; position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
  .story-chapter--repair .tablet-repair-sonar-field { display:block !important; position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
  .tablet-repair-sonar-field circle { fill:none; stroke:#ffd170; stroke-width:3; filter:drop-shadow(0 0 6px rgba(255,199,93,.85)); }
  .tablet-repair-callout-lines path { fill:none; stroke:#ffd170; stroke-width:3; stroke-linejoin:round; stroke-linecap:round; filter:drop-shadow(0 1px 2px #000); }
  .story-chapter--repair .tablet-repair-callout { display:block !important; position:absolute; width:clamp(240px,26vw,320px); padding:8px 10px; border:2px solid #ffd170; border-radius:12px; background:rgba(15,10,4,.94); color:#fff0c4; box-shadow:0 6px 24px rgba(0,0,0,.6),0 0 18px rgba(255,193,75,.28); font:800 clamp(16px,1.7vw,21px)/1.1 var(--body); letter-spacing:.02em; text-align:center; pointer-events:none; }
  .story-chapter--repair .tablet-repair-callout[hidden] { display:none !important; }
  .story-chapter--repair .repair-explore__nav button { min-height:44px !important; padding:8px 4px !important; text-align:center !important; font-size:13px !important; }
  .story-chapter--repair .repair-explore__nav button[aria-pressed="true"] { background:rgba(230,195,139,.19) !important; color:#fff !important; }
  .story-chapter--repair .repair-explore__nav button[aria-pressed="false"] { background:transparent !important; }
  .story-chapter--repair .repair-explore__text { font-size:clamp(13px,1.5vw,16px) !important; }
  .story-chapter--repair .repair-story-link-label { display:none !important; }
  .story-chapter--repair .repair-story-link-label--tablet { display:inline !important; }
  .story-chapter--repair .repair-explore > a { display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:12px !important; min-height:48px !important; padding:10px 12px !important; border:1px solid rgba(232,201,157,.55) !important; border-radius:999px !important; background:rgba(235,199,148,.12) !important; font-size:clamp(12px,1.55vw,16px) !important; white-space:nowrap !important; text-transform:none !important; letter-spacing:.02em !important; }
  @media (orientation:landscape) {
    html.lean-mode .story-chapter--repair .story-chapter__stage { display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; height:max(100svh,780px) !important; column-gap:28px !important; }
    html.lean-mode .story-chapter--repair .story-chapter__heading { text-align:left !important; }
  }
  @media (prefers-reduced-motion:reduce) {
    html.lean-mode .story-chapter--repair .repair-image-stage > img,
    html.lean-mode .story-chapter--repair .story-chapter__heading,
    .story-chapter--repair .repair-focus span { transition:none !important; }
  }
  .world--repair .world-more { display:flex !important; align-items:center !important; justify-content:center !important; min-height:58px !important; }
  html.lean-mode .world--repair .world-sticky { justify-content:flex-start !important; padding-top:clamp(114px,15svh,190px) !important; }
  html.lean-mode .world--repair .repair-copy { inset:auto !important; z-index:8 !important; }
  .world--repair .repair-copy .repair-entry { width:100% !important; margin:0 auto 48px !important; gap:32px !important; }
  .world--repair .repair-copy .repair-entry button { min-height:84px !important; text-align:center !important; }
  .world--repair .repair-copy .repair-entry button::after { position:absolute !important; right:12px !important; }
  .world--repair .repair-copy .repair-entry span { padding:0 18px !important; font-size:clamp(16px,2vw,21px) !important; }
  .world--repair .repair-copy .repair-entry small { font-size:10px !important; }

  /* Bring the VDE explanation and controls together instead of opposite screen edges. */
  html.lean-mode .story-chapter--vde .story-chapter__stage { justify-content:center !important; gap:32px !important; }
  .story-chapter--vde .vde-sequence { margin-top:0 !important; padding:28px !important; background:rgba(4,25,28,.9) !important; }
  .story-chapter--vde .vde-sequence__display { min-height:138px !important; }
  .story-chapter--vde .vde-sequence__display strong { font-size:clamp(34px,4.5vw,50px) !important; }
  .story-chapter--vde .vde-sequence__display p { font-size:17px !important; }
  .story-chapter--vde .vde-sequence__steps button { min-height:64px !important; text-align:center !important; font-size:13px !important; }
  .story-chapter--vde .vde-sequence > a { display:inline-flex !important; align-items:center !important; justify-content:center !important; min-height:46px !important; font-size:13px !important; }
  .tablet-vde-overview { display:grid !important; gap:0 !important; margin:30px auto !important; border-top:1px solid rgba(178,217,196,.45); }
  .tablet-vde-overview article { display:grid; grid-template-columns:1fr 1.4fr; gap:8px 24px; padding:20px 0; border-bottom:1px solid rgba(178,217,196,.35); text-align:center; }
  .tablet-vde-overview article > small { grid-column:1; align-self:end; color:#b9dec8; font-size:11px; letter-spacing:.08em; }
  .tablet-vde-overview h3 { grid-column:1; margin:0; color:#fffaf1; font:400 26px/1.1 var(--display); }
  .tablet-vde-overview article > p { grid-column:2; grid-row:1 / 3; align-self:center; margin:0 !important; font-size:17px !important; }
  .world--vde .world-copy > p { font-size:19px !important; }
  .world--vde .world-more { display:flex !important; justify-content:center !important; align-items:center !important; gap:20px !important; min-height:64px !important; font-size:20px !important; }
  .world--vde .world-more > small { display:none !important; }
  .world--vde .world-photo-reveal::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,20,16,.4),rgba(3,20,16,.8) 35%,rgba(3,20,16,.84) 75%,rgba(3,20,16,.45)); }
  .tablet-vde-detail { display:grid !important; list-style:none; margin:26px 0 8px !important; padding:0 !important; gap:0; }
  .tablet-vde-detail li { padding:15px 4px; border-top:1px solid rgba(152,215,222,.25); color:#e3f0ed; font-size:18px; line-height:1.5; }
  .story-chapter--vde .vde-sequence__display { min-height:0 !important; }
  .story-chapter--vde .vde-sequence__steps { margin-top:24px !important; }
  .story-chapter--vde .vde-sequence__steps button { font-size:16px !important; min-height:72px !important; }
  .story-chapter--vde .vde-sequence > a { font-size:16px !important; margin-top:18px !important; }

  /* Centre the headline in the film rather than along its bottom edge. */
  .reality-interlude { align-items:center !important; padding:84px var(--tablet-gutter) !important; }
  .reality-interlude__copy { padding:30px 18px !important; text-shadow:0 3px 24px rgba(0,0,0,.9) !important; }
  .reality-interlude__copy small { font-size:14px !important; }
  .reality-interlude__copy h2 { font-size:clamp(60px,8vw,90px) !important; line-height:1.03 !important; }
  .reality-interlude::after { background:linear-gradient(180deg,rgba(10,8,5,.2),rgba(10,8,5,.65) 35%,rgba(10,8,5,.68) 65%,rgba(10,8,5,.2)) !important; }

  /* Contact reads as one composition, with equal widths and deliberate spacing. */
  .lean-contact-inner { max-width:46rem !important; padding:36px 28px !important; gap:32px !important; border:1px solid rgba(233,198,144,.34); border-radius:24px; background:rgba(18,16,12,.72); backdrop-filter:blur(8px); box-shadow:0 20px 60px rgba(0,0,0,.22); }
  .lean-contact-copy { width:100% !important; }
  .lean-contact-copy h2 { font-size:clamp(48px,6.2vw,72px) !important; }
  .lean-contact-copy > small { font-size:13px !important; }
  .lean-contact-copy p { max-width:38rem !important; font-size:19px !important; margin-top:24px !important; }
  .lean-contact-copy__detail { color:#e1d7c8 !important; font-size:17px !important; padding-top:20px; border-top:1px solid rgba(233,198,144,.25); }
  .lean-contact-action { width:100% !important; padding:28px 0 0 !important; border:0 !important; border-top:1px solid rgba(233,198,144,.35) !important; border-radius:0 !important; background:none !important; box-shadow:none !important; }
  .lean-contact-action h3 { font-size:34px !important; margin:14px 0 24px !important; }
  .lean-contact-methods { display:grid !important; grid-template-columns:1fr 1fr !important; gap:16px !important; }
  .lean-contact-methods a { min-height:84px !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:7px !important; font-size:19px !important; text-align:center !important; padding:16px 24px !important; }
  .lean-contact-methods a::before { position:static !important; display:block !important; font-size:10px !important; }

  /* One swipeable instruction window. Long individual steps scroll inside their card. */
  .detail-shell--repair .repair-descaler__steps[data-step-cards] { position:relative !important; display:flex !important; gap:16px !important; overflow-x:auto !important; overflow-y:hidden !important; scroll-snap-type:x mandatory !important; scroll-padding:0 !important; overscroll-behavior-x:contain !important; margin-top:24px !important; padding:0 0 8px !important; }
  .detail-shell--repair .repair-descaler__steps[data-step-cards] > li { flex:0 0 100% !important; min-width:0 !important; height:clamp(300px,42svh,500px) !important; display:flex !important; flex-direction:column !important; gap:16px !important; overflow-y:auto !important; overscroll-behavior-y:contain !important; scroll-snap-align:start !important; padding:24px !important; border:1px solid rgba(232,201,157,.45) !important; border-radius:18px !important; background:rgba(233,190,126,.065) !important; text-align:center !important; }
  .detail-shell--repair .repair-descaler__steps[data-step-cards] > li > b { font-size:34px !important; }
  .detail-shell--repair .repair-descaler__steps[data-step-cards] > li > div { flex:none !important; }
  .detail-shell--repair .repair-descaler__steps[data-step-cards] > li strong { font-size:24px !important; }
  .detail-shell--repair .repair-descaler__steps[data-step-cards] > li p { font-size:16px !important; }
  .detail-shell--repair .descale-step-controls { display:flex !important; align-items:center !important; justify-content:center !important; gap:24px !important; margin:12px 0 24px !important; }
  .detail-shell--repair .descale-step-controls button { display:grid !important; place-items:center !important; width:48px !important; height:48px !important; border:1px solid rgba(232,201,157,.55) !important; border-radius:50% !important; background:rgba(233,190,126,.1) !important; color:#fff4df !important; font-size:24px !important; cursor:pointer; }
  .detail-shell--repair .descale-step-controls button:disabled { opacity:.3 !important; cursor:default; }
  .detail-shell--repair .descale-step-controls span { min-width:90px !important; color:#f1d09c !important; font-size:17px !important; font-weight:700 !important; }
  .detail-shell--repair .repair-descaler__steps[data-step-cards]:focus-visible { outline:2px solid #f1d09c; outline-offset:4px; }
}