/* Ruby v61 — Five genuinely distinct photographic frames per destination.
   Photographs themselves carry true changing sky, sunlight and reflections.
   The daycycle class is intentionally isolated from the editorial
   .ruby-time-stage component elsewhere on the page. */
.ruby-daycycle-stage{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  margin:0;
  display:block;
  z-index:-2;
  pointer-events:none;
  user-select:none;
  overflow:hidden;
  visibility:hidden;
  contain:paint;
}
.ruby-daycycle-stage.is-ready{visibility:visible}
.ruby-daycycle-frame{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  opacity:0;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  pointer-events:none;
  will-change:opacity;
  transform:translateZ(0);
  transition:opacity 1750ms cubic-bezier(.42,0,.16,1);
}
.gateway-card>.ruby-daycycle-stage{
  z-index:-2;
  transform-origin:center;
  transition:transform 1.2s ease;
}
.gateway-card:hover>.ruby-daycycle-stage{transform:scale(1.07)}
.istanbul-hero .hero-media>.ruby-daycycle-stage{z-index:0}
.istanbul-hero .hero-media>.ruby-scene-wrap{z-index:1}
.mare-main>.ruby-daycycle-stage{z-index:-1}

/* Old cut-outs were sampled from ONE sunset image. They no longer align
   photometrically with different real photographs and can cause ghost ships.
   Keep the exact original boat pixels IN each full-frame photograph instead.
   The independent SVG terrace/bridge lights and natural leaf/gull overlays
   are not disabled. */
html.ruby-real-time .ruby-scene-wrap .ruby-istanbul-layer,
html.ruby-real-time .ruby-scene-wrap .ruby-mare-vessel{
  display:none!important;
}
/* The independently swaying olive canopy remains visible on Bodrum. */
/* City lighting belongs in twilight / night; midday has fewer glowing
   LED points while keeping the photographer's authentic lamps in the photo. */
html.ruby-real-time .ruby-scene-wrap .ruby-photo-svg{
  opacity:var(--ruby-scene-lights,.75);
  transition:opacity 1750ms ease;
}
@media(max-width:900px){
  /* Mobile gateway's original 16:9 photo ends above its solid black caption. */
  .gateway .gateway-card>.ruby-daycycle-stage{
    inset:0 0 auto;
    width:100%;
    height:56.25vw;
    transition:none;
  }
  .gateway .gateway-card:hover>.ruby-daycycle-stage{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .ruby-daycycle-frame{transition:none!important}
  .gateway-card>.ruby-daycycle-stage{transition:none!important}
}