/* ridgeback-roofing: editorial and interaction layer (2026-10-12), loaded after the shared demo bundle. */

/* Depth (2026-10-12). Storm work starts with the storm: the rain sits in front of the house, and far-off lightning flickers now and then. Pointer devices only; off under reduced motion. */
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  body[data-demo="ridgeback-roofing"] .rbHero > img {
    translate: calc(var(--dx-px, 0) * -10px) calc(var(--dx-py, 0) * -6px);
    transition: translate 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
  }

  body[data-demo="ridgeback-roofing"] .rbHero > .rbRain {
    translate: calc(var(--dx-px, 0) * -24px) calc(var(--dx-py, 0) * -10px);
    transition: translate 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
  }

  body[data-demo="ridgeback-roofing"] .rbHero .dx-light {
    z-index: 0;
    mix-blend-mode: screen;
    background: radial-gradient(60% 50% at 70% 10%, #c9d6ff, transparent 70%);
    animation: rb-lightning 11s linear infinite 3s;
  }
  /* Two dim flickers about every 11 seconds: well under the three-flashes-a-second limit. */
  @keyframes rb-lightning {
    0%,
    90%,
    93%,
    100% {
      opacity: 0;
    }
    91% {
      opacity: 0.35;
    }
    94% {
      opacity: 0.2;
    }
    95% {
      opacity: 0;
    }
  }
}

/* Registered foreground layers: original source pixels, segmented alpha (2026-10-13). */
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero { isolation: isolate; }
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; pointer-events:none; scale:1.08; z-index:-5; }
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > .dx-foreground { z-index:-3; }
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > .rbHeroShade { z-index:-1; }
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > .dx-light { z-index:-2; }
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > .dx-light { z-index:-4; }
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > .rbRain { z-index:0; pointer-events:none; }
body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > .rbHeroCopy { position:relative; z-index:1; }
@media(prefers-reduced-motion:reduce) { body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > img { animation:none!important; translate:none!important; transition:none!important; } }
@supports(animation-timeline:scroll()) { @media(prefers-reduced-motion:no-preference) and (hover:none) { body[data-authored-demo][data-demo="ridgeback-roofing"] .rbHero > img { animation-name:dx-settle,dx-drift; animation-duration:2.4s,auto; animation-timing-function:cubic-bezier(.2,.7,.2,1),linear; animation-fill-mode:both; animation-timeline:auto,scroll(root); animation-range:normal,0 100vh; } } }

/* Contrast (2026-10-13): the note beside the inspection slots was pale blue on pale grey (1.56:1). */
body[data-demo="ridgeback-roofing"] .rbSlotsHead > small {
  color: #4a5866;
  opacity: 1;
}
